From 6ca1b99947ef39e59ebc0dc843966517c255fbc3 Mon Sep 17 00:00:00 2001
From: Ali BARIN <ali.barin53@gmail.com>
Date: Wed, 3 Aug 2022 21:49:30 +0200
Subject: [PATCH] fix: hide form field error if not touched

---
 packages/web/src/pages/ProfileSettings/index.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

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