Merge pull request #1009 from mturley/1000-hide-back-cancel-on-end-of…

…-wizards Hide Back and Cancel buttons on the last step of Migration wizards (cherry picked from commit 145211c) Fixes https://bugzilla.redhat.com/show_bug.cgi?id=1726844
ManageIQ · Jul 25, 2019 · 1712835 · 1712835
1 parent 1f66875
commit 1712835
Show file tree

Hide file tree

Showing 5 changed files with 92 additions and 93 deletions.
diff --git a/app/javascript/react/screens/App/Mappings/screens/MappingWizard/MappingWizard.js b/app/javascript/react/screens/App/Mappings/screens/MappingWizard/MappingWizard.js
@@ -141,16 +141,12 @@ class MappingWizard extends React.Component {
     return (
       <Wizard
         show={!hideMappingWizard}
-        onClose={() => {
-          hideMappingWizardAction(onFinalStep);
-        }}
+        onClose={hideMappingWizardAction}
         onExited={mappingWizardExitedAction}
         backdrop="static"
       >
         <Wizard.Header
-          onClose={() => {
-            hideMappingWizardAction(onFinalStep);
-          }}
+          onClose={hideMappingWizardAction}
           title={!editingMapping ? __('Create Infrastructure Mapping') : __('Edit Infrastructure Mapping')}
         />
 
@@ -172,24 +168,20 @@ class MappingWizard extends React.Component {
           />
         </Wizard.Body>
         <Wizard.Footer>
-          <Button
-            bsStyle="default"
-            className="btn-cancel"
-            onClick={() => {
-              hideMappingWizardAction(onFinalStep);
-            }}
-            disabled={onFinalStep}
-          >
-            {__('Cancel')}
-          </Button>
-
-          <Button bsStyle="default" onClick={this.prevStep} disabled={onFirstStep || onFinalStep}>
-            <Icon type="fa" name="angle-left" />
-            {__('Back')}
-          </Button>
+          {!onFinalStep && (
+            <React.Fragment>
+              <Button bsStyle="default" className="btn-cancel" onClick={hideMappingWizardAction}>
+                {__('Cancel')}
+              </Button>
+              <Button bsStyle="default" onClick={this.prevStep} disabled={onFirstStep}>
+                <Icon type="fa" name="angle-left" />
+                {__('Back')}
+              </Button>
+            </React.Fragment>
+          )}
           <Button
             bsStyle="primary"
-            onClick={onFinalStep ? () => hideMappingWizardAction(onFinalStep) : this.nextStep}
+            onClick={onFinalStep ? hideMappingWizardAction : this.nextStep}
             disabled={disableNextStep}
           >
             {onFinalStep

diff --git a/...ens/App/Mappings/screens/MappingWizard/__tests__/__snapshots__/MappingWizard.test.js.snap b/...ens/App/Mappings/screens/MappingWizard/__tests__/__snapshots__/MappingWizard.test.js.snap
@@ -5,12 +5,12 @@ exports[`MappingWizard component renders the mapping wizard 1`] = `
   backdrop="static"
   className=""
   dialogClassName=""
-  onClose={[Function]}
+  onClose={[MockFunction]}
   onExited={[MockFunction]}
   show={true}
 >
   <WizardHeader
-    onClose={[Function]}
+    onClose={[MockFunction]}
     title="Create Infrastructure Mapping"
   />
   <WizardBody
@@ -33,31 +33,33 @@ exports[`MappingWizard component renders the mapping wizard 1`] = `
   <WizardFooter
     className=""
   >
-    <Button
-      active={false}
-      block={false}
-      bsClass="btn"
-      bsStyle="default"
-      className="btn-cancel"
-      disabled={false}
-      onClick={[Function]}
-    >
-      Cancel
-    </Button>
-    <Button
-      active={false}
-      block={false}
-      bsClass="btn"
-      bsStyle="default"
-      disabled={true}
-      onClick={[Function]}
-    >
-      <Icon
-        name="angle-left"
-        type="fa"
-      />
-      Back
-    </Button>
+    <React.Fragment>
+      <Button
+        active={false}
+        block={false}
+        bsClass="btn"
+        bsStyle="default"
+        className="btn-cancel"
+        disabled={false}
+        onClick={[MockFunction]}
+      >
+        Cancel
+      </Button>
+      <Button
+        active={false}
+        block={false}
+        bsClass="btn"
+        bsStyle="default"
+        disabled={true}
+        onClick={[Function]}
+      >
+        <Icon
+          name="angle-left"
+          type="fa"
+        />
+        Back
+      </Button>
+    </React.Fragment>
     <Button
       active={false}
       block={false}

diff --git a/app/javascript/react/screens/App/Overview/screens/PlanWizard/PlanWizard.js b/app/javascript/react/screens/App/Overview/screens/PlanWizard/PlanWizard.js
@@ -250,13 +250,17 @@ class PlanWizard extends React.Component {
         </Wizard.Body>
 
         <Wizard.Footer className="wizard-pf-footer">
-          <Button bsStyle="default" className="btn-cancel" onClick={hidePlanWizardAction} disabled={onFinalStep}>
-            {__('Cancel')}
-          </Button>
-          <Button bsStyle="default" onClick={this.prevStep} disabled={onFirstStep || onFinalStep}>
-            <Icon type="fa" name="angle-left" />
-            {__('Back')}
-          </Button>
+          {!onFinalStep && (
+            <React.Fragment>
+              <Button bsStyle="default" className="btn-cancel" onClick={hidePlanWizardAction}>
+                {__('Cancel')}
+              </Button>
+              <Button bsStyle="default" onClick={this.prevStep} disabled={onFirstStep}>
+                <Icon type="fa" name="angle-left" />
+                {__('Back')}
+              </Button>
+            </React.Fragment>
+          )}
           <Button
             bsStyle="primary"
             onClick={onFinalStep ? hidePlanWizardAction : this.nextStep}

diff --git a/...s/screens/ConversionHostsSettings/components/ConversionHostWizard/ConversionHostWizard.js b/...s/screens/ConversionHostsSettings/components/ConversionHostWizard/ConversionHostWizard.js
@@ -103,18 +103,17 @@ class ConversionHostWizard extends React.Component {
           />
         </Wizard.Body>
         <Wizard.Footer className="wizard-pf-footer">
-          <Button
-            bsStyle="default"
-            className="btn-cancel"
-            onClick={hideConversionHostWizardAction}
-            disabled={onFinalStep}
-          >
-            {__('Cancel')}
-          </Button>
-          <Button bsStyle="default" onClick={this.prevStep} disabled={onFirstStep || onFinalStep}>
-            <Icon type="fa" name="angle-left" />
-            {__('Back')}
-          </Button>
+          {!onFinalStep && (
+            <React.Fragment>
+              <Button bsStyle="default" className="btn-cancel" onClick={hideConversionHostWizardAction}>
+                {__('Cancel')}
+              </Button>
+              <Button bsStyle="default" onClick={this.prevStep} disabled={onFirstStep}>
+                <Icon type="fa" name="angle-left" />
+                {__('Back')}
+              </Button>
+            </React.Fragment>
+          )}
           <Button
             bsStyle="primary"
             onClick={onFinalStep ? hideConversionHostWizardAction : this.nextStep}

diff --git a/...components/ConversionHostWizard/__tests__/__snapshots__/ConversionHostWizard.test.js.snap b/...components/ConversionHostWizard/__tests__/__snapshots__/ConversionHostWizard.test.js.snap
@@ -51,31 +51,33 @@ exports[`conversion host wizard renders correctly 1`] = `
   <WizardFooter
     className="wizard-pf-footer"
   >
-    <Button
-      active={false}
-      block={false}
-      bsClass="btn"
-      bsStyle="default"
-      className="btn-cancel"
-      disabled={false}
-      onClick={[MockFunction]}
-    >
-      Cancel
-    </Button>
-    <Button
-      active={false}
-      block={false}
-      bsClass="btn"
-      bsStyle="default"
-      disabled={true}
-      onClick={[Function]}
-    >
-      <Icon
-        name="angle-left"
-        type="fa"
-      />
-      Back
-    </Button>
+    <React.Fragment>
+      <Button
+        active={false}
+        block={false}
+        bsClass="btn"
+        bsStyle="default"
+        className="btn-cancel"
+        disabled={false}
+        onClick={[MockFunction]}
+      >
+        Cancel
+      </Button>
+      <Button
+        active={false}
+        block={false}
+        bsClass="btn"
+        bsStyle="default"
+        disabled={true}
+        onClick={[Function]}
+      >
+        <Icon
+          name="angle-left"
+          type="fa"
+        />
+        Back
+      </Button>
+    </React.Fragment>
     <Button
       active={false}
       block={false}