chore: pr amends

Co-Authored-By: Dominik Dorfmeister <[email protected]>

Author: joshuaellis

docs/framework/angular/guides/mutations.md

@@ -96,14 +96,14 @@ mutation = injectMutation(() => ({
     // Optionally return a scope containing data to use when for example rolling back
     return { id: 1 }
   },
-  onError: (error, variables, scope) => {
+  onError: (error, variables, scope, context) => {
     // An error happened!
     console.log(`rolling back optimistic update with id ${scope.id}`)
   },
-  onSuccess: (data, variables, scope) => {
+  onSuccess: (data, variables, scope, context) => {
     // Boom baby!
   },
-  onSettled: (data, error, variables, scope) => {
+  onSettled: (data, error, variables, scope, context) => {
     // Error or success... doesn't matter!
   },
 }))
@@ -130,25 +130,25 @@ mutation = injectMutation(() => ({
 ```ts
 mutation = injectMutation(() => ({
   mutationFn: addTodo,
-  onSuccess: (data, variables, scope) => {
+  onSuccess: (data, variables, scope, context) => {
     // I will fire first
   },
-  onError: (error, variables, scope) => {
+  onError: (error, variables, scope, context) => {
     // I will fire first
   },
-  onSettled: (data, error, variables, scope) => {
+  onSettled: (data, error, variables, scope, context) => {
     // I will fire first
   },
 }))
 
 mutation.mutate(todo, {
-  onSuccess: (data, variables, scope) => {
+  onSuccess: (data, variables, scope, context) => {
     // I will fire second!
   },
-  onError: (error, variables, scope) => {
+  onError: (error, variables, scope, context) => {
     // I will fire second!
   },
-  onSettled: (data, error, variables, scope) => {
+  onSettled: (data, error, variables, scope, context) => {
     // I will fire second!
   },
 })
@@ -161,15 +161,15 @@ mutation.mutate(todo, {
 export class Example {
   mutation = injectMutation(() => ({
     mutationFn: addTodo,
-    onSuccess: (data, variables, scope) => {
+    onSuccess: (data, variables, scope, context) => {
       // Will be called 3 times
     },
   }))
 
   doMutations() {
     ;['Todo 1', 'Todo 2', 'Todo 3'].forEach((todo) => {
       this.mutation.mutate(todo, {
-        onSuccess: (data, variables, scope) => {
+        onSuccess: (data, variables, scope, context) => {
           // Will execute only once, for the last mutation (Todo 3),
           // regardless which mutation resolves first
         },

docs/framework/react/guides/mutations.md

@@ -149,14 +149,14 @@ useMutation({
     // Optionally return a scope containing data to use when for example rolling back
     return { id: 1 }
   },
-  onError: (error, variables, scope) => {
+  onError: (error, variables, scope, context) => {
     // An error happened!
     console.log(`rolling back optimistic update with id ${scope.id}`)
   },
-  onSuccess: (data, variables, scope) => {
+  onSuccess: (data, variables, scope, context) => {
     // Boom baby!
   },
-  onSettled: (data, error, variables, scope) => {
+  onSettled: (data, error, variables, scope, context) => {
     // Error or success... doesn't matter!
   },
 })
@@ -189,25 +189,25 @@ You might find that you want to **trigger additional callbacks** beyond the ones
 ```tsx
 useMutation({
   mutationFn: addTodo,
-  onSuccess: (data, variables, scope) => {
+  onSuccess: (data, variables, scope, context) => {
     // I will fire first
   },
-  onError: (error, variables, scope) => {
+  onError: (error, variables, scope, context) => {
     // I will fire first
   },
-  onSettled: (data, error, variables, scope) => {
+  onSettled: (data, error, variables, scope, context) => {
     // I will fire first
   },
 })
 
 mutate(todo, {
-  onSuccess: (data, variables, scope) => {
+  onSuccess: (data, variables, scope, context) => {
     // I will fire second!
   },
-  onError: (error, variables, scope) => {
+  onError: (error, variables, scope, context) => {
     // I will fire second!
   },
-  onSettled: (data, error, variables, scope) => {
+  onSettled: (data, error, variables, scope, context) => {
     // I will fire second!
   },
 })
@@ -226,15 +226,15 @@ There is a slight difference in handling `onSuccess`, `onError` and `onSettled`
 ```tsx
 useMutation({
   mutationFn: addTodo,
-  onSuccess: (data, variables, scope) => {
+  onSuccess: (data, variables, scope, context) => {
     // Will be called 3 times
   },
 })
 
 const todos = ['Todo 1', 'Todo 2', 'Todo 3']
 todos.forEach((todo) => {
   mutate(todo, {
-    onSuccess: (data, variables, scope) => {
+    onSuccess: (data, variables, scope, context) => {
       // Will execute only once, for the last mutation (Todo 3),
       // regardless which mutation resolves first
     },

docs/framework/react/reference/useMutation.md

@@ -69,15 +69,15 @@ mutate(variables, {
   - This function will fire before the mutation function is fired and is passed the same variables the mutation function would receive
   - Useful to perform optimistic updates to a resource in hopes that the mutation succeeds
   - The value returned from this function will be passed to both the `onError` and `onSettled` functions in the event of a mutation failure and can be useful for rolling back optimistic updates.
-- `onSuccess: (data: TData, variables: TVariables, scope: TScope) => Promise<unknown> | unknown`
+- `onSuccess: (data: TData, variables: TVariables, scope: TScope | undefined, context: MutationFunctionContext) => Promise<unknown> | unknown`
   - Optional
   - This function will fire when the mutation is successful and will be passed the mutation's result.
   - If a promise is returned, it will be awaited and resolved before proceeding
-- `onError: (err: TError, variables: TVariables, scope?: TScope) => Promise<unknown> | unknown`
+- `onError: (err: TError, variables: TVariables, scope: TScope | undefined, context: MutationFunctionContext) => Promise<unknown> | unknown`
   - Optional
   - This function will fire if the mutation encounters an error and will be passed the error.
   - If a promise is returned, it will be awaited and resolved before proceeding
-- `onSettled: (data: TData, error: TError, variables: TVariables, scope?: TScope) => Promise<unknown> | unknown`
+- `onSettled: (data: TData, error: TError, variables: TVariables, scope: TScope | undefined, context: MutationFunctionContext) => Promise<unknown> | unknown`
   - Optional
   - This function will fire when the mutation is either successfully fetched or encounters an error and be passed either the data or error
   - If a promise is returned, it will be awaited and resolved before proceeding
@@ -114,15 +114,15 @@ mutate(variables, {
   - `variables: TVariables`
     - Optional
     - The variables object to pass to the `mutationFn`.
-  - `onSuccess: (data: TData, variables: TVariables, scope: TScope) => void`
+  - `onSuccess: (data: TData, variables: TVariables, scope: TScope | undefined, context: MutationFunctionContext) => void`
     - Optional
     - This function will fire when the mutation is successful and will be passed the mutation's result.
     - Void function, the returned value will be ignored
-  - `onError: (err: TError, variables: TVariables, scope: TScope | undefined) => void`
+  - `onError: (err: TError, variables: TVariables, scope: TScope | undefined, context: MutationFunctionContext) => void`
     - Optional
     - This function will fire if the mutation encounters an error and will be passed the error.
     - Void function, the returned value will be ignored
-  - `onSettled: (data: TData | undefined, error: TError | null, variables: TVariables, scope: TScope | undefined) => void`
+  - `onSettled: (data: TData | undefined, error: TError | null, variables: TVariables, scope: TScope | undefined, context: MutationFunctionContext) => void`
     - Optional
     - This function will fire when the mutation is either successfully fetched or encounters an error and be passed either the data or error
     - Void function, the returned value will be ignored

packages/angular-query-experimental/src/__tests__/mutation-options.test-d.ts

@@ -8,6 +8,7 @@ import {
 } from '..'
 import type {
   DefaultError,
+  MutationFunctionContext,
   MutationState,
   WithRequired,
 } from '@tanstack/query-core'
@@ -58,15 +59,37 @@ describe('mutationOptions', () => {
     })
   })
 
-  it('should infer context type correctly', () => {
+  it('should infer scope type correctly', () => {
     mutationOptions<number, DefaultError, void, { name: string }>({
       mutationFn: () => Promise.resolve(5),
       mutationKey: ['key'],
       onMutate: () => {
-        return { name: 'context' }
+        return { name: 'scope' }
+      },
+      onSuccess: (_data, _variables, scope) => {
+        expectTypeOf(scope).toEqualTypeOf<{ name: string } | undefined>()
+      },
+    })
+  })
+
+  it('should infer context type correctly', () => {
+    mutationOptions<number>({
+      mutationFn: (_variables, context) => {
+        expectTypeOf(context).toEqualTypeOf<MutationFunctionContext>()
+        return Promise.resolve(5)
+      },
+      mutationKey: ['key'],
+      onMutate: (_variables, context) => {
+        expectTypeOf(context).toEqualTypeOf<MutationFunctionContext>()
+      },
+      onSuccess: (_data, _variables, _scope, context) => {
+        expectTypeOf(context).toEqualTypeOf<MutationFunctionContext>()
+      },
+      onError: (_error, _variables, _scope, context) => {
+        expectTypeOf(context).toEqualTypeOf<MutationFunctionContext>()
       },
-      onSuccess: (_data, _variables, context) => {
-        expectTypeOf(context).toEqualTypeOf<{ name: string }>()
+      onSettled: (_data, _error, _variables, _scope, context) => {
+        expectTypeOf(context).toEqualTypeOf<MutationFunctionContext>()
       },
     })
   })

packages/query-core/src/mutation.ts

@@ -30,7 +30,7 @@ export interface MutationState<
   TScope = unknown,
 > {
   /**
-   * @deprecated This will be removed in the next major version. Use the `scope` property instead.
+   * @deprecated `context` was renamed to `scope`. This will be removed in the next major version. Use the `scope` property instead.
    */
   context: TScope | undefined
   scope: TScope | undefined