@tanstack/solid-query 5.0.0-alpha.85 → 5.0.0-alpha.87

package/build/index.js

@@ -0,0 +1,338 @@
+import { notifyManager, QueryClient as QueryClient$1, MutationObserver, QueriesObserver, hydrate, QueryObserver, InfiniteQueryObserver } from '@tanstack/query-core';
+export * from '@tanstack/query-core';
+import { batch, createContext, useContext, onMount, onCleanup, createMemo, createSignal, createComputed, on, createResource } from 'solid-js';
+import { createComponent, isServer } from 'solid-js/web';
+import { createStore, unwrap, reconcile } from 'solid-js/store';
+
+// src/setBatchUpdatesFn.ts
+notifyManager.setBatchNotifyFunction(batch);
+var QueryClient = class extends QueryClient$1 {
+  constructor(config = {}) {
+    super(config);
+  }
+};
+var QueryClientContext = createContext(void 0);
+var useQueryClient = (queryClient) => {
+  if (queryClient) {
+    return queryClient;
+  }
+  const client = useContext(QueryClientContext);
+  if (!client) {
+    throw new Error("No QueryClient set, use QueryClientProvider to set one");
+  }
+  return client;
+};
+var QueryClientProvider = (props) => {
+  onMount(() => {
+    props.client.mount();
+  });
+  onCleanup(() => props.client.unmount());
+  return createComponent(QueryClientContext.Provider, {
+    get value() {
+      return props.client;
+    },
+    get children() {
+      return props.children;
+    }
+  });
+};
+
+// src/utils.ts
+function shouldThrowError(throwError, params) {
+  if (typeof throwError === "function") {
+    return throwError(...params);
+  }
+  return !!throwError;
+}
+
+// src/createBaseQuery.ts
+function reconcileFn(store, result, reconcileOption) {
+  if (reconcileOption === false)
+    return result;
+  if (typeof reconcileOption === "function") {
+    const newData2 = reconcileOption(store.data, result.data);
+    return { ...result, data: newData2 };
+  }
+  const newData = reconcile(result.data, { key: reconcileOption })(store.data);
+  return { ...result, data: newData };
+}
+function createBaseQuery(options, Observer, queryClient) {
+  const client = createMemo(() => useQueryClient(queryClient?.()));
+  const defaultedOptions = client().defaultQueryOptions(options());
+  defaultedOptions._optimisticResults = "optimistic";
+  defaultedOptions.structuralSharing = false;
+  if (isServer) {
+    defaultedOptions.retry = false;
+    defaultedOptions.throwOnError = true;
+  }
+  const observer = new Observer(client(), defaultedOptions);
+  const [state, setState] = createStore(
+    observer.getOptimisticResult(defaultedOptions)
+  );
+  const createServerSubscriber = (resolve, reject) => {
+    return observer.subscribe((result) => {
+      notifyManager.batchCalls(() => {
+        const query = observer.getCurrentQuery();
+        const { refetch: refetch2, ...rest } = unwrap(result);
+        const unwrappedResult = {
+          ...rest,
+          // hydrate() expects a QueryState object, which is similar but not
+          // quite the same as a QueryObserverResult object. Thus, for now, we're
+          // copying over the missing properties from state in order to support hydration
+          dataUpdateCount: query.state.dataUpdateCount,
+          fetchFailureCount: query.state.fetchFailureCount,
+          // Removing these properties since they might not be serializable
+          // fetchFailureReason: query.state.fetchFailureReason,
+          // fetchMeta: query.state.fetchMeta,
+          isInvalidated: query.state.isInvalidated
+        };
+        if (unwrappedResult.isError) {
+          reject(unwrappedResult.error);
+        }
+        if (unwrappedResult.isSuccess) {
+          resolve(unwrappedResult);
+        }
+      })();
+    });
+  };
+  const createClientSubscriber = () => {
+    return observer.subscribe((result) => {
+      notifyManager.batchCalls(() => {
+        const reconcileOptions = observer.options.reconcile;
+        if (queryResource()?.data && result.data && !queryResource.loading) {
+          setState((store) => {
+            return reconcileFn(
+              store,
+              result,
+              reconcileOptions === void 0 ? "id" : reconcileOptions
+            );
+          });
+          mutate(state);
+        } else {
+          setState((store) => {
+            return reconcileFn(
+              store,
+              result,
+              reconcileOptions === void 0 ? "id" : reconcileOptions
+            );
+          });
+          refetch();
+        }
+      })();
+    });
+  };
+  let unsubscribe = null;
+  const [queryResource, { refetch, mutate }] = createResource(
+    () => {
+      return new Promise((resolve, reject) => {
+        if (isServer) {
+          unsubscribe = createServerSubscriber(resolve, reject);
+        } else {
+          if (!unsubscribe) {
+            unsubscribe = createClientSubscriber();
+          }
+        }
+        if (!state.isLoading) {
+          resolve(state);
+        }
+      });
+    },
+    {
+      initialValue: state,
+      // If initialData is provided, we resolve the resource immediately
+      ssrLoadFrom: options().initialData ? "initial" : "server",
+      get deferStream() {
+        return options().deferStream;
+      },
+      /**
+       * If this resource was populated on the server (either sync render, or streamed in over time), onHydrated
+       * will be called. This is the point at which we can hydrate the query cache state, and setup the query subscriber.
+       *
+       * Leveraging onHydrated allows us to plug into the async and streaming support that solidjs resources already support.
+       *
+       * Note that this is only invoked on the client, for queries that were originally run on the server.
+       */
+      onHydrated(_k, info) {
+        if (info.value) {
+          hydrate(client(), {
+            queries: [
+              {
+                queryKey: defaultedOptions.queryKey,
+                queryHash: defaultedOptions.queryHash,
+                state: info.value
+              }
+            ]
+          });
+        }
+        if (!unsubscribe) {
+          const newOptions = { ...defaultedOptions };
+          if (defaultedOptions.staleTime || !defaultedOptions.initialData) {
+            newOptions.refetchOnMount = false;
+          }
+          observer.setOptions(newOptions);
+          setState(observer.getOptimisticResult(newOptions));
+          unsubscribe = createClientSubscriber();
+        }
+      }
+    }
+  );
+  onCleanup(() => {
+    if (unsubscribe) {
+      unsubscribe();
+      unsubscribe = null;
+    }
+  });
+  createComputed(
+    on(
+      () => client().defaultQueryOptions(options()),
+      () => observer.setOptions(client().defaultQueryOptions(options())),
+      {
+        // Defer because we don't need to trigger on first render
+        // This only cares about changes to options after the observer is created
+        defer: true
+      }
+    )
+  );
+  createComputed(
+    on(
+      () => state.status,
+      () => {
+        if (state.isError && !state.isFetching && shouldThrowError(observer.options.throwOnError, [
+          state.error,
+          observer.getCurrentQuery()
+        ])) {
+          throw state.error;
+        }
+      }
+    )
+  );
+  const handler = {
+    get(target, prop) {
+      const val = queryResource()?.[prop];
+      return val !== void 0 ? val : Reflect.get(target, prop);
+    }
+  };
+  return new Proxy(state, handler);
+}
+
+// src/createQuery.ts
+function queryOptions(options) {
+  return options;
+}
+function createQuery(options, queryClient) {
+  return createBaseQuery(
+    createMemo(() => options()),
+    QueryObserver,
+    queryClient
+  );
+}
+function useIsFetching(filters, queryClient) {
+  const client = createMemo(() => useQueryClient(queryClient?.()));
+  const queryCache = createMemo(() => client().getQueryCache());
+  const [fetches, setFetches] = createSignal(client().isFetching(filters?.()));
+  const unsubscribe = queryCache().subscribe(() => {
+    setFetches(client().isFetching(filters?.()));
+  });
+  onCleanup(unsubscribe);
+  return fetches;
+}
+function createInfiniteQuery(options, queryClient) {
+  return createBaseQuery(
+    createMemo(() => options()),
+    // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
+    InfiniteQueryObserver,
+    queryClient
+  );
+}
+function createMutation(options, queryClient) {
+  const client = useQueryClient(queryClient?.());
+  const observer = new MutationObserver(
+    client,
+    options()
+  );
+  const mutate = (variables, mutateOptions) => {
+    observer.mutate(variables, mutateOptions).catch(noop);
+  };
+  const [state, setState] = createStore({
+    ...observer.getCurrentResult(),
+    mutate,
+    mutateAsync: observer.getCurrentResult().mutate
+  });
+  createComputed(() => {
+    observer.setOptions(options());
+  });
+  createComputed(
+    on(
+      () => state.status,
+      () => {
+        if (state.isError && shouldThrowError(observer.options.throwOnError, [state.error])) {
+          throw state.error;
+        }
+      }
+    )
+  );
+  const unsubscribe = observer.subscribe((result) => {
+    setState({
+      ...result,
+      mutate,
+      mutateAsync: result.mutate
+    });
+  });
+  onCleanup(unsubscribe);
+  return state;
+}
+function noop() {
+}
+function useIsMutating(filters, queryClient) {
+  const client = createMemo(() => useQueryClient(queryClient?.()));
+  const mutationCache = createMemo(() => client().getMutationCache());
+  const [mutations, setMutations] = createSignal(
+    client().isMutating(filters?.())
+  );
+  const unsubscribe = mutationCache().subscribe((_result) => {
+    setMutations(client().isMutating(filters?.()));
+  });
+  onCleanup(unsubscribe);
+  return mutations;
+}
+function createQueries(queriesOptions, queryClient) {
+  const client = useQueryClient(queryClient?.());
+  const defaultedQueries = queriesOptions().queries.map((options) => {
+    const defaultedOptions = client.defaultQueryOptions(options);
+    defaultedOptions._optimisticResults = "optimistic";
+    return defaultedOptions;
+  });
+  const observer = new QueriesObserver(
+    client,
+    defaultedQueries,
+    queriesOptions().combine ? {
+      combine: queriesOptions().combine
+    } : void 0
+  );
+  const [state, setState] = createStore(
+    observer.getOptimisticResult(defaultedQueries)[1]()
+  );
+  const unsubscribe = observer.subscribe((result) => {
+    notifyManager.batchCalls(() => {
+      setState(unwrap(result));
+    })();
+  });
+  onCleanup(unsubscribe);
+  createComputed(() => {
+    const updatedQueries = queriesOptions().queries.map((options) => {
+      const defaultedOptions = client.defaultQueryOptions(options);
+      defaultedOptions._optimisticResults = "optimistic";
+      return defaultedOptions;
+    });
+    observer.setQueries(
+      updatedQueries,
+      queriesOptions().combine ? {
+        combine: queriesOptions().combine
+      } : void 0,
+      { listeners: false }
+    );
+  });
+  return state;
+}
+
+export { QueryClient, QueryClientContext, QueryClientProvider, createInfiniteQuery, createMutation, createQueries, createQuery, queryOptions, useIsFetching, useIsMutating, useQueryClient };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/solid-query",
-  "version": "5.0.0-alpha.85",
+  "version": "5.0.0-alpha.87",
   "description": "Primitives for managing, caching and syncing asynchronous and remote data in Solid",
   "author": "tannerlinsley",
   "license": "MIT",
