fix: register wizard steps component.

client/src/common/registerWizard.js

@@ -0,0 +1,16 @@
+
+
+export const registerWizardSteps = [
+  {
+    label: 'organization_register',
+  },
+  {
+    label: 'payment_or_trial',
+  },
+  {
+    label: 'getting_started',
+  },
+  {
+    label: 'initializing',
+  },
+];

client/src/containers/Authentication/Register/RegisterWizardSteps.js

@@ -1,32 +1,32 @@
 import React from 'react';
-import { FormattedMessage as T, useIntl } from 'react-intl';
+import classNames from 'classnames';
+import { FormattedMessage as T } from 'react-intl';
+import { registerWizardSteps } from 'common/registerWizard'
 
-function RegisterWizardSteps() {
+function RegisterWizardStep({
+  label,
+  isActive = false
+}) {
+  return (
+    <li className={classNames({ 'is-active': isActive })}>
+      <p className={'wizard-info'}><T id={label} /></p>
+    </li>
+  );
+}
+
+function RegisterWizardSteps({
+  currentStep = 1,
+}) {
   return (
     <div className={'register-wizard-steps'}>
       <div className={'wizard-container'}>
         <ul className={'wizard-wrapper'}>
-          <li>
-            <p className={'wizard-info'}>
-              <T id={'organization_register'} />
-            </p>
-          </li>
-          <li>
-            <p className={'wizard-info'}>
-              <T id={'payment_or_trial'} />
-            </p>
-          </li>
-          <li className="complete">
-            <p className={'wizard-info'}>
-              <T id={'getting_started'} />
-            </p>
-          </li>
-
-          <li>
-            <p className={'wizard-info'}>
-              <T id={'initializing'} />
-            </p>
-          </li>
+          {registerWizardSteps.map((step, index) => (
+            <RegisterWizardStep
+              label={step.label}
+              isActive={(index + 1) <= currentStep}
+            />
+          ))}
         </ul>
       </div>
     </div>

client/src/containers/Subscriptions/BillingForm.js

@@ -55,7 +55,6 @@ function BillingForm({
     initialValues: {
       ...initialValues,
     },
-
     onSubmit: (values, { setSubmitting, resetForm, setErrors }) => {
       requestSubmitBilling(values)
         .then((response) => {
@@ -72,7 +71,7 @@ function BillingForm({
         });
     },
   });
-  console.log(formik.values, 'formik');
+
   return (
     <div className={'billing-form'}>
       <form onSubmit={formik.handleSubmit}>