From 7da854d2f60c1dad5c54cf9487ee3500f34fbee5 Mon Sep 17 00:00:00 2001 From: Matthew Hausman Date: Sun, 23 Oct 2022 02:42:08 -0400 Subject: [PATCH 1/9] update --- packages/vue-query/src/useMutation.ts | 21 ++++++++++----------- packages/vue-query/src/utils.ts | 4 ++-- 2 files changed, 12 insertions(+), 13 deletions(-) diff --git a/packages/vue-query/src/useMutation.ts b/packages/vue-query/src/useMutation.ts index e53715c025..7f11588fc9 100644 --- a/packages/vue-query/src/useMutation.ts +++ b/packages/vue-query/src/useMutation.ts @@ -205,21 +205,20 @@ export function parseMutationArgs< ): WithQueryClientKey< MutationObserverOptions > { - let options = arg1 - if (isMutationKey(arg1)) { - const plainFn = isRef(arg2) ? arg2.value : arg2 - const plainOptions = isRef(arg3) ? arg3.value : arg3 - if (typeof plainFn === 'function') { - options = { ...plainOptions, mutationKey: arg1, mutationFn: plainFn } + const plainArg1 = isRef(arg1) ? arg1.value : arg1 + const plainArg2 = isRef(arg2) ? arg2.value : arg2 + let options = plainArg1 + if (isMutationKey(plainArg1)) { + const plainArg3 = isRef(arg3) ? arg3.value : arg3 + if (typeof plainArg2 === 'function') { + options = { ...plainArg3, mutationKey: plainArg1, mutationFn: plainArg2 } } else { - options = { ...arg2, mutationKey: arg1 } + options = { ...plainArg2, mutationKey: plainArg1 } } } - const plainFn = isRef(arg1) ? arg1.value : arg1 - const plainOptions = isRef(arg2) ? arg2.value : arg2 - if (typeof plainFn === 'function') { - options = { ...plainOptions, mutationFn: plainFn } + if (typeof plainArg1 === 'function') { + options = { ...plainArg2, mutationFn: plainArg1 } } return cloneDeepUnref(options) as UseMutationOptions< diff --git a/packages/vue-query/src/utils.ts b/packages/vue-query/src/utils.ts index 2d719c9039..954af2101e 100644 --- a/packages/vue-query/src/utils.ts +++ b/packages/vue-query/src/utils.ts @@ -15,8 +15,8 @@ export function isQueryKey(value: unknown): value is QueryKey { return Array.isArray(value) } -export function isMutationKey(value: unknown): value is MaybeRef { - return Array.isArray(isRef(value) ? value.value : value) +export function isMutationKey(value: unknown): value is MutationKey { + return Array.isArray(value) } export function updateState( From 52c4a1f6be46552e39007a0a887a7306a5f020c3 Mon Sep 17 00:00:00 2001 From: Matthew Hausman Date: Sun, 23 Oct 2022 03:22:30 -0400 Subject: [PATCH 2/9] Update useMutation.test.ts --- .../src/__tests__/useMutation.test.ts | 29 +++++++++++++++++-- 1 file changed, 27 insertions(+), 2 deletions(-) diff --git a/packages/vue-query/src/__tests__/useMutation.test.ts b/packages/vue-query/src/__tests__/useMutation.test.ts index 3ca4578f09..58885ffa8f 100644 --- a/packages/vue-query/src/__tests__/useMutation.test.ts +++ b/packages/vue-query/src/__tests__/useMutation.test.ts @@ -90,13 +90,12 @@ describe('useMutation', () => { entity: string otherObject: { name: string - someFn: Function } } const mutationKey = ref([ { entity: 'test', - otherObject: { name: 'objectName', someFn: () => null }, + otherObject: { name: 'objectName' }, }, ]) const queryClient = useQueryClient() @@ -127,6 +126,32 @@ describe('useMutation', () => { ) }) + test('mutationFn and mutationKey are trigger reactive update when passed as arg1 or arg2', async () => { + const mutationKey = ref(['foo']) + const mutationFn = ref((params: string) => successMutator(params)) + const queryClient = useQueryClient() + const mutationCache = queryClient.getMutationCache() + const mutation = useMutation( + mutationKey, + mutationFn + ) + + mutationKey.value = ['bar'] + let proof = false + mutationFn.value = (params: string) => { + proof = true + return successMutator(params) + } + await flushPromises() + + mutation.mutate('xyz') + await flushPromises() + + const mutations = mutationCache.find({ mutationKey: ['bar'] }) + expect(mutations?.options.mutationKey).toEqual(['bar']) + expect(proof).toEqual(true) + }) + test('should reset state after invoking mutation.reset', async () => { const mutation = useMutation((params: string) => errorMutator(params)) From c8e68e91164685cf06810cdde618979349bf6cb9 Mon Sep 17 00:00:00 2001 From: Matthew Hausman Date: Sun, 23 Oct 2022 03:23:22 -0400 Subject: [PATCH 3/9] Update useMutation.ts --- packages/vue-query/src/useMutation.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/vue-query/src/useMutation.ts b/packages/vue-query/src/useMutation.ts index 7f11588fc9..42a8201f63 100644 --- a/packages/vue-query/src/useMutation.ts +++ b/packages/vue-query/src/useMutation.ts @@ -209,8 +209,8 @@ export function parseMutationArgs< const plainArg2 = isRef(arg2) ? arg2.value : arg2 let options = plainArg1 if (isMutationKey(plainArg1)) { - const plainArg3 = isRef(arg3) ? arg3.value : arg3 if (typeof plainArg2 === 'function') { + const plainArg3 = isRef(arg3) ? arg3.value : arg3 options = { ...plainArg3, mutationKey: plainArg1, mutationFn: plainArg2 } } else { options = { ...plainArg2, mutationKey: plainArg1 } From 4ee0de384302b0d4c43a8761fc92e62deda6aa0a Mon Sep 17 00:00:00 2001 From: Matthew Hausman Date: Sun, 23 Oct 2022 03:27:43 -0400 Subject: [PATCH 4/9] Update useMutation.test.ts --- packages/vue-query/src/__tests__/useMutation.test.ts | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/packages/vue-query/src/__tests__/useMutation.test.ts b/packages/vue-query/src/__tests__/useMutation.test.ts index 58885ffa8f..8f21374cf5 100644 --- a/packages/vue-query/src/__tests__/useMutation.test.ts +++ b/packages/vue-query/src/__tests__/useMutation.test.ts @@ -131,10 +131,7 @@ describe('useMutation', () => { const mutationFn = ref((params: string) => successMutator(params)) const queryClient = useQueryClient() const mutationCache = queryClient.getMutationCache() - const mutation = useMutation( - mutationKey, - mutationFn - ) + const mutation = useMutation(mutationKey, mutationFn) mutationKey.value = ['bar'] let proof = false From 253c05ec9bf2f57ec04533e930267bf90d1597f4 Mon Sep 17 00:00:00 2001 From: Matthew Hausman Date: Sun, 23 Oct 2022 03:30:14 -0400 Subject: [PATCH 5/9] Update utils.ts --- packages/vue-query/src/utils.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/vue-query/src/utils.ts b/packages/vue-query/src/utils.ts index 954af2101e..a754fc477c 100644 --- a/packages/vue-query/src/utils.ts +++ b/packages/vue-query/src/utils.ts @@ -2,7 +2,6 @@ import type { QueryKey, MutationKey } from '@tanstack/query-core' import { isRef, unref } from 'vue-demi' import type { UnwrapRef } from 'vue-demi' -import type { MaybeRef } from './types' export const VUE_QUERY_CLIENT = 'VUE_QUERY_CLIENT' From 4da1ff0feed392b85c291da690cd0329b7d0b80f Mon Sep 17 00:00:00 2001 From: Matthew Hausman Date: Sun, 23 Oct 2022 03:42:37 -0400 Subject: [PATCH 6/9] Update useMutation.test.ts --- packages/vue-query/src/__tests__/useMutation.test.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/vue-query/src/__tests__/useMutation.test.ts b/packages/vue-query/src/__tests__/useMutation.test.ts index 8f21374cf5..1161ad0291 100644 --- a/packages/vue-query/src/__tests__/useMutation.test.ts +++ b/packages/vue-query/src/__tests__/useMutation.test.ts @@ -126,7 +126,7 @@ describe('useMutation', () => { ) }) - test('mutationFn and mutationKey are trigger reactive update when passed as arg1 or arg2', async () => { + test('should allow for non-objects passed as arg1 & arg2 to trigger reactive updates', async () => { const mutationKey = ref(['foo']) const mutationFn = ref((params: string) => successMutator(params)) const queryClient = useQueryClient() From 86cdd3b9ad2e867f4a74e97115b34bf459d052ce Mon Sep 17 00:00:00 2001 From: Matthew Hausman Date: Sun, 23 Oct 2022 03:43:00 -0400 Subject: [PATCH 7/9] Update useMutation.test.ts --- packages/vue-query/src/__tests__/useMutation.test.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/vue-query/src/__tests__/useMutation.test.ts b/packages/vue-query/src/__tests__/useMutation.test.ts index 1161ad0291..c453c72b5e 100644 --- a/packages/vue-query/src/__tests__/useMutation.test.ts +++ b/packages/vue-query/src/__tests__/useMutation.test.ts @@ -126,7 +126,7 @@ describe('useMutation', () => { ) }) - test('should allow for non-objects passed as arg1 & arg2 to trigger reactive updates', async () => { + test('should allow for options object passed as arg1 & arg2 to trigger reactive updates', async () => { const mutationKey = ref(['foo']) const mutationFn = ref((params: string) => successMutator(params)) const queryClient = useQueryClient() From f710996f535e13ce907e8930165dd9b332d72709 Mon Sep 17 00:00:00 2001 From: Matthew Hausman Date: Sun, 23 Oct 2022 03:46:49 -0400 Subject: [PATCH 8/9] Update useMutation.test.ts --- packages/vue-query/src/__tests__/useMutation.test.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/vue-query/src/__tests__/useMutation.test.ts b/packages/vue-query/src/__tests__/useMutation.test.ts index c453c72b5e..b3a11ffd56 100644 --- a/packages/vue-query/src/__tests__/useMutation.test.ts +++ b/packages/vue-query/src/__tests__/useMutation.test.ts @@ -127,13 +127,13 @@ describe('useMutation', () => { }) test('should allow for options object passed as arg1 & arg2 to trigger reactive updates', async () => { - const mutationKey = ref(['foo']) + const mutationKey = ref(['foo2']) const mutationFn = ref((params: string) => successMutator(params)) const queryClient = useQueryClient() const mutationCache = queryClient.getMutationCache() const mutation = useMutation(mutationKey, mutationFn) - mutationKey.value = ['bar'] + mutationKey.value = ['bar2'] let proof = false mutationFn.value = (params: string) => { proof = true @@ -144,8 +144,8 @@ describe('useMutation', () => { mutation.mutate('xyz') await flushPromises() - const mutations = mutationCache.find({ mutationKey: ['bar'] }) - expect(mutations?.options.mutationKey).toEqual(['bar']) + const mutations = mutationCache.find({ mutationKey: ['bar2'] }) + expect(mutations?.options.mutationKey).toEqual(['bar2']) expect(proof).toEqual(true) }) From fb5c8f541f6c67b1ca47ae685a690c66c425c178 Mon Sep 17 00:00:00 2001 From: Matthew Hausman Date: Sun, 23 Oct 2022 04:41:38 -0400 Subject: [PATCH 9/9] Update useMutation.test.ts --- packages/vue-query/src/__tests__/useMutation.test.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/vue-query/src/__tests__/useMutation.test.ts b/packages/vue-query/src/__tests__/useMutation.test.ts index b3a11ffd56..3c3b860664 100644 --- a/packages/vue-query/src/__tests__/useMutation.test.ts +++ b/packages/vue-query/src/__tests__/useMutation.test.ts @@ -126,7 +126,7 @@ describe('useMutation', () => { ) }) - test('should allow for options object passed as arg1 & arg2 to trigger reactive updates', async () => { + test('should allow for non-options object (mutationFn or mutationKey) passed as arg1 & arg2 to trigger reactive updates', async () => { const mutationKey = ref(['foo2']) const mutationFn = ref((params: string) => successMutator(params)) const queryClient = useQueryClient()