fix: hide form field error if not touched

This commit is contained in:
Ali BARIN
2022-08-03 21:49:30 +02:00
parent cdb018dcd2
commit 6ca1b99947

View File

@@ -92,14 +92,14 @@ function ProfileSettings() {
resolver={yupResolver(emailValidationSchema)} resolver={yupResolver(emailValidationSchema)}
mode="onChange" mode="onChange"
sx={{ mb: 2 }} sx={{ mb: 2 }}
render={({ formState: { errors, isDirty, isValid, isSubmitting } }) => ( render={({ formState: { errors, touchedFields, isDirty, isValid, isSubmitting } }) => (
<> <>
<TextField <TextField
fullWidth fullWidth
name="email" name="email"
label={formatMessage('profileSettings.email')} label={formatMessage('profileSettings.email')}
margin="normal" margin="normal"
error={!!errors?.email} error={touchedFields.email && !!errors?.email}
helperText={errors?.email?.message || ' '} helperText={errors?.email?.message || ' '}
/> />
@@ -119,7 +119,7 @@ function ProfileSettings() {
onSubmit={handlePasswordUpdate} onSubmit={handlePasswordUpdate}
resolver={yupResolver(passwordValidationSchema)} resolver={yupResolver(passwordValidationSchema)}
mode="onChange" mode="onChange"
render={({ formState: { errors, isDirty, isValid, isSubmitting } }) => ( render={({ formState: { errors, touchedFields, isDirty, isValid, isSubmitting } }) => (
<> <>
<TextField <TextField
fullWidth fullWidth
@@ -127,7 +127,7 @@ function ProfileSettings() {
label={formatMessage('profileSettings.newPassword')} label={formatMessage('profileSettings.newPassword')}
margin="normal" margin="normal"
type="password" type="password"
error={!!errors?.password} error={touchedFields.password && !!errors?.password}
helperText={errors?.password?.message || ' '} helperText={errors?.password?.message || ' '}
/> />
@@ -137,7 +137,7 @@ function ProfileSettings() {
label={formatMessage('profileSettings.confirmNewPassword')} label={formatMessage('profileSettings.confirmNewPassword')}
margin="normal" margin="normal"
type="password" type="password"
error={!!errors?.confirmPassword} error={touchedFields.confirmPassword && !!errors?.confirmPassword}
helperText={errors?.confirmPassword?.message || ' '} helperText={errors?.confirmPassword?.message || ' '}
/> />