From ec77c76f0e644d81129a40b232a356a935fd40a8 Mon Sep 17 00:00:00 2001
From: Anna <annagav@mit.edu>
Date: Mon, 29 Sep 2025 18:27:13 -0400
Subject: [PATCH 1/3] adding missing fields

---
 .../src/components/forms/ProfileFormFields.js | 46 +++++++++++++++++++
 1 file changed, 46 insertions(+)

diff --git a/frontend/public/src/components/forms/ProfileFormFields.js b/frontend/public/src/components/forms/ProfileFormFields.js
index c4d6b6559d..b8d8af40b4 100644
--- a/frontend/public/src/components/forms/ProfileFormFields.js
+++ b/frontend/public/src/components/forms/ProfileFormFields.js
@@ -149,6 +149,43 @@ const findStates = (country: string, countries: Array<Country>) => {
     null
 }
 
+const renderFirstNameField = errors => {
+  const hasError =
+    errors && errors.legal_address && errors.legal_address.first_name
+  return (
+    <div>
+      <CardLabel
+        htmlFor="legal_address.first_name"
+        isRequired={true}
+        label="First Name"
+        subLabel="Name that will appear on emails"
+      />
+      <Field
+        type="text"
+        name="legal_address.first_name"
+        id="legal_address.first_name"
+        className="form-control"
+        autoComplete="given-name"
+        aria-invalid={
+          hasError ? "true" : null
+        }
+        aria-describedby={
+          hasError ?
+            "first-name-error" :
+            null
+        }
+        aria-description="Name cannot start with, or contain, a special character"
+        title="Name cannot start with, or contain, a special character."
+        required
+      />
+      <ErrorMessage
+        id="first-name-error"
+        name="legal_address.first_name"
+        component={FormError}
+      />
+    </div>)
+}
+
 const renderYearOfBirthField = errors => {
   const hasError =
     errors && errors.user_profile && errors.user_profile.year_of_birth
@@ -202,8 +239,14 @@ export const LegalAddressCountryFields = ({
         values.legal_address.country === "CA") &&
         !values.legal_address.state)
   )
