Skip to content

Conversation

wo-o29
Copy link
Contributor

@wo-o29 wo-o29 commented Aug 26, 2025

Summary

This PR fixes the status type in mutation documentation

Changes

Update type definition

  • Before: status: string
  • After: status: MutationStatus
  • Reason: Reflects actual internal implementation and improves type accuracy.
// packages/query-core/src/mutation.ts
export interface MutationState<
  TData = unknown,
  TError = DefaultError,
  TVariables = unknown,
  TContext = unknown,
> {
  context: TContext | undefined
  data: TData | undefined
  error: TError | null
  failureCount: number
  failureReason: TError | null
  isPaused: boolean
  status: MutationStatus // use MutationStatus type
  variables: TVariables | undefined
  submittedAt: number
}

Why

  • Ensures documentation consistency with internal implementation.
  • Improves type accuracy for better DX (developer experience).

Summary by CodeRabbit

  • Documentation
    • Updated useMutation docs: status is now a typed state with four values — idle, pending, success, error.
    • Added derived booleans: isIdle, isPending, isSuccess, isError (based on status).
    • Confirmed mutateAsync behavior remains unchanged.
    • Improved guidance for interpreting mutation state and handling UI states accordingly.

Copy link

coderabbitai bot commented Aug 26, 2025

Walkthrough

Documentation for React useMutation updated: status is documented as MutationStatus with values idle, pending, error, success; added derived booleans isIdle, isPending, isSuccess, isError. No code or API changes; mutateAsync signature unchanged.

Changes

Cohort / File(s) Summary of Changes
Docs — React useMutation reference
docs/framework/react/reference/useMutation.md
Updated Returns section: status documented as MutationStatus with possible values idle, pending, error, success; clarified isIdle/isPending/isSuccess/isError are booleans derived from status. No changes to parameters or mutateAsync signature.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~2 minutes

Poem

I twitch my whiskers, flip a page,
Mutation’s status steps on stage—
idle, pending, error, success,
Four small signs to help address.
I thump and smile: docs made bright. 🥕

Tip

🔌 Remote MCP (Model Context Protocol) integration is now available!

Pro plan users can now connect to remote MCP servers from the Integrations page. Connect with popular remote MCPs such as Notion and Linear to add more context to your reviews and chats.

✨ Finishing Touches
🧪 Generate unit tests
  • Create PR with unit tests
  • Post copyable unit tests in a comment

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

CodeRabbit Commands (Invoked using PR/Issue comments)

Type @coderabbitai help to get the list of available commands.

Other keywords and placeholders

  • Add @coderabbitai ignore or @coderabbit ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Status, Documentation and Community

  • Visit our Status Page to check the current availability of CodeRabbit.
  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

@github-actions github-actions bot added the documentation Improvements or additions to documentation label Aug 26, 2025
Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 0

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)
docs/framework/react/reference/useMutation.md (1)

144-145: Terminology bug: “query” → “mutation”.

This is the mutation reference; “query” here is misleading.

-  - The error object for the query, if an error was encountered.
+  - The error object for the mutation, if an error was encountered.
🧹 Nitpick comments (3)
docs/framework/react/reference/useMutation.md (3)

131-137: Minor clarity tweak: mention reset() returns status to idle.

Adding this one-liner helps users reason about state transitions around retries and manual resets.

 - `status: MutationStatus`
   - Will be:
     - `idle` initial status prior to the mutation function executing.
     - `pending` if the mutation is currently executing.
     - `error` if the last mutation attempt resulted in an error.
     - `success` if the last mutation attempt was successful.
+  - Resets to `idle` after calling `reset()`.

141-143: Type accuracy: data should be TData | undefined, not unknown.

The hook is generic over TData, and the resolved data is typed accordingly. Documenting it as unknown drops type information.

-- `data: undefined | unknown`
+- `data: undefined | TData`
   - Defaults to `undefined`
   - The last successfully resolved data for the mutation.

113-116: Clarify when variables are optional.

In TypeScript, variables are only truly optional if TVariables allows undefined/void. This avoids confusion when TVariables is non-optional.

-  - `variables: TVariables`
-    - Optional
-    - The variables object to pass to the `mutationFn`.
+  - `variables: TVariables`
+    - Optional if `TVariables` allows `undefined`/`void`; otherwise required
+    - The variables object to pass to the `mutationFn`.
📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

💡 Knowledge Base configuration:

  • MCP integration is disabled by default for public repositories
  • Jira integration is disabled by default for public repositories
  • Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between a1b1279 and ce9cc31.

📒 Files selected for processing (1)
  • docs/framework/react/reference/useMutation.md (1 hunks)
🔇 Additional comments (1)
docs/framework/react/reference/useMutation.md (1)

131-137: Good correction: status should be MutationStatus (idle | pending | error | success).

The change aligns the docs with the actual union type and the derived booleans. Looks correct.

Copy link

nx-cloud bot commented Aug 30, 2025

View your CI Pipeline Execution ↗ for commit 5565a87

