@tanstack/solid-query 5.29.3 → 5.30.1

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,22 @@ function createBaseQuery(options, Observer, queryClient) {
           unsubscribe = createClientSubscriber();
         }
         obs.updateResult();
-        if (!state.isLoading) {
+        if (observerResult.isError && !observerResult.isFetching && !isRestoring() && shouldThrowError(obs.options.throwOnError, [
+          observerResult.error,
+          obs.getCurrentQuery()
+        ])) {
+          setStateWithReconciliation(observerResult);
+          return reject(observerResult.error);
+        }
+        if (!observerResult.isLoading) {
           const query = obs.getCurrentQuery();
-          resolve(hydratableObserverResult(query, state));
+          return resolve(hydratableObserverResult(query, observerResult));
         }
+        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,29 +258,21 @@ function createBaseQuery(options, Observer, queryClient) {
       [observer, defaultedOptions],
       ([obs, opts]) => {
         obs.setOptions(opts);
-        setState(obs.getOptimisticResult(opts));
+        setStateWithReconciliation(obs.getOptimisticResult(opts));
       },
       { defer: true }
     )
   );
-  solidJs.createComputed(
-    solidJs.on(
-      () => state.status,
-      () => {
-        const obs = observer();
-        if (state.isError && !state.isFetching && !isRestoring() && shouldThrowError(obs.options.throwOnError, [
-          state.error,
-          obs.getCurrentQuery()
-        ])) {
-          throw state.error;
-        }
-      }
-    )
-  );
   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,22 @@ function createBaseQuery(options, Observer, queryClient) {
           unsubscribe = createClientSubscriber();
         }
         obs.updateResult();
-        if (!state.isLoading) {
+        if (observerResult.isError && !observerResult.isFetching && !isRestoring() && shouldThrowError(obs.options.throwOnError, [
+          observerResult.error,
+          obs.getCurrentQuery()
+        ])) {
+          setStateWithReconciliation(observerResult);
+          return reject(observerResult.error);
+        }
+        if (!observerResult.isLoading) {
           const query = obs.getCurrentQuery();
-          resolve(hydratableObserverResult(query, state));
+          return resolve(hydratableObserverResult(query, observerResult));
         }
+        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,29 +257,21 @@ function createBaseQuery(options, Observer, queryClient) {
       [observer, defaultedOptions],
       ([obs, opts]) => {
         obs.setOptions(opts);
-        setState(obs.getOptimisticResult(opts));
+        setStateWithReconciliation(obs.getOptimisticResult(opts));
       },
       { defer: true }
     )
   );
-  createComputed(
-    on(
-      () => state.status,
-      () => {
-        const obs = observer();
-        if (state.isError && !state.isFetching && !isRestoring() && shouldThrowError(obs.options.throwOnError, [
-          state.error,
-          obs.getCurrentQuery()
-        ])) {
-          throw state.error;
-        }
-      }
-    )
-  );
   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,22 @@ function createBaseQuery(options, Observer, queryClient) {
           unsubscribe = createClientSubscriber();
         }
         obs.updateResult();
-        if (!state.isLoading) {
+        if (observerResult.isError && !observerResult.isFetching && !isRestoring() && shouldThrowError(obs.options.throwOnError, [
+          observerResult.error,
+          obs.getCurrentQuery()
+        ])) {
+          setStateWithReconciliation(observerResult);
+          return reject(observerResult.error);
+        }
+        if (!observerResult.isLoading) {
           const query = obs.getCurrentQuery();
-          resolve(hydratableObserverResult(query, state));
+          return resolve(hydratableObserverResult(query, observerResult));
         }
+        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,29 +258,21 @@ function createBaseQuery(options, Observer, queryClient) {
       [observer, defaultedOptions],
       ([obs, opts]) => {
         obs.setOptions(opts);
-        setState(obs.getOptimisticResult(opts));
+        setStateWithReconciliation(obs.getOptimisticResult(opts));
       },
       { defer: true }
     )
   );
