Merge pull request #31 from rzane/fix-use-mounted

The entire ref object needs to be returned from `useMounted`

src/useSubmit.ts

@@ -39,7 +39,7 @@ export function useSubmit<Value, Result>(
       const result = await form.validate({ touch: true });
       if (result.valid) await fn(result.value);
     } finally {
-      if (isMounted) form.setSubmitting(false);
+      if (isMounted.current) form.setSubmitting(false);
     }
   });
 }

src/useValidation.ts

@@ -38,12 +38,17 @@ export function useValidation<Value, Result>(
       const result = await fn(form.value);
       const errors = result.valid ? undefined : result.error;
 
-      if (isMounted) form.setError(errors);
-      if (isMounted && opts.touch) form.setTouched(getAllTouched(errors));
+      if (isMounted.current) {
+        form.setError(errors);
+
+        if (opts.touch) {
+          form.setTouched(getAllTouched(errors));
+        }
+      }
 
       return result;
     } finally {
-      if (isMounted) form.setValidating(false);
+      if (isMounted.current) form.setValidating(false);
     }
   });
 

src/utilities/useMounted.ts

@@ -1,13 +1,13 @@
-import { useRef, useEffect } from "react";
+import { useRef, useEffect, MutableRefObject } from "react";
 
-export function useMounted(): boolean {
-  const ref = useRef<boolean>(true);
+export function useMounted(): MutableRefObject<boolean> {
+  const isMounted = useRef<boolean>(true);
 
   useEffect(() => {
     return () => {
-      ref.current = false;
+      isMounted.current = false;
     };
   }, []);
 
-  return ref.current;
+  return isMounted;
 }

test/utilities/useMounted.test.ts

@@ -0,0 +1,9 @@
+import { renderHook } from "@testing-library/react-hooks";
+import { useMounted } from "../../src/utilities/useMounted";
+
+test("useMounted", () => {
+  const { result, unmount } = renderHook(() => useMounted());
+  expect(result.current.current).toBe(true);
+  unmount();
+  expect(result.current.current).toBe(false);
+});