Command Status Duration Result
nx affected --targets=test:sherif,test:knip,tes... ✅ Succeeded 58s View ↗
nx run-many --target=build --exclude=examples/*... ✅ Succeeded 1s View ↗

☁️ Nx Cloud last updated this comment at 2025-08-30 05:46:39 UTC

Copy link

pkg-pr-new bot commented Aug 30, 2025

More templates

@tanstack/angular-query-devtools-experimental

npm i https://pkg.pr.new/@tanstack/angular-query-devtools-experimental@9595

@tanstack/angular-query-experimental

npm i https://pkg.pr.new/@tanstack/angular-query-experimental@9595

@tanstack/eslint-plugin-query

npm i https://pkg.pr.new/@tanstack/eslint-plugin-query@9595

@tanstack/query-async-storage-persister

npm i https://pkg.pr.new/@tanstack/query-async-storage-persister@9595

@tanstack/query-broadcast-client-experimental

npm i https://pkg.pr.new/@tanstack/query-broadcast-client-experimental@9595

@tanstack/query-core

npm i https://pkg.pr.new/@tanstack/query-core@9595

@tanstack/query-devtools

npm i https://pkg.pr.new/@tanstack/query-devtools@9595

@tanstack/query-persist-client-core

npm i https://pkg.pr.new/@tanstack/query-persist-client-core@9595

@tanstack/query-sync-storage-persister

npm i https://pkg.pr.new/@tanstack/query-sync-storage-persister@9595

@tanstack/react-query

npm i https://pkg.pr.new/@tanstack/react-query@9595

@tanstack/react-query-devtools

npm i https://pkg.pr.new/@tanstack/react-query-devtools@9595

@tanstack/react-query-next-experimental

npm i https://pkg.pr.new/@tanstack/react-query-next-experimental@9595

@tanstack/react-query-persist-client

npm i https://pkg.pr.new/@tanstack/react-query-persist-client@9595

@tanstack/solid-query

npm i https://pkg.pr.new/@tanstack/solid-query@9595

@tanstack/solid-query-devtools

npm i https://pkg.pr.new/@tanstack/solid-query-devtools@9595

@tanstack/solid-query-persist-client

npm i https://pkg.pr.new/@tanstack/solid-query-persist-client@9595

@tanstack/svelte-query

npm i https://pkg.pr.new/@tanstack/svelte-query@9595

@tanstack/svelte-query-devtools

npm i https://pkg.pr.new/@tanstack/svelte-query-devtools@9595

@tanstack/svelte-query-persist-client

npm i https://pkg.pr.new/@tanstack/svelte-query-persist-client@9595

@tanstack/vue-query

npm i https://pkg.pr.new/@tanstack/vue-query@9595

@tanstack/vue-query-devtools

npm i https://pkg.pr.new/@tanstack/vue-query-devtools@9595

commit: 5565a87

@manudeli
Copy link
Collaborator

👍

@manudeli manudeli merged commit 428c19f into TanStack:main Aug 30, 2025
5 of 6 checks passed
Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 0

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)
docs/framework/react/reference/useMutation.md (1)

141-145: Update useMutation docs: correct data type & wording

Verified: mutation result uses data: TData | undefined and error: TError | null — docs should reflect that. Location: docs/framework/react/reference/useMutation.md (lines 141–145)

-data: undefined | unknown
+data: TData | undefined

    • The error object for the query, if an error was encountered.
    • The error object for the mutation, if an error was encountered.
🧹 Nitpick comments (4)
docs/framework/react/reference/useMutation.md (4)

87-87: Grammar nit: article before “number”

Use “a number”, not “an number”.

-  - If set to an `number`, e.g. `3`, failed mutations will retry until the failed mutations count meets that number.
+  - If set to a `number`, e.g. `3`, failed mutations will retry until the failed mutations count meets that number.

81-81: Wording: “fetched” is query terminology

For mutations, prefer “succeeded”. Same below in Returns/onSettled.

-  - This function will fire when the mutation is either successfully fetched or encounters an error and be passed either the data or error
+  - This function will fire when the mutation either succeeds or encounters an error and will be passed either the data or error

126-126: Mirror the onSettled wording fix in Returns

Keep terminology consistent with the Options section.

-    - This function will fire when the mutation is either successfully fetched or encounters an error and be passed either the data or error
+    - This function will fire when the mutation either succeeds or encounters an error and will be passed either the data or error

131-131: Optional: cross-link MutationStatus

If there’s a central types section, link MutationStatus to improve discoverability (e.g., a types page or source link).

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

💡 Knowledge Base configuration:

  • MCP integration is disabled by default for public repositories
  • Jira integration is disabled by default for public repositories
  • Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between ce9cc31 and 5565a87.

📒 Files selected for processing (1)
  • docs/framework/react/reference/useMutation.md (1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
  • GitHub Check: Test
🔇 Additional comments (1)
docs/framework/react/reference/useMutation.md (1)

131-137: Verified MutationStatus and derived booleans
MutationStatus is defined exactly as 'idle' | 'pending' | 'success' | 'error', and mutation code only uses isIdle, isPending, isSuccess, and isError with no lingering loading state. Docs now accurately reflect the implementation.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
documentation Improvements or additions to documentation
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants