Add option to disable progress bar in wizard steps

[MAILPOET-2142]

assets/js/src/wizard/layout/step_layout.jsx

@@ -12,6 +12,7 @@ const WelcomeWizardStepLayout = (props) => (
       illustrationUrl={props.illustrationUrl}
       step={props.step}
       stepsCount={props.stepsCount}
+      displayProgressBar={props.displayProgressBar}
     >
       {props.children}
     </WelcomeWizardStepLayoutBody>
@@ -21,6 +22,7 @@ const WelcomeWizardStepLayout = (props) => (
 WelcomeWizardStepLayout.propTypes = {
   illustrationUrl: PropTypes.string.isRequired,
   step: PropTypes.number.isRequired,
+  displayProgressBar: PropTypes.bool,
   stepsCount: PropTypes.number.isRequired,
   children: PropTypes.oneOfType([
     PropTypes.arrayOf(PropTypes.node),
@@ -28,4 +30,8 @@ WelcomeWizardStepLayout.propTypes = {
   ]).isRequired,
 };
 
+WelcomeWizardStepLayout.defaultProps = {
+  displayProgressBar: true,
+};
+
 export default WelcomeWizardStepLayout;

assets/js/src/wizard/layout/step_layout_body.jsx

@@ -8,7 +8,7 @@ const WelcomeWizardStepLayoutBody = (props) => (
       <img src={props.illustrationUrl} alt="" />
     </div>
     <div className="mailpoet_welcome_wizard_step">
-      { props.step <= props.stepsCount
+      { props.displayProgressBar && (props.step <= props.stepsCount)
         ? (
           <SteppedProgressBar steps_count={props.stepsCount} step={props.step} />
         ) : null
@@ -20,12 +20,19 @@ const WelcomeWizardStepLayoutBody = (props) => (
 
 WelcomeWizardStepLayoutBody.propTypes = {
   illustrationUrl: PropTypes.string.isRequired,
-  step: PropTypes.number.isRequired,
+  displayProgressBar: PropTypes.bool,
-  stepsCount: PropTypes.number.isRequired,
+  step: PropTypes.number,
+  stepsCount: PropTypes.number,
   children: PropTypes.oneOfType([
     PropTypes.arrayOf(PropTypes.node),
     PropTypes.node,
   ]).isRequired,
 };
 
+WelcomeWizardStepLayoutBody.defaultProps = {
+  displayProgressBar: true,
+  step: 0,
+  stepsCount: -1,
+};
+
 export default WelcomeWizardStepLayoutBody;