From d558c5bf09e6b89e3b22e6528e63553cae662a04 Mon Sep 17 00:00:00 2001
From: blam <ben@blam.sh>
Date: Fri, 19 Aug 2022 13:46:24 +0200
Subject: [PATCH] chore: working some more on the review

Signed-off-by: blam <ben@blam.sh>
---
 .../TemplateWizardPage/Stepper/Stepper.tsx    | 23 +++++++++++++++++--
 1 file changed, 21 insertions(+), 2 deletions(-)

diff --git a/plugins/scaffolder/src/next/TemplateWizardPage/Stepper/Stepper.tsx b/plugins/scaffolder/src/next/TemplateWizardPage/Stepper/Stepper.tsx
index be4a300755..f5656092c1 100644
--- a/plugins/scaffolder/src/next/TemplateWizardPage/Stepper/Stepper.tsx
+++ b/plugins/scaffolder/src/next/TemplateWizardPage/Stepper/Stepper.tsx
@@ -35,6 +35,7 @@ const useStyles = makeStyles(theme => ({
   backButton: {
     marginRight: theme.spacing(1),
   },
+
   footer: {
     display: 'flex',
     flexDirection: 'row',
@@ -75,7 +76,7 @@ export const Stepper = (props: StepperProps) => {
   }, [props.extensions]);
 
   const validation = useMemo(() => {
-    return createAsyncValidators(steps[activeStep].mergedSchema, validators, {
+    return createAsyncValidators(steps[activeStep]?.mergedSchema, validators, {
       apiHolder,
     });
   }, [steps, activeStep, validators, apiHolder]);
@@ -104,6 +105,10 @@ export const Stepper = (props: StepperProps) => {
     setFormState(current => ({ ...current, ...formData }));
   };
 
+  const handleCreate = () => {
+    // TODO(blam): Create the template in a modal with the ability to view the logs etc.
+  };
+
   return (
     <>
       <MuiStepper activeStep={activeStep} alternativeLabel variant="elevation">
@@ -141,7 +146,21 @@ export const Stepper = (props: StepperProps) => {
             </div>
           </Form>
         ) : (
-          <ReviewState formState={formState} schemas={steps} />
+          <>
+            <ReviewState formState={formState} schemas={steps} />
+            <div className={styles.footer}>
+              <Button
+                onClick={handleBack}
+                className={styles.backButton}
+                disabled={activeStep < 1}
+              >
+                Back
+              </Button>
+              <Button variant="contained" onClick={handleCreate}>
+                Create
+              </Button>
+            </div>
+          </>
         )}
       </div>
     </>