Skip to content

Commit b9246eb

Browse files
phryneasphryneas
authored
remove originalArgs from the mutation slice (#1318)
1 parent c6f9c7f commit b9246eb

File tree

6 files changed

+75
-97
lines changed

6 files changed

+75
-97
lines changed

‎packages/toolkit/src/query/core/apiState.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -175,7 +175,6 @@ export type QuerySubState<D extends BaseEndpointDefinition<any, any, any>> = Id<
175175
>
176176

177177
type BaseMutationSubState<D extends BaseEndpointDefinition<any, any, any>> = {
178-
originalArgs?: QueryArgFrom<D>
179178
data?: ResultTypeFrom<D>
180179
error?:
181180
| SerializedError
@@ -202,7 +201,6 @@ export type MutationSubState<D extends BaseEndpointDefinition<any, any, any>> =
202201
} & WithRequiredProp<BaseMutationSubState<D>, 'error'>)
203202
| {
204203
status: QueryStatus.uninitialized
205-
originalArgs?: undefined
206204
data?: undefined
207205
error?: undefined
208206
endpointName?: string

‎packages/toolkit/src/query/core/buildSlice.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -190,7 +190,6 @@ export function buildSlice({
190190

191191
draft[requestId] = {
192192
status: QueryStatus.pending,
193-
originalArgs: arg.originalArgs,
194193
endpointName: arg.endpointName,
195194
startedTimeStamp,
196195
}

‎packages/toolkit/src/query/react/buildHooks.ts

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -363,9 +363,11 @@ export type UseMutationStateOptions<
363363
}
364364

365365
export type UseMutationStateResult<
366-
_ extends MutationDefinition<any, any, any, any>,
366+
D extends MutationDefinition<any, any, any, any>,
367367
R
368-
> = NoInfer<R>
368+
> = NoInfer<R> & {
369+
originalArgs?: QueryArgFrom<D>
370+
}
369371

370372
/**
371373
* A React hook that lets you trigger an update request for a given endpoint, and subscribes the component to read the request status from the Redux store. The component will re-render as the loading status changes.
@@ -740,11 +742,19 @@ export function buildHooks<Definitions extends EndpointDefinitions>({
740742
)
741743

742744
const currentState = useSelector(mutationSelector, shallowEqual)
745+
const originalArgs = promiseRef.current?.arg.originalArgs
746+
const finalState = useMemo(
747+
() => ({
748+
...currentState,
749+
originalArgs,
750+
}),
751+
[currentState, originalArgs]
752+
)
743753

744-
return useMemo(() => [triggerMutation, currentState], [
745-
triggerMutation,
746-
currentState,
747-
])
754+
return useMemo(
755+
() => [triggerMutation, finalState],
756+
[triggerMutation, finalState]
757+
)
748758
}
749759
}
750760
}

‎packages/toolkit/src/query/tests/buildHooks.test.tsx

Lines changed: 59 additions & 82 deletions
Original file line numberDiff line numberDiff line change
@@ -198,11 +198,8 @@ describe('hooks tests', () => {
198198
const [value, setValue] = React.useState(0)
199199
getRenderCount = useRenderCounter()
200200

201-
const {
202-
isLoading,
203-
isFetching,
204-
refetch,
205-
} = api.endpoints.getUser.useQuery(22, { skip: value < 1 })
201+
const { isLoading, isFetching, refetch } =
202+
api.endpoints.getUser.useQuery(22, { skip: value < 1 })
206203
refetchMe = refetch
207204
return (
208205
<div>
@@ -259,13 +256,10 @@ describe('hooks tests', () => {
259256
test('useQuery hook respects refetchOnMountOrArgChange: true', async () => {
260257
let data, isLoading, isFetching
261258
function User() {
262-
;({
263-
data,
264-
isLoading,
265-
isFetching,
266-
} = api.endpoints.getIncrementedAmount.useQuery(undefined, {
267-
refetchOnMountOrArgChange: true,
268-
}))
259+
;({ data, isLoading, isFetching } =
260+
api.endpoints.getIncrementedAmount.useQuery(undefined, {
261+
refetchOnMountOrArgChange: true,
262+
}))
269263
return (
270264
<div>
271265
<div data-testid="isLoading">{String(isLoading)}</div>
@@ -308,13 +302,10 @@ describe('hooks tests', () => {
308302
test('useQuery does not refetch when refetchOnMountOrArgChange: NUMBER condition is not met', async () => {
309303
let data, isLoading, isFetching
310304
function User() {
311-
;({
312-
data,
313-
isLoading,
314-
isFetching,
315-
} = api.endpoints.getIncrementedAmount.useQuery(undefined, {
316-
refetchOnMountOrArgChange: 10,
317-
}))
305+
;({ data, isLoading, isFetching } =
306+
api.endpoints.getIncrementedAmount.useQuery(undefined, {
307+
refetchOnMountOrArgChange: 10,
308+
}))
318309
return (
319310
<div>
320311
<div data-testid="isLoading">{String(isLoading)}</div>
@@ -351,13 +342,10 @@ describe('hooks tests', () => {
351342
test('useQuery refetches when refetchOnMountOrArgChange: NUMBER condition is met', async () => {
352343
let data, isLoading, isFetching
353344
function User() {
354-
;({
355-
data,
356-
isLoading,
357-
isFetching,
358-
} = api.endpoints.getIncrementedAmount.useQuery(undefined, {
359-
refetchOnMountOrArgChange: 0.5,
360-
}))
345+
;({ data, isLoading, isFetching } =
346+
api.endpoints.getIncrementedAmount.useQuery(undefined, {
347+
refetchOnMountOrArgChange: 0.5,
348+
}))
361349
return (
362350
<div>
363351
<div data-testid="isLoading">{String(isLoading)}</div>
@@ -403,14 +391,11 @@ describe('hooks tests', () => {
403391
let data, isLoading, isFetching
404392
function User() {
405393
const [skip, setSkip] = React.useState(true)
406-
;({
407-
data,
408-
isLoading,
409-
isFetching,
410-
} = api.endpoints.getIncrementedAmount.useQuery(undefined, {
411-
refetchOnMountOrArgChange: 0.5,
412-
skip,
413-
}))
394+
;({ data, isLoading, isFetching } =
395+
api.endpoints.getIncrementedAmount.useQuery(undefined, {
396+
refetchOnMountOrArgChange: 0.5,
397+
skip,
398+
}))
414399

415400
return (
416401
<div>
@@ -452,14 +437,11 @@ describe('hooks tests', () => {
452437
let data, isLoading, isFetching
453438
function User() {
454439
const [skip, setSkip] = React.useState(true)
455-
;({
456-
data,
457-
isLoading,
458-
isFetching,
459-
} = api.endpoints.getIncrementedAmount.useQuery(undefined, {
460-
skip,
461-
refetchOnMountOrArgChange: 0.5,
462-
}))
440+
;({ data, isLoading, isFetching } =
441+
api.endpoints.getIncrementedAmount.useQuery(undefined, {
442+
skip,
443+
refetchOnMountOrArgChange: 0.5,
444+
}))
463445

464446
return (
465447
<div>
@@ -540,10 +522,8 @@ describe('hooks tests', () => {
540522
let getRenderCount: () => number = () => 0
541523
test('useLazyQuery does not automatically fetch when mounted and has undefined data', async () => {
542524
function User() {
543-
const [
544-
fetchUser,
545-
{ data: hookData, isFetching, isUninitialized },
546-
] = api.endpoints.getUser.useLazyQuery()
525+
const [fetchUser, { data: hookData, isFetching, isUninitialized }] =
526+
api.endpoints.getUser.useLazyQuery()
547527
getRenderCount = useRenderCounter()
548528

549529
data = hookData
@@ -592,10 +572,8 @@ describe('hooks tests', () => {
592572
let interval = 1000
593573
function User() {
594574
const [options, setOptions] = React.useState<SubscriptionOptions>()
595-
const [
596-
fetchUser,
597-
{ data: hookData, isFetching, isUninitialized },
598-
] = api.endpoints.getUser.useLazyQuery(options)
575+
const [fetchUser, { data: hookData, isFetching, isUninitialized }] =
576+
api.endpoints.getUser.useLazyQuery(options)
599577
getRenderCount = useRenderCounter()
600578

601579
data = hookData
@@ -676,10 +654,8 @@ describe('hooks tests', () => {
676654

677655
test('useLazyQuery accepts updated args and unsubscribes the original query', async () => {
678656
function User() {
679-
const [
680-
fetchUser,
681-
{ data: hookData, isFetching, isUninitialized },
682-
] = api.endpoints.getUser.useLazyQuery()
657+
const [fetchUser, { data: hookData, isFetching, isUninitialized }] =
658+
api.endpoints.getUser.useLazyQuery()
683659

684660
data = hookData
685661

@@ -766,10 +742,8 @@ describe('hooks tests', () => {
766742
describe('useMutation', () => {
767743
test('useMutation hook sets and unsets the isLoading flag when running', async () => {
768744
function User() {
769-
const [
770-
updateUser,
771-
{ isLoading },
772-
] = api.endpoints.updateUser.useMutation()
745+
const [updateUser, { isLoading }] =
746+
api.endpoints.updateUser.useMutation()
773747

774748
return (
775749
<div>
@@ -1217,10 +1191,8 @@ describe('hooks tests', () => {
12171191
let data, isLoading, isError
12181192
function User() {
12191193
;({ data, isError, isLoading } = api.endpoints.checkSession.useQuery())
1220-
const [
1221-
login,
1222-
{ isLoading: loginLoading },
1223-
] = api.endpoints.login.useMutation()
1194+
const [login, { isLoading: loginLoading }] =
1195+
api.endpoints.login.useMutation()
12241196

12251197
return (
12261198
<div>
@@ -1310,10 +1282,8 @@ describe('hooks with createApi defaults set', () => {
13101282
let data, isLoading, isFetching
13111283

13121284
function User() {
1313-
;({
1314-
data,
1315-
isLoading,
1316-
} = defaultApi.endpoints.getIncrementedAmount.useQuery())
1285+
;({ data, isLoading } =
1286+
defaultApi.endpoints.getIncrementedAmount.useQuery())
13171287
return (
13181288
<div>
13191289
<div data-testid="isLoading">{String(isLoading)}</div>
@@ -1338,12 +1308,10 @@ describe('hooks with createApi defaults set', () => {
13381308
unmount()
13391309

13401310
function OtherUser() {
1341-
;({
1342-
data,
1343-
isFetching,
1344-
} = defaultApi.endpoints.getIncrementedAmount.useQuery(undefined, {
1345-
refetchOnMountOrArgChange: true,
1346-
}))
1311+
;({ data, isFetching } =
1312+
defaultApi.endpoints.getIncrementedAmount.useQuery(undefined, {
1313+
refetchOnMountOrArgChange: true,
1314+
}))
13471315
return (
13481316
<div>
13491317
<div data-testid="isFetching">{String(isFetching)}</div>
@@ -1370,10 +1338,8 @@ describe('hooks with createApi defaults set', () => {
13701338
let data, isLoading, isFetching
13711339

13721340
function User() {
1373-
;({
1374-
data,
1375-
isLoading,
1376-
} = defaultApi.endpoints.getIncrementedAmount.useQuery())
1341+
;({ data, isLoading } =
1342+
defaultApi.endpoints.getIncrementedAmount.useQuery())
13771343
return (
13781344
<div>
13791345
<div data-testid="isLoading">{String(isLoading)}</div>
@@ -1398,12 +1364,10 @@ describe('hooks with createApi defaults set', () => {
13981364
unmount()
13991365

14001366
function OtherUser() {
1401-
;({
1402-
data,
1403-
isFetching,
1404-
} = defaultApi.endpoints.getIncrementedAmount.useQuery(undefined, {
1405-
refetchOnMountOrArgChange: false,
1406-
}))
1367+
;({ data, isFetching } =
1368+
defaultApi.endpoints.getIncrementedAmount.useQuery(undefined, {
1369+
refetchOnMountOrArgChange: false,
1370+
}))
14071371
return (
14081372
<div>
14091373
<div data-testid="isFetching">{String(isFetching)}</div>
@@ -1965,6 +1929,19 @@ describe('hooks with createApi defaults set', () => {
19651929
expect(getRenderCount()).toBe(5)
19661930
})
19671931

1932+
test('useMutation return value contains originalArgs', async () => {
1933+
const { result } = renderHook(api.endpoints.increment.useMutation, {
1934+
wrapper: storeRef.wrapper,
1935+
})
1936+
1937+
const firstRenderResult = result.current
1938+
expect(firstRenderResult[1].originalArgs).toBe(undefined)
1939+
firstRenderResult[0](5)
1940+
const secondRenderResult = result.current
1941+
expect(firstRenderResult[1].originalArgs).toBe(undefined)
1942+
expect(secondRenderResult[1].originalArgs).toBe(5)
1943+
})
1944+
19681945
it('useMutation with selectFromResult option has a type error if the result is not an object', async () => {
19691946
function Counter() {
19701947
const [increment] = api.endpoints.increment.useMutation({

‎packages/toolkit/src/query/tests/cacheLifecycle.test.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -417,7 +417,6 @@ test(`mutation: getCacheEntry`, async () => {
417417
isLoading: true,
418418
isSuccess: false,
419419
isUninitialized: false,
420-
originalArgs: 'arg',
421420
startedTimeStamp: expect.any(Number),
422421
status: 'pending',
423422
})
@@ -431,7 +430,6 @@ test(`mutation: getCacheEntry`, async () => {
431430
isLoading: false,
432431
isSuccess: true,
433432
isUninitialized: false,
434-
originalArgs: 'arg',
435433
startedTimeStamp: expect.any(Number),
436434
status: 'fulfilled',
437435
})

‎packages/toolkit/src/query/tests/queryLifecycle.test.tsx

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -272,7 +272,6 @@ test('mutation: getCacheEntry (success)', async () => {
272272
isLoading: true,
273273
isSuccess: false,
274274
isUninitialized: false,
275-
originalArgs: 'arg',
276275
startedTimeStamp: expect.any(Number),
277276
status: 'pending',
278277
})
@@ -286,7 +285,6 @@ test('mutation: getCacheEntry (success)', async () => {
286285
isLoading: false,
287286
isSuccess: true,
288287
isUninitialized: false,
289-
originalArgs: 'arg',
290288
startedTimeStamp: expect.any(Number),
291289
status: 'fulfilled',
292290
})
@@ -330,7 +328,6 @@ test('mutation: getCacheEntry (error)', async () => {
330328
isLoading: true,
331329
isSuccess: false,
332330
isUninitialized: false,
333-
originalArgs: 'arg',
334331
startedTimeStamp: expect.any(Number),
335332
status: 'pending',
336333
})
@@ -344,7 +341,6 @@ test('mutation: getCacheEntry (error)', async () => {
344341
isLoading: false,
345342
isSuccess: false,
346343
isUninitialized: false,
347-
originalArgs: 'arg',
348344
startedTimeStamp: expect.any(Number),
349345
status: 'rejected',
350346
})

0 commit comments

Comments
 (0)