changes for testing

src/Components/PatientForm/PersonalSection1.tsx

@@ -28,7 +28,7 @@ interface Patient {
     email: yup.string().required("Email is required"),
     age: yup.number().positive().integer("Age must be a positive integer").required("Age is required"),
     dateOfBirth: yup.date().required("Date of birth is required"),
-    socialSecurityNumber: yup.string().matches(/^\d{9}$/, "Social security number must be 9 digits"),
+    socialSecurityNumber: yup.string(),
     mailingAddress: yup.string().required("Mailing address is required"),
     city: yup.string().required("City is required"),
     state: yup.string().required("State is required"),
@@ -38,6 +38,7 @@ interface Patient {
 export default function PersonalSection(){
 
     const [startDateValue, setStartDateValue] = React.useState<any>();
+    const [emailValue, setEmailValue]= React.useState<string>('');
     const [patient, setPatient] = React.useState<Patient>({
         fullName: "",
         homePhone: "",
@@ -88,7 +89,7 @@ export default function PersonalSection(){
     
     return(
         <>
-        <Grid container direction="row">
+        <Grid container direction="row" className='section1-test-class'>
             <Grid item xs={4} className='collapsable-form-style '>
              <TextField
                     variant="outlined"
@@ -139,8 +140,10 @@ export default function PersonalSection(){
                     label="Email"
                     name="email"
                     placeholder='Please enter your email'
-                    value={formik.values.email}
-                    onChange={handleChange}
+                    value={emailValue}
+                    onChange={(e)=>{
+                        setEmailValue(e.target.value)
+                    }}
                     onBlur={formik.handleBlur}
                     // error={formik.touched.email && Boolean(formik.errors.email)}
                     // helperText={formik.touched.email && formik.errors.email}