@tanstack/solid-query 6.0.0-beta.7 → 6.0.0-rc.0

package/build/dev.js

@@ -1,9 +1,161 @@
-import { MutationObserver, shouldThrowError, QueriesObserver, QueryClient as QueryClient$1, replaceEqualDeep, noop, notifyManager, QueryObserver, InfiniteQueryObserver } from '@tanstack/query-core';
+import { MutationObserver, shouldThrowError, QueriesObserver, QueryClient as QueryClient$1, replaceEqualDeep, noop, hydrate, notifyManager, QueryObserver, InfiniteQueryObserver } from '@tanstack/query-core';
 export * from '@tanstack/query-core';
-import { createContext, useContext, onCleanup, createMemo, untrack, createRenderEffect, createStore, runWithOwner, merge, createEffect, reconcile, createSignal, isPending, refresh, snapshot } from 'solid-js';
+import { createContext, useContext, onCleanup, createSignal, createRenderEffect, createMemo, untrack, createStore, runWithOwner, merge, createEffect, reconcile, isPending, refresh, snapshot } from 'solid-js';
 import { createComponent } from '@solidjs/web';
 
 // src/useQuery.ts
+function createServerDehydrationChannel(client) {
+  const cache = client.getQueryCache();
+  const entryCache = /* @__PURE__ */ new Map();
+  const snapshot2 = () => {
+    const entries = [];
+    for (const query of cache.getAll()) {
+      if (query.state.status !== "success") continue;
+      let cached = entryCache.get(query.queryHash);
+      if (!cached || cached.state !== query.state) {
+        cached = {
+          state: query.state,
+          entry: {
+            dehydratedAt: Date.now(),
+            state: query.state,
+            queryKey: query.queryKey,
+            queryHash: query.queryHash,
+            ...query.meta && { meta: query.meta },
+            ...query.queryType && { queryType: query.queryType }
+          }
+        };
+        entryCache.set(query.queryHash, cached);
+      }
+      entries.push(cached.entry);
+    }
+    return entries;
+  };
+  let closed = false;
+  let pull = null;
+  const buffered = [];
+  const emit = (value) => {
+    if (closed) return;
+    if (value.done) closed = true;
+    if (pull) {
+      const resolve = pull;
+      pull = null;
+      resolve({ done: false, value });
+    } else {
+      buffered.push(value);
+    }
+  };
+  let closeTimer = null;
+  const scheduleCloseCheck = () => {
+    if (closed || closeTimer !== null) return;
+    closeTimer = setTimeout(() => {
+      closeTimer = null;
+      if (closed) return;
+      if (client.isFetching() === 0) {
+        unsubscribe();
+        emit({ entries: snapshot2(), done: true });
+      }
+    }, 0);
+  };
+  const unsubscribe = cache.subscribe((event) => {
+    if (closed) return;
+    if (event.type === "updated" && event.action.type === "success") {
+      emit({ entries: snapshot2(), done: false });
+    }
+    scheduleCloseCheck();
+  });
+  scheduleCloseCheck();
+  return {
+    [Symbol.asyncIterator]() {
+      return {
+        next() {
+          if (buffered.length > 0) {
+            return Promise.resolve({ done: false, value: buffered.shift() });
+          }
+          if (closed) {
+            return Promise.resolve({
+              done: true,
+              value: void 0
+            });
+          }
+          return new Promise(
+            (resolve) => {
+              pull = resolve;
+            }
+          );
+        },
+        return(value) {
+          if (!closed) {
+            closed = true;
+            unsubscribe();
+            if (closeTimer !== null) {
+              clearTimeout(closeTimer);
+              closeTimer = null;
+            }
+            const resolve = pull;
+            pull = null;
+            resolve?.({ done: true, value: void 0 });
+          }
+          return Promise.resolve({
+            done: true,
+            value
+          });
+        }
+      };
+    }
+  };
+}
+function createHydrationCoordinator(client) {
+  const applied = /* @__PURE__ */ new Map();
+  const waiters = /* @__PURE__ */ new Map();
+  let channelDone = false;
+  const fireWaiters = (queryHash) => {
+    const callbacks = waiters.get(queryHash);
+    if (!callbacks) return;
+    waiters.delete(queryHash);
+    for (const callback of callbacks) queueMicrotask(callback);
+  };
+  return {
+    applyYield(value) {
+      const fresh = value.entries.filter(
+        (entry) => applied.get(entry.queryHash) !== entry.state.dataUpdatedAt
+      );
+      if (fresh.length > 0) {
+        runWithOwner(
+          null,
+          () => hydrate(client(), { queries: fresh, mutations: [] })
+        );
+        for (const entry of fresh) {
+          applied.set(entry.queryHash, entry.state.dataUpdatedAt);
+          fireWaiters(entry.queryHash);
+        }
+      }
+      if (value.done && !channelDone) {
+        channelDone = true;
+        const remaining = [...waiters.values()];
+        waiters.clear();
+        for (const callbacks of remaining) {
+          for (const callback of callbacks) queueMicrotask(callback);
+        }
+      }
+    },
+    whenQueryPrimed(queryHash, callback) {
+      if (channelDone || applied.has(queryHash)) {
+        queueMicrotask(callback);
+        return;
+      }
+      let list = waiters.get(queryHash);
+      if (!list) {
+        list = [];
+        waiters.set(queryHash, list);
+      }
+      list.push(callback);
+    }
+  };
+}
+var HydrationCoordinatorContext = createContext(null);
+
+// src/QueryClientProvider.tsx
+var isServer = typeof window === "undefined";
 var QueryClientContext = createContext(null);
 var useQueryClient = (queryClient) => {
   if (queryClient) {
@@ -18,10 +170,22 @@ var useQueryClient = (queryClient) => {
 var QueryClientProvider = (props) => {
   props.client.mount();
   onCleanup(() => props.client.unmount());
+  const [channelValue] = createSignal(() => isServer ? createServerDehydrationChannel(props.client) : void 0);
+  const coordinator = isServer ? null : createHydrationCoordinator(() => props.client);
+  createRenderEffect(() => isServer ? void 0 : channelValue(), (value) => {
+    if (value && coordinator) {
+      coordinator.applyYield(value);
+    }
+  });
   return createComponent(QueryClientContext, {
     value: () => props.client,
     get children() {
-      return props.children;
+      return createComponent(HydrationCoordinatorContext, {
+        value: coordinator,
+        get children() {
+          return props.children;
+        }
+      });
     }
   });
 };
@@ -29,9 +193,9 @@ var IsRestoringContext = createContext(() => false);
 var useIsRestoring = () => useContext(IsRestoringContext);
 
 // src/useBaseQuery.ts
-var isServer = typeof window === "undefined";
+var isServer2 = typeof window === "undefined";
 function _stripFnsForSSR(obj) {
-  if (!isServer) return obj;
+  if (!isServer2) return obj;
   const out = {};
   for (const k of Object.keys(obj)) {
     if (k === "refetch" || k === "fetchNextPage" || k === "fetchPreviousPage") {
@@ -71,8 +235,8 @@ function reconcileFn(store, result, reconcileOption, queryHash) {
   }
   return { ...result, data };
 }
-var hydratableObserverResult = (query, result) => {
-  if (!isServer) return result;
+var hydratableObserverResult = (_query, result) => {
+  if (!isServer2) return result;
   const obj = {
     ...snapshot(result),
     // During SSR, functions cannot be serialized, so we need to remove them
@@ -83,12 +247,6 @@ var hydratableObserverResult = (query, result) => {
     obj.fetchNextPage = void 0;
     obj.fetchPreviousPage = void 0;
   }
-  obj.hydrationData = {
-    state: query.state,
-    queryKey: query.queryKey,
-    queryHash: query.queryHash,
-    ...query.meta && { meta: query.meta }
-  };
   return obj;
 };
 function useBaseQuery(options, Observer, queryClient) {
@@ -99,7 +257,7 @@ function useBaseQuery(options, Observer, queryClient) {
     const defaultOptions = client().defaultQueryOptions(options());
     defaultOptions._optimisticResults = isRestoring() ? "isRestoring" : "optimistic";
     defaultOptions.structuralSharing = false;
-    if (isServer) {
+    if (isServer2) {
       defaultOptions.retry = false;
       defaultOptions.throwOnError = true;
       defaultOptions.experimental_prefetchInRender = true;
@@ -171,11 +329,25 @@ function useBaseQuery(options, Observer, queryClient) {
   }
   let unsubscribe = null;
   let disposed = false;
+  const coordinator = useContext(HydrationCoordinatorContext);
+  const attachHydratedSubscriber = () => {
+    if (!unsubscribe && !disposed && !isRestoring()) {
+      unsubscribe = createClientSubscriber();
+    }
+  };
+  const scheduleHydratedAttach = () => {
+    const queryHash = untrack(() => observer.getCurrentQuery().queryHash);
+    if (coordinator) {
+      coordinator.whenQueryPrimed(queryHash, attachHydratedSubscriber);
+    } else {
+      queueMicrotask(attachHydratedSubscriber);
+    }
+  };
   let resolver = null;
   const [queryResource] = createSignal(() => {
     const opts = trackedDefaultedOptions();
     const restoring = isRestoring();
-    if (isServer) {
+    if (isServer2) {
       const cached = observer.getOptimisticResult(opts);
       if (!cached.isLoading) {
         observerResult = cached;
@@ -188,9 +360,11 @@ function useBaseQuery(options, Observer, queryClient) {
         );
       }
     }
-    return new Promise((resolve, reject) => {
+    const replayProbe = { executorRan: false };
+    const resource = new Promise((resolve, reject) => {
+      replayProbe.executorRan = true;
       resolver = resolve;
-      if (isServer) {
+      if (isServer2) {
         unsubscribe = createServerSubscriber((data) => {
           resolve(data);
         }, reject);
@@ -223,10 +397,14 @@ function useBaseQuery(options, Observer, queryClient) {
         );
       }
     });
+    if (!isServer2 && !replayProbe.executorRan) {
+      scheduleHydratedAttach();
+    }
+    return resource;
   });
   onCleanup(() => {
     disposed = true;
-    if (isServer && isPending(queryResource)) {
+    if (isServer2 && isPending(queryResource)) {
       unsubscribeQueued = true;
       return;
     }
@@ -234,7 +412,7 @@ function useBaseQuery(options, Observer, queryClient) {
       unsubscribe();
       unsubscribe = null;
     }
-    if (resolver && !isServer) {
+    if (resolver && !isServer2) {
       resolver(observerResult);
       resolver = null;
     }
@@ -252,7 +430,7 @@ function useBaseQuery(options, Observer, queryClient) {
       if (typeof prop === "symbol") {
         return Reflect.get(target, prop, receiver);
       }
-      if (isServer) {
+      if (isServer2) {
         const resolved = queryResource();
         if (prop in resolved) {
           return Reflect.get(resolved, prop);

package/build/index.cjs

@@ -5,6 +5,158 @@ var solidJs = require('solid-js');
 var web = require('@solidjs/web');
 
 // src/useQuery.ts
+function createServerDehydrationChannel(client) {
+  const cache = client.getQueryCache();
+  const entryCache = /* @__PURE__ */ new Map();
+  const snapshot2 = () => {
+    const entries = [];
+    for (const query of cache.getAll()) {
+      if (query.state.status !== "success") continue;
+      let cached = entryCache.get(query.queryHash);
+      if (!cached || cached.state !== query.state) {
+        cached = {
+          state: query.state,
+          entry: {
+            dehydratedAt: Date.now(),
+            state: query.state,
+            queryKey: query.queryKey,
+            queryHash: query.queryHash,
+            ...query.meta && { meta: query.meta },
+            ...query.queryType && { queryType: query.queryType }
+          }
+        };
+        entryCache.set(query.queryHash, cached);
+      }
+      entries.push(cached.entry);
+    }
+    return entries;
+  };
+  let closed = false;
+  let pull = null;
+  const buffered = [];
+  const emit = (value) => {
+    if (closed) return;
+    if (value.done) closed = true;
+    if (pull) {
+      const resolve = pull;
+      pull = null;
+      resolve({ done: false, value });
+    } else {
+      buffered.push(value);
+    }
+  };
+  let closeTimer = null;
+  const scheduleCloseCheck = () => {
+    if (closed || closeTimer !== null) return;
+    closeTimer = setTimeout(() => {
+      closeTimer = null;
+      if (closed) return;
+      if (client.isFetching() === 0) {
+        unsubscribe();
+        emit({ entries: snapshot2(), done: true });
+      }
+    }, 0);
+  };
+  const unsubscribe = cache.subscribe((event) => {
+    if (closed) return;
+    if (event.type === "updated" && event.action.type === "success") {
+      emit({ entries: snapshot2(), done: false });
+    }
+    scheduleCloseCheck();
+  });
+  scheduleCloseCheck();
+  return {
+    [Symbol.asyncIterator]() {
+      return {
+        next() {
+          if (buffered.length > 0) {
+            return Promise.resolve({ done: false, value: buffered.shift() });
+          }
+          if (closed) {
+            return Promise.resolve({
+              done: true,
+              value: void 0
+            });
+          }
+          return new Promise(
+            (resolve) => {
+              pull = resolve;
+            }
+          );
+        },
+        return(value) {
+          if (!closed) {
+            closed = true;
+            unsubscribe();
+            if (closeTimer !== null) {
+              clearTimeout(closeTimer);
+              closeTimer = null;
+            }
+            const resolve = pull;
+            pull = null;
+            resolve?.({ done: true, value: void 0 });
+          }
+          return Promise.resolve({
+            done: true,
+            value
+          });
+        }
+      };
+    }
+  };
+}
+function createHydrationCoordinator(client) {
+  const applied = /* @__PURE__ */ new Map();
+  const waiters = /* @__PURE__ */ new Map();
+  let channelDone = false;
+  const fireWaiters = (queryHash) => {
+    const callbacks = waiters.get(queryHash);
+    if (!callbacks) return;
+    waiters.delete(queryHash);
+    for (const callback of callbacks) queueMicrotask(callback);
+  };
+  return {
+    applyYield(value) {
+      const fresh = value.entries.filter(
+        (entry) => applied.get(entry.queryHash) !== entry.state.dataUpdatedAt
+      );
+      if (fresh.length > 0) {
+        solidJs.runWithOwner(
+          null,
+          () => queryCore.hydrate(client(), { queries: fresh, mutations: [] })
+        );
+        for (const entry of fresh) {
+          applied.set(entry.queryHash, entry.state.dataUpdatedAt);
+          fireWaiters(entry.queryHash);
+        }
+      }
+      if (value.done && !channelDone) {
+        channelDone = true;
+        const remaining = [...waiters.values()];
+        waiters.clear();
+        for (const callbacks of remaining) {
+          for (const callback of callbacks) queueMicrotask(callback);
+        }
+      }
+    },
+    whenQueryPrimed(queryHash, callback) {
+      if (channelDone || applied.has(queryHash)) {
+        queueMicrotask(callback);
+        return;
+      }
+      let list = waiters.get(queryHash);
+      if (!list) {
+        list = [];
+        waiters.set(queryHash, list);
+      }
+      list.push(callback);
+    }
+  };
+}
+var HydrationCoordinatorContext = solidJs.createContext(null);
+
+// src/QueryClientProvider.tsx
+var isServer = typeof window === "undefined";
 exports.QueryClientContext = solidJs.createContext(null);
 exports.useQueryClient = (queryClient) => {
   if (queryClient) {
@@ -19,10 +171,22 @@ exports.useQueryClient = (queryClient) => {
 exports.QueryClientProvider = (props) => {
   props.client.mount();
   solidJs.onCleanup(() => props.client.unmount());
+  const [channelValue] = solidJs.createSignal(() => isServer ? createServerDehydrationChannel(props.client) : void 0);
+  const coordinator = isServer ? null : createHydrationCoordinator(() => props.client);
+  solidJs.createRenderEffect(() => isServer ? void 0 : channelValue(), (value) => {
+    if (value && coordinator) {
+      coordinator.applyYield(value);
+    }
+  });
   return web.createComponent(exports.QueryClientContext, {
     value: () => props.client,
     get children() {
-      return props.children;
+      return web.createComponent(HydrationCoordinatorContext, {
+        value: coordinator,
+        get children() {
+          return props.children;
+        }
+      });
     }
   });
 };
@@ -30,9 +194,9 @@ exports.IsRestoringContext = solidJs.createContext(() => false);
 exports.useIsRestoring = () => solidJs.useContext(exports.IsRestoringContext);
 
 // src/useBaseQuery.ts
-var isServer = typeof window === "undefined";
+var isServer2 = typeof window === "undefined";
 function _stripFnsForSSR(obj) {
-  if (!isServer) return obj;
+  if (!isServer2) return obj;
   const out = {};
   for (const k of Object.keys(obj)) {
     if (k === "refetch" || k === "fetchNextPage" || k === "fetchPreviousPage") {
@@ -63,8 +227,8 @@ function reconcileFn(store, result, reconcileOption, queryHash) {
   }
   return { ...result, data };
 }
-var hydratableObserverResult = (query, result) => {
-  if (!isServer) return result;
+var hydratableObserverResult = (_query, result) => {
+  if (!isServer2) return result;
   const obj = {
     ...solidJs.snapshot(result),
     // During SSR, functions cannot be serialized, so we need to remove them
@@ -75,12 +239,6 @@ var hydratableObserverResult = (query, result) => {
     obj.fetchNextPage = void 0;
     obj.fetchPreviousPage = void 0;
   }
-  obj.hydrationData = {
-    state: query.state,
-    queryKey: query.queryKey,
-    queryHash: query.queryHash,
-    ...query.meta && { meta: query.meta }
-  };
   return obj;
 };
 function useBaseQuery(options, Observer, queryClient) {
@@ -91,7 +249,7 @@ function useBaseQuery(options, Observer, queryClient) {
     const defaultOptions = client().defaultQueryOptions(options());
     defaultOptions._optimisticResults = isRestoring() ? "isRestoring" : "optimistic";
     defaultOptions.structuralSharing = false;
-    if (isServer) {
+    if (isServer2) {
       defaultOptions.retry = false;
       defaultOptions.throwOnError = true;
       defaultOptions.experimental_prefetchInRender = true;
@@ -163,11 +321,25 @@ function useBaseQuery(options, Observer, queryClient) {
   }
   let unsubscribe = null;
   let disposed = false;
+  const coordinator = solidJs.useContext(HydrationCoordinatorContext);
+  const attachHydratedSubscriber = () => {
+    if (!unsubscribe && !disposed && !isRestoring()) {
+      unsubscribe = createClientSubscriber();
+    }
+  };
+  const scheduleHydratedAttach = () => {
+    const queryHash = solidJs.untrack(() => observer.getCurrentQuery().queryHash);
+    if (coordinator) {
+      coordinator.whenQueryPrimed(queryHash, attachHydratedSubscriber);
+    } else {
+      queueMicrotask(attachHydratedSubscriber);
+    }
+  };
   let resolver = null;
   const [queryResource] = solidJs.createSignal(() => {
     const opts = trackedDefaultedOptions();
     const restoring = isRestoring();
-    if (isServer) {
+    if (isServer2) {
       const cached = observer.getOptimisticResult(opts);
       if (!cached.isLoading) {
         observerResult = cached;
@@ -180,9 +352,11 @@ function useBaseQuery(options, Observer, queryClient) {
         );
       }
     }
-    return new Promise((resolve, reject) => {
+    const replayProbe = { executorRan: false };
+    const resource = new Promise((resolve, reject) => {
+      replayProbe.executorRan = true;
       resolver = resolve;
-      if (isServer) {
+      if (isServer2) {
         unsubscribe = createServerSubscriber((data) => {
           resolve(data);
         }, reject);
@@ -215,10 +389,14 @@ function useBaseQuery(options, Observer, queryClient) {
         );
       }
     });
+    if (!isServer2 && !replayProbe.executorRan) {
+      scheduleHydratedAttach();
+    }
+    return resource;
   });
   solidJs.onCleanup(() => {
     disposed = true;
-    if (isServer && solidJs.isPending(queryResource)) {
+    if (isServer2 && solidJs.isPending(queryResource)) {
       unsubscribeQueued = true;
       return;
     }
@@ -226,7 +404,7 @@ function useBaseQuery(options, Observer, queryClient) {
       unsubscribe();
       unsubscribe = null;
     }
-    if (resolver && !isServer) {
+    if (resolver && !isServer2) {
       resolver(observerResult);
       resolver = null;
     }
@@ -244,7 +422,7 @@ function useBaseQuery(options, Observer, queryClient) {
       if (typeof prop === "symbol") {
         return Reflect.get(target, prop, receiver);
       }
-      if (isServer) {
+      if (isServer2) {
         const resolved = queryResource();
         if (prop in resolved) {
           return Reflect.get(resolved, prop);