Wizard: fix a rerender loop in AzureResourceGroups

resourceGroup is used in useEffect, so if assigned a new array to it
every time this function is called, it would cause the useEffect to run
every time, leading to an infinite loop. This is because useEffect uses
Object.is to determine if the value has changed, and [] creates a new
array every time. Thus, we use a constant empty array to avoid this
issue.

Alternatively JSON.stringify(resourceGroup), or a deep comparison could
be used as a useEffect dependency, but that feels like just a waste
of resources.

src/Components/CreateImageWizard/steps/TargetEnvironment/Azure/AzureResourceGroups.tsx

@@ -23,6 +23,8 @@ import {
   selectAzureSource,
 } from '../../../../../store/wizardSlice';
 
+const emptyArray: string[] = [];
+
 export const AzureResourceGroups = () => {
   const azureSource = useAppSelector(selectAzureSource);
   const azureResourceGroup = useAppSelector(selectAzureResourceGroup);
@@ -43,7 +45,9 @@ export const AzureResourceGroups = () => {
     }
   );
 
-  const resourceGroups = sourceDetails?.azure?.resource_groups || [];
+  // use a static empty array to avoid an infinite render loop in useEffect functions depending
+  // on `resourceGroups`
+  const resourceGroups = sourceDetails?.azure?.resource_groups || emptyArray;
 
   useEffect(() => {
     let filteredGroups = resourceGroups;