-  solidJs.createComputed(
-    solidJs.on(
-      () => state.status,
-      () => {
-        const obs = observer();
-        if (state.isError && !state.isFetching && !isRestoring() && shouldThrowError(obs.options.throwOnError, [
-          state.error,
-          obs.getCurrentQuery()
-        ])) {
-          throw state.error;
-        }
-      }
-    )
-  );
   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,22 @@ function createBaseQuery(options, Observer, queryClient) {
           unsubscribe = createClientSubscriber();
         }
         obs.updateResult();
-        if (!state.isLoading) {
+        if (observerResult.isError && !observerResult.isFetching && !isRestoring() && shouldThrowError(obs.options.throwOnError, [
+          observerResult.error,
+          obs.getCurrentQuery()
+        ])) {
+          setStateWithReconciliation(observerResult);
+          return reject(observerResult.error);
+        }
+        if (!observerResult.isLoading) {
           const query = obs.getCurrentQuery();
-          resolve(hydratableObserverResult(query, state));
+          return resolve(hydratableObserverResult(query, observerResult));
         }
+        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,29 +257,21 @@ function createBaseQuery(options, Observer, queryClient) {
       [observer, defaultedOptions],
       ([obs, opts]) => {
         obs.setOptions(opts);
-        setState(obs.getOptimisticResult(opts));
+        setStateWithReconciliation(obs.getOptimisticResult(opts));
       },
       { defer: true }
     )
   );
-  createComputed(
-    on(
-      () => state.status,
-      () => {
-        const obs = observer();
-        if (state.isError && !state.isFetching && !isRestoring() && shouldThrowError(obs.options.throwOnError, [
-          state.error,
-          obs.getCurrentQuery()
-        ])) {
-          throw state.error;
-        }
-      }
-    )
-  );
   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.1",
   "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/__tests__/createQuery.test.tsx

