diff --git a/packages/ra-core/src/form/useFormGroup.ts b/packages/ra-core/src/form/useFormGroup.ts index 775f0f99fc2..5aaa915f33d 100644 --- a/packages/ra-core/src/form/useFormGroup.ts +++ b/packages/ra-core/src/form/useFormGroup.ts @@ -69,13 +69,14 @@ export const useFormGroup = (name: string): FormGroupState => { const { dirtyFields, touchedFields, validatingFields, errors } = useFormState(); - // dirtyFields, touchedFields and validatingFields are objects with keys being the field names + // dirtyFields, touchedFields, validatingFields and errors are objects with keys being the field names // Ex: { title: true } // However, they are not correctly serialized when using JSON.stringify // To avoid our effects to not be triggered when they should, we extract the keys and use that as a dependency const dirtyFieldsNames = Object.keys(dirtyFields); const touchedFieldsNames = Object.keys(touchedFields); const validatingFieldsNames = Object.keys(validatingFields); + const errorsNames = Object.keys(errors); const formGroups = useFormGroups(); const [state, setState] = useState({ @@ -121,7 +122,8 @@ export const useFormGroup = (name: string): FormGroupState => { [ // eslint-disable-next-line react-hooks/exhaustive-deps JSON.stringify(dirtyFieldsNames), - errors, + // eslint-disable-next-line react-hooks/exhaustive-deps + JSON.stringify(errorsNames), // eslint-disable-next-line react-hooks/exhaustive-deps JSON.stringify(touchedFieldsNames), // eslint-disable-next-line react-hooks/exhaustive-deps