From ae8a63db900676e029378c49e5ac489c37504296 Mon Sep 17 00:00:00 2001
From: Kenneth Jannette <sj@sjdev.co>
Date: Sat, 27 Jan 2024 16:44:04 -0600
Subject: [PATCH 01/10] more

---
 src/Components/SignupPage/SignupPage.js | 25 ++++++++++++++++++++++++-
 src/styles/signup.scss                  | 13 ++++++++++++-
 2 files changed, 36 insertions(+), 2 deletions(-)

diff --git a/src/Components/SignupPage/SignupPage.js b/src/Components/SignupPage/SignupPage.js
index f292e01..1b6302d 100644
--- a/src/Components/SignupPage/SignupPage.js
+++ b/src/Components/SignupPage/SignupPage.js
@@ -49,7 +49,7 @@ const SignupPage = () => {
     process.env.NODE_ENV === "development"
       ? process.env.REACT_APP_API_DEV
       : process.env.REACT_APP_API_PROD;
-  const [selectedPlanToProcess, setSelectedPlanToProcess] = useState();
+  const [showAddAccount, setShowAddAccount] = useState(false);
   const modalText = "MAYBE PUT TOTAL HERE";
 
   const handleChangeInput = (e, name) => {
@@ -425,7 +425,30 @@ const SignupPage = () => {
                 </div>
               ))}
             </div>
+            {showAddAccount ? (
+              <div className="show-addaccount-container">
+                {" "}
+                <div className="plan-header-right">
+                  <h5 className="signup-subheader-text">
+                    Add additional accounts
+                  </h5>
+                  <p className="signup-accounts-info">
+                    Account holder access will be setup later
+                  </p>
+                </div>
+              </div>
+            ) : (
+              <></>
+            )}
             <div className="signup-button-box">
+              <Button
+                className="primary-button signup-proceed"
+                type="button"
+                size="lg"
+                onClick={() => setShowAddAccount(!showAddAccount)}
+                disabled={isBusy}
+                labelText="Add Account(s)"
+              />
               <Button
                 className="primary-button signup-proceed"
                 type="button"
diff --git a/src/styles/signup.scss b/src/styles/signup.scss
index a43234f..29ec0e8 100644
--- a/src/styles/signup.scss
+++ b/src/styles/signup.scss
@@ -62,7 +62,6 @@
   flex-direction: row;
   margin-top: 24px;
   width: 920px;
-  height: 600px;
 }
 
 .select-plan-header {
@@ -191,3 +190,15 @@
   border-radius: 10px;
   margin-top: 25px;
 }
+
+.show-addaccount-container {
+  display: flex;
+  flex-direction: column;
+  width: 880px;
+  min-height: 350px;
+  padding: 12px;
+  border-radius: 10px;
+  //background-color: rgb(240, 247, 250);
+  background-color: red;
+  border: 1px solid #e9e9e9;
+}

From 20d63a58062018de8f21c0e129847685ef424eca Mon Sep 17 00:00:00 2001
From: Kenneth Jannette <sj@sjdev.co>
Date: Sat, 27 Jan 2024 16:58:15 -0600
Subject: [PATCH 02/10] more

---
 src/Components/SignupPage/SignupPage.js |  4 ++--
 src/styles/signup.scss                  | 20 +++++++++++++++++---
 2 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/src/Components/SignupPage/SignupPage.js b/src/Components/SignupPage/SignupPage.js
index 1b6302d..592d3f9 100644
--- a/src/Components/SignupPage/SignupPage.js
+++ b/src/Components/SignupPage/SignupPage.js
@@ -429,11 +429,11 @@ const SignupPage = () => {
               <div className="show-addaccount-container">
                 {" "}
                 <div className="plan-header-right">
-                  <h5 className="signup-subheader-text">
+                  <h5 className="signup-button-wrapper-text">
                     Add additional accounts
                   </h5>
                   <p className="signup-accounts-info">
-                    Account holder access will be setup later
+                    account holder access will be setup later
                   </p>
                 </div>
               </div>
diff --git a/src/styles/signup.scss b/src/styles/signup.scss
index 29ec0e8..157dbd4 100644
--- a/src/styles/signup.scss
+++ b/src/styles/signup.scss
@@ -40,6 +40,14 @@
   margin-top: 6px;
 }
 
+.signup-button-wrapper-text {
+  letter-spacing: -0.6px;
+  font-weight: 400;
+  font-size: 1.7rem;
+  margin-left: 5px;
+  margin-bottom: 0px !important;
+}
+
 .signup-form {
   width: 880px;
 }
@@ -195,10 +203,16 @@
   display: flex;
   flex-direction: column;
   width: 880px;
