Make sure wasFieldTouched and isErrorVisible use useCallback

storybookjs · Nov 20, 2020 · e662c34 · e662c34
1 parent 348dd80
commit e662c34
Showing 1 changed file with 9 additions and 2 deletions.
diff --git a/src/components/FormErrorState.tsx b/src/components/FormErrorState.tsx
@@ -118,8 +118,15 @@ export const FormErrorState: React.FunctionComponent<FormErrorStateProps> = ({
     return error;
   }, callbackRegenValues);
 
-  const wasFieldTouched = (id: string) => blurredFieldIds.has(id) || didAttemptSubmission;
-  const isErrorVisible = (id: string) => wasFieldTouched(id) && erroredFieldIds.has(id);
+  const wasFieldTouched = useCallback(
+    (id: string) => blurredFieldIds.has(id) || didAttemptSubmission,
+    callbackRegenValues
+  );
+
+  const isErrorVisible = useCallback(
+    (id: string) => wasFieldTouched(id) && erroredFieldIds.has(id),
+    callbackRegenValues
+  );
 
   const onFocus = useCallback((id: string) => setFocusedFieldId(id), []);