|  |  | 
 |  |  |     MenuItem, | 
 |  |  |     FormHelperText, | 
 |  |  |     CircularProgress, | 
 |  |  |     LinearProgress, | 
 |  |  | } from '@mui/material'; | 
 |  |  | import { updateUserInfo } from '@/api/auth'; | 
 |  |  | import avatar from '/avatar.jpg' | 
 |  |  | 
 |  |  |     const notify = useNotify(); | 
 |  |  |     const { children, userInfo } = props; | 
 |  |  |  | 
 |  |  |     const { control, handleSubmit, watch, setValue, getValues, formState: { isDirty } } = useForm(); | 
 |  |  |     const { | 
 |  |  |         control, | 
 |  |  |         handleSubmit, | 
 |  |  |         watch, | 
 |  |  |         setValue, | 
 |  |  |         getValues, | 
 |  |  |         reset, | 
 |  |  |         formState: { | 
 |  |  |             errors, | 
 |  |  |             isDirty, | 
 |  |  |         }, | 
 |  |  |         setError, | 
 |  |  |         clearErrors, | 
 |  |  |     } = useForm(); | 
 |  |  |  | 
 |  |  |     const [loading, setLoading] = useState(false); | 
 |  |  |  | 
 |  |  |     useEffect(() => { | 
 |  |  | 
 |  |  |                     username: data.username | 
 |  |  |                 } | 
 |  |  |                 localStorage.setItem("user", JSON.stringify(userToPersist)); | 
 |  |  |             } else if (code === 10005 || code === 10006) { | 
 |  |  |                 setError('email', { | 
 |  |  |                     message: msg | 
 |  |  |                 }) | 
 |  |  |             } else { | 
 |  |  |                 notify(msg, { type: 'error', messageArgs: { _: msg } }); | 
 |  |  |             } | 
 |  |  | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     return ( | 
 |  |  |         <Box | 
 |  |  |             sx={{ | 
 |  |  |                 p: 3, | 
 |  |  |                 flex: 1, | 
 |  |  |                 overflow: 'auto', | 
 |  |  |             }} | 
 |  |  |         > | 
 |  |  |             {/* https://github.com/themeselection/materio-mui-nextjs-admin-template-free/blob/main/javascript-version/src/views/account-settings/account/AccountDetails.jsx */} | 
 |  |  |         <Box sx={{ | 
 |  |  |             position: 'relative', | 
 |  |  |             p: 3, | 
 |  |  |             flex: 1, | 
 |  |  |             overflow: 'auto', | 
 |  |  |         }}> | 
 |  |  |             {!userInfo && ( | 
 |  |  |                 <LinearProgress | 
 |  |  |                     sx={{ | 
 |  |  |                         height: "2px", | 
 |  |  |                         position: 'absolute', | 
 |  |  |                         top: 0, | 
 |  |  |                         left: 0, | 
 |  |  |                         right: 0, | 
 |  |  |                     }} | 
 |  |  |                 /> | 
 |  |  |             )} | 
 |  |  |             <form onSubmit={handleSubmit(onSubmit)} noValidate> | 
 |  |  |                 <Stack | 
 |  |  |                     direction='column' |