package-lock.json

@@ -37,7 +37,6 @@
         "react-dom": "^18.2.0",
         "react-gauge-chart": "^0.4.1",
         "react-icons": "^4.9.0",
-        "react-image-marker": "^1.2.0",
         "react-leaflet": "^4.2.1",
         "react-router-dom": "^6.14.2",
         "react-scripts": "5.0.1",
@@ -15796,15 +15795,6 @@
         "react": "*"
       }
     },
-    "node_modules/react-image-marker": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/react-image-marker/-/react-image-marker-1.2.0.tgz",
-      "integrity": "sha512-HFrzKVnX/hgZqHlxwV7XQNiyMRowD1IAnbsf4dZCEuSzGlGHxAv+sCv/AU1VHHVxFxoHubNL/xYNpGQfgtX67A==",
-      "peerDependencies": {
-        "react": ">= 16.8.0",
-        "react-dom": ">= 16.8.0"
-      }
-    },
     "node_modules/react-is": {
       "version": "17.0.2",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",

src/App.tsx

@@ -11,8 +11,7 @@ function App() {
         <div className='flex'>
           <BrowserRouter>
           <Routes>
-            <Route path='/' element={<PatientForm type={"fill"}/>} />
+              <Route path='/' element={<PatientForm />}/>
-            <Route path='/view-details' element={<PatientForm type={"display"}/>}/>
           </Routes>
           </BrowserRouter>
         </div>

src/Components/Helper/AlertDialogBox.tsx

@@ -1,35 +0,0 @@
-import { Alert, AlertColor, Snackbar, Stack } from '@mui/material';
-
-type Props = {
-  open: boolean;
-  message: string;
-  severity: AlertColor;
-  duration: number;
-  handleAlertClose: () => void;
-};
-
-function AlertDialog({
-  open,
-  message,
-  severity,
-  duration,
-  handleAlertClose,
-}: Props) {
-  return (
-    <Stack spacing={2} sx={{ width: '100%' }}>
-      <Snackbar
-        anchorOrigin={{ vertical: 'top', horizontal: 'right' }}
-        open={open}
-        autoHideDuration={duration}
-        onClose={handleAlertClose}
-        sx={{ zIndex: 9999 }}
-      >
-        <Alert severity={severity} sx={{ width: '100%' }}>
-          {message}
-        </Alert>
-      </Snackbar>
-    </Stack>
-  );
-}
-
-export default AlertDialog;

src/Components/ImageMarker/EntryForm.tsx

@@ -24,14 +24,14 @@ const EntryForm = ({ entries, onUpdate, onDelete, onSave }: Props) => {
           onDelete={onDelete}
         />
       ))}
-      {
+      {/* {
         entries && entries.length > 0 &&
         <div className='buttonDiv'>
           <Button variant='contained' onClick={() => onSave({})}>
             Save
           </Button>
         </div>
-      }
+      } */}
     </div>
   );
 };

src/Components/ImageMarker/PatientImageMarker.css

@@ -39,19 +39,6 @@
     width: 80%;
 }
 
