Wizard: Fix blueprint name update on Architecture/Distribution changes

This commit resolves an issue where the blueprint name did not update when the user changed the Architecture or Distribution.
Additionally, it sets an initial value for blueprintName in the WizardSlice.

src/Components/CreateImageWizard/steps/Details/index.tsx

@@ -16,8 +16,8 @@ import {
   changeBlueprintName,
   selectBlueprintDescription,
   selectBlueprintName,
+  setIsCustomName,
 } from '../../../../store/wizardSlice';
-import { useGenerateDefaultName } from '../../utilities/useGenerateDefaultName';
 import { useDetailsValidation } from '../../utilities/useValidation';
 import { ValidatedInputAndTextArea } from '../../ValidatedInput';
 
@@ -26,13 +26,12 @@ const DetailsStep = () => {
   const blueprintName = useAppSelector(selectBlueprintName);
   const blueprintDescription = useAppSelector(selectBlueprintDescription);
 
-  useGenerateDefaultName();
-
   const handleNameChange = (
     _event: React.FormEvent<HTMLInputElement | HTMLTextAreaElement>,
     name: string
   ) => {
     dispatch(changeBlueprintName(name));
+    dispatch(setIsCustomName());
   };
 
   const handleDescriptionChange = (

src/Components/CreateImageWizard/steps/ImageOutput/index.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 
 import { Text, Form, Title } from '@patternfly/react-core';
 
@@ -8,12 +8,30 @@ import ReleaseLifecycle from './ReleaseLifecycle';
 import ReleaseSelect from './ReleaseSelect';
 import TargetEnvironment from './TargetEnvironment';
 
-import { useAppSelector } from '../../../../store/hooks';
-import { selectDistribution } from '../../../../store/wizardSlice';
+import { useAppDispatch, useAppSelector } from '../../../../store/hooks';
+import {
+  changeBlueprintName,
+  selectArchitecture,
+  selectBlueprintName,
+  selectDistribution,
+  selectIsCustomName,
+} from '../../../../store/wizardSlice';
 import DocumentationButton from '../../../sharedComponents/DocumentationButton';
+import { generateDefaultName } from '../../utilities/useGenerateDefaultName';
 
 const ImageOutputStep = () => {
+  const dispatch = useAppDispatch();
+  const blueprintName = useAppSelector(selectBlueprintName);
   const distribution = useAppSelector(selectDistribution);
+  const arch = useAppSelector(selectArchitecture);
+  const isCustomName = useAppSelector(selectIsCustomName);
+
+  useEffect(() => {
+    const defaultName = generateDefaultName(distribution, arch);
+    if (!isCustomName && blueprintName !== defaultName) {
+      dispatch(changeBlueprintName(defaultName));
+    }
+  }, [dispatch, distribution, arch, isCustomName]);
 
   return (
     <Form>

src/Components/CreateImageWizard/steps/Review/index.tsx

@@ -9,14 +9,11 @@ import {
   selectBlueprintDescription,
   selectBlueprintName,
 } from '../../../../store/wizardSlice';
-import { useGenerateDefaultName } from '../../utilities/useGenerateDefaultName';
 
 const ReviewStep = () => {
   const blueprintName = useAppSelector(selectBlueprintName);
   const blueprintDescription = useAppSelector(selectBlueprintDescription);
 
-  useGenerateDefaultName();
-
   return (
     <Form>
       <Title headingLevel="h1" size="xl">