+  const [showFirstNameField, setshowFirstNameField] = React.useState(
+    values.legal_address.first_name === ""
+  )
 
   React.useEffect(() => {
+    if (values.legal_address.first_name === "") {
+      setshowFirstNameField(true)
+    }
     if (values.user_profile.year_of_birth === "") {
       setShowYearOfBirthField(true)
     }
@@ -219,6 +262,9 @@ export const LegalAddressCountryFields = ({
 
   return (
     <React.Fragment>
+      {showFirstNameField ? (
+        <div className="form-group">{renderFirstNameField(errors)}</div>
+      ) : null}
       {showYearOfBirthField ? (
         <div className="form-group">{renderYearOfBirthField(errors)}</div>
       ) : null}

From 9ec7b95cb7afdb1ccdf54e1724bef20ce6f3a3d6 Mon Sep 17 00:00:00 2001
From: Anna <annagav@mit.edu>
Date: Tue, 30 Sep 2025 09:14:51 -0400
Subject: [PATCH 2/3] add last name too

---
 .../src/components/forms/ProfileFormFields.js | 102 +++++++++---------
 1 file changed, 50 insertions(+), 52 deletions(-)

diff --git a/frontend/public/src/components/forms/ProfileFormFields.js b/frontend/public/src/components/forms/ProfileFormFields.js
index b8d8af40b4..499090dd01 100644
--- a/frontend/public/src/components/forms/ProfileFormFields.js
+++ b/frontend/public/src/components/forms/ProfileFormFields.js
@@ -186,6 +186,43 @@ const renderFirstNameField = errors => {
     </div>)
 }
 
+const renderLastNameField = errors => {
+  const hasError =
+    errors && errors.legal_address && errors.legal_address.last_name
+  return (
+    <div>
+      <CardLabel
+        htmlFor="legal_address.last_name"
+        isRequired={true}
+        label="Last Name"
+        subLabel="Name that will appear on emails"
+      />
+      <Field
+        type="text"
+        name="legal_address.last_name"
+        id="legal_address.last_name"
+        className="form-control"
+        autoComplete="family-name"
+        aria-invalid={
+          hasError ? "true" : null
+        }
+        aria-describedby={
+          hasError ?
+            "last-name-error" :
+            null
+        }
+        aria-description="Name cannot start with, or contain, a special character"
+        title="Name cannot start with, or contain, a special character."
+        required
+      />
+      <ErrorMessage
+        id="last-name-error"
+        name="legal_address.last_name"
+        component={FormError}
+      />
+    </div>)
+}
+
 const renderYearOfBirthField = errors => {
   const hasError =
     errors && errors.user_profile && errors.user_profile.year_of_birth
@@ -239,13 +276,19 @@ export const LegalAddressCountryFields = ({
         values.legal_address.country === "CA") &&
         !values.legal_address.state)
   )
-  const [showFirstNameField, setshowFirstNameField] = React.useState(
+  const [showFirstNameField, setShowFirstNameField] = React.useState(
+    values.legal_address.first_name === ""
+  )
+  const [showLastNameField, setShowLastNameField] = React.useState(
     values.legal_address.first_name === ""
   )
 
   React.useEffect(() => {
     if (values.legal_address.first_name === "") {
-      setshowFirstNameField(true)
+      setShowFirstNameField(true)
+    }
+    if (values.legal_address.last_name === "") {
+      setShowLastNameField(true)
     }
     if (values.user_profile.year_of_birth === "") {
       setShowYearOfBirthField(true)
@@ -265,6 +308,9 @@ export const LegalAddressCountryFields = ({
       {showFirstNameField ? (
         <div className="form-group">{renderFirstNameField(errors)}</div>
       ) : null}
+      {showLastNameField ? (
+        <div className="form-group">{renderLastNameField(errors)}</div>
+      ) : null}
       {showYearOfBirthField ? (
         <div className="form-group">{renderYearOfBirthField(errors)}</div>
       ) : null}
@@ -363,58 +409,10 @@ export const LegalAddressFields = ({
   return (
     <React.Fragment>
       <div className="form-group">
-        <CardLabel
-          htmlFor="legal_address.first_name"
-          isRequired={true}
-          label="First Name"
-          subLabel="Name that will appear on emails"
-        />
-        <Field
-          type="text"
-          name="legal_address.first_name"
-          id="legal_address.first_name"
-          className="form-control"
-          autoComplete="given-name"
-          aria-invalid={
-            addressErrors && addressErrors.first_name ? "true" : null
-          }
-          aria-describedby={
-            addressErrors && addressErrors.first_name ?
-              "first-name-error" :
-              null
-          }
-          aria-description="Name cannot start with, or contain, a special character"
-          title="Name cannot start with, or contain, a special character."
-          required
-        />
-        <ErrorMessage
-          id="first-name-error"
-          name="legal_address.first_name"
-          component={FormError}
-        />
+        {renderFirstNameField(errors)}
       </div>
       <div className="form-group">
-        <CardLabel
-          htmlFor="legal_address.last_name"
-          isRequired={true}
-          label="Last Name"
-        />
-        <Field
-          type="text"
-          name="legal_address.last_name"
-          id="legal_address.last_name"
-          className="form-control"
-          autoComplete="family-name"
-          aria-invalid={
-            addressErrors && addressErrors.last_name ? "true" : null
-          }
-          aria-describedby={
-            addressErrors && addressErrors.last_name ? "last-name-error" : null
-          }
-          aria-description="Name cannot start with, or contain, a special character"
-          required
-        />
-        <ErrorMessage name="legal_address.last_name" component={FormError} />
+        {renderLastNameField(errors)}
       </div>
       <div className="form-group">
         <CardLabel

From 1902e7daa9123fc1412440fc7f703b7a61f10d6c Mon Sep 17 00:00:00 2001
From: Anna <annagav@mit.edu>
Date: Tue, 30 Sep 2025 09:44:26 -0400
Subject: [PATCH 3/3] format

---
 .../src/components/forms/ProfileFormFields.js | 36 ++++++-------------
 1 file changed, 11 insertions(+), 25 deletions(-)

diff --git a/frontend/public/src/components/forms/ProfileFormFields.js b/frontend/public/src/components/forms/ProfileFormFields.js
index 499090dd01..377ca34631 100644
--- a/frontend/public/src/components/forms/ProfileFormFields.js
+++ b/frontend/public/src/components/forms/ProfileFormFields.js
@@ -166,14 +166,8 @@ const renderFirstNameField = errors => {
         id="legal_address.first_name"
         className="form-control"
         autoComplete="given-name"
-        aria-invalid={
-          hasError ? "true" : null
-        }
-        aria-describedby={
-          hasError ?
-            "first-name-error" :
-            null
-        }
+        aria-invalid={hasError ? "true" : null}
+        aria-describedby={hasError ? "first-name-error" : null}
         aria-description="Name cannot start with, or contain, a special character"
         title="Name cannot start with, or contain, a special character."
         required
@@ -183,7 +177,8 @@ const renderFirstNameField = errors => {
         name="legal_address.first_name"
         component={FormError}
       />
-    </div>)
+    </div>
+  )
 }
 
 const renderLastNameField = errors => {
@@ -203,14 +198,8 @@ const renderLastNameField = errors => {
         id="legal_address.last_name"
         className="form-control"
         autoComplete="family-name"
-        aria-invalid={
-          hasError ? "true" : null
-        }
-        aria-describedby={
-          hasError ?
-            "last-name-error" :
-            null
-        }
+        aria-invalid={hasError ? "true" : null}
+        aria-describedby={hasError ? "last-name-error" : null}
         aria-description="Name cannot start with, or contain, a special character"
         title="Name cannot start with, or contain, a special character."
         required
@@ -220,7 +209,8 @@ const renderLastNameField = errors => {
         name="legal_address.last_name"
         component={FormError}
       />
-    </div>)
+    </div>
+  )
 }
 
 const renderYearOfBirthField = errors => {
@@ -280,7 +270,7 @@ export const LegalAddressCountryFields = ({
     values.legal_address.first_name === ""
   )
   const [showLastNameField, setShowLastNameField] = React.useState(
-    values.legal_address.first_name === ""
+    values.legal_address.last_name === ""
   )
 
   React.useEffect(() => {
@@ -408,12 +398,8 @@ export const LegalAddressFields = ({
   const addressErrors = errors && errors.legal_address
   return (
     <React.Fragment>
-      <div className="form-group">
-        {renderFirstNameField(errors)}
-      </div>
-      <div className="form-group">
-        {renderLastNameField(errors)}
-      </div>
+      <div className="form-group">{renderFirstNameField(errors)}</div>
+      <div className="form-group">{renderLastNameField(errors)}</div>
       <div className="form-group">
         <CardLabel
           htmlFor="name"