Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/tasty-steaks-think.md
Original file line number Diff line number Diff line change
@@ -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
60 changes: 59 additions & 1 deletion src/react/hooks/__tests__/useMutation.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -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", () => {
Expand Down Expand Up @@ -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 {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you update this to check client and called as well?

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>>>();
}
});
});
33 changes: 33 additions & 0 deletions src/react/hooks/useMutation.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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,
Expand Down Expand Up @@ -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">,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It looks like we still return loading, called, and client properties even when ignoreResults are set. They just happen to use their initial values:

const [result, setResult] = React.useState<Omit<MutationResult, "reset">>({
called: false,
loading: false,
client,
});

Can we include those properties here as well? I see no reason not to be able to access them, even if loading or called never changes.

];
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,
Expand Down
8 changes: 3 additions & 5 deletions src/react/types/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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<
Expand All @@ -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>,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💯 I have no idea why this wasn't that way to begin with. Good find!

result: MutationResult<TData>,
];

Expand Down