@tanstack/vue-query 4.16.1 → 4.17.1

package/build/umd/index.development.js

@@ -54,7 +54,7 @@
   function timeUntilStale(updatedAt, staleTime) {
     return Math.max(updatedAt + (staleTime || 0) - Date.now(), 0);
   }
-  function parseQueryArgs(arg1, arg2, arg3) {
+  function parseQueryArgs$1(arg1, arg2, arg3) {
     if (!isQueryKey$1(arg1)) {
       return arg1;
     }
@@ -93,12 +93,12 @@
     return { ...arg1
     };
   }
-  function parseFilterArgs$1(arg1, arg2, arg3) {
+  function parseFilterArgs$2(arg1, arg2, arg3) {
     return isQueryKey$1(arg1) ? [{ ...arg2,
       queryKey: arg1
     }, arg3] : [arg1 || {}, arg2];
   }
-  function parseMutationFilterArgs$1(arg1, arg2, arg3) {
+  function parseMutationFilterArgs(arg1, arg2, arg3) {
     return isQueryKey$1(arg1) ? [{ ...arg2,
       mutationKey: arg1
     }, arg3] : [arg1 || {}, arg2];
@@ -1329,7 +1329,7 @@
     }
 
     find(arg1, arg2) {
-      const [filters] = parseFilterArgs$1(arg1, arg2);
+      const [filters] = parseFilterArgs$2(arg1, arg2);
 
       if (typeof filters.exact === 'undefined') {
         filters.exact = true;
@@ -1339,7 +1339,7 @@
     }
 
     findAll(arg1, arg2) {
-      const [filters] = parseFilterArgs$1(arg1, arg2);
+      const [filters] = parseFilterArgs$2(arg1, arg2);
       return Object.keys(filters).length > 0 ? this.queries.filter(query => matchQuery(filters, query)) : this.queries;
     }
 
@@ -1872,7 +1872,7 @@
     }
 
     isFetching(arg1, arg2) {
-      const [filters] = parseFilterArgs$1(arg1, arg2);
+      const [filters] = parseFilterArgs$2(arg1, arg2);
       filters.fetchStatus = 'fetching';
       return this.queryCache.findAll(filters).length;
     }
@@ -1908,7 +1908,7 @@
         return undefined;
       }
 
-      const parsedOptions = parseQueryArgs(queryKey);
+      const parsedOptions = parseQueryArgs$1(queryKey);
       const defaultedOptions = this.defaultQueryOptions(parsedOptions);
       return this.queryCache.build(this, defaultedOptions).setData(data, { ...options,
         manual: true
@@ -1928,7 +1928,7 @@
     }
 
     removeQueries(arg1, arg2) {
-      const [filters] = parseFilterArgs$1(arg1, arg2);
+      const [filters] = parseFilterArgs$2(arg1, arg2);
       const queryCache = this.queryCache;
       notifyManager.batch(() => {
         queryCache.findAll(filters).forEach(query => {
@@ -1938,7 +1938,7 @@
     }
 
     resetQueries(arg1, arg2, arg3) {
-      const [filters, options] = parseFilterArgs$1(arg1, arg2, arg3);
+      const [filters, options] = parseFilterArgs$2(arg1, arg2, arg3);
       const queryCache = this.queryCache;
       const refetchFilters = {
         type: 'active',
@@ -1953,7 +1953,7 @@
     }
 
     cancelQueries(arg1, arg2, arg3) {
-      const [filters, cancelOptions = {}] = parseFilterArgs$1(arg1, arg2, arg3);
+      const [filters, cancelOptions = {}] = parseFilterArgs$2(arg1, arg2, arg3);
 
       if (typeof cancelOptions.revert === 'undefined') {
         cancelOptions.revert = true;
@@ -1964,7 +1964,7 @@
     }
 
     invalidateQueries(arg1, arg2, arg3) {
-      const [filters, options] = parseFilterArgs$1(arg1, arg2, arg3);
+      const [filters, options] = parseFilterArgs$2(arg1, arg2, arg3);
       return notifyManager.batch(() => {
         var _ref, _filters$refetchType;
 
@@ -1984,7 +1984,7 @@
     }
 
     refetchQueries(arg1, arg2, arg3) {
-      const [filters, options] = parseFilterArgs$1(arg1, arg2, arg3);
+      const [filters, options] = parseFilterArgs$2(arg1, arg2, arg3);
       const promises = notifyManager.batch(() => this.queryCache.findAll(filters).filter(query => !query.isDisabled()).map(query => {
         var _options$cancelRefetc;
 
@@ -2005,7 +2005,7 @@
     }
 
     fetchQuery(arg1, arg2, arg3) {
-      const parsedOptions = parseQueryArgs(arg1, arg2, arg3);
+      const parsedOptions = parseQueryArgs$1(arg1, arg2, arg3);
       const defaultedOptions = this.defaultQueryOptions(parsedOptions); // https://github.com/tannerlinsley/react-query/issues/652
 
       if (typeof defaultedOptions.retry === 'undefined') {
@@ -2021,7 +2021,7 @@
     }
 
     fetchInfiniteQuery(arg1, arg2, arg3) {
-      const parsedOptions = parseQueryArgs(arg1, arg2, arg3);
+      const parsedOptions = parseQueryArgs$1(arg1, arg2, arg3);
       parsedOptions.behavior = infiniteQueryBehavior();
       return this.fetchQuery(parsedOptions);
     }
@@ -3245,6 +3245,7 @@
         mutationCache: unreffedConfig.mutationCache || new MutationCache()
       };
       super(vueQueryConfig);
+      this.isRestoring = vueDemi.ref(false);
     }
 
     isFetching(arg1, arg2) {
@@ -4405,7 +4406,7 @@
       id: pluginId,
       label: pluginName,
       packageName: 'vue-query',
-      homepage: 'https://github.com/DamianOsipiuk/vue-query',
+      homepage: 'https://tanstack.com/query/v4',
       logo: 'https://vue-query.vercel.app/vue-query.svg',
       app,
       settings: {
@@ -4576,12 +4577,25 @@
 
       client.mount();
 
+      let persisterUnmount = () => {// noop
+      };
+
+      if (options.clientPersister) {
+        client.isRestoring.value = true;
+        const [unmount, promise] = options.clientPersister(client);
+        persisterUnmount = unmount;
+        promise.then(() => {
+          client.isRestoring.value = false;
+        });
+      }
+
       if (options.contextSharing) {
         client.getLogger().error("The contextSharing option has been deprecated and will be removed in the next major version");
       }
 
       const cleanup = () => {
         client.unmount();
+        persisterUnmount();
       };
 
       if (app.onUnmount) {
@@ -4630,43 +4644,61 @@
   };
 
   function useBaseQuery(Observer, arg1, arg2 = {}, arg3 = {}) {
-    var _options$queryClient;
+    var _options$value$queryC;
 
-    const options = getQueryUnreffedOptions();
-    const queryClient = (_options$queryClient = options.queryClient) != null ? _options$queryClient : useQueryClient(options.queryClientKey);
-    const defaultedOptions = queryClient.defaultQueryOptions(options);
-    const observer = new Observer(queryClient, defaultedOptions);
+    const options = vueDemi.computed(() => parseQueryArgs(arg1, arg2, arg3));
+    const queryClient = (_options$value$queryC = options.value.queryClient) != null ? _options$value$queryC : useQueryClient(options.value.queryClientKey);
+    const defaultedOptions = vueDemi.computed(() => {
+      const defaulted = queryClient.defaultQueryOptions(options.value);
+      defaulted._optimisticResults = queryClient.isRestoring.value ? 'isRestoring' : 'optimistic';
+      return defaulted;
+    });
+    const observer = new Observer(queryClient, defaultedOptions.value);
     const state = vueDemi.reactive(observer.getCurrentResult());
-    const unsubscribe = observer.subscribe(result => {
-      updateState(state, result);
+    const unsubscribe = vueDemi.ref(() => {// noop
+    });
+    vueDemi.watch(queryClient.isRestoring, isRestoring => {
+      // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+      if (!isRestoring) {
+        unsubscribe.value();
+        unsubscribe.value = observer.subscribe(result => {
+          updateState(state, result);
+        });
+      }
+    }, {
+      immediate: true
     });
-    vueDemi.watch([() => arg1, () => arg2, () => arg3], () => {
-      observer.setOptions(queryClient.defaultQueryOptions(getQueryUnreffedOptions()));
+    vueDemi.watch(defaultedOptions, () => {
+      observer.setOptions(defaultedOptions.value);
+      updateState(state, observer.getCurrentResult());
     }, {
       deep: true
     });
     vueDemi.onScopeDispose(() => {
-      unsubscribe();
+      unsubscribe.value();
     });
 
     const suspense = () => {
       return new Promise(resolve => {
-        const run = () => {
-          const newOptions = queryClient.defaultQueryOptions(getQueryUnreffedOptions());
+        let stopWatch = () => {//noop
+        };
 
-          if (newOptions.enabled !== false) {
-            const optimisticResult = observer.getOptimisticResult(newOptions);
+        const run = () => {
+          if (defaultedOptions.value.enabled !== false) {
+            const optimisticResult = observer.getOptimisticResult(defaultedOptions.value);
 
             if (optimisticResult.isStale) {
-              resolve(observer.fetchOptimistic(defaultedOptions));
+              stopWatch();
+              resolve(observer.fetchOptimistic(defaultedOptions.value));
             } else {
+              stopWatch();
               resolve(optimisticResult);
             }
           }
         };
 
         run();
-        vueDemi.watch([() => arg1, () => arg2, () => arg3], run, {
+        stopWatch = vueDemi.watch(defaultedOptions, run, {
           deep: true
         });
       });
@@ -4675,32 +4707,27 @@
     return { ...vueDemi.toRefs(vueDemi.readonly(state)),
       suspense
     };
-    /**
-     * Get Query Options object
-     * All inner refs unwrapped. No Reactivity
-     */
-
-    function getQueryUnreffedOptions() {
-      let mergedOptions;
-
-      if (!isQueryKey(arg1)) {
-        // `useQuery(optionsObj)`
-        mergedOptions = arg1;
-      } else if (typeof arg2 === 'function') {
-        // `useQuery(queryKey, queryFn, optionsObj?)`
-        mergedOptions = { ...arg3,
-          queryKey: arg1,
-          queryFn: arg2
-        };
-      } else {
-        // `useQuery(queryKey, optionsObj?)`
-        mergedOptions = { ...arg2,
-          queryKey: arg1
-        };
-      }
+  }
+  function parseQueryArgs(arg1, arg2 = {}, arg3 = {}) {
+    const plainArg1 = vueDemi.isRef(arg1) ? arg1.value : arg1;
+    const plainArg2 = vueDemi.isRef(arg2) ? arg2.value : arg2;
+    const plainArg3 = vueDemi.isRef(arg3) ? arg3.value : arg3;
+    let options = plainArg1;
 
-      return cloneDeepUnref(mergedOptions);
+    if (!isQueryKey(plainArg1)) {
+      options = plainArg1;
+    } else if (typeof plainArg2 === 'function') {
+      options = { ...plainArg3,
+        queryKey: plainArg1,
+        queryFn: plainArg2
+      };
+    } else {
+      options = { ...plainArg2,
+        queryKey: plainArg1
+      };
     }
+
+    return cloneDeepUnref(options);
   }
 
   function useQuery(arg1, arg2, arg3) {
@@ -4712,34 +4739,44 @@
   }
 
   /* eslint-disable @typescript-eslint/no-explicit-any */
-
   function useQueries({
     queries
   }) {
-    var _unreffedQueries$, _unreffedQueries$2;
+    var _unreffedQueries$valu, _unreffedQueries$valu2;
 
-    const unreffedQueries = cloneDeepUnref(queries);
-    const queryClientKey = (_unreffedQueries$ = unreffedQueries[0]) == null ? void 0 : _unreffedQueries$.queryClientKey;
-    const optionsQueryClient = (_unreffedQueries$2 = unreffedQueries[0]) == null ? void 0 : _unreffedQueries$2.queryClient;
+    const unreffedQueries = vueDemi.computed(() => cloneDeepUnref(queries));
+    const queryClientKey = (_unreffedQueries$valu = unreffedQueries.value[0]) == null ? void 0 : _unreffedQueries$valu.queryClientKey;
+    const optionsQueryClient = (_unreffedQueries$valu2 = unreffedQueries.value[0]) == null ? void 0 : _unreffedQueries$valu2.queryClient;
     const queryClient = optionsQueryClient != null ? optionsQueryClient : useQueryClient(queryClientKey);
-    const defaultedQueries = unreffedQueries.map(options => {
-      return queryClient.defaultQueryOptions(options);
-    });
-    const observer = new QueriesObserver(queryClient, defaultedQueries);
+    const defaultedQueries = vueDemi.computed(() => unreffedQueries.value.map(options => {
+      const defaulted = queryClient.defaultQueryOptions(options);
+      defaulted._optimisticResults = queryClient.isRestoring.value ? 'isRestoring' : 'optimistic';
+      return defaulted;
+    }));
+    const observer = new QueriesObserver(queryClient, defaultedQueries.value);
     const state = vueDemi.reactive(observer.getCurrentResult());
-    const unsubscribe = observer.subscribe(result => {
-      state.splice(0, state.length, ...result);
+    const unsubscribe = vueDemi.ref(() => {// noop
     });
-    vueDemi.watch(() => queries, () => {
-      const defaulted = cloneDeepUnref(queries).map(options => {
-        return queryClient.defaultQueryOptions(options);
-      });
-      observer.setQueries(defaulted);
+    vueDemi.watch(queryClient.isRestoring, isRestoring => {
+      if (!isRestoring) {
+        unsubscribe.value();
+        unsubscribe.value = observer.subscribe(result => {
+          state.splice(0, result.length, ...result);
+        }); // Subscription would not fire for persisted results
+
+        state.splice(0, state.length, ...observer.getOptimisticResult(defaultedQueries.value));
+      }
+    }, {
+      immediate: true
+    });
+    vueDemi.watch(unreffedQueries, () => {
+      observer.setQueries(defaultedQueries.value);
+      state.splice(0, state.length, ...observer.getCurrentResult());
     }, {
       deep: true
     });
     vueDemi.onScopeDispose(() => {
-      unsubscribe();
+      unsubscribe.value();
     });
     return vueDemi.readonly(state);
   }
@@ -4818,14 +4855,13 @@
   function useIsFetching(arg1, arg2) {
     var _filters$value$queryC;
 
-    const filters = vueDemi.ref(parseFilterArgs(arg1, arg2));
+    const filters = vueDemi.computed(() => parseFilterArgs$1(arg1, arg2));
     const queryClient = (_filters$value$queryC = filters.value.queryClient) != null ? _filters$value$queryC : useQueryClient(filters.value.queryClientKey);
     const isFetching = vueDemi.ref(queryClient.isFetching(filters));
     const unsubscribe = queryClient.getQueryCache().subscribe(() => {
       isFetching.value = queryClient.isFetching(filters);
     });
-    vueDemi.watch([() => arg1, () => arg2], () => {
-      filters.value = parseFilterArgs(arg1, arg2);
+    vueDemi.watch(filters, () => {
       isFetching.value = queryClient.isFetching(filters);
     }, {
       deep: true
@@ -4835,16 +4871,18 @@
     });
     return isFetching;
   }
-  function parseFilterArgs(arg1, arg2 = {}) {
-    let options;
+  function parseFilterArgs$1(arg1, arg2 = {}) {
+    const plainArg1 = vueDemi.isRef(arg1) ? arg1.value : arg1;
+    const plainArg2 = vueDemi.isRef(arg2) ? arg2.value : arg2;
+    let options = plainArg1;
 
-    if (isQueryKey(arg1)) {
-      options = { ...arg2,
-        queryKey: arg1
+    if (isQueryKey(plainArg1)) {
+      options = { ...plainArg2,
+        queryKey: plainArg1
       };
     } else {
       // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-      options = arg1 || {};
+      options = plainArg1 || {};
     }
 
     return cloneDeepUnref(options);
@@ -4853,14 +4891,13 @@
   function useIsMutating(arg1, arg2) {
     var _filters$value$queryC;
 
-    const filters = vueDemi.ref(parseMutationFilterArgs(arg1, arg2));
+    const filters = vueDemi.computed(() => parseFilterArgs(arg1, arg2));
     const queryClient = (_filters$value$queryC = filters.value.queryClient) != null ? _filters$value$queryC : useQueryClient(filters.value.queryClientKey);
     const isMutating = vueDemi.ref(queryClient.isMutating(filters));
     const unsubscribe = queryClient.getMutationCache().subscribe(() => {
       isMutating.value = queryClient.isMutating(filters);
     });
-    vueDemi.watch([() => arg1, () => arg2], () => {
-      filters.value = parseMutationFilterArgs(arg1, arg2);
+    vueDemi.watch(filters, () => {
       isMutating.value = queryClient.isMutating(filters);
     }, {
       deep: true
@@ -4870,16 +4907,18 @@
     });
     return isMutating;
   }
-  function parseMutationFilterArgs(arg1, arg2 = {}) {
-    let options;
+  function parseFilterArgs(arg1, arg2 = {}) {
+    const plainArg1 = vueDemi.isRef(arg1) ? arg1.value : arg1;
+    const plainArg2 = vueDemi.isRef(arg2) ? arg2.value : arg2;
+    let options = plainArg1;
 
-    if (isQueryKey(arg1)) {
-      options = { ...arg2,
-        mutationKey: arg1
+    if (isQueryKey(plainArg1)) {
+      options = { ...plainArg2,
+        mutationKey: plainArg1
       };
     } else {
       // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-      options = arg1 || {};
+      options = plainArg1 || {};
     }
 
     return cloneDeepUnref(options);
@@ -4904,10 +4943,10 @@
   exports.isServer = isServer;
   exports.notifyManager = notifyManager;
   exports.onlineManager = onlineManager;
-  exports.parseFilterArgs = parseFilterArgs$1;
+  exports.parseFilterArgs = parseFilterArgs$2;
   exports.parseMutationArgs = parseMutationArgs$1;
-  exports.parseMutationFilterArgs = parseMutationFilterArgs$1;
-  exports.parseQueryArgs = parseQueryArgs;
+  exports.parseMutationFilterArgs = parseMutationFilterArgs;
+  exports.parseQueryArgs = parseQueryArgs$1;
   exports.replaceEqualDeep = replaceEqualDeep;
   exports.useInfiniteQuery = useInfiniteQuery;
   exports.useIsFetching = useIsFetching;