@tanstack/vue-query 5.91.4 → 5.92.0

package/src/useMutation.ts

@@ -39,9 +39,13 @@ export type UseMutationOptions<
   TError = DefaultError,
   TVariables = void,
   TOnMutateResult = unknown,
-> = MaybeRefDeep<
-  UseMutationOptionsBase<TData, TError, TVariables, TOnMutateResult>
->
+> =
+  | MaybeRefDeep<
+      UseMutationOptionsBase<TData, TError, TVariables, TOnMutateResult>
+    >
+  | (() => MaybeRefDeep<
+      UseMutationOptionsBase<TData, TError, TVariables, TOnMutateResult>
+    >)
 
 type MutateSyncFunction<
   TData = unknown,
@@ -77,8 +81,11 @@ export function useMutation<
   TVariables = void,
   TOnMutateResult = unknown,
 >(
-  mutationOptions: MaybeRefDeep<
-    UseMutationOptionsBase<TData, TError, TVariables, TOnMutateResult>
+  mutationOptions: UseMutationOptions<
+    TData,
+    TError,
+    TVariables,
+    TOnMutateResult
   >,
   queryClient?: QueryClient,
 ): UseMutationReturnType<TData, TError, TVariables, TOnMutateResult> {
@@ -92,7 +99,11 @@ export function useMutation<
 
   const client = queryClient || useQueryClient()
   const options = computed(() => {
-    return client.defaultMutationOptions(cloneDeepUnref(mutationOptions))
+    const resolvedOptions =
+      typeof mutationOptions === 'function'
+        ? mutationOptions()
+        : mutationOptions
+    return client.defaultMutationOptions(cloneDeepUnref(resolvedOptions))
   })
   const observer = new MutationObserver(client, options.value)
   const state = options.value.shallow

package/src/useMutationState.ts

@@ -21,7 +21,7 @@ import type { MutationCache } from './mutationCache'
 export type MutationFilters = MaybeRefDeep<MF>
 
 export function useIsMutating(
-  filters: MutationFilters = {},
+  filters: MutationFilters | (() => MutationFilters) = {},
   queryClient?: QueryClient,
 ): Ref<number> {
   if (process.env.NODE_ENV === 'development') {
@@ -37,7 +37,7 @@ export function useIsMutating(
   const mutationState = useMutationState(
     {
       filters: computed(() => ({
-        ...cloneDeepUnref(filters),
+        ...cloneDeepUnref(typeof filters === 'function' ? filters() : filters),
         status: 'pending' as const,
       })),
     },
@@ -66,18 +66,26 @@ function getResult<TResult = MutationState>(
 }
 
 export function useMutationState<TResult = MutationState>(
-  options: MutationStateOptions<TResult> = {},
+  options:
+    | MutationStateOptions<TResult>
+    | (() => MutationStateOptions<TResult>) = {},
   queryClient?: QueryClient,
 ): Readonly<Ref<Array<TResult>>> {
-  const filters = computed(() => cloneDeepUnref(options.filters))
+  const resolvedOptions = computed(() => {
+    const newOptions = typeof options === 'function' ? options() : options
+    return {
+      filters: cloneDeepUnref(newOptions.filters),
+      select: newOptions.select,
+    }
+  })
   const mutationCache = (queryClient || useQueryClient()).getMutationCache()
-  const state = shallowRef(getResult(mutationCache, options))
+  const state = shallowRef(getResult(mutationCache, resolvedOptions.value))
   const unsubscribe = mutationCache.subscribe(() => {
-    state.value = getResult(mutationCache, options)
+    state.value = getResult(mutationCache, resolvedOptions.value)
   })
 
-  watch(filters, () => {
-    state.value = getResult(mutationCache, options)
+  watch(resolvedOptions, () => {
+    state.value = getResult(mutationCache, resolvedOptions.value)
   })
 
   onScopeDispose(() => {

package/src/useQueries.ts

@@ -240,6 +240,7 @@ export function useQueries<
     ...options
   }: ShallowOption & {
     queries:
+      | (() => MaybeRefDeep<UseQueriesOptionsArg<T>>)
       | MaybeRefDeep<UseQueriesOptionsArg<T>>
       | MaybeRefDeep<
           readonly [
@@ -261,8 +262,12 @@ export function useQueries<
   const client = queryClient || useQueryClient()
 
   const defaultedQueries = computed(() => {
+    const resolvedQueries =
+      typeof queries === 'function'
+        ? (queries as () => MaybeRefDeep<UseQueriesOptionsArg<T>>)()
+        : queries
     // Only unref the top level array.
-    const queriesRaw = unref(queries) as ReadonlyArray<any>
+    const queriesRaw = unref(resolvedQueries) as ReadonlyArray<any>
 
     // Unref the rest for each element in the top level array.
     return queriesRaw.map((queryOptions) => {