Changed return type of useMutation when ignoreResult is explicitly set to true to hide unset result

Author: Cellule

.changeset/tasty-steaks-think.md

@@ -0,0 +1,5 @@
+---
+"@apollo/client": patch
+---
+
+Changed return type of useMutation when ignoreResult is explicitly set to true to avoid using unset values of the result

src/react/hooks/__tests__/useMutation.test.tsx

@@ -38,7 +38,7 @@ import {
   createRenderStream,
   renderHookToSnapshotStream,
 } from "@testing-library/react-render-stream";
-import { MutationTuple, QueryResult } from "../../types/types";
+import { MutationResult, MutationTuple, QueryResult } from "../../types/types";
 import { invariant } from "../../../utilities/globals";
 
 describe("useMutation Hook", () => {
@@ -3389,4 +3389,62 @@ describe.skip("Type Tests", () => {
     expectTypeOf(data).toMatchTypeOf<Mutation | null | undefined>();
     expectTypeOf(mutate()).toMatchTypeOf<Promise<FetchResult<Mutation>>>();
   });
+
+  test("should not be able to access result when using ignoreResults", async () => {
+    const mutation = gql`
+      mutation {
+        updateUser {
+          id
+        }
+      }
+    `;
+
+    type Mutation = {
+      updateUser: {
+        __typename: "User";
+        id: string;
+      };
+    };
+
+    // Explicit `true`
+    {
+      const [mutate, result] = useMutation<Mutation>(mutation, {
+        ignoreResults: true,
+      });
+      expectTypeOf(result).toMatchTypeOf<{ reset: () => void }>();
+      expectTypeOf(result).not.toMatchTypeOf<MutationResult<Mutation>>();
+      expectTypeOf(mutate()).toMatchTypeOf<Promise<FetchResult<Mutation>>>();
+      const {
+        reset,
+        // @ts-expect-error
+        data,
+        // @ts-expect-error
+        loading,
+        // @ts-expect-error
+        error,
+      } = result;
+      reset;
+      data;
+      loading;
+      error;
+    }
+
+    // Explicit `false`
+    {
+      const [mutate, result] = useMutation<Mutation>(mutation, {
+        ignoreResults: false,
+      });
+      expectTypeOf(result).toMatchTypeOf<MutationResult<Mutation>>();
+      expectTypeOf(mutate()).toMatchTypeOf<Promise<FetchResult<Mutation>>>();
+    }
+
+    // Unknown boolean
+    {
+      const [mutate, result] = useMutation<Mutation>(mutation, {
+        ignoreResults: Math.random() > 0.5,
+      });
+      expectTypeOf(result).toMatchTypeOf<MutationResult<Mutation>>();
+      expectTypeOf(mutate()).toMatchTypeOf<Promise<FetchResult<Mutation>>>();
+    }
+  });
 });

src/react/hooks/useMutation.ts

@@ -2,6 +2,7 @@ import * as React from "rehackt";
 import type { DocumentNode } from "graphql";
 import type { TypedDocumentNode } from "@graphql-typed-document-node/core";
 import type {
+  MutationFunction,
   MutationFunctionOptions,
   MutationHookOptions,
   MutationResult,
@@ -69,6 +70,38 @@ import { useIsomorphicLayoutEffect } from "./internal/useIsomorphicLayoutEffect.
  * @param options - Options to control how the mutation is executed.
  * @returns A tuple in the form of `[mutate, result]`
  */
+export function useMutation<
+  TData = any,
+  TVariables = OperationVariables,
+  TContext = DefaultContext,
+  TCache extends ApolloCache<any> = ApolloCache<any>,
+>(
+  mutation: DocumentNode | TypedDocumentNode<TData, TVariables>,
+  options: { ignoreResults: true } & MutationHookOptions<
+    NoInfer<TData>,
+    NoInfer<TVariables>,
+    TContext,
+    TCache
+  >
+): [
+  MutationFunction<TData, TVariables, TContext, TCache>,
+  // result is not reliable when ignoreResults is true
+  Pick<MutationResult<TData>, "reset">,
+];
+export function useMutation<
+  TData = any,
+  TVariables = OperationVariables,
+  TContext = DefaultContext,
+  TCache extends ApolloCache<any> = ApolloCache<any>,
+>(
+  mutation: DocumentNode | TypedDocumentNode<TData, TVariables>,
+  options?: MutationHookOptions<
+    NoInfer<TData>,
+    NoInfer<TVariables>,
+    TContext,
+    TCache
+  >
+): MutationTuple<TData, TVariables, TContext, TCache>;
 export function useMutation<
   TData = any,
   TVariables = OperationVariables,

src/react/types/types.ts

@@ -394,6 +394,8 @@ export declare type MutationFunction<
   TCache extends ApolloCache<any> = ApolloCache<any>,
 > = (
   options?: MutationFunctionOptions<TData, TVariables, TContext, TCache>
+  // TODO This FetchResult<TData> seems strange here, as opposed to an
+  // ApolloQueryResult<TData>
 ) => Promise<FetchResult<MaybeMasked<TData>>>;
 
 export interface MutationHookOptions<
@@ -418,11 +420,7 @@ export type MutationTuple<
   TContext = DefaultContext,
   TCache extends ApolloCache<any> = ApolloCache<any>,
 > = [
-  mutate: (
-    options?: MutationFunctionOptions<TData, TVariables, TContext, TCache>
-    // TODO This FetchResult<TData> seems strange here, as opposed to an
-    // ApolloQueryResult<TData>
-  ) => Promise<FetchResult<MaybeMasked<TData>>>,
+  mutate: MutationFunction<TData, TVariables, TContext, TCache>,
   result: MutationResult<TData>,
 ];