@@ -11,46 +11,52 @@
     "url": "https://github.com/sponsors/tannerlinsley"
   },
   "type": "module",
-  "types": "dist/types/index.d.ts",
-  "main": "dist/cjs/index.cjs",
-  "module": "dist/esm/index.js",
+  "main": "./build/index.cjs",
+  "module": "./build/index.js",
+  "types": "./build/index.d.ts",
+  "browser": {},
   "exports": {
-    ".": {
-      "types": "./dist/types/index.d.ts",
-      "solid": "./dist/source/index.js",
-      "import": "./dist/esm/index.js",
-      "browser": {
-        "import": "./dist/esm/index.js",
-        "require": "./dist/cjs/index.cjs"
+    "solid": {
+      "development": "./build/dev.js",
+      "import": "./build/index.js"
+    },
+    "development": {
+      "import": {
+        "types": "./build/index.d.ts",
+        "default": "./build/dev.js"
       },
-      "require": "./dist/cjs/index.cjs",
-      "node": "./dist/cjs/index.cjs"
+      "require": "./build/dev.cjs"
+    },
+    "import": {
+      "types": "./build/index.d.ts",
+      "default": "./build/index.js"
     },
-    "./package.json": "./package.json"
+    "require": "./build/index.cjs"
   },
   "sideEffects": [
     "./src/setBatchUpdatesFn.ts"
   ],
   "files": [
-    "dist",
+    "build",
     "src"
   ],
   "dependencies": {
-    "@tanstack/query-core": "5.0.0-alpha.85"
+    "@tanstack/query-core": "5.0.0-alpha.87"
   },
   "devDependencies": {
+    "tsup-preset-solid": "^0.1.8",
     "vite-plugin-solid": "^2.5.0"
   },
   "peerDependencies": {
     "solid-js": "^1.6.13"
   },
   "scripts": {
-    "clean": "rimraf ./dist && rimraf ./coverage",
+    "clean": "rimraf ./build && rimraf ./coverage",
     "test:eslint": "eslint --ext .ts,.tsx ./src",
     "test:types": "tsc --noEmit",
     "test:lib": "vitest run --coverage",
     "test:lib:dev": "pnpm run test:lib --watch",
     "test:build": "publint --strict",
-    "build": "rollup --config rollup.config.js"
+    "build": "tsup"
   }
 }

package/src/__tests__/createMutation.test.tsx

@@ -15,7 +15,7 @@ import {
 } from '..'
 import {
   createQueryClient,
-  mockNavigatorOnLine,
+  mockOnlineManagerIsOnline,
   queryKey,
   setActTimeout,
   sleep,
@@ -495,7 +495,7 @@ describe('createMutation', () => {
   })
 
   it('should not retry mutations while offline', async () => {
-    const onlineMock = mockNavigatorOnLine(false)
+    const onlineMock = mockOnlineManagerIsOnline(false)
 
     let count = 0
 
@@ -535,6 +535,8 @@ describe('createMutation', () => {
       ).toBeInTheDocument()
     })
 
+    window.dispatchEvent(new Event('offline'))
+
     fireEvent.click(screen.getByRole('button', { name: /mutate/i }))
 
     await waitFor(() => {
@@ -545,7 +547,7 @@ describe('createMutation', () => {
 
     expect(count).toBe(0)
 
-    onlineMock.mockReturnValue(true)
+    onlineMock.mockRestore()
     window.dispatchEvent(new Event('online'))
 
     await sleep(100)
@@ -557,12 +559,10 @@ describe('createMutation', () => {
     })
 
     expect(count).toBe(2)
-
-    onlineMock.mockRestore()
   })
 
   it('should call onMutate even if paused', async () => {
-    const onlineMock = mockNavigatorOnLine(false)
+    const onlineMock = mockOnlineManagerIsOnline(false)
     const onMutate = vi.fn()
     let count = 0
 
@@ -595,6 +595,8 @@ describe('createMutation', () => {
 
     await screen.findByText('data: null, status: idle, isPaused: false')
 
+    window.dispatchEvent(new Event('offline'))
+
     fireEvent.click(screen.getByRole('button', { name: /mutate/i }))
 
     await screen.findByText('data: null, status: pending, isPaused: true')
@@ -602,19 +604,17 @@ describe('createMutation', () => {
     expect(onMutate).toHaveBeenCalledTimes(1)
     expect(onMutate).toHaveBeenCalledWith('todo')
 
-    onlineMock.mockReturnValue(true)
+    onlineMock.mockRestore()
     window.dispatchEvent(new Event('online'))
 
     await screen.findByText('data: 1, status: success, isPaused: false')
 
     expect(onMutate).toHaveBeenCalledTimes(1)
     expect(count).toBe(1)
-
-    onlineMock.mockRestore()
   })
 
   it('should optimistically go to paused state if offline', async () => {
-    const onlineMock = mockNavigatorOnLine(false)
+    const onlineMock = mockOnlineManagerIsOnline(false)
     let count = 0
     const states: Array<string> = []
 
@@ -667,7 +667,7 @@ describe('createMutation', () => {
   })
 
   it('should be able to retry a mutation when online', async () => {
-    const onlineMock = mockNavigatorOnLine(false)
+    const onlineMock = mockOnlineManagerIsOnline(false)
 
     let count = 0
     const states: CreateMutationResult<any, any, any, any>[] = []
@@ -693,6 +693,7 @@ describe('createMutation', () => {
       createEffect(() => {
         const { mutate } = mutation
         setActTimeout(() => {
+          window.dispatchEvent(new Event('offline'))
           mutate('todo')
         }, 10)
       })
@@ -734,7 +735,7 @@ describe('createMutation', () => {
       failureReason: new Error('oops'),
     })
 
-    onlineMock.mockReturnValue(true)
+    onlineMock.mockRestore()
     window.dispatchEvent(new Event('online'))
 
     await sleep(50)
@@ -753,8 +754,6 @@ describe('createMutation', () => {
       failureReason: null,
       data: 'data',
     })
-
-    onlineMock.mockRestore()
   })
 
   it('should not change state if unmounted', async () => {