more

src/Components/SignupPage/SignupPage.js

@@ -44,13 +44,15 @@ const SignupPage = () => {
     getFormDataDefaults(paymentfields)
   );
   const [showPaymentModal, setShowPaymentModal] = useState(false);
+  /*
   const [showSelectPlan, setShowSelectPlan] = useState(
     isUpgrade ? true : false
   );
-  //const [showSelectPlan, setShowSelectPlan] = useState(true);
+  */
+  const [showSelectPlan, setShowSelectPlan] = useState(true);
   const [activeRadioOption, setActiveRadioOption] = useState("partner");
   const [selectedPlan, setSelectedPlan] = useState([signupRadioFields[1]]);
-  const [isAnnual, setIsAnnual] = useState(1);
+  //const [isAnnual, setIsAnnual] = useState(1);
   const stripe = new Stripe(stripeApiKey);
   const apiUrl =
     process.env.NODE_ENV === "development"
@@ -60,6 +62,7 @@ const SignupPage = () => {
   const [numberOfAccountsToAdd, setNumberOfAccountsToAdd] = useState();
   const [showPromoModal, setShowPromoModal] = useState(false);
   const [issueText, setIssueText] = useState("");
+  const [isAnnual, setIsAnnual] = useState([1, 2]);
 
   const handleChangeInput = (e, name) => {
     const newData = handleFormDataChange(e, name, data, signupFields);
@@ -283,13 +286,7 @@ const SignupPage = () => {
     setShowPromoModal(!showPromoModal);
   };
 
-  const handleToggle = (e) => {
-    if (isAnnual === e) {
-      return;
-    } else {
-      setIsAnnual(e);
-    }
-  };
+  const handleToggle = (val) => setIsAnnual(val);
 
   const handleAddAccounts = () => {
     setShowAddAccount(!showAddAccount);
@@ -608,7 +605,7 @@ const SignupPage = () => {
             <div className="plan-header-left">
               <div className="select-toggle-box">
                 <p className="select-billing-text">Billed annually</p>
-                <Toggle onClick={handleToggle} />
+                <Toggle value={isAnnual} onClick={handleToggle} />
                 <p className="select-billing-text">Billed montly</p>
               </div>
             </div>