-  min-height: 350px;
+  min-height: 180px;
   padding: 12px;
   border-radius: 10px;
-  //background-color: rgb(240, 247, 250);
-  background-color: red;
+  background-color: #fff;
   border: 1px solid #e9e9e9;
 }
+
+.signup-accounts-info {
+  font-weight: 300;
+  font-size: 0.93rem;
+  margin-top: 0px;
+  margin-left: 5px;
+}

From 2d9c07d18c54c97c669ce78b0bb8b2eb05b5dd75 Mon Sep 17 00:00:00 2001
From: Kenneth Jannette <sj@sjdev.co>
Date: Sat, 27 Jan 2024 16:58:39 -0600
Subject: [PATCH 03/10] more

---
 src/styles/signup.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/styles/signup.scss b/src/styles/signup.scss
index 157dbd4..5f9e26b 100644
--- a/src/styles/signup.scss
+++ b/src/styles/signup.scss
@@ -203,7 +203,7 @@
   display: flex;
   flex-direction: column;
   width: 880px;
-  min-height: 180px;
+  min-height: 200px;
   padding: 12px;
   border-radius: 10px;
   background-color: #fff;

From 8353480ac98a2cf76be432e4eb031d10f9687ca8 Mon Sep 17 00:00:00 2001
From: Kenneth Jannette <sj@sjdev.co>
Date: Sat, 27 Jan 2024 17:00:39 -0600
Subject: [PATCH 04/10] more

---
 src/Components/SignupPage/SignupPage.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Components/SignupPage/SignupPage.js b/src/Components/SignupPage/SignupPage.js
index 592d3f9..30d3d7a 100644
--- a/src/Components/SignupPage/SignupPage.js
+++ b/src/Components/SignupPage/SignupPage.js
@@ -433,7 +433,7 @@ const SignupPage = () => {
                     Add additional accounts
                   </h5>
                   <p className="signup-accounts-info">
-                    account holder access will be setup later
+                    account username(s) and access will be setup later
                   </p>
                 </div>
               </div>

From e0cd22242a6a1924255466cbfff0f7095fb980b5 Mon Sep 17 00:00:00 2001
From: Kenneth Jannette <sj@sjdev.co>
Date: Sat, 27 Jan 2024 17:07:21 -0600
Subject: [PATCH 05/10] more

---
 src/Components/SignupPage/SignupPage.js | 24 ++++++++++++++++--------
 src/styles/signup.scss                  |  4 ++--
 2 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/src/Components/SignupPage/SignupPage.js b/src/Components/SignupPage/SignupPage.js
index 30d3d7a..692e193 100644
--- a/src/Components/SignupPage/SignupPage.js
+++ b/src/Components/SignupPage/SignupPage.js
@@ -184,6 +184,9 @@ const SignupPage = () => {
     setIsAnnual(!isAnnual);
     console.log("isAnnual", isAnnual);
   };
+  const handleAddAccounts = () => {
+    setShowAddAccount(!showAddAccount);
+  };
 
   async function handleStripeAuthorization(
     user,
@@ -441,14 +444,19 @@ const SignupPage = () => {
               <></>
             )}
             <div className="signup-button-box">
-              <Button
-                className="primary-button signup-proceed"
-                type="button"
-                size="lg"
-                onClick={() => setShowAddAccount(!showAddAccount)}
-                disabled={isBusy}
-                labelText="Add Account(s)"
-              />
+              {!showAddAccount ? (
+                <Button
+                  className="secondary-button"
+                  type="button"
+                  size="lg"
+                  onClick={handleAddAccounts}
+                  disabled={isBusy}
+                  labelText="Add Account(s)"
+                />
+              ) : (
+                <></>
+              )}
+
               <Button
                 className="primary-button signup-proceed"
                 type="button"
diff --git a/src/styles/signup.scss b/src/styles/signup.scss
index 5f9e26b..04c746a 100644
--- a/src/styles/signup.scss
+++ b/src/styles/signup.scss
@@ -56,8 +56,8 @@
   width: 100%;
   margin-bottom: 24px;
   display: flex;
-  flex-direction: column;
-  align-items: flex-end;
+  flex-direction: row;
+  justify-content: flex-end;
   padding-right: 14px;
 }
 

From d1e270c41d8297351b8f6866327c07db10f42cd9 Mon Sep 17 00:00:00 2001
From: Kenneth Jannette <sj@sjdev.co>
Date: Sat, 27 Jan 2024 17:09:07 -0600
Subject: [PATCH 06/10] more

