Wizard: Add beforeNext conditions to Details step footer

src/Components/CreateImageWizard/CreateImageWizard.tsx

@@ -203,6 +203,7 @@ const CreateImageWizard = ({ isEdit }: CreateImageWizardProps) => {
   // Firstboot
   const firstBootValidation = useFirstBootValidation();
   // Details
+  const [detailsPristine, setDetailsPristine] = useState(true);
   const detailsValidation = useDetailsValidation();
 
   let startIndex = 1; // default index
@@ -453,7 +454,14 @@ const CreateImageWizard = ({ isEdit }: CreateImageWizardProps) => {
             status={detailsValidation.disabledNext ? 'error' : 'default'}
             footer={
               <CustomWizardFooter
-                disableNext={detailsValidation.disabledNext}
+                beforeNext={() => {
+                  if (detailsValidation.disabledNext) {
+                    setDetailsPristine(false);
+                    return false;
+                  }
+                  return true;
+                }}
+                disableNext={!detailsPristine && detailsValidation.disabledNext}
               />
             }
           >

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

@@ -63,6 +63,7 @@ describe('Step Details', () => {
     const nextButton = await getNextButton();
     expect(nextButton).toBeEnabled();
     await enterBlueprintName(' ');
+    await clickNext();
     await waitFor(() => expect(nextButton).toBeDisabled());
   });
 
@@ -83,6 +84,7 @@ describe('Step Details', () => {
     await goToDetailsStep();
     await enterBlueprintName('Lemon Pie');
     const nextButton = await getNextButton();
+    await clickNext();
     await waitFor(() => expect(nextButton).toBeDisabled());
   });