-.image-marker-div .entry-div .sub-header {
-    font-weight: 500;
-    font-size: 16px;
-}
-
-.ratingResult {
-    display: flex;
-    align-items: center;
-    gap: 5px;
-    margin-top: 2%;
-    margin-bottom: 3%;
-}
-
 @media only screen and (max-width: 1200px) {
     .image-marker-div {
         flex-direction: column;
@@ -73,11 +60,7 @@
 
 @media only screen and (min-width: 1400px) {
     .image-marker-div .rating-div {
-        width: 70%;
+        width: 60%;
-    }
-
-    .ratingResult .rating-div {
-        width: 80%;
     }
 }
 

src/Components/ImageMarker/PatientImageMarker.tsx

@@ -34,10 +34,7 @@ const PatientImageMarker = (props: Props) => {
   };
 
   const onSave = () => {
-    localStorage.setItem(
+
-      'entry',
-      JSON.stringify({ markers: markers, entries: entries })
-    );
   }
 
   useEffect(() => {

src/Components/ImageMarker/Rating.tsx

@@ -5,10 +5,9 @@ type Props = {
   index: number;
   defaultValue: number;
   onUpdate: (data: any) => void;
-  disabled?: boolean;
 };
 
-const Rating = ({index, defaultValue, onUpdate, disabled} : Props) => {
+const Rating = ({index, defaultValue, onUpdate} : Props) => {
   return (
     <div key={index} className='rating-div'>
       {[...Array(10)].map((star, ind) => {
@@ -17,8 +16,7 @@ const Rating = ({index, defaultValue, onUpdate, disabled} : Props) => {
             <Button
               className={`btn btn-scale btn-scale-asc-${ind+1} ${(ind+1) === defaultValue ? 'selected' : ''}`}
               key={ind + 1}
-              onClick={() => onUpdate({ index: index, severity: ind + 1 })}
+              onClick={() => onUpdate({ index: index, severity: ind+1 })}
-              disabled={disabled}
             >
               {ind + 1}
             </Button>

src/Components/ImageMarker/ViewPatientImageMarker.tsx

@@ -1,30 +0,0 @@
-import React, { useEffect, useState } from 'react'
-import ImageMarker, { Marker } from 'react-image-marker';
-
-import humanImage from '../../Assets/human_body_3d.jpg';
-import './PatientImageMarker.css'
-import Rating from './Rating';
-
-type Props = {}
-
-const ViewPatientImageMarker = (props: Props) => {
-  const saved = JSON.parse(localStorage.getItem('entry') || '{}');
-  return (
-      <div className='image-marker-div'>
-      <div className='entry-div'>
-        <span className='sub-header'>How much pain?</span>
-            {saved.entries?.map((entry: any, index: number) => (
-              <div className='ratingResult' key={index}>
-                <span className='image-marker__marker--default'>{entry.index}</span>
-                <Rating index={entry.index} defaultValue={entry.severity} onUpdate={() => {}} disabled/>
-              </div>
-            ))}
-          </div>
-          <div className='marker-div'>
-              <ImageMarker src={humanImage} markers={saved.markers ?? []} />
-          </div>
-    </div>
-  )
-}
-
-export default ViewPatientImageMarker;

src/Components/PatientForm/FamilyFormSection2.tsx

@@ -19,6 +19,21 @@ interface Patient {
     spousePhone: string | undefined,
 }
 
+const validationSchema = yup.object({
+  maritalStatus:yup.string().required("Marital Status is required"),
+  numberOfChildren:yup.string().required("Full name is required"),
+  occupation:yup.string().required("Occupation is required"),
+//   hoursPerWeek: yup.number().required('Required'),
+//   employer:yup.string().required("Full name is required"),
+//   businessPhone:yup.string().required("Full name is required"),
+  spouseName:yup.string().required("Spouse name is required"),
+//   spouseEmployer:yup.string().required("Full name is required"),
+//   spouseBusinessPhone:yup.string().required("Full name is required"),
+  emergencyContact:yup.string().matches(/^\d{10}$/, "Cell phone must be 10 digits"),
+  relationship:yup.string().required("Relationship is required"),
+  spousePhone:yup.string().matches(/^\d{10}$/, "Cell phone must be 10 digits"),
+});
+
 type Props = {
     handleFormSection2Data:(
         maritalStatus: string | undefined,
@@ -34,12 +49,10 @@ type Props = {
         relationship: string | undefined,
         spousePhone: string | undefined,
     )=> void
-    patientDataDiplay:any;
-    type:string;
   }
   
 
-export default function FamilyFormSection({handleFormSection2Data,patientDataDiplay,type}:Props){
+export default function FamilyFormSection({handleFormSection2Data}:Props){
     const [patient, setPatient] = React.useState<Patient>({
         maritalStatus:'',
         numberOfChildren:'',
@@ -80,8 +93,9 @@ export default function FamilyFormSection({handleFormSection2Data,patientDataDip
             <FormLabel>Marital Status</FormLabel>
                 <RadioGroup
                     aria-labelledby="demo-radio-buttons-group-label"
+                    defaultValue="married"
                     name="maritalStatus"
-                    defaultValue={type=='display'?patientDataDiplay.maritalStatus:patient.maritalStatus}
+                    value={patient.maritalStatus}
                     sx={{display:'flex', flexDirection:'row'}}
                     onChange={(e)=>{
                         setPatient((prevValues:any) => ({
@@ -89,12 +103,14 @@ export default function FamilyFormSection({handleFormSection2Data,patientDataDip
                             maritalStatus: e.target.value,
                           }));
                     }}
+                    // error={formik.touched.numberOfChildren && Boolean(formik.errors.maritalStatus)}
+                    // helperText={formik.touched.numberOfChildren && formik.errors.maritalStatus}
                     >
-                    <FormControlLabel value="married" control={<Radio />} label="Married" disabled={type=='display'}/>
+                    <FormControlLabel value="married" control={<Radio />} label="Married" />
-                    <FormControlLabel value="single" control={<Radio />} label="Single" disabled={type=='display'}/>
+                    <FormControlLabel value="single" control={<Radio />} label="Single" />
-                    <FormControlLabel value="widowed" control={<Radio />} label="Widowed" disabled={type=='display'}/>
+                    <FormControlLabel value="widowed" control={<Radio />} label="Widowed" />
-                    <FormControlLabel value="seperated" control={<Radio />} label="Seperated" disabled={type=='display'}/>
+                    <FormControlLabel value="seperated" control={<Radio />} label="Seperated" />
-                    <FormControlLabel value="divorced" control={<Radio />} label="Divorced" disabled={type=='display'}/>
+                    <FormControlLabel value="divorced" control={<Radio />} label="Divorced" />
                 </RadioGroup>
                 
             </FormControl>
@@ -115,8 +131,10 @@ export default function FamilyFormSection({handleFormSection2Data,patientDataDip
                         numberOfChildren: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.numberOfChildren:patient.numberOfChildren}
+                value={patient.numberOfChildren}
-                disabled={type=='display'}
+                // onBlur={formik.handleBlur}
+                // error={formik.touched.numberOfChildren && Boolean(formik.errors.numberOfChildren)}
+                // helperText={formik.touched.numberOfChildren && formik.errors.numberOfChildren}
                 />
             </Grid>
             <Grid item xs={4} className='collapsable-form-style '>
@@ -132,8 +150,10 @@ export default function FamilyFormSection({handleFormSection2Data,patientDataDip
                         occupation: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.occupation:patient.occupation}
+                value={patient.occupation}
-                disabled={type=='display'}
+                // onBlur={formik.handleBlur}
+                // error={formik.touched.occupation && Boolean(formik.errors.occupation)}
+                // helperText={formik.touched.occupation && formik.errors.occupation}
                 />
                
             </Grid>
@@ -150,8 +170,8 @@ export default function FamilyFormSection({handleFormSection2Data,patientDataDip
                         hoursPerWeek: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.hoursPerWeek:patient.hoursPerWeek}
+                 value={patient.hoursPerWeek}
-                disabled={type=='display'}
+                //  onBlur={formik.handleBlur}
                  />
                  
             </Grid>
@@ -167,8 +187,8 @@ export default function FamilyFormSection({handleFormSection2Data,patientDataDip
                         employer: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.employer:patient.employer}
+                value={patient.employer}
-                disabled={type=='display'}
+                // onBlur={formik.handleBlur}
                 />
             </Grid>
             <Grid item xs={4} className='collapsable-form-style '>
@@ -184,8 +204,8 @@ export default function FamilyFormSection({handleFormSection2Data,patientDataDip
                         businessPhone: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.businessPhone:patient.businessPhone}
+                value={patient.businessPhone}
-                disabled={type=='display'}
+                // onBlur={formik.handleBlur}
                 />
             </Grid>
 
@@ -207,8 +227,8 @@ export default function FamilyFormSection({handleFormSection2Data,patientDataDip
                         spouseName: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.spouseName:patient.spouseName}
+                 value={patient.spouseName}
-                disabled={type=='display'}
+                //  onBlur={formik.handleBlur}
                  />
             </Grid>
             <Grid item xs={4} className='collapsable-form-style '>
@@ -223,8 +243,8 @@ export default function FamilyFormSection({handleFormSection2Data,patientDataDip
                         spouseEmployer: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.spouseEmployer:patient.spouseEmployer}
+                 value={patient.spouseEmployer}
-                disabled={type=='display'}
+                //  onBlur={formik.handleBlur}
                  />
             </Grid>
             <Grid item xs={4} className='collapsable-form-style '>
@@ -240,8 +260,8 @@ export default function FamilyFormSection({handleFormSection2Data,patientDataDip
                         spouseBusinessPhone: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.spouseBusinessPhone:patient.spouseBusinessPhone}
+                  value={patient.spouseBusinessPhone}
-                disabled={type=='display'}
+                //   onBlur={formik.handleBlur}
                   />
             </Grid>
             
@@ -262,8 +282,8 @@ export default function FamilyFormSection({handleFormSection2Data,patientDataDip
                         emergencyContact: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.emergencyContact:patient.emergencyContact}
+                   value={patient.emergencyContact}
-                disabled={type=='display'}
+                //    onBlur={formik.handleBlur}
                    />
             </Grid>
             <Grid item xs={4} className='collapsable-form-style '>
@@ -278,8 +298,8 @@ export default function FamilyFormSection({handleFormSection2Data,patientDataDip
                             relationship: e.target.value,
                           }));
                     }}
-                    value={type=='display'?patientDataDiplay.relationship:patient.relationship}
+                    value={patient.relationship}
-                    disabled={type=='display'}
+                    // onBlur={formik.handleBlur}
                     />
             </Grid>
             <Grid item xs={4} className='collapsable-form-style '>
@@ -295,8 +315,8 @@ export default function FamilyFormSection({handleFormSection2Data,patientDataDip
                             spousePhone: e.target.value,
                           }));
                     }}
-                    value={type=='display'?patientDataDiplay.spousePhone:patient.spousePhone}
+                     value={patient.spousePhone}
-                    disabled={type=='display'}
+                    //  onBlur={formik.handleBlur}
                      />
             </Grid>
         </Grid>

src/Components/PatientForm/MedicalHistorySection3.tsx

@@ -18,6 +18,19 @@ interface Patient {
   cellPhoneProvider: string |undefined;
 }
 
+const validationSchema = Yup.object({
+  familyphysician: Yup.string().required('Required'),
+  city: Yup.string().required('Required'),
+  state: Yup.string().required('Required'),
+  phone: Yup.string().required('Required'),
+  chiropractorName: Yup.string().required('Required'),
+  xray: Yup.boolean().required('Required'),
+  haveChiropractor: Yup.boolean().required('Required'),
+  reference: Yup.boolean().required('Required'),
+  visitDetails: Yup.string().required('Required'),
+  cellPhoneProvider: Yup.string().required('Required'),
+});
+
 type Props = {
     handleFormSection3Data:(
         physicianname?: string |undefined,
@@ -32,11 +45,9 @@ type Props = {
         visitDetails?: string |undefined,
         cellPhoneProvider?: string |undefined,
     )=> void
-    patientDataDiplay:any;
-    type:string;
   }
 
-export default function MedicalHistoryForm({handleFormSection3Data,patientDataDiplay,type}:Props){
+export default function MedicalHistoryForm({handleFormSection3Data}:Props){
     
     const [patient, setPatient] = React.useState<Patient>({
         physicianname: '',
@@ -67,8 +78,6 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
             patient.cellPhoneProvider,
         )
       },[patient])
-
-      console.log("patientDataDiplay",patientDataDiplay)
     return(
         <>
         <Grid item xs={12} className='collapsable-form-style '> 
@@ -87,8 +96,8 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
                         physicianname: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.physicianname:patient.physicianname}
+                value={patient.physicianname}
-                disabled={type=='display'}
+                // onBlur={formik.handleBlur}
                 />
             </Grid>
             <Grid item xs={4} className='collapsable-form-style'>
@@ -102,8 +111,8 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
                         physiciancity: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.physiciancity:patient.physiciancity}
+                value={patient.physiciancity}
-                disabled={type=='display'}
+                // onBlur={formik.handleBlur}
                 />
             </Grid>
             <Grid item xs={4} className='collapsable-form-style'>
@@ -117,8 +126,8 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
                         physicianstate: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.physicianstate:patient.physicianstate}
+                 value={patient.physicianstate}
-                disabled={type=='display'}
+                //  onBlur={formik.handleBlur}
                  />
             </Grid>
             <Grid item xs={4} className='collapsable-form-style'>
@@ -133,8 +142,8 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
                         physicianphone: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.physicianphone:patient.physicianphone}
+                value={patient.physicianphone}
-                disabled={type=='display'}
+                // onBlur={formik.handleBlur}
                 />
             </Grid>
             
@@ -149,8 +158,9 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
                 <FormControl>
                 <FormLabel>Previous Chiropractic Care:</FormLabel>
                 <RadioGroup
+                    // value={patient.gender}
                     aria-labelledby="demo-radio-buttons-group-label"
-                    defaultValue={type=='display'?patientDataDiplay.haveChiropractor:patient.haveChiropractor}
+                    // defaultValue="yes"
                     name="radio-buttons-group"
                     onChange={(e)=>{
                         setPatient((prevValues) => ({
@@ -160,8 +170,8 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
                     }}
                     sx={{display:'flex', flexDirection:'row'}}
                 >
-                    <FormControlLabel disabled={type=='display'} value="yes" control={<Radio />} label="Yes" />
+                    <FormControlLabel value="yes" control={<Radio />} label="Yes" />
-                    <FormControlLabel disabled={type=='display'} value="no" control={<Radio />} label="No" />
+                    <FormControlLabel value="no" control={<Radio />} label="No" />
                 </RadioGroup>
                 </FormControl>
             </Grid>
@@ -177,8 +187,8 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
                         chiropractorName: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.chiropractorName:patient.chiropractorName}
+                 value={patient.chiropractorName}
-                disabled={type=='display'}
+                //  onBlur={formik.handleBlur}
                  />
             </Grid>
 
@@ -193,8 +203,8 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
                         chiropractorState: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.chiropractorState:patient.chiropractorState}
+                 value={patient.chiropractorState}
-                disabled={type=='display'}
+                //  onBlur={formik.handleBlur}
                  />
             </Grid>
         </Grid>
@@ -205,7 +215,7 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
                 <RadioGroup
                     // value={patient.gender}
                     aria-labelledby="demo-radio-buttons-group-label"
-                    defaultValue={type=='display'?patientDataDiplay.xray:patient.xray}
+                    // defaultValue="yes"
                     name="radio-buttons-group"
                     onChange={(e)=>{
                         setPatient((prevValues) => ({
@@ -215,8 +225,8 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
                     }}
                     sx={{display:'flex', flexDirection:'row'}}
                 >
-                    <FormControlLabel disabled={type=='display'} value="yes" control={<Radio />} label="Yes" />
+                    <FormControlLabel value="yes" control={<Radio />} label="Yes" />
-                    <FormControlLabel disabled={type=='display'} value="no" control={<Radio />} label="No" />
+                    <FormControlLabel value="no" control={<Radio />} label="No" />
                 </RadioGroup>
             </FormControl>
         </Grid>
@@ -227,7 +237,7 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
                 <RadioGroup
                     // value={patient.gender}
                     aria-labelledby="demo-radio-buttons-group-label"
-                    defaultValue={type=='display'?patientDataDiplay.reference:patient.reference}
+                    // defaultValue="physician"
                     name="radio-buttons-group"
                     onChange={(e)=>{
                         setPatient((prevValues) => ({
@@ -237,12 +247,12 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
                     }}
                     sx={{display:'flex', flexDirection:'row'}}
                 >
-                    <FormControlLabel disabled={type=='display'} value="friend" control={<Radio />} label="Friend" />
+                    <FormControlLabel value="friend" control={<Radio />} label="Friend" />
-                    <FormControlLabel disabled={type=='display'} value="relative" control={<Radio />} label="Relative" />
+                    <FormControlLabel value="relative" control={<Radio />} label="Relative" />
-                    <FormControlLabel disabled={type=='display'} value="physician" control={<Radio />} label="Physician" />
+                    <FormControlLabel value="physician" control={<Radio />} label="Physician" />
-                    <FormControlLabel disabled={type=='display'} value="instagram" control={<Radio />} label="Instagram" />
+                    <FormControlLabel value="instagram" control={<Radio />} label="Instagram" />
-                    <FormControlLabel disabled={type=='display'} value="google" control={<Radio />} label="Google" />
+                    <FormControlLabel value="google" control={<Radio />} label="Google" />
-                    <FormControlLabel disabled={type=='display'} value="others" control={<Radio />} label="Others" />
+                    <FormControlLabel value="others" control={<Radio />} label="Others" />
                 </RadioGroup>
             </FormControl>
         </Grid>
@@ -253,7 +263,7 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
                 <RadioGroup
                     // value={patient.gender}
                     aria-labelledby="demo-radio-buttons-group-label"
-                    defaultValue={type=='display'?patientDataDiplay.cellPhoneProvider:patient.cellPhoneProvider}
+                    // defaultValue="email"
                     name="radio-buttons-group"
                     onChange={(e)=>{
                         setPatient((prevValues) => ({
@@ -263,8 +273,8 @@ export default function MedicalHistoryForm({handleFormSection3Data,patientDataDi
                     }}
                     sx={{display:'flex', flexDirection:'row'}}
                 >
-                    <FormControlLabel disabled={type=='display'} value="email" control={<Radio />} label="Email" />
+                    <FormControlLabel value="email" control={<Radio />} label="Email" />
-                    <FormControlLabel disabled={type=='display'} value="text" control={<Radio />} label="Text" />
+                    <FormControlLabel value="text" control={<Radio />} label="Text" />
                 </RadioGroup>
             </FormControl>
         </Grid>

src/Components/PatientForm/OtherDetails8.tsx

@@ -24,11 +24,9 @@ interface Patient {
       pregnancy:string|undefined,
       menstralCycle: any,
     )=> void
-    patientDataDiplay:any;
-    type:string;
   }
 
-export default function OtherDetails8({handleFormSection8Data,patientDataDiplay,type}:Props){
+export default function OtherDetails8({handleFormSection8Data}:Props){
   
     const [patient, setPatient] = React.useState<Patient>({
         familyHistory: '',
@@ -73,8 +71,7 @@ export default function OtherDetails8({handleFormSection8Data,patientDataDiplay,
                 multiline
                 variant="outlined"
                 label="" 
-                value={type=='display'?patientDataDiplay.familyHistory:patient.familyHistory}
+                name='explanation'
-                disabled={type=='display'}
                 onChange={(event:any) => {
                   setPatient((prevValues) => ({
                     ...prevValues,
@@ -89,7 +86,6 @@ export default function OtherDetails8({handleFormSection8Data,patientDataDiplay,
                     <FormLabel>How do you sleep?</FormLabel>
                     <RadioGroup
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.sleep:patient.sleep}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -97,9 +93,9 @@ export default function OtherDetails8({handleFormSection8Data,patientDataDiplay,
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Back" control={<Radio />} label="Back" />
+                        <FormControlLabel value="Back" control={<Radio />} label="Back" />
-                        <FormControlLabel disabled={type=='display'} value="Side" control={<Radio />} label="Side" />
+                        <FormControlLabel value="Side" control={<Radio />} label="Side" />
-                        <FormControlLabel disabled={type=='display'} value="Stomach" control={<Radio />} label="Stomach" />
+                        <FormControlLabel value="Stomach" control={<Radio />} label="Stomach" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -109,7 +105,6 @@ export default function OtherDetails8({handleFormSection8Data,patientDataDiplay,
                     <FormLabel>Do you use a pillow?</FormLabel>
                     <RadioGroup
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.pillow:patient.pillow}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -117,8 +112,8 @@ export default function OtherDetails8({handleFormSection8Data,patientDataDiplay,
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -128,7 +123,6 @@ export default function OtherDetails8({handleFormSection8Data,patientDataDiplay,
                     <FormLabel>Do you wear orthotics or arch support?</FormLabel>
                     <RadioGroup
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.orthotics:patient.orthotics}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -136,8 +130,8 @@ export default function OtherDetails8({handleFormSection8Data,patientDataDiplay,
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -147,8 +141,7 @@ export default function OtherDetails8({handleFormSection8Data,patientDataDiplay,
                 <FormControl>
                     <LocalizationProvider dateAdapter={AdapterDayjs}>
                     <DatePicker
-                    value={type=='display'?patientDataDiplay.brestExam:patient.brestExam}
+                    value={patient.brestExam}
-                    disabled={type=='display'}
                     onChange={(event) => {
                       const formattedDate = formatDate(event)
                       setPatient((prevValues) => ({
@@ -171,7 +164,6 @@ export default function OtherDetails8({handleFormSection8Data,patientDataDiplay,
                     <FormLabel>Possible pregnancy?</FormLabel>
                     <RadioGroup
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.pregnancy:patient.pregnancy}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -179,8 +171,8 @@ export default function OtherDetails8({handleFormSection8Data,patientDataDiplay,
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -190,8 +182,7 @@ export default function OtherDetails8({handleFormSection8Data,patientDataDiplay,
                 <FormControl>
                     <LocalizationProvider dateAdapter={AdapterDayjs}>
                     <DatePicker
-                    value={type=='display'?patientDataDiplay.menstralCycle:patient.menstralCycle}
+                    value={patient.menstralCycle}
-                    disabled={type=='display'}
                     onChange={(event) => {
                       const formattedDate = formatDate(event)
                       setPatient((prevValues) => ({

src/Components/PatientForm/PainAnalysisSection4.tsx

@@ -31,12 +31,10 @@ interface Patient {
         treatmentGoal: string|undefined,
         selfTreatment:string|undefined,
     )=> void
-    patientDataDiplay:any;
-    type:string;
   }
   
 
-export default function PainAnalysisSection4({handleFormSection4Data,patientDataDiplay,type}:Props){
+export default function PainAnalysisSection4({handleFormSection4Data}:Props){
     const [patient, setPatient] = React.useState<Patient>({
         chiefComplaint:'',
         painWorse:[],
@@ -132,8 +130,7 @@ export default function PainAnalysisSection4({handleFormSection4Data,patientData
                         chiefComplaint: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.chiefComplaint:patient.chiefComplaint}
+                value={patient.chiefComplaint}
-                disabled={type=='display'}
                 />
             </Grid>
 
@@ -144,27 +141,22 @@ export default function PainAnalysisSection4({handleFormSection4Data,patientData
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainWorseChange} name="Bending" />}
                             label="Bending"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainWorseChange} name="Standing" />}
                             label="Standing"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainWorseChange} name="Sitting" />}
                             label="Sitting"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainWorseChange} name="Walking" />}
                             label="Walking"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainWorseChange} name="Others" />}
                             label="Others"
-                            disabled={type=='display'}
                         />
                     </FormGroup>
                    
@@ -178,27 +170,22 @@ export default function PainAnalysisSection4({handleFormSection4Data,patientData
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainBetterChange} name="laying down" />}
                             label="laying down"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainBetterChange} name="Standing" />}
                             label="Standing"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainBetterChange} name="Sitting" />}
                             label="Sitting"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainBetterChange} name="Walking" />}
                             label="Walking"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainBetterChange} name="Others" />}
                             label="Others"
-                            disabled={type=='display'}
                         />
                     </FormGroup>
                 </FormControl>
@@ -211,27 +198,22 @@ export default function PainAnalysisSection4({handleFormSection4Data,patientData
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainQualityChange} name="sharp" />}
                             label="Sharp"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainQualityChange} name="Dull/Ache" />}
                             label="Dull/Ache"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainQualityChange} name="Throbbing" />}
                             label="Throbbing"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainQualityChange} name="Tingling/Numbness/Burning" />}
                             label="Tingling/Numbness/Burning"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainQualityChange} name="Others" />}
                             label="Others"
-                            disabled={type=='display'}
                         />
                     </FormGroup>
                 </FormControl>
@@ -244,27 +226,22 @@ export default function PainAnalysisSection4({handleFormSection4Data,patientData
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainWorstTimeChange} name="Morning" />}
                             label="Morning"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainWorstTimeChange} name="During day" />}
                             label="During day"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainWorstTimeChange} name="Evening" />}
                             label="Evening"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainWorstTimeChange} name="Lying in bed" />}
                             label="Lying in bed"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handlePainWorstTimeChange} name="Others" />}
                             label="Others"
-                            disabled={type=='display'}
                         />
                     </FormGroup>
                 </FormControl>
@@ -281,13 +258,13 @@ export default function PainAnalysisSection4({handleFormSection4Data,patientData
                                 painDuration: e.target.value,
                               }));
                         }}
-                        value={type=='display'?patientDataDiplay.painDuration:patient.painDuration}
+                        value={patient.painDuration}
                         sx={{display:'flex', flexDirection:'row'}}
                         >
-                        <FormControlLabel disabled={type=='display'} value="0-25%" control={<Radio />} label="0-25%" />
+                        <FormControlLabel value="0-25%" control={<Radio />} label="0-25%" />
-                        <FormControlLabel disabled={type=='display'} value="25-50%" control={<Radio />} label="25-50%" />
+                        <FormControlLabel value="25-50%" control={<Radio />} label="25-50%" />
-                        <FormControlLabel disabled={type=='display'} value="50-75%" control={<Radio />} label="50-75%" />
+                        <FormControlLabel value="50-75%" control={<Radio />} label="50-75%" />
-                        <FormControlLabel disabled={type=='display'} value="75-100%" control={<Radio />} label="75-100%" />
+                        <FormControlLabel value="75-100%" control={<Radio />} label="75-100%" />
                     </RadioGroup>
                 </FormControl>
             </Grid>
@@ -299,22 +276,18 @@ export default function PainAnalysisSection4({handleFormSection4Data,patientData
                         <FormControlLabel
                             control={<Checkbox onChange={handleCurrentComplaintIssuesTimeChange} name="Muscle weakness" />}
                             label="Muscle weakness"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handleCurrentComplaintIssuesTimeChange} name="Bowel/Bladder problem" />}
                             label="Bowel/Bladder problem"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handleCurrentComplaintIssuesTimeChange} name="Digestion" />}
                             label="Digestion"
-                            disabled={type=='display'}
                         />
                         <FormControlLabel
                             control={<Checkbox onChange={handleCurrentComplaintIssuesTimeChange} name="Cardiac/Respiratory" />}
                             label="Cardiac/Respiratory"
-                            disabled={type=='display'}
                         />
                        
                     </FormGroup>
@@ -332,11 +305,11 @@ export default function PainAnalysisSection4({handleFormSection4Data,patientData
                                 selfTreatment: e.target.value,
                               }));
                         }}
-                        value={type=='display'?patientDataDiplay.selfTreatment:patient.selfTreatment}
+                        value={patient.selfTreatment}
                         sx={{display:'flex', flexDirection:'row'}}
                         >
-                        <FormControlLabel disabled={type=='display'} value="yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="no" control={<Radio />} label="No" />
+                        <FormControlLabel value="no" control={<Radio />} label="No" />
                     </RadioGroup>
                 </FormControl>
             </Grid>
@@ -356,8 +329,7 @@ export default function PainAnalysisSection4({handleFormSection4Data,patientData
                         treatmentGoal: e.target.value,
                       }));
                 }}
-                value={type=='display'?patientDataDiplay.treatmentGoal:patient.treatmentGoal}
+                value={patient.treatmentGoal}
-                disabled={type=='display'}
                 />
             </Grid>
           

src/Components/PatientForm/PastTreatment5.tsx

@@ -33,12 +33,10 @@ type Props = {
     injuriesHospitalization: string|undefined,
     supplementsOrDrugs: string|undefined,
   )=> void
-  patientDataDiplay:any;
-  type:string;
 }
 
 
-export default function PastTreatment5({handleFormSection5Data,patientDataDiplay,type}:Props){
+export default function PastTreatment5({handleFormSection5Data}:Props){
 
     const [patient, setPatient] = React.useState<Patient>({
         generalHealth: '',
@@ -82,7 +80,6 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                     <FormLabel>Overall your General Healgth is:</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.generalHealth:patient.generalHealth}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
@@ -91,11 +88,11 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                           }));
                         }}
                       >
-                        <FormControlLabel disabled={type=='display'} value="Excellent" control={<Radio />} label="Excellent" />
+                        <FormControlLabel value="Excellent" control={<Radio />} label="Excellent" />
-                        <FormControlLabel disabled={type=='display'} value="Very Good" control={<Radio />} label="Very Good" />
+                        <FormControlLabel value="Very Good" control={<Radio />} label="Very Good" />
-                        <FormControlLabel disabled={type=='display'} value="Good" control={<Radio />} label="Good" />
+                        <FormControlLabel value="Good" control={<Radio />} label="Good" />
-                        <FormControlLabel disabled={type=='display'} value="Fair" control={<Radio />} label="Fair" />
+                        <FormControlLabel value="Fair" control={<Radio />} label="Fair" />
-                        <FormControlLabel disabled={type=='display'} value="Poor" control={<Radio />} label="Poor" />
+                        <FormControlLabel value="Poor" control={<Radio />} label="Poor" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -105,7 +102,6 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                     <FormLabel>Have you experienced your present problem before?</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.presentProblemBefore:patient.presentProblemBefore}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
@@ -114,8 +110,8 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -126,7 +122,7 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                 variant="outlined"
                 label="If yes, when?" 
                 name='treatmentGoal'
-                disabled={patient.presentProblemBefore!=='Yes'||type=='display'}
+                disabled={patient.presentProblemBefore!=='Yes'}
                 onChange={(event) => {
                   setPatient((prevValues) => ({
                     ...prevValues,
@@ -140,8 +136,7 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                 variant="outlined"
                 label="Was treatment provided?If yes, by whom?" 
                 name='treatmentGoal'
-                disabled={patient.presentProblemBefore!=='Yes'||type=='display'}
+                disabled={patient.presentProblemBefore!=='Yes'}
-                value={type=='display'?patientDataDiplay.ifYestreatmentProvided:patient.ifYestreatmentProvided}
                 onChange={(event) => {
                   setPatient((prevValues) => ({
                     ...prevValues,
@@ -155,8 +150,7 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                 variant="outlined"
                 label="Outcome?" 
                 name='treatmentGoal'
-                disabled={patient.presentProblemBefore!=='Yes'||type=='display'}
+                disabled={patient.presentProblemBefore!=='Yes'}
-                value={type=='display'?patientDataDiplay.ifYesOutcome:patient.ifYesOutcome}
                 onChange={(event) => {
                   setPatient((prevValues) => ({
                     ...prevValues,
@@ -172,8 +166,6 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                     <FormLabel>Have you ever had a stroke or issues with blood clotting?</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.strokeBloodclotting:patient.strokeBloodclotting}
-                        value={type=='display'?patientDataDiplay.strokeBloodclotting:patient.strokeBloodclotting}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
@@ -182,8 +174,8 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -193,8 +185,7 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                 variant="outlined"
                 label="If yes, when?" 
                 name='treatmentGoal'
-                value={type=='display'?patientDataDiplay.ifYesstrokeBloodclotting:patient.ifYesstrokeBloodclotting}
+                disabled={patient.strokeBloodclotting!=='Yes'}
-                disabled={patient.strokeBloodclotting!=='Yes'||type=='display'}
                 onChange={(event) => {
                   setPatient((prevValues) => ({
                     ...prevValues,
@@ -210,7 +201,6 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                     <RadioGroup
                         name="painDuration"
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.dizzinessFetigue:patient.dizzinessFetigue}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -218,8 +208,8 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -230,7 +220,6 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                 label="If yes, when?" 
                 name='treatmentGoal'
                 disabled={patient.dizzinessFetigue!=='Yes'}
-                value={type=='display'?patientDataDiplay.ifyesdizzinessFetigue:patient.ifyesdizzinessFetigue}
                 onChange={(event) => {
                   setPatient((prevValues) => ({
                     ...prevValues,
@@ -246,7 +235,6 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                     <RadioGroup
                         name="painDuration"
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.antiColligent:patient.antiColligent}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -254,8 +242,8 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -265,7 +253,6 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                     <FormLabel>Have you ever had any major illness, injuries, hospitalization or surgeries?</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.injuriesHospitalization:patient.injuriesHospitalization}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
@@ -274,8 +261,8 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -291,8 +278,6 @@ export default function PastTreatment5({handleFormSection5Data,patientDataDiplay
                 variant="outlined"
                 label="" 
                 name='treatmentGoal'
-                defaultValue={type=='display'?patientDataDiplay.supplementsOrDrugs:patient.supplementsOrDrugs}
-                disabled={type=='display'}
                 onChange={(event) => {
                   setPatient((prevValues) => ({
                     ...prevValues,

src/Components/PatientForm/PatientForm.tsx

@@ -20,8 +20,6 @@ import SystemReviewSection6 from './SyestemReviewSection6';
 import RecreationalHobbiesSection7 from './RecreationalHobbiesSection7';
 import OtherDetails8 from './OtherDetails8';
 import PatientImageMarker from '../ImageMarker/PatientImageMarker';
-import ViewPatientImageMarker from '../ImageMarker/ViewPatientImageMarker';
-import AlertDialog from '../Helper/AlertDialogBox';
 
   const Accordion = styled((props: AccordionProps) => (
     <MuiAccordion disableGutters elevation={0} square {...props} />
@@ -59,12 +57,9 @@ import AlertDialog from '../Helper/AlertDialogBox';
     borderTop: '1px solid rgba(0, 0, 0, .125)',
   }));
 
-type Props={
-  type:any;
-}
 
-export default function PatientForm({type}:Props){
+
-    const [alertProps, setAlertProps] = React.useState<any>({});
+export default function PatientForm(){
     const [expanded, setExpanded] = React.useState<string | false>('panel1');
     const [isChecked, setIsChecked] = React.useState(false);
     const [signature,setSignature]=React.useState('');
@@ -76,6 +71,7 @@ export default function PatientForm({type}:Props){
     const [section6Data, setSection6Data] = React.useState<any>({});
     const [section7Data, setSection7Data] = React.useState<any>({});
     const [section8Data, setSection8Data] = React.useState<any>({});
+    const [restructuredCurrentPatientData, setRestructuredCurrentPatientData] = React.useState<any>({});
     const [allPatientData, setAllPatientData] = React.useState<any>([]);
 
     const handleFormSection1Data = (
@@ -327,14 +323,14 @@ export default function PatientForm({type}:Props){
     
     const handleSubmit = () => {
       const newPatientData = {
-        personalInformation: section1Data,
+        section1: section1Data,
-        familyInformation: section2Data,
+        section2: section2Data,
-        medicalHistory: section3Data,
+        section3: section3Data,
-        injuryDetails: section4Data,
+        section4: section4Data,
-        pastTreatment: section5Data,
+        section5: section5Data,
-        systemReviewQuestions: section6Data,
+        section6: section6Data,
-        recreationalActivities: section7Data,
+        section7: section7Data,
-        otherDetails: section8Data,
+        section8: section8Data,
       };
     
       // Create a copy of the existing data array and push the new patient data
@@ -342,64 +338,24 @@ export default function PatientForm({type}:Props){
     
       // Update the state with the new array
       setAllPatientData(updatedAllPatientData);
-
+    
-      localStorage.setItem('patientData', JSON.stringify(newPatientData));
+      console.log("UpdatedallPatientData:", updatedAllPatientData);
-
+    };
-      if (
-        section1Data.fullName !== "" && section1Data.cellPhone &&
-        /^\d{10}$/.test(section1Data.cellPhone) && section1Data.email &&
-        /^\S+@\S+\.\S+$/.test(section1Data.email) && section1Data.age &&
-        section1Data.age !== "" && Number(section1Data.age) >= 0 && section1Data.mailingAddress &&
-        section1Data.mailingAddress !== "" ){
-          TextFile();     
-        }else{
-          setAlertProps({
-            open: true,
-            severity: 'error',
-            message: 'Please fill all the mandatory fields with valid data!',
-            duration: 4000,
-          });
-        }
-  };
-  
-  const TextFile = () => {
-    const element = document.createElement("a");
-    //@ts-ignore
-    const textFile = new Blob([localStorage.getItem('patientData')], {type: 'text/json'});
-    element.href = URL.createObjectURL(textFile);
-    element.download = "patientData.json";
-    document.body.appendChild(element); 
-    element.click();
-  }
     
 
-  const handleExpandChange =
+      const handleExpandChange =
-    (panel: string) => (event: React.SyntheticEvent, newExpanded: boolean) => {
+        (panel: string) => (event: React.SyntheticEvent, newExpanded: boolean) => {
-      setExpanded(newExpanded ? panel : false);
+        setExpanded(newExpanded ? panel : false);
-    };
+        };
  
-  const handleCheckboxChange = (event:any) => {
+      const handleCheckboxChange = (event:any) => {
-    setIsChecked(event.target.checked);
+        setIsChecked(event.target.checked);
-  };
+      };
 
-  const handleAlertClose = () => {
+    
-    setAlertProps({});
-  };
 
-  //@ts-ignore
-  const patientData = localStorage.getItem('patientData') ? JSON.parse(localStorage.getItem('patientData')) : [];
-  
     return(
         <>
-          {alertProps && alertProps.open && (
-          <AlertDialog
-            open={alertProps.open}
-            message={alertProps.message}
-            severity={alertProps.severity}
-            duration={alertProps.duration}
-            handleAlertClose={handleAlertClose}
-          />
-          )}
             <Paper elevation={0} className='app-screen-constants'>
                 <Header/>
                     <Paper  elevation={0} sx={{margin:4, minHeight:550}} >
@@ -419,12 +375,7 @@ export default function PatientForm({type}:Props){
                             </AccordionSummary>
                            
                             <AccordionDetails>
-                                <PersonalSection 
+                                <PersonalSection handleFormSection1Data={handleFormSection1Data}/>
-                                  handleFormSection1Data={handleFormSection1Data}
-                                  patientDataDiplay={patientData.personalInformation}
-                                  type={type}
-                                  
-                                  />
                             </AccordionDetails>
                            
                         </Accordion>
@@ -435,11 +386,7 @@ export default function PatientForm({type}:Props){
                             </AccordionSummary>
 
                             <AccordionDetails>
-                                <FamilyFormSection 
+                                <FamilyFormSection handleFormSection2Data={handleFormSection2Data}/>
-                                handleFormSection2Data={handleFormSection2Data}
-                                patientDataDiplay={patientData.familyInformation}
-                                type={type}
-                                  />
                             </AccordionDetails>
                         </Accordion>
 
@@ -449,11 +396,7 @@ export default function PatientForm({type}:Props){
                             </AccordionSummary>
                             
                             <AccordionDetails>
-                                <MedicalHistory 
+                                <MedicalHistory handleFormSection3Data={handleFormSection3Data}/>
-                                handleFormSection3Data={handleFormSection3Data}
-                                patientDataDiplay={patientData.medicalHistory}
-                                type={type}
-                                />
                             </AccordionDetails>
                         </Accordion>
                 
@@ -462,14 +405,8 @@ export default function PatientForm({type}:Props){
                                 <Typography sx={{fontSize:18}}>Patient's Injury Image</Typography>
                             </AccordionSummary>
                             
-                <AccordionDetails>
+                            <AccordionDetails>
-                  {
+                                <PatientImageMarker />
-                    type === 'fill' ?
-                      <PatientImageMarker />
-                      :
-                      <ViewPatientImageMarker />
-                  }
-                                
                             </AccordionDetails>
                         </Accordion>
 
@@ -480,11 +417,7 @@ export default function PatientForm({type}:Props){
                             </AccordionSummary>
                             
                             <AccordionDetails>
-                                <PainAnalysisSection4
+                                <PainAnalysisSection4 handleFormSection4Data={handleFormSection4Data}/>
-                                 handleFormSection4Data={handleFormSection4Data}
-                                 patientDataDiplay={patientData.injuryDetails}
-                                  type={type}
-                                  />
                             </AccordionDetails>
                         </Accordion>
 
@@ -494,10 +427,7 @@ export default function PatientForm({type}:Props){
                             </AccordionSummary>
                             
                             <AccordionDetails>
-                                <PastTreatment5 
+                                <PastTreatment5 handleFormSection5Data={handleFormSection5Data}/>
-                                handleFormSection5Data={handleFormSection5Data}
-                                patientDataDiplay={patientData.pastTreatment}
-                                type={type}/>
                             </AccordionDetails>
                         </Accordion>
 
@@ -507,11 +437,7 @@ export default function PatientForm({type}:Props){
                             </AccordionSummary>
                             
                             <AccordionDetails>
-                                <SystemReviewSection6 
+                                <SystemReviewSection6 handleFormSection6Data={handleFormSection6Data}/>
-                                handleFormSection6Data={handleFormSection6Data}
-                                patientDataDiplay={patientData.systemReviewQuestions}
-                                type={type}
-                                />
                             </AccordionDetails>
                         </Accordion>
 
@@ -521,10 +447,7 @@ export default function PatientForm({type}:Props){
                             </AccordionSummary>
                             
                             <AccordionDetails>
-                                <RecreationalHobbiesSection7 
+                                <RecreationalHobbiesSection7 handleFormSection7Data={handleFormSection7Data}/>
-                                handleFormSection7Data={handleFormSection7Data}
-                                patientDataDiplay={patientData.recreationalActivities}
-                                type={type}/>
                             </AccordionDetails>
                         </Accordion>
 
@@ -534,14 +457,12 @@ export default function PatientForm({type}:Props){
                             </AccordionSummary>
                             
                             <AccordionDetails>
-                                <OtherDetails8 
+                                <OtherDetails8 handleFormSection8Data={handleFormSection8Data}/>
-                                handleFormSection8Data={handleFormSection8Data}
-                                patientDataDiplay={patientData.otherDetails}
-                                type={type}/>
                             </AccordionDetails>
                         </Accordion>
 
-                      <Grid container>
+                        <Grid container>
+
                         <Grid item xs={12} className='collapsable-form-style-multiline'>
                           <FormGroup sx={{ marginTop: 3 }}>
                             <FormControlLabel
@@ -554,7 +475,7 @@ export default function PatientForm({type}:Props){
 
                         <Grid item xs={6} className='collapsable-form-style'>
                               <TextField 
-                              disabled={type=='display'}
+                              
                               variant="outlined"
                               label="SIGNATURE" 
                               name='treatmentGoal'
@@ -571,7 +492,7 @@ export default function PatientForm({type}:Props){
                             variant="contained"
                             color="primary"
                             sx={{ margin: 5, left: '40%', width: '200px' }}
-                            disabled={isChecked==false || signature=='' || type=='display'}
+                            disabled={isChecked==false || signature==''}
                             onClick={handleSubmit}
                           >
                             Submit

src/Components/PatientForm/PersonalSection1.tsx

@@ -1,5 +1,7 @@
 import * as React from 'react';
 import { Button, FormControl, FormControlLabel, FormLabel, Grid, Paper, Radio, RadioGroup, TextField } from '@mui/material';
+import { useFormik } from "formik";
+import * as yup from "yup";
 import { LocalizationProvider, DatePicker } from '@mui/x-date-pickers';
 import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
 import { useEffect } from 'react';
@@ -19,6 +21,20 @@ interface Patient {
     gender: string;
   }
 
+  const validationSchema = yup.object({
+    fullName: yup.string().required("Full name is required"),
+    homePhone: yup.string().matches(/^\d{10}$/, "Home phone must be 10 digits"),
+    cellPhone: yup.string().required("Phone number is required").matches(/^\d{10}$/, "Cell phone must be 10 digits"),
+    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(),
+    mailingAddress: yup.string().required("Mailing address is required"),
+    city: yup.string().required("City is required"),
+    state: yup.string().required("State is required"),
+    zipCode: yup.string().matches(/^\d{6}$/, "Zip code must be 6 digits").required("Zip code is required")
+  });
+
   type Props = {
     handleFormSection1Data:(
         fullName?: string|undefined,
@@ -34,21 +50,19 @@ interface Patient {
         zipCode?: string|undefined,
         gender?: string|undefined,
     )=> void
-    patientDataDiplay:any;
-    type:string;
   }
   
 
-export default function PersonalSection({handleFormSection1Data,patientDataDiplay,type}:Props){
+export default function PersonalSection({handleFormSection1Data}:Props){
 
-    const [birthDateValue, setBirthDateValue] = React.useState<any>();
+    const [startDateValue, setStartDateValue] = React.useState<any>();
     const [patient, setPatient] = React.useState<Patient>({
         fullName: "",
         homePhone: "",
         cellPhone: "",
         email: "",
-        age: "",
+        age: 0,
-        dateOfBirth: birthDateValue,
+        dateOfBirth: startDateValue,
         socialSecurityNumber: "",
         mailingAddress:"",
         city: "",
@@ -65,7 +79,7 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
             patient.cellPhone,
             patient.email,
             patient.age,
-            birthDateValue,
+            startDateValue,
             patient.socialSecurityNumber,
             patient.mailingAddress,
             patient.city,
@@ -73,30 +87,50 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
             patient.zipCode,
             patient.gender,
         )
-      },[patient])    
+      },[patient])
 
-     
+    //   const formik = useFormik<Patient>({
+    //       initialValues: {
+    //       fullName: "",
+    //       homePhone: "",
+    //       cellPhone: "",
+    //       email: "",
+    //       age: "",
+    //       dateOfBirth: "",
+    //       socialSecurityNumber: "",
+    //       mailingAddress: "",
+    //       city: "",
+    //       state: "",
+    //       zipCode: "",
+    //       gender: "male",
+    //     },
+    //     validationSchema,
+    //     onSubmit: (values) => {
+    //       // Do something with the patient data
+    //       console.log(values,"sdfdsfsd34");
+    //     },
+    //   });      
     
     return(
         <>
         <Grid container direction="row" className='section1-test-class'>
-                <Grid item xs={4} className='collapsable-form-style '>
+            <Grid item xs={4} className='collapsable-form-style '>
-                <TextField
+             <TextField
                     variant="outlined"
                     label="Patient's Full Name"
                     name="fullName"
                     placeholder='Please enter your name'
-                    value={type=='display'?patientDataDiplay.fullName:patient.fullName}
+                    value={patient.fullName}
-                    disabled={type=='display'}
                     onChange={(e)=>{
                         setPatient((prevValues) => ({
                             ...prevValues,
                             fullName: e.target.value,
                           }));
                     }}
+                    // onBlur={formik.handleBlur}
+                    // error={formik.touched.fullName && Boolean(formik.errors.fullName)}
+                    // helperText={formik.touched.fullName && formik.errors.fullName}
                     required
-                    error={patient.fullName === ""}
-                    helperText={patient.fullName === "" ? "Please enter your name" : ""}
                 />
                 </Grid>
                
@@ -106,18 +140,17 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
                     variant="outlined"
                     label="Phone Number"
                     name="cellPhone"
-                    type="number"
                     placeholder='Please enter your cell Phone number'
-                    value={type=='display'?patientDataDiplay.cellPhone:patient.cellPhone}
+                    value={patient.cellPhone}
-                    disabled={type=='display'}
                     onChange={(e)=>{
                         setPatient((prevValues) => ({
                             ...prevValues,
                             cellPhone: e.target.value,
                           }));
                     }}
-                    error={!(/^\d{10}$/.test(patient.cellPhone))}
+                    // onBlur={formik.handleBlur}
-                    helperText={!(/^\d{10}$/.test(patient.cellPhone)) ? "Please enter a valid 10-digit phone number" : ""}
+                    // error={formik.touched.cellPhone && Boolean(formik.errors.cellPhone)}
+                    // helperText={formik.touched.cellPhone && formik.errors.cellPhone}
                 />
                 </Grid>
 
@@ -126,38 +159,36 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
                     variant="outlined"
                     label="Home Phone Number"
                     name="homePhone"
-                    type='number'
                     placeholder='Please enter your home phone'
-                    value={type=='display'?patientDataDiplay.homePhone:patient.homePhone}
+                    value={patient.homePhone}
-                    disabled={type=='display'}
                     onChange={(e)=>{
                         setPatient((prevValues) => ({
                             ...prevValues,
                             homePhone: e.target.value,
                           }));
                     }}
-                    // error={!(/^\d{10}$/.test(patient.homePhone))}
+                    // onBlur={formik.handleBlur}
-                    // helperText={!(/^\d{10}$/.test(patient.homePhone)) ? "Please enter a valid 10-digit phone number" : ""}
+                    // error={formik.touched.homePhone && Boolean(formik.errors.homePhone)}
+                    // helperText={formik.touched.homePhone && formik.errors.homePhone}
                 />
                 </Grid>
 
                 <Grid item xs={4} className='collapsable-form-style'>
                 <TextField
-                    required
                     variant="outlined"
                     label="Email"
                     name="email"
                     placeholder='Please enter your email'
-                    value={type=='display'?patientDataDiplay.email:patient.email}
+                    value={patient.email}
-                    disabled={type=='display'}
                     onChange={(e)=>{
                         setPatient((prevValues) => ({
                             ...prevValues,
                             email: e.target.value,
                           }));
                     }}
-                    error={!(/^\S+@\S+\.\S+$/.test(patient.email))}
+                    // onBlur={formik.handleBlur}
-                    helperText={!(/^\S+@\S+\.\S+$/.test(patient.email)) ? "Please enter a valid email address" : ""}
+                    // error={formik.touched.email && Boolean(formik.errors.email)}
+                    // helperText={formik.touched.email && formik.errors.email}
                 />
                 </Grid>
                 <Grid item xs={4} className='collapsable-form-style'>
@@ -168,29 +199,27 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
                     name="age"
                     type="number"
                     placeholder='Please enter your age'
-                    value={type=='display'?patientDataDiplay.age:patient.age}
+                    value={patient.age}
-                    disabled={type=='display'}
                     onChange={(e)=>{
                         setPatient((prevValues) => ({
                             ...prevValues,
                             age: e.target.value,
                           }));
                     }}
-                    error={patient.age === ""}
+                    // onBlur={formik.handleBlur}
-                    helperText={patient.age === "" ? "Please enter your age" : ""}
+                    // error={formik.touched.age && Boolean(formik.errors.age)}
-                    
+                    // helperText={formik.touched.age && formik.errors.age}
                 />
                 </Grid>
-
                 <Grid item xs={4} className='collapsable-form-style'>
                 <FormControl >
+        
                 <LocalizationProvider dateAdapter={AdapterDayjs}>
                     <DatePicker
                     label="Date of Birth"
-                    value={type=='display'?patientDataDiplay.dateOfBirth:birthDateValue}
+                    value={startDateValue}
-                    disabled={type=='display'}
                     onChange={(newValue) => {
-                        setBirthDateValue(newValue);
+                        setStartDateValue(newValue);
                     }}
                     renderInput={(params) => <TextField required  variant="outlined" {...params} />}
                     />
@@ -198,14 +227,12 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
                 </FormControl>
             
                 </Grid>
-
                 <Grid item xs={4} className='collapsable-form-style'>
                 <TextField
                     variant="outlined"
                     label="Social Security Number"
                     name="socialSecurityNumber"
-                    value={type=='display'?patientDataDiplay.socialSecurityNumber:patient.socialSecurityNumber}
+                    value={patient.socialSecurityNumber}
-                    disabled={type=='display'}
                     onChange={(e)=>{
                         setPatient((prevValues) => ({
                             ...prevValues,
@@ -224,16 +251,16 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
                         variant="outlined"
                         label="Mailing Address"
                         name="mailingAddress"
-                        value={type=='display'?patientDataDiplay.mailingAddress:patient.mailingAddress}
+                        value={patient.mailingAddress}
-                        disabled={type=='display'}
                         onChange={(e)=>{
                             setPatient((prevValues) => ({
                                 ...prevValues,
                                 mailingAddress: e.target.value,
                               }));
                         }}
-                        error={patient.mailingAddress === ""}
+                        // onBlur={formik.handleBlur}
-                        helperText={patient.mailingAddress === "" ? "Please enter your mailing address" : ""}
+                        // error={formik.touched.mailingAddress && Boolean(formik.errors.mailingAddress)}
+                        // helperText={formik.touched.mailingAddress && formik.errors.mailingAddress}
                     />
                 </Grid>                
             
@@ -242,30 +269,35 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
                     variant="outlined"
                     label="State"
                     name="state"
-                    value={type=='display'?patientDataDiplay.state:patient.state}
+                    value={patient.state}
-                    disabled={type=='display'}
                     onChange={(e)=>{
                         setPatient((prevValues) => ({
                             ...prevValues,
                             state: e.target.value,
                           }));
                     }}
+                    // onBlur={formik.handleBlur}
+                    // error={formik.touched.state && Boolean(formik.errors.state)}
+                    // helperText={formik.touched.state && formik.errors.state}
                 />
                 </Grid>
 
                 <Grid item xs={4} className='collapsable-form-style'>
                     <TextField
+                        required
                         variant="outlined"
                         label="City"
                         name="city"
-                        value={type=='display'?patientDataDiplay.city:patient.city}
+                        value={patient.city}
-                        disabled={type=='display'}
                         onChange={(e)=>{
                             setPatient((prevValues) => ({
                                 ...prevValues,
                                 city: e.target.value,
                               }));
                         }}
+                        // onBlur={formik.handleBlur}
+                        // error={formik.touched.city && Boolean(formik.errors.city)}
+                        // helperText={formik.touched.city && formik.errors.city}
                     />
                 </Grid>
                 
@@ -274,8 +306,7 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
                     variant="outlined"
                     label="Zip Code"
                     name="zipCode"
-                    value={type=='display'?patientDataDiplay.zipCode:patient.zipCode}
+                    value={patient.zipCode}
-                    disabled={type=='display'}
                     onChange={(e)=>{
                         setPatient((prevValues) => ({
                             ...prevValues,
@@ -293,7 +324,7 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
                 <FormLabel>Gender</FormLabel>
                 <RadioGroup
                     aria-labelledby="demo-radio-buttons-group-label"
-                    defaultValue={type=='display'?patientDataDiplay.gender:patient.gender}
+                    defaultValue={patient.gender}
                     name="radio-buttons-group"
                     onChange={(e)=>{
                         setPatient((prevValues) => ({
@@ -303,12 +334,8 @@ export default function PersonalSection({handleFormSection1Data,patientDataDipla
                     }}
                     sx={{display:'flex', flexDirection:'row'}}
                 >
-                    <FormControlLabel
+                    <FormControlLabel value="male" control={<Radio />} label="Male" />
-                        disabled={type=='display'}
+                    <FormControlLabel value="female" control={<Radio />} label="Female" />
-                         value="male" control={<Radio />} label="Male" />
-                    <FormControlLabel 
-                        disabled={type=='display'}
-                        value="female" control={<Radio />} label="Female" />
                 </RadioGroup>
                 </FormControl>
                 </Grid>

src/Components/PatientForm/RecreationalHobbiesSection7.tsx

@@ -43,11 +43,9 @@ interface Patient {
       drugs: string|undefined,
       drugsExplanation:string|undefined,
     )=> void
-    patientDataDiplay:any;
-    type:string;
   }
 
-export default function RecreationalHobbiesSection7({handleFormSection7Data,patientDataDiplay,type}:Props){
+export default function RecreationalHobbiesSection7({handleFormSection7Data}:Props){
     const [patient, setPatient] = React.useState<Patient>({
           hobbies: '',
           educationLevel: '',
@@ -103,8 +101,7 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                 multiline
                 variant="outlined"
                 label="" 
-                value={type=='display'?patientDataDiplay.hobbies:patient.hobbies}
+                name='explanation'
-                disabled={type=='display'}
                 onChange={(event:any) => {
                   setPatient((prevValues) => ({
                     ...prevValues,
@@ -119,7 +116,6 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                     <FormLabel>Your education level:</FormLabel>
                     <RadioGroup
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.educationLevel:patient.educationLevel}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -127,11 +123,11 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="High School" control={<Radio />} label="High School" />
+                        <FormControlLabel value="High School" control={<Radio />} label="High School" />
-                        <FormControlLabel disabled={type=='display'} value="Some college" control={<Radio />} label="Some college" />
+                        <FormControlLabel value="Some college" control={<Radio />} label="Some college" />
-                        <FormControlLabel disabled={type=='display'} value="College Graduate" control={<Radio />} label="College Graduate" />
+                        <FormControlLabel value="College Graduate" control={<Radio />} label="College Graduate" />
-                        <FormControlLabel disabled={type=='display'} value="Post college" control={<Radio />} label="Post college" />
+                        <FormControlLabel value="Post college" control={<Radio />} label="Post college" />
-                        <FormControlLabel disabled={type=='display'} value="Other" control={<Radio />} label="Other" />
+                        <FormControlLabel value="Other" control={<Radio />} label="Other" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -142,7 +138,6 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                     <RadioGroup
                         name="painDuration"
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.excercise:patient.excercise}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -150,19 +145,18 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
 
           <Grid item xs={6} className='collapsable-form-style-form7'>
                 <TextField 
-                disabled={patient.excercise!=='Yes'||type=='display'}
+                disabled={patient.excercise!=='Yes'}
                 variant="outlined"
                 label="Times per week?" 
                 name='treatmentGoal'
-                value={type=='display'?patientDataDiplay.excerciseExplanation:patient.excerciseExplanation}
                 onChange={(event) => {
                   setPatient((prevValues) => ({
                     ...prevValues,
@@ -178,7 +172,6 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                     <RadioGroup
                         name="painDuration"
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.tobacco:patient.tobacco}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -186,23 +179,22 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
 
           <Grid item xs={6} className='collapsable-form-style-form7'>
                 <TextField 
-                disabled={patient.tobacco!=='Yes'||type=='display'}
+                disabled={patient.tobacco!=='Yes'}
-                value={type=='display'?patientDataDiplay.tobaccoExplanation:patient.tobaccoExplanation}
                 variant="outlined"
                 label="Packs/Cans per day(If you have quit, when did you quit?)" 
                 name='treatmentGoal'
                 onChange={(event) => {
                   setPatient((prevValues) => ({
                     ...prevValues,
-                    tobaccoExplanation: event.target.value,
+                    excerciseExplanation: event.target.value,
                   }));
                 }}
                 />
@@ -214,7 +206,6 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                     <RadioGroup
                         name="painDuration"
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.alcohol:patient.alcohol}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -222,16 +213,15 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
 
           <Grid item xs={6} className='collapsable-form-style-form7'>
                 <TextField 
-                disabled={patient.alcohol!=='Yes'||type=='display'}
+                disabled={patient.alcohol!=='Yes'}
-                value={type=='display'?patientDataDiplay.alcoholExplanation:patient.alcoholExplanation}
                 variant="outlined"
                 label="How many drinks per week?" 
                 name='treatmentGoal'
@@ -250,7 +240,6 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                     <RadioGroup
                         name="painDuration"
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.healthyDiet:patient.healthyDiet}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -258,16 +247,15 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
 
           <Grid item xs={6} className='collapsable-form-style-form7'>
                 <TextField 
-                disabled={patient.healthyDiet!=='No'||type=='display'}
+                disabled={patient.healthyDiet!=='No'}
-                value={type=='display'?patientDataDiplay.healthyDietExplanation:patient.healthyDietExplanation}
                 variant="outlined"
                 label="If no, explain" 
                 name='treatmentGoal'
@@ -286,7 +274,6 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                     <RadioGroup
                         name="painDuration"
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.sleep:patient.sleep}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -294,16 +281,15 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
 
           <Grid item xs={6} className='collapsable-form-style-form7'>
                 <TextField 
-                disabled={patient.sleep!=='No'||type=='display'}
+                disabled={patient.sleep!=='No'}
-                value={type=='display'?patientDataDiplay.sleepExplanation:patient.sleepExplanation}
                 variant="outlined"
                 label="If no, explain" 
                 name='treatmentGoal'
@@ -322,7 +308,6 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                     <RadioGroup
                         name="painDuration"
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.workSchool:patient.workSchool}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -330,16 +315,15 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
 
           <Grid item xs={6} className='collapsable-form-style-form7'>
                 <TextField 
-                disabled={patient.workSchool!=='Yes'||type=='display'}
+                disabled={patient.workSchool!=='Yes'}
-                value={type=='display'?patientDataDiplay.workSchool:patient.workSchool}
                 variant="outlined"
                 label="If yes, explain" 
                 name='treatmentGoal'
@@ -358,7 +342,6 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                     <RadioGroup
                         name="painDuration"
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.familyLife:patient.familyLife}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -366,16 +349,15 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
 
           <Grid item xs={6} className='collapsable-form-style-form7'>
                 <TextField 
-                disabled={patient.familyLife!=='Yes'||type=='display'}
+                disabled={patient.familyLife!=='Yes'}
-                value={type=='display'?patientDataDiplay.familyLifeExplanation:patient.familyLifeExplanation}
                 variant="outlined"
                 label="If yes, explain" 
                 name='treatmentGoal'
@@ -394,7 +376,6 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                     <RadioGroup
                         name="painDuration"
                         sx={{display:'flex', flexDirection:'row'}}
-                        defaultValue={type=='display'?patientDataDiplay.drugs:patient.drugs}
                         onChange={(event) => {
                           setPatient((prevValues) => ({
                             ...prevValues,
@@ -402,16 +383,15 @@ export default function RecreationalHobbiesSection7({handleFormSection7Data,pati
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
 
           <Grid item xs={6} className='collapsable-form-style-form7'>
                 <TextField 
-                disabled={patient.drugs!=='Yes'||type=='display'}
+                disabled={patient.drugs!=='Yes'}
-                value={type=='display'?patientDataDiplay.drugsExplanation:patient.drugsExplanation}
                 variant="outlined"
                 label="If yes, explain" 
                 name='treatmentGoal'

src/Components/PatientForm/SyestemReviewSection6.tsx

@@ -41,11 +41,9 @@ interface Patient {
       prostate: string|undefined,
       explanation:string|undefined,
     )=> void
-    patientDataDiplay:any;
-    type:string;
   }
 
-export default function SystemReviewSection6({handleFormSection6Data,patientDataDiplay,type}:Props){
+export default function SystemReviewSection6({handleFormSection6Data}:Props){
     const [patient, setPatients] = React.useState<Patient>({
         eyes: '',
         IntestinesBowls: '',
@@ -98,7 +96,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Eyes</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.eyes:patient.eyes}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -107,8 +104,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -117,7 +114,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Intestines/Bowls</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.IntestinesBowls:patient.IntestinesBowls}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -126,8 +122,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -136,7 +132,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Joints/Bones</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.jointsBones:patient.jointsBones}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -145,8 +140,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -155,7 +150,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Allergies</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.allergies:patient.allergies}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -164,8 +158,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -174,7 +168,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Ears, Nose, Mouth, Throat</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.earsNoseMouth:patient.earsNoseMouth}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -183,8 +176,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -193,7 +186,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Urinary</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.urinary:patient.urinary}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -202,8 +194,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -212,7 +204,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Skin</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.skin:patient.skin}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -221,8 +212,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -231,7 +222,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Psychological/Emotional</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.psychological:patient.psychological}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -240,8 +230,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -250,7 +240,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Heart</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.heart:patient.heart}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -259,8 +248,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -269,7 +258,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Muscles</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.muscles:patient.muscles}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -278,8 +266,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -288,7 +276,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Internal Organs</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.internalOrgans:patient.internalOrgans}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -297,8 +284,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -307,7 +294,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Gynecological menstrual/Brest</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.gynecological:patient.gynecological}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -316,8 +302,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -327,7 +313,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Lungs/Breathing</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.lungsBreathing:patient.lungsBreathing}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -336,8 +321,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -346,7 +331,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Nerves</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.nerves:patient.nerves}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -355,8 +339,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -365,7 +349,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Blood</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.blood:patient.blood}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -374,8 +357,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -384,7 +367,6 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                     <FormLabel>Prostate/Testicular/Penile</FormLabel>
                     <RadioGroup
                         name="painDuration"
-                        defaultValue={type=='display'?patientDataDiplay.prostate:patient.prostate}
                         sx={{display:'flex', flexDirection:'row'}}
                         onChange={(event) => {
                           setPatients((prevValues) => ({
@@ -393,8 +375,8 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                           }));
                         }}
                         >
-                        <FormControlLabel disabled={type=='display'} value="Yes" control={<Radio />} label="Yes" />
+                        <FormControlLabel value="Yes" control={<Radio />} label="Yes" />
-                        <FormControlLabel disabled={type=='display'} value="No" control={<Radio />} label="No" />
+                        <FormControlLabel value="No" control={<Radio />} label="No" />
                     </RadioGroup>
               </FormControl>
           </Grid>
@@ -405,8 +387,7 @@ export default function SystemReviewSection6({handleFormSection6Data,patientData
                 variant="outlined"
                 label="" 
                 name='explanation'
-                value={type=='display'?patientDataDiplay.explanation:patient.explanation}
+                value={patient.explanation}
-                disabled={type=='display'}
                 onChange={(event:any) => {
                   setPatients((prevValues) => ({
                     ...prevValues,