From 86c6690a8166ad15a35ed5bc65574e284f4e1be8 Mon Sep 17 00:00:00 2001
From: Brian Kim <briankimpossible@gmail.com>
Date: Thu, 30 Sep 2021 13:57:31 -0400
Subject: [PATCH] Allow mutations to be reset

Implements #8859
---
 .../hooks/__tests__/useMutation.test.tsx      | 55 +++++++++++++++++++
 src/react/hooks/useMutation.ts                |  9 ++-
 src/react/types/types.ts                      |  1 +
 3 files changed, 63 insertions(+), 2 deletions(-)

diff --git a/src/react/hooks/__tests__/useMutation.test.tsx b/src/react/hooks/__tests__/useMutation.test.tsx
index 82c3e081367..dfb65630142 100644
--- a/src/react/hooks/__tests__/useMutation.test.tsx
+++ b/src/react/hooks/__tests__/useMutation.test.tsx
@@ -359,6 +359,61 @@ describe('useMutation Hook', () => {
 
       expect(fetchResult).toEqual({ data: CREATE_TODO_DATA });
     });
+
+    it('should be possible to reset the mutation', async () => {
+      const CREATE_TODO_DATA = {
+        createTodo: {
+          id: 1,
+          priority: 'Low',
+          description: 'Get milk!',
+          __typename: 'Todo',
+        },
+      };
+
+      const mocks = [
+        {
+          request: {
+            query: CREATE_TODO_MUTATION,
+            variables: {
+              priority: 'Low',
+              description: 'Get milk.',
+            }
+          },
+          result: {
+            data: CREATE_TODO_DATA,
+          }
+        }
+      ];
+
+      const { result, waitForNextUpdate } = renderHook(
+        () => useMutation<
+          { createTodo: Todo },
+          { priority: string, description: string }
+        >(CREATE_TODO_MUTATION),
+        { wrapper: ({ children }) => (
+          <MockedProvider mocks={mocks}>
+            {children}
+          </MockedProvider>
+        )},
+      );
+
+      const createTodo = result.current[0];
+      let fetchResult: any;
+      await act(async () => {
+        fetchResult = await createTodo({
+          variables: { priority: 'Low', description: 'Get milk.' },
+        });
+      });
+
+      expect(fetchResult).toEqual({ data: CREATE_TODO_DATA });
+      expect(result.current[1].data).toEqual(CREATE_TODO_DATA);
+      setTimeout(() => {
+        result.current[1].reset();
+      });
+
+      await waitForNextUpdate();
+      expect(result.current[1].data).toBe(undefined);
+    });
   });
 
   describe('ROOT_MUTATION cache data', () => {
diff --git a/src/react/hooks/useMutation.ts b/src/react/hooks/useMutation.ts
index ebff8f5230f..5885d3aaf3f 100644
--- a/src/react/hooks/useMutation.ts
+++ b/src/react/hooks/useMutation.ts
@@ -30,7 +30,7 @@ export function useMutation<
 ): MutationTuple<TData, TVariables, TContext, TCache> {
   const client = useApolloClient(options?.client);
   verifyDocumentType(mutation, DocumentType.Mutation);
-  const [result, setResult] = useState<MutationResult>({
+  const [result, setResult] = useState<Omit<MutationResult, 'reset'>>({
     called: false,
     loading: false,
     client,
@@ -122,9 +122,14 @@ export function useMutation<
     });
   }, [client, options, mutation]);
 
+  const reset = useCallback(() => {
+    setResult({ called: false, loading: false, client });
+  }, []);
+
   useEffect(() => () => {
     ref.current.isMounted = false;
   }, []);
 
-  return [execute, result];
+
+  return [execute, { reset, ...result }];
 }
diff --git a/src/react/types/types.ts b/src/react/types/types.ts
index 6ba2db9919e..4f3bc908aac 100644
--- a/src/react/types/types.ts
+++ b/src/react/types/types.ts
@@ -149,6 +149,7 @@ export interface MutationResult<TData = any> {
   loading: boolean;
   called: boolean;
   client: ApolloClient<object>;
+  reset(): void;
 }
 
 export declare type MutationFunction<