@tanstack/solid-query 5.29.3 → 5.30.0

package/build/dev.cjs

@@ -5,8 +5,7 @@ var solidJs = require('solid-js');
 var web = require('solid-js/web');
 var store = require('solid-js/store');
 
-// src/setBatchUpdatesFn.ts
-queryCore.notifyManager.setBatchNotifyFunction(solidJs.batch);
+// src/index.ts
 exports.QueryClient = class QueryClient extends queryCore.QueryClient {
   constructor(config = {}) {
     super(config);
@@ -103,9 +102,8 @@ function createBaseQuery(options, Observer, queryClient) {
   const [observer, setObserver] = solidJs.createSignal(
     new Observer(client(), defaultedOptions())
   );
-  const [state, setState] = store.createStore(
-    observer().getOptimisticResult(defaultedOptions())
-  );
+  let observerResult = observer().getOptimisticResult(defaultedOptions());
+  const [state, setState] = store.createStore(observerResult);
   const createServerSubscriber = (resolve, reject) => {
     return observer().subscribe((result) => {
       queryCore.notifyManager.batchCalls(() => {
@@ -130,32 +128,34 @@ function createBaseQuery(options, Observer, queryClient) {
   const createClientSubscriber = () => {
     const obs = observer();
     return obs.subscribe((result) => {
-      queryCore.notifyManager.batchCalls(() => {
-        const reconcileOptions = obs.options.reconcile;
-        if (!queryResource.error && queryResource()?.data && result.data && !queryResource.loading) {
-          setState((store) => {
-            return reconcileFn(
-              store,
-              result,
-              reconcileOptions === void 0 ? false : reconcileOptions
-            );
-          });
-          mutate(state);
-        } else {
-          setState((store) => {
-            return reconcileFn(
-              store,
-              result,
-              reconcileOptions === void 0 ? false : reconcileOptions
-            );
-          });
-          refetch();
-        }
-      })();
+      observerResult = result;
+      queueMicrotask(() => refetch());
     });
   };
+  function setStateWithReconciliation(res) {
+    const reconcileOptions = observer().options.reconcile;
+    setState((store) => {
+      return reconcileFn(
+        store,
+        res,
+        reconcileOptions === void 0 ? false : reconcileOptions
+      );
+    });
+  }
+  function createDeepSignal() {
+    return [
+      () => state,
+      (v) => {
+        const unwrapped = store.unwrap(state);
+        if (typeof v === "function") {
+          v = v(unwrapped);
+        }
+        setStateWithReconciliation(v);
+      }
+    ];
+  }
   let unsubscribe = null;
-  const [queryResource, { refetch, mutate }] = solidJs.createResource(
+  const [queryResource, { refetch }] = solidJs.createResource(
     () => {
       const obs = observer();
       return new Promise((resolve, reject) => {
@@ -165,18 +165,16 @@ function createBaseQuery(options, Observer, queryClient) {
           unsubscribe = createClientSubscriber();
         }
         obs.updateResult();
-        if (!state.isLoading) {
+        if (!observerResult.isLoading) {
           const query = obs.getCurrentQuery();
-          resolve(hydratableObserverResult(query, state));
+          resolve(hydratableObserverResult(query, observerResult));
+        } else {
+          setStateWithReconciliation(observerResult);
         }
       });
     },
     {
-      initialValue: state,
-      // If initialData is provided, we resolve the resource immediately
-      get ssrLoadFrom() {
-        return options().initialData ? "initial" : "server";
-      },
+      storage: createDeepSignal,
       get deferStream() {
         return options().deferStream;
       },
@@ -254,7 +252,7 @@ function createBaseQuery(options, Observer, queryClient) {
       [observer, defaultedOptions],
       ([obs, opts]) => {
         obs.setOptions(opts);
-        setState(obs.getOptimisticResult(opts));
+        setStateWithReconciliation(obs.getOptimisticResult(opts));
       },
       { defer: true }
     )
@@ -275,8 +273,14 @@ function createBaseQuery(options, Observer, queryClient) {
   );
   const handler = {
     get(target, prop) {
-      const val = queryResource()?.[prop];
-      return val !== void 0 ? val : Reflect.get(target, prop);
+      if (prop === "data") {
+        const opts = observer().options;
+        if (opts.placeholderData) {
+          return queryResource.latest?.data;
+        }
+        return queryResource()?.data;
+      }
+      return Reflect.get(target, prop);
     }
   };
   return new Proxy(state, handler);

package/build/dev.js

@@ -1,11 +1,10 @@
-import { notifyManager, QueryClient as QueryClient$1, MutationObserver, replaceEqualDeep, QueriesObserver, hydrate, QueryObserver, InfiniteQueryObserver } from '@tanstack/query-core';
+import { QueryClient as QueryClient$1, MutationObserver, replaceEqualDeep, QueriesObserver, hydrate, QueryObserver, InfiniteQueryObserver, notifyManager } from '@tanstack/query-core';
 export * from '@tanstack/query-core';
-import { batch, createContext, useContext, createRenderEffect, onCleanup, createMemo, createSignal, createComputed, on, createEffect, mergeProps, createResource, onMount } from 'solid-js';
+import { createContext, useContext, createRenderEffect, onCleanup, createMemo, createSignal, createComputed, on, createEffect, mergeProps, createResource, batch, onMount } from 'solid-js';
 import { createComponent, isServer } from 'solid-js/web';
 import { createStore, unwrap, reconcile } from 'solid-js/store';
 
-// src/setBatchUpdatesFn.ts
-notifyManager.setBatchNotifyFunction(batch);
+// src/index.ts
 var QueryClient = class extends QueryClient$1 {
   constructor(config = {}) {
     super(config);
@@ -102,9 +101,8 @@ function createBaseQuery(options, Observer, queryClient) {
   const [observer, setObserver] = createSignal(
     new Observer(client(), defaultedOptions())
   );
-  const [state, setState] = createStore(
-    observer().getOptimisticResult(defaultedOptions())
-  );
+  let observerResult = observer().getOptimisticResult(defaultedOptions());
+  const [state, setState] = createStore(observerResult);
   const createServerSubscriber = (resolve, reject) => {
     return observer().subscribe((result) => {
       notifyManager.batchCalls(() => {
@@ -129,32 +127,34 @@ function createBaseQuery(options, Observer, queryClient) {
   const createClientSubscriber = () => {
     const obs = observer();
     return obs.subscribe((result) => {
-      notifyManager.batchCalls(() => {
-        const reconcileOptions = obs.options.reconcile;
-        if (!queryResource.error && queryResource()?.data && result.data && !queryResource.loading) {
-          setState((store) => {
-            return reconcileFn(
-              store,
-              result,
-              reconcileOptions === void 0 ? false : reconcileOptions
-            );
-          });
-          mutate(state);
-        } else {
-          setState((store) => {
-            return reconcileFn(
-              store,
-              result,
-              reconcileOptions === void 0 ? false : reconcileOptions
-            );
-          });
-          refetch();
-        }
-      })();
+      observerResult = result;
+      queueMicrotask(() => refetch());
     });
   };
+  function setStateWithReconciliation(res) {
+    const reconcileOptions = observer().options.reconcile;
+    setState((store) => {
+      return reconcileFn(
+        store,
+        res,
+        reconcileOptions === void 0 ? false : reconcileOptions
+      );
+    });
+  }
+  function createDeepSignal() {
+    return [
+      () => state,
+      (v) => {
+        const unwrapped = unwrap(state);
+        if (typeof v === "function") {
+          v = v(unwrapped);
+        }
+        setStateWithReconciliation(v);
+      }
+    ];
+  }
   let unsubscribe = null;
-  const [queryResource, { refetch, mutate }] = createResource(
+  const [queryResource, { refetch }] = createResource(
     () => {
       const obs = observer();
       return new Promise((resolve, reject) => {
@@ -164,18 +164,16 @@ function createBaseQuery(options, Observer, queryClient) {
           unsubscribe = createClientSubscriber();
         }
         obs.updateResult();
-        if (!state.isLoading) {
+        if (!observerResult.isLoading) {
           const query = obs.getCurrentQuery();
-          resolve(hydratableObserverResult(query, state));
+          resolve(hydratableObserverResult(query, observerResult));
+        } else {
+          setStateWithReconciliation(observerResult);
         }
       });
     },
     {
-      initialValue: state,
-      // If initialData is provided, we resolve the resource immediately
-      get ssrLoadFrom() {
-        return options().initialData ? "initial" : "server";
-      },
+      storage: createDeepSignal,
       get deferStream() {
         return options().deferStream;
       },
@@ -253,7 +251,7 @@ function createBaseQuery(options, Observer, queryClient) {
       [observer, defaultedOptions],
       ([obs, opts]) => {
         obs.setOptions(opts);
-        setState(obs.getOptimisticResult(opts));
+        setStateWithReconciliation(obs.getOptimisticResult(opts));
       },
       { defer: true }
     )
@@ -274,8 +272,14 @@ function createBaseQuery(options, Observer, queryClient) {
   );
   const handler = {
     get(target, prop) {
-      const val = queryResource()?.[prop];
-      return val !== void 0 ? val : Reflect.get(target, prop);
+      if (prop === "data") {
+        const opts = observer().options;
+        if (opts.placeholderData) {
+          return queryResource.latest?.data;
+        }
+        return queryResource()?.data;
+      }
+      return Reflect.get(target, prop);
     }
   };
   return new Proxy(state, handler);

package/build/index.cjs

@@ -5,8 +5,7 @@ var solidJs = require('solid-js');
 var web = require('solid-js/web');
 var store = require('solid-js/store');
 
-// src/setBatchUpdatesFn.ts
-queryCore.notifyManager.setBatchNotifyFunction(solidJs.batch);
+// src/index.ts
 exports.QueryClient = class QueryClient extends queryCore.QueryClient {
   constructor(config = {}) {
     super(config);
@@ -103,9 +102,8 @@ function createBaseQuery(options, Observer, queryClient) {
   const [observer, setObserver] = solidJs.createSignal(
     new Observer(client(), defaultedOptions())
   );
-  const [state, setState] = store.createStore(
-    observer().getOptimisticResult(defaultedOptions())
-  );
+  let observerResult = observer().getOptimisticResult(defaultedOptions());
+  const [state, setState] = store.createStore(observerResult);
   const createServerSubscriber = (resolve, reject) => {
     return observer().subscribe((result) => {
       queryCore.notifyManager.batchCalls(() => {
@@ -130,32 +128,34 @@ function createBaseQuery(options, Observer, queryClient) {
   const createClientSubscriber = () => {
     const obs = observer();
     return obs.subscribe((result) => {
-      queryCore.notifyManager.batchCalls(() => {
-        const reconcileOptions = obs.options.reconcile;
-        if (!queryResource.error && queryResource()?.data && result.data && !queryResource.loading) {
-          setState((store) => {
-            return reconcileFn(
-              store,
-              result,
-              reconcileOptions === void 0 ? false : reconcileOptions
-            );
-          });
-          mutate(state);
-        } else {
-          setState((store) => {
-            return reconcileFn(
-              store,
-              result,
-              reconcileOptions === void 0 ? false : reconcileOptions
-            );
-          });
-          refetch();
-        }
-      })();
+      observerResult = result;
+      queueMicrotask(() => refetch());
     });
   };
+  function setStateWithReconciliation(res) {
+    const reconcileOptions = observer().options.reconcile;
+    setState((store) => {
+      return reconcileFn(
+        store,
+        res,
+        reconcileOptions === void 0 ? false : reconcileOptions
+      );
+    });
+  }
+  function createDeepSignal() {
+    return [
+      () => state,
+      (v) => {
+        const unwrapped = store.unwrap(state);
+        if (typeof v === "function") {
+          v = v(unwrapped);
+        }
+        setStateWithReconciliation(v);
+      }
+    ];
+  }
   let unsubscribe = null;
-  const [queryResource, { refetch, mutate }] = solidJs.createResource(
+  const [queryResource, { refetch }] = solidJs.createResource(
     () => {
       const obs = observer();
       return new Promise((resolve, reject) => {
@@ -165,18 +165,16 @@ function createBaseQuery(options, Observer, queryClient) {
           unsubscribe = createClientSubscriber();
         }
         obs.updateResult();
-        if (!state.isLoading) {
+        if (!observerResult.isLoading) {
           const query = obs.getCurrentQuery();
-          resolve(hydratableObserverResult(query, state));
+          resolve(hydratableObserverResult(query, observerResult));
+        } else {
+          setStateWithReconciliation(observerResult);
         }
       });
     },
     {
-      initialValue: state,
-      // If initialData is provided, we resolve the resource immediately
-      get ssrLoadFrom() {
-        return options().initialData ? "initial" : "server";
-      },
+      storage: createDeepSignal,
       get deferStream() {
         return options().deferStream;
       },
@@ -254,7 +252,7 @@ function createBaseQuery(options, Observer, queryClient) {
       [observer, defaultedOptions],
       ([obs, opts]) => {
         obs.setOptions(opts);
-        setState(obs.getOptimisticResult(opts));
+        setStateWithReconciliation(obs.getOptimisticResult(opts));
       },
       { defer: true }
     )
@@ -275,8 +273,14 @@ function createBaseQuery(options, Observer, queryClient) {
   );
   const handler = {
     get(target, prop) {
-      const val = queryResource()?.[prop];
-      return val !== void 0 ? val : Reflect.get(target, prop);
+      if (prop === "data") {
+        const opts = observer().options;
+        if (opts.placeholderData) {
+          return queryResource.latest?.data;
+        }
+        return queryResource()?.data;
+      }
+      return Reflect.get(target, prop);
     }
   };
   return new Proxy(state, handler);

package/build/index.js

@@ -1,11 +1,10 @@
-import { notifyManager, QueryClient as QueryClient$1, MutationObserver, replaceEqualDeep, QueriesObserver, hydrate, QueryObserver, InfiniteQueryObserver } from '@tanstack/query-core';
+import { QueryClient as QueryClient$1, MutationObserver, replaceEqualDeep, QueriesObserver, hydrate, QueryObserver, InfiniteQueryObserver, notifyManager } from '@tanstack/query-core';
 export * from '@tanstack/query-core';
-import { batch, createContext, useContext, createRenderEffect, onCleanup, createMemo, createSignal, createComputed, on, createEffect, mergeProps, createResource, onMount } from 'solid-js';
+import { createContext, useContext, createRenderEffect, onCleanup, createMemo, createSignal, createComputed, on, createEffect, mergeProps, createResource, batch, onMount } from 'solid-js';
 import { createComponent, isServer } from 'solid-js/web';
 import { createStore, unwrap, reconcile } from 'solid-js/store';
 
-// src/setBatchUpdatesFn.ts
-notifyManager.setBatchNotifyFunction(batch);
+// src/index.ts
 var QueryClient = class extends QueryClient$1 {
   constructor(config = {}) {
     super(config);
@@ -102,9 +101,8 @@ function createBaseQuery(options, Observer, queryClient) {
   const [observer, setObserver] = createSignal(
     new Observer(client(), defaultedOptions())
   );
-  const [state, setState] = createStore(
-    observer().getOptimisticResult(defaultedOptions())
-  );
+  let observerResult = observer().getOptimisticResult(defaultedOptions());
+  const [state, setState] = createStore(observerResult);
   const createServerSubscriber = (resolve, reject) => {
     return observer().subscribe((result) => {
       notifyManager.batchCalls(() => {
@@ -129,32 +127,34 @@ function createBaseQuery(options, Observer, queryClient) {
   const createClientSubscriber = () => {
     const obs = observer();
     return obs.subscribe((result) => {
-      notifyManager.batchCalls(() => {
-        const reconcileOptions = obs.options.reconcile;
-        if (!queryResource.error && queryResource()?.data && result.data && !queryResource.loading) {
-          setState((store) => {
-            return reconcileFn(
-              store,
-              result,
-              reconcileOptions === void 0 ? false : reconcileOptions
-            );
-          });
-          mutate(state);
-        } else {
-          setState((store) => {
-            return reconcileFn(
-              store,
-              result,
-              reconcileOptions === void 0 ? false : reconcileOptions
-            );
-          });
-          refetch();
-        }
-      })();
+      observerResult = result;
+      queueMicrotask(() => refetch());
     });
   };
+  function setStateWithReconciliation(res) {
+    const reconcileOptions = observer().options.reconcile;
+    setState((store) => {
+      return reconcileFn(
+        store,
+        res,
+        reconcileOptions === void 0 ? false : reconcileOptions
+      );
+    });
+  }
+  function createDeepSignal() {
+    return [
+      () => state,
+      (v) => {
+        const unwrapped = unwrap(state);
+        if (typeof v === "function") {
+          v = v(unwrapped);
+        }
+        setStateWithReconciliation(v);
+      }
+    ];
+  }
   let unsubscribe = null;
-  const [queryResource, { refetch, mutate }] = createResource(
+  const [queryResource, { refetch }] = createResource(
     () => {
       const obs = observer();
       return new Promise((resolve, reject) => {
@@ -164,18 +164,16 @@ function createBaseQuery(options, Observer, queryClient) {
           unsubscribe = createClientSubscriber();
         }
         obs.updateResult();
-        if (!state.isLoading) {
+        if (!observerResult.isLoading) {
           const query = obs.getCurrentQuery();
-          resolve(hydratableObserverResult(query, state));
+          resolve(hydratableObserverResult(query, observerResult));
+        } else {
+          setStateWithReconciliation(observerResult);
         }
       });
     },
     {
-      initialValue: state,
-      // If initialData is provided, we resolve the resource immediately
-      get ssrLoadFrom() {
-        return options().initialData ? "initial" : "server";
-      },
+      storage: createDeepSignal,
       get deferStream() {
         return options().deferStream;
       },
@@ -253,7 +251,7 @@ function createBaseQuery(options, Observer, queryClient) {
       [observer, defaultedOptions],
       ([obs, opts]) => {
         obs.setOptions(opts);
-        setState(obs.getOptimisticResult(opts));
+        setStateWithReconciliation(obs.getOptimisticResult(opts));
       },
       { defer: true }
     )
@@ -274,8 +272,14 @@ function createBaseQuery(options, Observer, queryClient) {
   );
   const handler = {
     get(target, prop) {
-      const val = queryResource()?.[prop];
-      return val !== void 0 ? val : Reflect.get(target, prop);
+      if (prop === "data") {
+        const opts = observer().options;
+        if (opts.placeholderData) {
+          return queryResource.latest?.data;
+        }
+        return queryResource()?.data;
+      }
+      return Reflect.get(target, prop);
     }
   };
   return new Proxy(state, handler);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/solid-query",
-  "version": "5.29.3",
+  "version": "5.30.0",
   "description": "Primitives for managing, caching and syncing asynchronous and remote data in Solid",
   "author": "tannerlinsley",
   "license": "MIT",
@@ -39,9 +39,6 @@
       "default": "./build/index.cjs"
     }
   },
-  "sideEffects": [
-    "./src/setBatchUpdatesFn.ts"
-  ],
   "files": [
     "build",
     "src"

package/src/createBaseQuery.ts

@@ -16,7 +16,7 @@ import { useQueryClient } from './QueryClientProvider'
 import { shouldThrowError } from './utils'
 import { useIsRestoring } from './isRestoring'
 import type { CreateBaseQueryOptions } from './types'
-import type { Accessor } from 'solid-js'
+import type { Accessor, Signal } from 'solid-js'
 import type { QueryClient } from './QueryClient'
 import type {
   InfiniteQueryObserverResult,
@@ -144,9 +144,9 @@ export function createBaseQuery<
     new Observer(client(), defaultedOptions()),
   )
 
-  const [state, setState] = createStore<QueryObserverResult<TData, TError>>(
-    observer().getOptimisticResult(defaultedOptions()),
-  )
+  let observerResult = observer().getOptimisticResult(defaultedOptions())
+  const [state, setState] =
+    createStore<QueryObserverResult<TData, TError>>(observerResult)
 
   const createServerSubscriber = (
     resolve: (
@@ -180,49 +180,43 @@ export function createBaseQuery<
   const createClientSubscriber = () => {
     const obs = observer()
     return obs.subscribe((result) => {
-      notifyManager.batchCalls(() => {
-        // @ts-expect-error - This will error because the reconcile option does not
-        // exist on the query-core QueryObserverResult type
-        const reconcileOptions = obs.options.reconcile
+      observerResult = result
+      queueMicrotask(() => refetch())
+    })
+  }
 
-        // If the query has data we don't suspend but instead mutate the resource
-        // This could happen when placeholderData/initialData is defined
-        if (
-          !queryResource.error &&
-          queryResource()?.data &&
-          result.data &&
-          !queryResource.loading
-        ) {
-          setState((store) => {
-            return reconcileFn(
-              store,
-              result,
-              reconcileOptions === undefined ? false : reconcileOptions,
-            )
-          })
-          mutate(state)
-        } else {
-          setState((store) => {
-            return reconcileFn(
-              store,
-              result,
-              reconcileOptions === undefined ? false : reconcileOptions,
-            )
-          })
-          refetch()
-        }
-      })()
+  function setStateWithReconciliation(res: typeof observerResult) {
+    // @ts-expect-error - Reconcile option is not correctly typed internally
+    const reconcileOptions = observer().options.reconcile
+
+    setState((store) => {
+      return reconcileFn(
+        store,
+        res,
+        reconcileOptions === undefined ? false : reconcileOptions,
+      )
     })
   }
 
+  function createDeepSignal<T>(): Signal<T> {
+    return [
+      () => state,
+      (v: T) => {
+        const unwrapped = unwrap(state)
+        if (typeof v === 'function') {
+          v = v(unwrapped)
+        }
+        setStateWithReconciliation(v as any)
+      },
+    ] as Signal<T>
+  }
+
   /**
    * Unsubscribe is set lazily, so that we can subscribe after hydration when needed.
    */
   let unsubscribe: (() => void) | null = null
 
-  const [queryResource, { refetch, mutate }] = createResource<
-    ResourceData | undefined
-  >(
+  const [queryResource, { refetch }] = createResource<ResourceData | undefined>(
     () => {
       const obs = observer()
       return new Promise((resolve, reject) => {
@@ -233,19 +227,16 @@ export function createBaseQuery<
         }
         obs.updateResult()
 
-        if (!state.isLoading) {
+        if (!observerResult.isLoading) {
           const query = obs.getCurrentQuery()
-          resolve(hydratableObserverResult(query, state))
+          resolve(hydratableObserverResult(query, observerResult))
+        } else {
+          setStateWithReconciliation(observerResult)
         }
       })
     },
     {
-      initialValue: state,
-
-      // If initialData is provided, we resolve the resource immediately
-      get ssrLoadFrom() {
-        return options().initialData ? 'initial' : 'server'
-      },
+      storage: createDeepSignal,
 
       get deferStream() {
         return options().deferStream
@@ -338,7 +329,7 @@ export function createBaseQuery<
       [observer, defaultedOptions],
       ([obs, opts]) => {
         obs.setOptions(opts)
-        setState(obs.getOptimisticResult(opts))
+        setStateWithReconciliation(obs.getOptimisticResult(opts))
       },
       { defer: true },
     ),
@@ -369,8 +360,14 @@ export function createBaseQuery<
       target: QueryObserverResult<TData, TError>,
       prop: keyof QueryObserverResult<TData, TError>,
     ): any {
-      const val = queryResource()?.[prop]
-      return val !== undefined ? val : Reflect.get(target, prop)
+      if (prop === 'data') {
+        const opts = observer().options
+        if (opts.placeholderData) {
+          return queryResource.latest?.data
+        }
+        return queryResource()?.data
+      }
+      return Reflect.get(target, prop)
     },
   }
 

package/src/index.ts

@@ -1,8 +1,5 @@
 /* istanbul ignore file */
 
-// Side Effects
-import './setBatchUpdatesFn'
-
 // Re-export core
 export * from '@tanstack/query-core'
 

package/src/setBatchUpdatesFn.ts

@@ -1,4 +0,0 @@
-import { notifyManager } from '@tanstack/query-core'
-import { batch } from 'solid-js'
-
-notifyManager.setBatchNotifyFunction(batch)