fix: only show errors when field not in focus, closes #3766

leather-io · Jul 19, 2023 · abffd71 · abffd71
1 parent 0e73a1e
commit abffd71
Showing 1 changed file with 5 additions and 1 deletion.
diff --git a/src/app/common/form-utils.ts b/src/app/common/form-utils.ts
@@ -9,6 +9,10 @@ export function useShowFieldError(name: string) {
   const form = useFormikContext();
   const [_, meta] = useField(name);
   const isDirty = useIsFieldDirty(name);
+  const isFieldInFocus = document.activeElement?.getAttribute('name') === name;
 
-  return (form.submitCount > 0 && meta.error) || (meta.touched && isDirty && meta.error);
+  return (
+    (form.submitCount > 0 && meta.error) ||
+    (!isFieldInFocus && meta.touched && isDirty && meta.error)
+  );
 }