---
 src/Components/SignupPage/SignupPage.js | 2 +-
 src/styles/signup.scss                  | 7 +++++++
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/Components/SignupPage/SignupPage.js b/src/Components/SignupPage/SignupPage.js
index 692e193..ce1f30b 100644
--- a/src/Components/SignupPage/SignupPage.js
+++ b/src/Components/SignupPage/SignupPage.js
@@ -431,7 +431,7 @@ const SignupPage = () => {
             {showAddAccount ? (
               <div className="show-addaccount-container">
                 {" "}
-                <div className="plan-header-right">
+                <div className="plan-header-right-lower">
                   <h5 className="signup-button-wrapper-text">
                     Add additional accounts
                   </h5>
diff --git a/src/styles/signup.scss b/src/styles/signup.scss
index 04c746a..3b9dd41 100644
--- a/src/styles/signup.scss
+++ b/src/styles/signup.scss
@@ -83,6 +83,13 @@
   width: 50%;
 }
 
+.plan-header-right-low {
+  display: flex;
+  flex-direction: row;
+  padding: 12px 14px;
+  width: 100%;
+}
+
 .plan-header-left {
   display: flex;
   flex-direction: row-reverse;

From 1c22a8ac7b9ad71049f8b3b6c7c41e9df2c42b2e Mon Sep 17 00:00:00 2001
From: Kenneth Jannette <sj@sjdev.co>
Date: Sat, 27 Jan 2024 17:15:10 -0600
Subject: [PATCH 07/10] more

---
 src/Components/SignupPage/SignupPage.js | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

diff --git a/src/Components/SignupPage/SignupPage.js b/src/Components/SignupPage/SignupPage.js
index ce1f30b..2a218d0 100644
--- a/src/Components/SignupPage/SignupPage.js
+++ b/src/Components/SignupPage/SignupPage.js
@@ -188,6 +188,10 @@ const SignupPage = () => {
     setShowAddAccount(!showAddAccount);
   };
 
+  const handleCancelAdd = () => {
+    setShowAddAccount(!showAddAccount);
+  };
+
   async function handleStripeAuthorization(
     user,
     paymentDataValues,
@@ -439,6 +443,20 @@ const SignupPage = () => {
                     account username(s) and access will be setup later
                   </p>
                 </div>
+                <div className="details-button-box">
+                  <Button
+                    className="secondary-button back-button"
+                    onClick={handleCancelAdd}
+                    labelText="Cancel"
+                  />
+                  <div className="upload-button-box">
+                    <Button
+                      className="p-2 mr-2 primary-button"
+                      onClick={() => setShowUploadModal(true)}
+                      labelText="Upload Document"
+                    />
+                  </div>
+                </div>
               </div>
             ) : (
               <></>
@@ -456,7 +474,6 @@ const SignupPage = () => {
               ) : (
                 <></>
               )}
-
               <Button
                 className="primary-button signup-proceed"
                 type="button"

From c2deadf85c5dcd50c1f02d0e38bff97cbadb5399 Mon Sep 17 00:00:00 2001
From: Kenneth Jannette <sj@sjdev.co>
Date: Sat, 27 Jan 2024 17:23:07 -0600
Subject: [PATCH 08/10] more

---
 src/Components/SignupPage/SignupPage.js | 31 ++++++++++++++++---------
 1 file changed, 20 insertions(+), 11 deletions(-)

diff --git a/src/Components/SignupPage/SignupPage.js b/src/Components/SignupPage/SignupPage.js
index 2a218d0..6ee1297 100644
--- a/src/Components/SignupPage/SignupPage.js
+++ b/src/Components/SignupPage/SignupPage.js
@@ -44,7 +44,6 @@ const SignupPage = () => {
   const [isAnnual, setIsAnnual] = useState(false);
   // Could also go in App.js if needed in the future
   const stripe = new Stripe(stripeApiKey);
-  console.log("activeRadioOption", activeRadioOption);
   const apiUrl =
     process.env.NODE_ENV === "development"
       ? process.env.REACT_APP_API_DEV
@@ -185,6 +184,7 @@ const SignupPage = () => {
     console.log("isAnnual", isAnnual);
   };
   const handleAddAccounts = () => {
+    console.log("selectedPlan", selectedPlan);
     setShowAddAccount(!showAddAccount);
   };
 
@@ -192,6 +192,10 @@ const SignupPage = () => {
     setShowAddAccount(!showAddAccount);
   };
 
+  const handleAdd = () => {
+    //add accounts, close sectin
+    setShowAddAccount(!showAddAccount);
+  };
   async function handleStripeAuthorization(
     user,
     paymentDataValues,
@@ -443,6 +447,7 @@ const SignupPage = () => {
                     account username(s) and access will be setup later
                   </p>
                 </div>
+                <div className="add-accounts-input-box"></div>
                 <div className="details-button-box">
                   <Button
                     className="secondary-button back-button"
@@ -452,8 +457,8 @@ const SignupPage = () => {
                   <div className="upload-button-box">
                     <Button
                       className="p-2 mr-2 primary-button"
-                      onClick={() => setShowUploadModal(true)}
-                      labelText="Upload Document"
+                      onClick={handleAdd}
+                      labelText="Add And Proceed to Payment"
                     />
                   </div>
                 </div>
@@ -474,14 +479,18 @@ const SignupPage = () => {
               ) : (
                 <></>
               )}
-              <Button
-                className="primary-button signup-proceed"
-                type="button"
-                size="lg"
-                onClick={handleProceedToPayment}
-                disabled={isBusy}
-                labelText="Proceed to Payment"
-              />
+              {!showAddAccount ? (
+                <Button
+                  className="primary-button signup-proceed"
+                  type="button"
+                  size="lg"
+                  onClick={handleProceedToPayment}
+                  disabled={isBusy}
+                  labelText="Proceed to Payment"
+                />
+              ) : (
+                <></>
+              )}
             </div>
           </div>
         </div>

From 1d2fbe1742ad002bbf2d3ee47c58ee997dedbfaa Mon Sep 17 00:00:00 2001
From: Kenneth Jannette <sj@sjdev.co>
Date: Sat, 27 Jan 2024 17:27:01 -0600
Subject: [PATCH 09/10] more

---
 src/Components/SignupPage/SignupPage.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/Components/SignupPage/SignupPage.js b/src/Components/SignupPage/SignupPage.js
index 6ee1297..8f14cf3 100644
--- a/src/Components/SignupPage/SignupPage.js
+++ b/src/Components/SignupPage/SignupPage.js
@@ -310,6 +310,10 @@ const SignupPage = () => {
   };
 
   const showNoticeOnPage = "" !== notice && !showPaymentModal;
+  const addAccountCopy =
+    selectedPlan[0].value === "seniorPartner"
+      ? "You ay add up to eight accounts"
+      : "You may add up to two accounts";
 
   return (
     <div className="signup-super-container">
@@ -391,7 +395,6 @@ const SignupPage = () => {
             labelText="Select A Plan"
           />
         </div>
-
         {showNoticeOnPage ? (
           <>
             <br></br>
@@ -447,7 +450,6 @@ const SignupPage = () => {
                     account username(s) and access will be setup later
                   </p>
                 </div>
-                <div className="add-accounts-input-box"></div>
                 <div className="details-button-box">
                   <Button
                     className="secondary-button back-button"

From 13492956e59a994a4b060f9c8c5fd6a52d0b9f80 Mon Sep 17 00:00:00 2001
From: Kenneth Jannette <sj@sjdev.co>
Date: Sat, 27 Jan 2024 17:45:28 -0600
Subject: [PATCH 10/10] more

---
 src/Components/SignupPage/SignupPage.js | 38 ++++++++++++-------------
 1 file changed, 18 insertions(+), 20 deletions(-)

diff --git a/src/Components/SignupPage/SignupPage.js b/src/Components/SignupPage/SignupPage.js
index 8f14cf3..89184ae 100644
--- a/src/Components/SignupPage/SignupPage.js
+++ b/src/Components/SignupPage/SignupPage.js
@@ -470,26 +470,24 @@ const SignupPage = () => {
             )}
             <div className="signup-button-box">
               {!showAddAccount ? (
-                <Button
-                  className="secondary-button"
-                  type="button"
-                  size="lg"
-                  onClick={handleAddAccounts}
-                  disabled={isBusy}
-                  labelText="Add Account(s)"
-                />
-              ) : (
-                <></>
-              )}
-              {!showAddAccount ? (
-                <Button
-                  className="primary-button signup-proceed"
-                  type="button"
-                  size="lg"
-                  onClick={handleProceedToPayment}
-                  disabled={isBusy}
-                  labelText="Proceed to Payment"
-                />
+                <>
+                  <Button
+                    className="secondary-button"
+                    type="button"
+                    size="lg"
+                    onClick={handleAddAccounts}
+                    disabled={isBusy}
+                    labelText="Add Account(s)"
+                  />
+                  <Button
+                    className="primary-button signup-proceed"
+                    type="button"
+                    size="lg"
+                    onClick={handleProceedToPayment}
+                    disabled={isBusy}
+                    labelText="Proceed to Payment"
+                  />
+                </>
               ) : (
                 <></>
               )}