Merge pull request #3823 from James-Baloyi/james/en/43/3781

James/en/43/3781

Author: IvanIlyichev

shesha-reactjs/src/designer-components/wizard/index.tsx

@@ -44,7 +44,9 @@ const TabsComponent: IToolboxComponent<Omit<IWizardComponentProps, 'size'>> = {
   },
   initModel: (model) => ({
     ...model,
-    stylingBox: "{\"marginBottom\":\"5\"}"
+    stylingBox: "{\"marginBottom\":\"5\"}",
+    showBackButton: true,
+    showDoneButton: true
   }),
   migrator: (m) =>
     m
@@ -101,6 +103,11 @@ const TabsComponent: IToolboxComponent<Omit<IWizardComponentProps, 'size'>> = {
       .add<IWizardComponentProps>(4, (prev) => migrateWizardActions(prev))
       .add<IWizardComponentProps>(5, (prev) => ({ ...migrateFormApi.properties(prev) }))
       .add<IWizardComponentProps>(6, (prev) => removeComponents(prev))
+      .add<IWizardComponentProps>(7, (prev) => ({ 
+        ...prev,
+        showBackButton: prev.showBackButton ?? true,
+        showDoneButton: prev.showDoneButton ?? true
+      }))
   ,
   settingsFormFactory: (props) => <WizardSettingsForm {...props} />,
   // validateSettings: model => validateConfigurableComponentSettings(settingsForm, model),

shesha-reactjs/src/designer-components/wizard/models.ts

@@ -76,4 +76,6 @@ export interface IWizardComponentProps extends Omit<IConfigurableFormComponent,
   buttonsLayout?: 'left' | 'right' | 'spaceBetween';
   showStepStatus?: boolean;
   sequence?: IWizardSequence;
+  showBackButton?: boolean;
+  showDoneButton?: boolean;
 }

shesha-reactjs/src/designer-components/wizard/settings.tsx

@@ -147,6 +147,14 @@ const WizardSettings: FC<ISettingsFormFactoryArgs<IWizardComponentProps>> = (pro
           </Select>
         </SettingsFormItem>
 
+        <SettingsFormItem name="showBackButton" label="Show Back Button" valuePropName="checked" jsSetting>
+          <Checkbox disabled={readOnly} />
+        </SettingsFormItem>
+
+        <SettingsFormItem name="showDoneButton" label="Show Done Button" valuePropName="checked" jsSetting>
+          <Checkbox disabled={readOnly} />
+        </SettingsFormItem>
+
         <SettingsFormItem name="hidden" label="Hidden" valuePropName="checked" jsSetting>
           <Checkbox disabled={readOnly} />
         </SettingsFormItem>

shesha-reactjs/src/designer-components/wizard/tabs.tsx

@@ -28,6 +28,8 @@ export const Tabs: FC<Omit<IWizardComponentProps, 'size'>> = ({ form, ...model }
         isDynamic,
         labelPlacement,
         wizardType = 'default',
+        showBackButton = true,
+        showDoneButton = true,
     } = model;
 
     const steps = useMemo(() => {
@@ -92,7 +94,7 @@ export const Tabs: FC<Omit<IWizardComponentProps, 'size'>> = ({ form, ...model }
                                 </Space>
                             )}
                         >
-                            {current > 0 && (
+                            {current > 0 && showBackButton && (
                                 <Button
                                     style={btnStyle('back')}
                                     onClick={back}
@@ -132,7 +134,7 @@ export const Tabs: FC<Omit<IWizardComponentProps, 'size'>> = ({ form, ...model }
                                 </Button>
                             )}
 
-                            {current === visibleSteps.length - 1 && (
+                            {current === visibleSteps.length - 1 && showDoneButton && (
                                 <Button
                                     type="primary"
                                     style={btnStyle('next')}