@@ -2407,6 +2407,7 @@ describe('createQuery', () => {
 
       return (
         <div>
+          <h1>{state.data}</h1>
           <h1>{state.status}</h1>
           <h2>{state.error?.message}</h2>
         </div>
@@ -2426,6 +2427,124 @@ describe('createQuery', () => {
     consoleMock.mockRestore()
   })
 
+  it('should throw error inside the same component if queryFn throws and throwOnError is in use', async () => {
+    const key = queryKey()
+
+    const consoleMock = vi
+      .spyOn(console, 'error')
+      .mockImplementation(() => undefined)
+
+    function Page() {
+      const state = createQuery(() => ({
+        queryKey: key,
+        queryFn: () => Promise.reject(new Error('Error test')),
+        retry: false,
+        throwOnError: true,
+      }))
+
+      return (
+        <div>
+          <ErrorBoundary fallback={() => <div>error boundary</div>}>
+            <h1>{state.data}</h1>
+            <h1>{state.status}</h1>
+            <h2>{state.error?.message}</h2>
+          </ErrorBoundary>
+        </div>
+      )
+    }
+
+    const rendered = render(() => (
+      <QueryClientProvider client={queryClient}>
+        <Page />
+      </QueryClientProvider>
+    ))
+
+    await waitFor(() => rendered.getByText('error boundary'))
+
+    consoleMock.mockRestore()
+  })
+
+  it('should throw error inside the same component if queryFn throws and show the correct error message', async () => {
+    const key = queryKey()
+
+    const consoleMock = vi
+      .spyOn(console, 'error')
+      .mockImplementation(() => undefined)
+
+    function Page() {
+      const state = createQuery(() => ({
+        queryKey: key,
+        queryFn: () => Promise.reject(new Error('Error test')),
+        retry: false,
+        throwOnError: true,
+      }))
+
+      return (
+        <div>
+          <ErrorBoundary
+            fallback={(err) => <div>Fallback error: {err.message}</div>}
+          >
+            <h1>{state.data}</h1>
+            <h1>{state.status}</h1>
+            <h2>{state.error?.message}</h2>
+          </ErrorBoundary>
+        </div>
+      )
+    }
+
+    const rendered = render(() => (
+      <QueryClientProvider client={queryClient}>
+        <Page />
+      </QueryClientProvider>
+    ))
+
+    await waitFor(() => rendered.getByText('Fallback error: Error test'))
+
+    consoleMock.mockRestore()
+  })
+
+  it('should show the correct error message on the error property when accessed outside error boundary', async () => {
+    const key = queryKey()
+
+    const consoleMock = vi
+      .spyOn(console, 'error')
+      .mockImplementation(() => undefined)
+
+    function Page() {
+      const state = createQuery(() => ({
+        queryKey: key,
+        queryFn: () => Promise.reject(new Error('Error test')),
+        retry: false,
+        throwOnError: true,
+      }))
+
+      return (
+        <div>
+          <h2>Outside error boundary: {state.error?.message}</h2>
+          <ErrorBoundary
+            fallback={(err) => <div>Fallback error: {err.message}</div>}
+          >
+            <h1>{state.data}</h1>
+            <h1>{state.status}</h1>
+          </ErrorBoundary>
+        </div>
+      )
+    }
+
+    const rendered = render(() => (
+      <QueryClientProvider client={queryClient}>
+        <Page />
+      </QueryClientProvider>
+    ))
+
+    await waitFor(() =>
+      rendered.getByText('Outside error boundary: Error test'),
+    )
+    await waitFor(() => rendered.getByText('Fallback error: Error test'))
+
+    consoleMock.mockRestore()
+  })
+
   it('should update with data if we observe no properties and throwOnError', async () => {
     const key = queryKey()
 
@@ -2491,7 +2610,7 @@ describe('createQuery', () => {
     const key = queryKey()
 
     function Page() {
-      const state = createQuery<unknown, Error>(() => ({
+      const state = createQuery(() => ({
         queryKey: key,
         queryFn: () => Promise.reject(new Error('Remote Error')),
         retry: false,
@@ -2500,6 +2619,7 @@ describe('createQuery', () => {
 
       return (
         <div>
+          <div>{state.data}</div>
           <h1>{state.status}</h1>
           <h2>{state.error?.message ?? ''}</h2>
         </div>

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,28 @@ export function createBaseQuery<
         }
         obs.updateResult()
 
-        if (!state.isLoading) {
+        if (
+          observerResult.isError &&
+          !observerResult.isFetching &&
+          !isRestoring() &&
+          shouldThrowError(obs.options.throwOnError, [
+            observerResult.error,
+            obs.getCurrentQuery(),
+          ])
+        ) {
+          setStateWithReconciliation(observerResult)
+          return reject(observerResult.error)
+        }
+        if (!observerResult.isLoading) {
           const query = obs.getCurrentQuery()
-          resolve(hydratableObserverResult(query, state))
+          return resolve(hydratableObserverResult(query, observerResult))
         }
+
+        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,39 +341,25 @@ export function createBaseQuery<
       [observer, defaultedOptions],
       ([obs, opts]) => {
         obs.setOptions(opts)
-        setState(obs.getOptimisticResult(opts))
+        setStateWithReconciliation(obs.getOptimisticResult(opts))
       },
       { defer: true },
     ),
   )
 
-  createComputed(
-    on(
-      () => state.status,
-      () => {
-        const obs = observer()
-        if (
-          state.isError &&
-          !state.isFetching &&
-          !isRestoring() &&
-          shouldThrowError(obs.options.throwOnError, [
-            state.error,
-            obs.getCurrentQuery(),
-          ])
-        ) {
-          throw state.error
-        }
-      },
-    ),
-  )
-
   const handler = {
     get(
       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)