more

src/Components/Modals/PaymentModal.js

@@ -31,6 +31,9 @@ const PaymentModal = ({
   const additionalAccountsAnnualPriceToday =
     additionalAccountsMonthlyPriceToday * 12;
 
+  const extraAccountsPrice = isAnnual
+    ? additionalAccountsAnnualPriceToday
+    : additionalAccountsMonthlyPriceToday;
   const showAdditionaLAccountsView =
     (selectedPlan[0]?.value === "partner" && numberOfAccountsToAdd > 0) ||
     (selectedPlan[0]?.value === "seniorPartner" && numberOfAccountsToAdd > 0);
@@ -64,17 +67,20 @@ const PaymentModal = ({
             </div>
 
             <div className="payment-modal-text-wrapper">
-              <div className="paymodal-summary-right">Addiitonal accounts:</div>
+              <div className="paymodal-summary-right">
+                {numberOfAccountsToAdd} Addiitonal{" "}
+                {numberOfAccountsToAdd > 1 ? `accounts` : `account`}
+              </div>
               <div className="paymodal-summary-left">
-                {isAnnual
+                {billingPeriod} - ${extraAccountsPrice}
-                  ? additionalAccountsAnnualPriceToday
-                  : additionalAccountsMonthlyPriceToday}
               </div>
             </div>
 
             <div className="payment-modal-text-wrapper">
               <div className="paymodal-summary-right">Total today:</div>
-              <div className="paymodal-summary-left"></div>
+              <div className="paymodal-summary-left">
+                ${amountToday + extraAccountsPrice}
+              </div>
             </div>
             {isAnnual ? (
               <div className="payment-modal-text-wrapper">
@@ -86,21 +92,6 @@ const PaymentModal = ({
             ) : (
               <></>
             )}
-
-            {showAdditionaLAccountsView ? (
-              <div className="payment-modal-text-wrapper">
-                <div className="paymodal-summary-right">
-                  Additional Accounts:
-                </div>
-                <div className="paymodal-summary-left">
-                  {isAnnual
-                    ? additionalAccountsAnnualPriceToday
-                    : additionalAccountsMonthlyPriceToday}
-                </div>
-              </div>
-            ) : (
-              <></>
-            )}
           </div>
         </div>
 
@@ -155,3 +146,23 @@ const PaymentModal = ({
 };
 
 export default PaymentModal;
+
+/*
+
+            {showAdditionaLAccountsView ? (
+              <div className="payment-modal-text-wrapper">
+                <div className="paymodal-summary-right">
+                  Additional Accounts:
+                </div>
+                <div className="paymodal-summary-left">
+                  {isAnnual
+                    ? additionalAccountsAnnualPriceToday
+                    : additionalAccountsMonthlyPriceToday}
+                </div>
+              </div>
+            ) : (
+              <></>
+            )}
+
+
+        */