diff --git a/README.md b/README.md index 70dcba8ac7..5c806154fb 100644 --- a/README.md +++ b/README.md @@ -49,4 +49,4 @@ Still on **React Query v4**? No problem! Check out the v4 docs here: https://tan ### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/) - + diff --git a/docs/config.json b/docs/config.json index fc43b4ea86..542ecbd78a 100644 --- a/docs/config.json +++ b/docs/config.json @@ -58,9 +58,21 @@ "label": "Overview", "to": "framework/solid/overview" }, + { + "label": "Quick Start", + "to": "framework/solid/quick-start" + }, + { + "label": "Installation", + "to": "framework/solid/installation" + }, { "label": "Devtools", "to": "framework/solid/devtools" + }, + { + "label": "TypeScript", + "to": "framework/solid/typescript" } ] }, diff --git a/docs/framework/angular/guides/disabling-queries.md b/docs/framework/angular/guides/disabling-queries.md index 8d707e235f..39b5408586 100644 --- a/docs/framework/angular/guides/disabling-queries.md +++ b/docs/framework/angular/guides/disabling-queries.md @@ -85,7 +85,7 @@ export class TodosComponent { todosQuery = injectQuery(() => ({ queryKey: ['todos', this.filter()], - queryFn: this.filter ? () => fetchTodos(this.filter()) : skipToken, + queryFn: this.filter() ? () => fetchTodos(this.filter()) : skipToken, })) } ``` diff --git a/docs/framework/react/plugins/createSyncStoragePersister.md b/docs/framework/react/plugins/createSyncStoragePersister.md index bf5bfc921b..087ebf9419 100644 --- a/docs/framework/react/plugins/createSyncStoragePersister.md +++ b/docs/framework/react/plugins/createSyncStoragePersister.md @@ -130,7 +130,7 @@ The default options are: #### `serialize` and `deserialize` options There is a limit to the amount of data which can be stored in `localStorage`. -If you need to store more data in `localStorage`, you can override the `serialize` and `deserialize` functions to compress and decrompress the data using a library like [lz-string](https://github.com/pieroxy/lz-string/). +If you need to store more data in `localStorage`, you can override the `serialize` and `deserialize` functions to compress and decompress the data using a library like [lz-string](https://github.com/pieroxy/lz-string/). ```tsx import { QueryClient } from '@tanstack/react-query' diff --git a/docs/framework/solid/devtools.md b/docs/framework/solid/devtools.md index a087d3ed79..530ccb81ee 100644 --- a/docs/framework/solid/devtools.md +++ b/docs/framework/solid/devtools.md @@ -7,8 +7,6 @@ Wave your hands in the air and shout hooray because Solid Query comes with dedic When you begin your Solid Query journey, you'll want these devtools by your side. They help visualize all of the inner workings of Solid Query and will likely save you hours of debugging if you find yourself in a pinch! -> Also note that you can use these devtools to observe queries, but **not mutations** (yet). - ## Install and Import the Devtools The devtools are a separate package that you need to install: @@ -29,7 +27,7 @@ You can import the devtools like this: import { SolidQueryDevtools } from '@tanstack/solid-query-devtools' ``` -By default, Solid Query Devtools are only included in bundles when `process.env.NODE_ENV === 'development'`, so you don't need to worry about excluding them during a production build. +By default, Solid Query Devtools are only included in bundles when `isServer === true` ([`isServer`](https://github.com/solidjs/solid/blob/a72d393a07b22f9b7496e5eb93712188ccce0d28/packages/solid/web/src/index.ts#L37) comes from the `solid-js/web` package), so you don't need to worry about excluding them during a production build. ## Floating Mode diff --git a/docs/framework/solid/installation.md b/docs/framework/solid/installation.md new file mode 100644 index 0000000000..c3660061b8 --- /dev/null +++ b/docs/framework/solid/installation.md @@ -0,0 +1,47 @@ +--- +id: installation +title: Installation +--- + +You can install Solid Query via [NPM](https://npmjs.com/), +or a good ol' ` +``` + +### Requirements + +Solid Query is optimized for modern browsers. It is compatible with the following browsers config + +``` +Chrome >= 91 +Firefox >= 90 +Edge >= 91 +Safari >= 15 +iOS >= 15 +Opera >= 77 +``` + +> Depending on your environment, you might need to add polyfills. If you want to support older browsers, you need to transpile the library from `node_modules` yourselves. diff --git a/docs/framework/solid/overview.md b/docs/framework/solid/overview.md index 5c504bce52..2b28496858 100644 --- a/docs/framework/solid/overview.md +++ b/docs/framework/solid/overview.md @@ -1,231 +1,137 @@ --- id: overview -title: Solid Query +title: Overview --- -The `@tanstack/solid-query` package provides a 1st-class API for using TanStack Query with SolidJS. +Solid Query is the official SolidJS adapter of TanStack Query that makes **fetching, caching, synchronizing and updating server state** in your web applications a breeze. -## Example +## Motivation -```tsx -import { - QueryClient, - QueryClientProvider, - createQuery, -} from '@tanstack/solid-query' -import { Switch, Match, For } from 'solid-js' +SolidJS has been gaining popularity as a fast, reactive, and declarative library for building user interfaces. It comes packed with a lot of features out of the box. Primitives like `createSignal`, `createStore` are great for managing client state. And, unlike other UI libraries, SolidJS has strong opinions about managing asynchronous data. The `createResource` API is a great primitive for handling server state in SolidJS apps. A `resource` is a special kind of signal that can be used to trigger `Suspense` boundaries when the data is in a loading state. -const queryClient = new QueryClient() +```tsx +import { createResource, ErrorBoundary, Suspense } from 'solid-js' -function Example() { - const query = createQuery(() => ({ - queryKey: ['todos'], - queryFn: fetchTodos, - })) +function App() { + const [repository] = createResource(async () => { + const result = await fetch('https://api.github.com/repos/TanStack/query') + if (!result.ok) throw new Error('Failed to fetch data') + return result.json() + }) return (
- - -

Loading...

- - -

Error: {query.error.message}

- - - {(todo) =>

{todo.title}

} - - +
Static Content
+ {/* An error while fetching will be caught by the ErrorBoundary */} + Something went wrong!
}> + {/* Suspense will trigger a loading state while the data is being fetched */} + Loading...}> +
{repository().updated_at}
+ + ) } -function App() { - return ( - - - - ) -} -``` - -## Available Functions - -Solid Query offers useful primitives and functions that will make managing server state in SolidJS apps easier. - -- `createQuery` -- `createQueries` -- `createInfiniteQueries` -- `createMutation` -- `useIsFetching` -- `useIsMutating` -- `useQueryClient` -- `QueryClient` -- `QueryClientProvider` - -## Important Differences between Solid Query & React Query +const root = document.getElementById('root') -Solid Query offers an API similar to React Query, but there are some key differences to be mindful of. - -- Arguments to `solid-query` primitives (like `createQuery`, `createMutation`, `useIsFetching`) listed above are functions, so that they can be tracked in a reactive scope. - -```tsx -// ❌ react version -useQuery({ - queryKey: ['todos', todo], - queryFn: fetchTodos, -}) - -// ✅ solid version -createQuery(() => ({ - queryKey: ['todos', todo], - queryFn: fetchTodos, -})) +render(() => , root!) ``` -- Suspense works for queries out of the box if you access the query data inside a `` boundary. +This is amazing! In a few lines of code, you can fetch data from an API and handle loading and error states. But, as your application grows in complexity, you will need more features to manage server state effectively. This is because **server state is totally different from client state**. For starters, server state: -```tsx -import { For, Suspense } from 'solid-js' +- Is persisted remotely in a location you do not control or own +- Requires asynchronous APIs for fetching and updating +- Implies shared ownership and can be changed by other people without your knowledge +- Can potentially become "out of date" in your applications if you're not careful -function Example() { - const query = createQuery(() => ({ - queryKey: ['todos'], - queryFn: fetchTodos, - })) - return ( -
- {/* ✅ Will trigger loading fallback, data accessed in a suspense boundary. */} - - {(todo) =>
{todo.title}
} - - {/* ❌ Will not trigger loading fallback, data not accessed in a suspense boundary. */} - {(todo) =>
{todo.title}
} -
- ) -} -``` +Once you grasp the nature of server state in your application, **even more challenges will arise** as you go, for example: -- Solid Query primitives (`createX`) do not support destructuring. The return value from these functions is a store, and their properties are only tracked in a reactive context. +- Caching... (possibly the hardest thing to do in programming) +- Deduping multiple requests for the same data into a single request +- Updating "out of date" data in the background +- Knowing when data is "out of date" +- Reflecting updates to data as quickly as possible +- Performance optimizations like pagination and lazy loading data +- Managing memory and garbage collection of server state +- Memoizing query results with structural sharing -```tsx -import { - QueryClient, - QueryClientProvider, - createQuery, -} from '@tanstack/solid-query' -import { Match, Switch } from 'solid-js' +This is where **Solid Query** comes in. The library wraps around `createResource` and provides a set of hooks and utilities to manage server state effectively. It works amazingly well **out-of-the-box, with zero-config, and can be customized** to your liking as your application grows. -const queryClient = new QueryClient() +On a more technical note, Solid Query will likely: -export default function App() { - return ( - - - - ) -} +- Help you remove **many** lines of complicated and misunderstood code from your application and replace with just a handful of lines of Solid Query logic. +- Make your application more maintainable and easier to build new features without worrying about wiring up new server state data sources +- Have a direct impact on your end-users by making your application feel faster and more responsive than ever before. +- Potentially help you save on bandwidth and increase memory performance -function Example() { - // ❌ react version -- supports destructing outside reactive context - // const { isPending, error, data } = useQuery({ - // queryKey: ['repoData'], - // queryFn: () => - // fetch('https://api.github.com/repos/tannerlinsley/react-query').then( - // (res) => res.json() - // ), - // }) - - // ✅ solid version -- does not support destructuring outside reactive context - const query = createQuery(() => ({ - queryKey: ['repoData'], - queryFn: () => - fetch('https://api.github.com/repos/tannerlinsley/react-query').then( - (res) => res.json(), - ), - })) +## Enough talk, show me some code already! - // ✅ access query properties in JSX reactive context - return ( - - Loading... - Error: {query.error.message} - -
-

{query.data.name}

-

{query.data.description}

- 👀 {query.data.subscribers_count}{' '} - ✨ {query.data.stargazers_count}{' '} - 🍴 {query.data.forks_count} -
- - - ) -} -``` - -- Signals and store values can be passed in directly to function arguments. Solid Query will update the query `store` automatically. +In the example below, you can see Solid Query in its most basic and simple form being used to fetch the GitHub stats for the TanStack Query GitHub project itself: ```tsx +import { ErrorBoundary, Suspense } from 'solid-js' import { + createQuery, QueryClient, QueryClientProvider, - createQuery, } from '@tanstack/solid-query' -import { createSignal, For } from 'solid-js' - -const queryClient = new QueryClient() - -function Example() { - const [enabled, setEnabled] = createSignal(false) - const [todo, setTodo] = createSignal(0) - - // ✅ passing a signal directly is safe and observers update - // automatically when the value of a signal changes - const todosQuery = createQuery(() => ({ - queryKey: ['todos'], - queryFn: fetchTodos, - enabled: enabled(), - })) - const todoDetailsQuery = createQuery(() => ({ - queryKey: ['todo', todo()], - queryFn: fetchTodo, - enabled: todo() > 0, +function App() { + const repositoryQuery = createQuery(() => ({ + queryKey: ['TanStack Query'], + queryFn: async () => { + const result = await fetch('https://api.github.com/repos/TanStack/query') + if (!result.ok) throw new Error('Failed to fetch data') + return result.json() + }, + staleTime: 1000 * 60 * 5, // 5 minutes + throwOnError: true, // Throw an error if the query fails })) return (
- - -

Loading...

- - -

Error: {query.error.message}

- - - - {(todo) => ( - - )} - - - - +
Static Content
+ {/* An error while fetching will be caught by the ErrorBoundary */} + Something went wrong!
}> + {/* Suspense will trigger a loading state while the data is being fetched */} + Loading...}> + {/* + The `data` property on a query is a SolidJS resource + so it will work with Suspense and transitions out of the box! + */} +
{repositoryQuery.data.updated_at}
+ + ) } -function App() { - return ( - - +const root = document.getElementById('root') +const client = new QueryClient() + +render( + () => ( + + - ) -} + ), + root!, +) ``` -- Errors can be caught and reset using SolidJS' native `ErrorBoundary` component. - Set `throwOnError` or the `suspense` option to `true` to make sure errors are thrown to the `ErrorBoundary` - -- Since Property tracking is handled through Solid's fine grained reactivity, options like `notifyOnChangeProps` are not needed +## Well, that seems like more lines of code to do the same thing? + +Yes it is! But, these few lines of code unlock a whole new world of possibilities. In the example above, your query is cached for 5 minutes, meaning that if a new component mounts anywhere in your app that uses the same query within 5 minutes, it will not re-fetch the data but instead use the cached data. This is just one of the many features that Solid Query provides out of the box. Some other features include: + +- **Automatic Refetching**: Queries automatically refetch in the background when they become "stale" (out of date according to the `staleTime` option) +- **Automatic Caching**: Queries are cached by default and shared across your application +- **Request Deduplication**: Multiple components can share the same query and make one request +- **Automatic Garbage Collection**: Queries are garbage collected when they are no longer needed +- **Window Focus Refetching**: Queries automatically refetch when the application comes back into focus +- **Pagination**: Built-in support for pagination +- **Request Cancellation**: Automatically cancels outdated or unwanted requests +- **Polling/Realtime**: It's easy to add polling or realtime updates to your queries with a simple `refetchInterval` option +- **SSR Support**: Solid Query works great with server-side rendering +- **Optimistic Updates**: Easily update your cache with optimistic updates +- **And much more...** diff --git a/docs/framework/solid/quick-start.md b/docs/framework/solid/quick-start.md new file mode 100644 index 0000000000..944258e591 --- /dev/null +++ b/docs/framework/solid/quick-start.md @@ -0,0 +1,231 @@ +--- +id: quick-start +title: Quick Start +--- + +The `@tanstack/solid-query` package provides a 1st-class API for using TanStack Query with SolidJS. + +## Example + +```tsx +import { + QueryClient, + QueryClientProvider, + createQuery, +} from '@tanstack/solid-query' +import { Switch, Match, For } from 'solid-js' + +const queryClient = new QueryClient() + +function Example() { + const query = createQuery(() => ({ + queryKey: ['todos'], + queryFn: fetchTodos, + })) + + return ( +
+ + +

Loading...

+ + +

Error: {query.error.message}

+ + + {(todo) =>

{todo.title}

} + + +
+ ) +} + +function App() { + return ( + + + + ) +} +``` + +## Available Functions + +Solid Query offers useful primitives and functions that will make managing server state in SolidJS apps easier. + +- `createQuery` +- `createQueries` +- `createInfiniteQueries` +- `createMutation` +- `useIsFetching` +- `useIsMutating` +- `useQueryClient` +- `QueryClient` +- `QueryClientProvider` + +## Important Differences between Solid Query & React Query + +Solid Query offers an API similar to React Query, but there are some key differences to be mindful of. + +- Arguments to `solid-query` primitives (like `createQuery`, `createMutation`, `useIsFetching`) listed above are functions, so that they can be tracked in a reactive scope. + +```tsx +// ❌ react version +useQuery({ + queryKey: ['todos', todo], + queryFn: fetchTodos, +}) + +// ✅ solid version +createQuery(() => ({ + queryKey: ['todos', todo], + queryFn: fetchTodos, +})) +``` + +- Suspense works for queries out of the box if you access the query data inside a `` boundary. + +```tsx +import { For, Suspense } from 'solid-js' + +function Example() { + const query = createQuery(() => ({ + queryKey: ['todos'], + queryFn: fetchTodos, + })) + return ( +
+ {/* ✅ Will trigger loading fallback, data accessed in a suspense boundary. */} + + {(todo) =>
{todo.title}
} + + {/* ❌ Will not trigger loading fallback, data not accessed in a suspense boundary. */} + {(todo) =>
{todo.title}
} +
+ ) +} +``` + +- Solid Query primitives (`createX`) do not support destructuring. The return value from these functions is a store, and their properties are only tracked in a reactive context. + +```tsx +import { + QueryClient, + QueryClientProvider, + createQuery, +} from '@tanstack/solid-query' +import { Match, Switch } from 'solid-js' + +const queryClient = new QueryClient() + +export default function App() { + return ( + + + + ) +} + +function Example() { + // ❌ react version -- supports destructing outside reactive context + // const { isPending, error, data } = useQuery({ + // queryKey: ['repoData'], + // queryFn: () => + // fetch('https://api.github.com/repos/tannerlinsley/react-query').then( + // (res) => res.json() + // ), + // }) + + // ✅ solid version -- does not support destructuring outside reactive context + const query = createQuery(() => ({ + queryKey: ['repoData'], + queryFn: () => + fetch('https://api.github.com/repos/tannerlinsley/react-query').then( + (res) => res.json(), + ), + })) + + // ✅ access query properties in JSX reactive context + return ( + + Loading... + Error: {query.error.message} + +
+

{query.data.name}

+

{query.data.description}

+ 👀 {query.data.subscribers_count}{' '} + ✨ {query.data.stargazers_count}{' '} + 🍴 {query.data.forks_count} +
+ + + ) +} +``` + +- Signals and store values can be passed in directly to function arguments. Solid Query will update the query `store` automatically. + +```tsx +import { + QueryClient, + QueryClientProvider, + createQuery, +} from '@tanstack/solid-query' +import { createSignal, For } from 'solid-js' + +const queryClient = new QueryClient() + +function Example() { + const [enabled, setEnabled] = createSignal(false) + const [todo, setTodo] = createSignal(0) + + // ✅ passing a signal directly is safe and observers update + // automatically when the value of a signal changes + const todosQuery = createQuery(() => ({ + queryKey: ['todos'], + queryFn: fetchTodos, + enabled: enabled(), + })) + + const todoDetailsQuery = createQuery(() => ({ + queryKey: ['todo', todo()], + queryFn: fetchTodo, + enabled: todo() > 0, + })) + + return ( +
+ + +

Loading...

+ + +

Error: {query.error.message}

+ + + + {(todo) => ( + + )} + + + + +
+ ) +} + +function App() { + return ( + + + + ) +} +``` + +- Errors can be caught and reset using SolidJS' native `ErrorBoundary` component. + Set `throwOnError` or the `suspense` option to `true` to make sure errors are thrown to the `ErrorBoundary` + +- Since Property tracking is handled through Solid's fine grained reactivity, options like `notifyOnChangeProps` are not needed diff --git a/docs/framework/solid/typescript.md b/docs/framework/solid/typescript.md new file mode 100644 index 0000000000..aaa2ce7664 --- /dev/null +++ b/docs/framework/solid/typescript.md @@ -0,0 +1,217 @@ +--- +id: typescript +title: TypeScript +--- + +Solid Query is written in **TypeScript** to make sure the library and your projects are type-safe! + +Things to keep in mind: + +- Types currently require using TypeScript **v4.7** or greater +- Changes to types in this repository are considered **non-breaking** and are usually released as **patch** semver changes (otherwise every type enhancement would be a major version!). +- It is **highly recommended that you lock your solid-query package version to a specific patch release and upgrade with the expectation that types may be fixed or upgraded between any release** +- The non-type-related public API of Solid Query still follows semver very strictly. + +## Type Inference + +Types in Solid Query generally flow through very well so that you don't have to provide type annotations for yourself + +```tsx +import { createQuery } from '@tanstack/solid-query' + +const query = createQuery(() => ({ + queryKey: ['number'], + queryFn: () => Promise.resolve(5), +})) + +query.data +// ^? (property) data: number | undefined +``` + +[typescript playground](https://www.typescriptlang.org/play/?#code/JYWwDg9gTgLgBAbzgYygUwIYzQRQK5pQCecAvnAGZQQhwDkAAjBgHYDOzyA1gPRsQAbYABMAtAEcCxOgFgAUPOQR28SYRIBeFOiy4pRABQGAlHA0A+OAYTy4duGuIBpNEQBccANp0WeEACNCOgBdABo4W3tHIgAxFg8TM0sABWoQYDY0ADp0fgEANzQDAFZjeVJjMoU5aKzhLAx5Hh57OAA9AH55brkgA) + +```tsx +import { createQuery } from '@tanstack/solid-query' + +const query = createQuery(() => ({ + queryKey: ['test'], + queryFn: () => Promise.resolve(5), + select: (data) => data.toString(), +})) + +query.data +// ^? (property) data: string | undefined +``` + +[typescript playground](https://www.typescriptlang.org/play/?#code/JYWwDg9gTgLgBAbzgYygUwIYzQRQK5pQCecAvnAGZQQhwDkAAjBgHYDOzyA1gPRsQAbYABMAtAEcCxOgFgAUPOQR28SYRIBeFOiy4pRABQGAlHA0A+OAYTy4duGuIBpNEQBccANp1sHOgF0AGjhbe0ciADEWDxMzSwAFahBgNjQAOnR+AQA3NAMAVmNA0LtUgTRkGBjhLAxTCzga5jSYCABlGChgFgBzE2K5UmNjeXlwtKaMeR4eezgAPQB+UYU5IA) + +This works best if your `queryFn` has a well-defined returned type. Keep in mind that most data fetching libraries return `any` per default, so make sure to extract it to a properly typed function: + +```tsx +const fetchGroups = (): Promise => + axios.get('/groups').then((response) => response.data) + +const query = createQuery(() => ({ + queryKey: ['groups'], + queryFn: fetchGroups, +})) + +query.data +// ^? (property) data: Group[] | undefined +``` + +[typescript playground](https://www.typescriptlang.org/play/?ssl=11&ssc=4&pln=6&pc=1#code/JYWwDg9gTgLgBAbzgYygUwIYzQRQK5pQCecAvnAGZQQhwDkAAjBgHYDOzyA1gPRsQAbYABMAtAEcCxOgFgAUKEiw4GAB7AIbStVp01GtrLnyYRMGjgBxanjBwAvIjgiAXHBZ4QAI0Jl585Ah2eAo0GGQAC2sIWy1HAAoASjcABR1gNjQAHmjbAG0AXQA+BxL9TQA6AHMw+LoeKpswQ0SKmAi0Fnj0Nkh2C3sSnr7MiuEsDET-OUDguElCEkdUTGx8Rfik0rh4hHk4A-mpIgBpNCI3PLpGmOa6AoAaOH3DheIAMRY3UPCoprYHvJSIkpsY5G8iGMJvIeDxDnAAHoAfmm8iAA) + +## Type Narrowing + +Solid Query uses a [discriminated union type](https://www.typescriptlang.org/docs/handbook/typescript-in-5-minutes-func.html#discriminated-unions) for the query result, discriminated by the `status` field and the derived status boolean flags. This will allow you to check for e.g. `success` status to make `data` defined: + +```tsx +const query = createQuery(() => ({ + queryKey: ['number'], + queryFn: () => Promise.resolve(5), +})) + +if (query.isSuccess) { + const data = query.data + // ^? const data: number +} +``` + +[typescript playground](https://www.typescriptlang.org/play/?#code/JYWwDg9gTgLgBAbzgYygUwIYzQRQK5pQCecAvnAGZQQhwDkAAjBgHYDOzyA1gPRsQAbYABMAtAEcCxOgFgAUKEixEKdFjQBRChTTJ45KjXr8hYgFZtZc+cgjt4kwiQC8qzNnxOAFF4CUcZwA+OC8EeTg4R2IAaTQiAC44AG06FjwQACNCOgBdABpwyKkiADEWRL8A4IAFahBgNjQAOnQTADc0LwBWXwK5Ul9feXlgChCooiaGgGU8ZGQ0NjZ-MLkIiNt7OGEsDACipyad5kKInh51iIA9AH55UmHrOSA) + +## Typing the error field + +The type for error defaults to `Error`, because that is what most users expect. + +```tsx +const query = createQuery(() => ({ + queryKey: ['groups'], + queryFn: fetchGroups, +})) + +query.error +// ^? (property) error: Error | null +``` + +[typescript playground](https://www.typescriptlang.org/play/?#code/JYWwDg9gTgLgBAbzgYygUwIYzQRQK5pQCecAvnAGZQQhwDkAAjBgHYDOzyA1gPRsQAbYABMAtAEcCxOgFgAUKEiw4GAB7AIbStVp01GtrLnyYRMGjgBxanjBwAvIjgiAXHBZ4QAI0Jl585Ah2eAo0GGQAC2sIWy1HAAoASjcABR1gNjQAHmjbAG0AXQA+BxL9TQA6AHMw+LoeKpswQ0SKmAi0Fnj0Nkh2C3sSnr7MiuEsDET-OUDguElCEkdUTGx8Rfik0rh4hHk4A-mpIgBpNCI3PLpGmOa6AoAaOH3DheIAMRY3UPCoprYHvJSIkpsY5G8iBVCNQoPIeDxDnAAHoAfmm8iAA) + +If you want to throw a custom error, or something that isn't an `Error` at all, you can specify the type of the error field: + +```tsx +const query = createQuery(() => ({ + queryKey: ['groups'], + queryFn: fetchGroups, +})) + +query.error +// ^? (property) error: string | null +``` + +However, this has the drawback that type inference for all other generics of `useQuery` will not work anymore. It is generally not considered a good practice to throw something that isn't an `Error`, so if you have a subclass like `AxiosError` you can use _type narrowing_ to make the error field more specific: + +```tsx +import axios from 'axios' + +const query = createQuery(() => ({ + queryKey: ['groups'], + queryFn: fetchGroups, +})) + +query.error +// ^? (property) error: Error | null + +if (axios.isAxiosError(query.error)) { + query.error + // ^? (property) error: AxiosError +} +``` + +[typescript playground](https://www.typescriptlang.org/play/?#code/JYWwDg9gTgLgBAbzgYygUwIYzQRQK5pQCecAvnAGZQQhwDkAAjBgHYDOzyA1gPRsQAbYABMAtAEcCxOgFgAUKEiw4GAB7AIbStVp01GtrLnyYRMGjgBxanjBwAvIjgiAXHBZ4QAI0Jl585Ah2eAo0GGQAC2sIWy1HAAoASjcABR1gNjQAHmjbAG0AXQA+BxL9TQA6AHMw+LoeKpswQ0SKmAi0Fnj0Nkh2C3sSnr7MiuEsDET-OUDguElCEkdUTGx8Rfik0rh4hHk4A-mpIgBpNCI3PLpGmOa6AoAaOH3DheIAMRY3UPCoprYHvJSIkpsY5G8iBVCNQoPIeDxDnAAHoAfmmwAoO3KbAqGQAgupNABRKAw+IQqGk6AgxAvA4U6HQOlweGI1FA+RAA) + +## Registering a global `Error` + +TanStack Query v5 allows for a way to set a global Error type for everything, without having to specify generics on call-sides, by amending the `Register` interface. This will make sure inference still works, but the error field will be of the specified type: + +```tsx +import '@tanstack/solid-query' + +declare module '@tanstack/solid-query' { + interface Register { + defaultError: AxiosError + } +} + +const query = createQuery(() => ({ + queryKey: ['groups'], + queryFn: fetchGroups, +})) + +query.error +// ^? (property) error: AxiosError | null +``` + +## Registering global `Meta` + +Similarly to registering a [global error type](#registering-a-global-error) you can also register a global `Meta` type. This ensures the optional `meta` field on [queries](../createQuery) and [mutations](../createMutation) stays consistent and is type-safe. Note that the registered type must extend `Record` so that `meta` remains an object. + +```ts +import '@tanstack/solid-query' + +interface MyMeta extends Record { + // Your meta type definition. +} + +declare module '@tanstack/solid-query' { + interface Register { + queryMeta: MyMeta + mutationMeta: MyMeta + } +} +``` + +## Typing Query Options + +If you inline query options into `createQuery`, you'll get automatic type inference. However, you might want to extract the query options into a separate function to share them between `createQuery` and e.g. `prefetchQuery`. In that case, you'd lose type inference. To get it back, you can use `queryOptions` helper: + +```ts +import { queryOptions } from '@tanstack/solid-query' + +function groupOptions() { + return queryOptions({ + queryKey: ['groups'], + queryFn: fetchGroups, + staleTime: 5 * 1000, + }) +} + +createQuery(groupOptions) +queryClient.prefetchQuery(groupOptions()) +``` + +Further, the `queryKey` returned from `queryOptions` knows about the `queryFn` associated with it, and we can leverage that type information to make functions like `queryClient.getQueryData` aware of those types as well: + +```ts +function groupOptions() { + return queryOptions({ + queryKey: ['groups'], + queryFn: fetchGroups, + staleTime: 5 * 1000, + }) +} + +const data = queryClient.getQueryData(groupOptions().queryKey) +// ^? const data: Group[] | undefined +``` + +Without `queryOptions`, the type of `data` would be `unknown`, unless we'd pass a generic to it: + +```ts +const data = queryClient.getQueryData(['groups']) +``` + +## Typesafe disabling of queries using `skipToken` + +If you are using TypeScript, you can use the `skipToken` to disable a query. This is useful when you want to disable a query based on a condition, but you still want to keep the query to be type safe. + +Read more about it in the [Disabling Queries](../disabling-queries) guide. diff --git a/examples/angular/basic/package.json b/examples/angular/basic/package.json index 63d6de1d3a..2d0d533c12 100644 --- a/examples/angular/basic/package.json +++ b/examples/angular/basic/package.json @@ -17,7 +17,7 @@ "@angular/platform-browser": "^17.3.3", "@angular/platform-browser-dynamic": "^17.3.3", "@angular/router": "^17.3.3", - "@tanstack/angular-query-experimental": "^5.32.0", + "@tanstack/angular-query-experimental": "^5.34.1", "rxjs": "^7.8.1", "tslib": "^2.6.2", "zone.js": "^0.14.4" @@ -26,7 +26,7 @@ "@angular-devkit/build-angular": "^17.3.3", "@angular/cli": "^17.3.3", "@angular/compiler-cli": "^17.3.3", - "@tanstack/angular-query-devtools-experimental": "^5.32.0", + "@tanstack/angular-query-devtools-experimental": "^5.34.1", "typescript": "5.2.2" } } diff --git a/examples/angular/infinite-query-with-max-pages/package.json b/examples/angular/infinite-query-with-max-pages/package.json index 33674060db..284a965a86 100644 --- a/examples/angular/infinite-query-with-max-pages/package.json +++ b/examples/angular/infinite-query-with-max-pages/package.json @@ -17,7 +17,7 @@ "@angular/platform-browser": "^17.3.3", "@angular/platform-browser-dynamic": "^17.3.3", "@angular/router": "^17.3.3", - "@tanstack/angular-query-experimental": "^5.32.0", + "@tanstack/angular-query-experimental": "^5.34.1", "rxjs": "^7.8.1", "tslib": "^2.6.2", "zone.js": "^0.14.4" @@ -26,7 +26,7 @@ "@angular-devkit/build-angular": "^17.3.3", "@angular/cli": "^17.3.3", "@angular/compiler-cli": "^17.3.3", - "@tanstack/angular-query-devtools-experimental": "^5.32.0", + "@tanstack/angular-query-devtools-experimental": "^5.34.1", "typescript": "5.2.2" } } diff --git a/examples/angular/router/package.json b/examples/angular/router/package.json index 8a97cc7996..c125f2e5c7 100644 --- a/examples/angular/router/package.json +++ b/examples/angular/router/package.json @@ -17,7 +17,7 @@ "@angular/platform-browser": "^17.3.3", "@angular/platform-browser-dynamic": "^17.3.3", "@angular/router": "^17.3.3", - "@tanstack/angular-query-experimental": "^5.32.0", + "@tanstack/angular-query-experimental": "^5.34.1", "rxjs": "^7.8.1", "tslib": "^2.6.2", "zone.js": "^0.14.4" @@ -26,7 +26,7 @@ "@angular-devkit/build-angular": "^17.3.3", "@angular/cli": "^17.3.3", "@angular/compiler-cli": "^17.3.3", - "@tanstack/angular-query-devtools-experimental": "^5.32.0", + "@tanstack/angular-query-devtools-experimental": "^5.34.1", "typescript": "5.2.2" } } diff --git a/examples/angular/simple/package.json b/examples/angular/simple/package.json index ac66720a30..bd2e2f5e98 100644 --- a/examples/angular/simple/package.json +++ b/examples/angular/simple/package.json @@ -17,7 +17,7 @@ "@angular/platform-browser": "^17.3.3", "@angular/platform-browser-dynamic": "^17.3.3", "@angular/router": "^17.3.3", - "@tanstack/angular-query-experimental": "^5.32.0", + "@tanstack/angular-query-experimental": "^5.34.1", "rxjs": "^7.8.1", "tslib": "^2.6.2", "zone.js": "^0.14.4" @@ -26,7 +26,7 @@ "@angular-devkit/build-angular": "^17.3.3", "@angular/cli": "^17.3.3", "@angular/compiler-cli": "^17.3.3", - "@tanstack/angular-query-devtools-experimental": "^5.32.0", + "@tanstack/angular-query-devtools-experimental": "^5.34.1", "typescript": "5.2.2" } } diff --git a/examples/react/algolia/package.json b/examples/react/algolia/package.json index bc691dbc73..bf37ee30be 100644 --- a/examples/react/algolia/package.json +++ b/examples/react/algolia/package.json @@ -11,14 +11,14 @@ "dependencies": { "@algolia/client-search": "4.22.1", "@algolia/transporter": "4.22.1", - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "algoliasearch": "4.22.1", "react": "^18.2.0", "react-dom": "^18.2.0" }, "devDependencies": { - "@tanstack/eslint-plugin-query": "^5.28.11", + "@tanstack/eslint-plugin-query": "^5.32.1", "@types/react": "^18.2.55", "@types/react-dom": "^18.2.19", "@vitejs/plugin-react": "^4.2.1", diff --git a/examples/react/auto-refetching/package.json b/examples/react/auto-refetching/package.json index e207fcc7f2..65b0c9503d 100644 --- a/examples/react/auto-refetching/package.json +++ b/examples/react/auto-refetching/package.json @@ -7,8 +7,8 @@ "start": "next start" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "axios": "^1.6.7", "isomorphic-unfetch": "4.0.2", "next": "^14.0.0", diff --git a/examples/react/basic-graphql-request/package.json b/examples/react/basic-graphql-request/package.json index 39315070bc..b9cf6ed51d 100644 --- a/examples/react/basic-graphql-request/package.json +++ b/examples/react/basic-graphql-request/package.json @@ -8,8 +8,8 @@ "preview": "vite preview" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "graphql": "^16.8.1", "graphql-request": "^6.1.0", "react": "^18.2.0", diff --git a/examples/react/basic-typescript/package.json b/examples/react/basic-typescript/package.json index 8b6614743d..cd0f9bdccc 100644 --- a/examples/react/basic-typescript/package.json +++ b/examples/react/basic-typescript/package.json @@ -9,16 +9,16 @@ "test:types": "tsc" }, "dependencies": { - "@tanstack/query-sync-storage-persister": "^5.32.0", - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", - "@tanstack/react-query-persist-client": "^5.32.0", + "@tanstack/query-sync-storage-persister": "^5.34.1", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", + "@tanstack/react-query-persist-client": "^5.34.1", "axios": "^1.6.7", "react": "^18.2.0", "react-dom": "^18.2.0" }, "devDependencies": { - "@tanstack/eslint-plugin-query": "^5.28.11", + "@tanstack/eslint-plugin-query": "^5.32.1", "@types/react": "^18.2.55", "@types/react-dom": "^18.2.19", "@vitejs/plugin-react": "^4.2.1", diff --git a/examples/react/basic/package.json b/examples/react/basic/package.json index 76b4984d4d..325aaef363 100644 --- a/examples/react/basic/package.json +++ b/examples/react/basic/package.json @@ -8,14 +8,14 @@ "preview": "vite preview" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "axios": "^1.6.7", "react": "^18.2.0", "react-dom": "^18.2.0" }, "devDependencies": { - "@tanstack/eslint-plugin-query": "^5.28.11", + "@tanstack/eslint-plugin-query": "^5.32.1", "@vitejs/plugin-react": "^4.2.1", "vite": "^5.1.1" }, diff --git a/examples/react/default-query-function/package.json b/examples/react/default-query-function/package.json index 1826b6ca6e..ff612d466d 100644 --- a/examples/react/default-query-function/package.json +++ b/examples/react/default-query-function/package.json @@ -8,8 +8,8 @@ "preview": "vite preview" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "axios": "^1.6.7", "react": "^18.2.0", "react-dom": "^18.2.0" diff --git a/examples/react/infinite-query-with-max-pages/package.json b/examples/react/infinite-query-with-max-pages/package.json index 95fe5bf5ac..c5dbb6f923 100644 --- a/examples/react/infinite-query-with-max-pages/package.json +++ b/examples/react/infinite-query-with-max-pages/package.json @@ -7,8 +7,8 @@ "start": "next start" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "axios": "^1.6.7", "isomorphic-unfetch": "4.0.2", "next": "^14.0.0", diff --git a/examples/react/load-more-infinite-scroll/package.json b/examples/react/load-more-infinite-scroll/package.json index fc50656c33..c8b797fdb7 100644 --- a/examples/react/load-more-infinite-scroll/package.json +++ b/examples/react/load-more-infinite-scroll/package.json @@ -7,8 +7,8 @@ "start": "next start" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "axios": "^1.6.7", "isomorphic-unfetch": "4.0.2", "next": "^14.0.0", diff --git a/examples/react/nextjs-suspense-streaming/package.json b/examples/react/nextjs-suspense-streaming/package.json index 28c27a3195..78b81c935d 100644 --- a/examples/react/nextjs-suspense-streaming/package.json +++ b/examples/react/nextjs-suspense-streaming/package.json @@ -8,9 +8,9 @@ "test:types": "tsc" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", - "@tanstack/react-query-next-experimental": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", + "@tanstack/react-query-next-experimental": "^5.34.1", "next": "^14.0.0", "react": "^18.2.0", "react-dom": "^18.2.0", diff --git a/examples/react/nextjs/package.json b/examples/react/nextjs/package.json index a9f996fda6..b480b7bf9c 100644 --- a/examples/react/nextjs/package.json +++ b/examples/react/nextjs/package.json @@ -7,8 +7,8 @@ "start": "next start" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "ky": "^1.2.0", "next": "^14.0.0", "react": "^18.2.0", diff --git a/examples/react/offline/package.json b/examples/react/offline/package.json index ebbed2a70a..dc664f8257 100644 --- a/examples/react/offline/package.json +++ b/examples/react/offline/package.json @@ -8,11 +8,11 @@ "preview": "vite preview" }, "dependencies": { - "@tanstack/query-sync-storage-persister": "^5.32.0", + "@tanstack/query-sync-storage-persister": "^5.34.1", "@tanstack/react-location": "^3.7.4", - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", - "@tanstack/react-query-persist-client": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", + "@tanstack/react-query-persist-client": "^5.34.1", "ky": "^1.2.0", "msw": "^2.1.7", "react": "^18.2.0", diff --git a/examples/react/optimistic-updates-cache/package.json b/examples/react/optimistic-updates-cache/package.json index 2d2fd011ab..ab8fab746e 100755 --- a/examples/react/optimistic-updates-cache/package.json +++ b/examples/react/optimistic-updates-cache/package.json @@ -8,8 +8,8 @@ "test:types": "tsc" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "axios": "^1.6.7", "isomorphic-unfetch": "4.0.2", "next": "^14.0.0", diff --git a/examples/react/optimistic-updates-ui/package.json b/examples/react/optimistic-updates-ui/package.json index 696e28c2e0..aba6461255 100755 --- a/examples/react/optimistic-updates-ui/package.json +++ b/examples/react/optimistic-updates-ui/package.json @@ -7,8 +7,8 @@ "start": "next start" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "axios": "^1.6.7", "isomorphic-unfetch": "4.0.2", "next": "^14.0.0", diff --git a/examples/react/pagination/package.json b/examples/react/pagination/package.json index d661d2e76f..f543565de9 100644 --- a/examples/react/pagination/package.json +++ b/examples/react/pagination/package.json @@ -7,8 +7,8 @@ "start": "next start" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "axios": "^1.6.7", "isomorphic-unfetch": "4.0.2", "next": "^14.0.0", diff --git a/examples/react/playground/package.json b/examples/react/playground/package.json index 9109e8eff1..1e102a02ea 100644 --- a/examples/react/playground/package.json +++ b/examples/react/playground/package.json @@ -8,8 +8,8 @@ "preview": "vite preview" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "react": "^18.2.0", "react-dom": "^18.2.0" }, diff --git a/examples/react/prefetching/package.json b/examples/react/prefetching/package.json index 5f342a422e..505e0b7aa7 100644 --- a/examples/react/prefetching/package.json +++ b/examples/react/prefetching/package.json @@ -7,8 +7,8 @@ "start": "next start" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "axios": "^1.6.7", "isomorphic-unfetch": "4.0.2", "next": "^14.0.0", diff --git a/examples/react/react-native/package.json b/examples/react/react-native/package.json index 5fc294f203..ec54b82680 100644 --- a/examples/react/react-native/package.json +++ b/examples/react/react-native/package.json @@ -14,8 +14,8 @@ "@react-native-community/netinfo": "^11.1.0", "@react-navigation/native": "^6.1.6", "@react-navigation/stack": "^6.3.16", - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "expo": "^50.0.6", "expo-constants": "^15.4.5", "expo-status-bar": "^1.11.1", diff --git a/examples/react/react-router/package.json b/examples/react/react-router/package.json index dfea5732cc..3feda3b03e 100644 --- a/examples/react/react-router/package.json +++ b/examples/react/react-router/package.json @@ -9,8 +9,8 @@ "test:types": "tsc" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "localforage": "^1.10.0", "match-sorter": "^6.3.4", "react": "^18.2.0", diff --git a/examples/react/rick-morty/package.json b/examples/react/rick-morty/package.json index f7fc55bff2..90e4f605e7 100644 --- a/examples/react/rick-morty/package.json +++ b/examples/react/rick-morty/package.json @@ -12,8 +12,8 @@ "@emotion/styled": "^11.11.0", "@mui/material": "^5.15.2", "@mui/styles": "^5.15.2", - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "react": "^18.2.0", "react-dom": "^18.2.0", "react-router": "^6.22.0", diff --git a/examples/react/shadow-dom/package.json b/examples/react/shadow-dom/package.json index a3528c55b9..43d56584e4 100644 --- a/examples/react/shadow-dom/package.json +++ b/examples/react/shadow-dom/package.json @@ -10,8 +10,8 @@ "preview": "vite preview" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "react": "^18.2.0", "react-dom": "^18.2.0" }, diff --git a/examples/react/simple/package.json b/examples/react/simple/package.json index 6dcba69491..5d804f1144 100644 --- a/examples/react/simple/package.json +++ b/examples/react/simple/package.json @@ -8,8 +8,8 @@ "preview": "vite preview" }, "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "axios": "^1.6.7", "react": "^18.2.0", "react-dom": "^18.2.0" diff --git a/examples/react/star-wars/package.json b/examples/react/star-wars/package.json index b2df2d0ec1..4af509aa85 100644 --- a/examples/react/star-wars/package.json +++ b/examples/react/star-wars/package.json @@ -12,8 +12,8 @@ "@emotion/styled": "^11.11.0", "@mui/material": "^5.15.2", "@mui/styles": "^5.15.2", - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "react": "^18.2.0", "react-dom": "^18.2.0", "react-router": "^6.22.0", diff --git a/examples/react/suspense/package.json b/examples/react/suspense/package.json index 9363b367ac..03199fa25e 100644 --- a/examples/react/suspense/package.json +++ b/examples/react/suspense/package.json @@ -3,8 +3,8 @@ "private": true, "type": "module", "dependencies": { - "@tanstack/react-query": "^5.32.0", - "@tanstack/react-query-devtools": "^5.32.0", + "@tanstack/react-query": "^5.34.1", + "@tanstack/react-query-devtools": "^5.34.1", "axios": "^1.6.7", "font-awesome": "^4.7.0", "react": "^18.2.0", diff --git a/examples/solid/astro/package.json b/examples/solid/astro/package.json index c2d52c9191..b615aff19e 100644 --- a/examples/solid/astro/package.json +++ b/examples/solid/astro/package.json @@ -15,8 +15,8 @@ "@astrojs/tailwind": "^5.1.0", "@astrojs/vercel": "^7.5.3", "@astrojs/node": "^8.2.5", - "@tanstack/solid-query": "^5.32.0", - "@tanstack/solid-query-devtools": "^5.32.0", + "@tanstack/solid-query": "^5.34.1", + "@tanstack/solid-query-devtools": "^5.34.1", "astro": "^4.6.1", "solid-js": "^1.8.14", "tailwindcss": "^3.4.1", diff --git a/examples/solid/basic-graphql-request/package.json b/examples/solid/basic-graphql-request/package.json index a84b3813c4..6d6cf2df93 100644 --- a/examples/solid/basic-graphql-request/package.json +++ b/examples/solid/basic-graphql-request/package.json @@ -9,8 +9,8 @@ "test:types": "tsc" }, "dependencies": { - "@tanstack/solid-query": "^5.32.0", - "@tanstack/solid-query-devtools": "^5.32.0", + "@tanstack/solid-query": "^5.34.1", + "@tanstack/solid-query-devtools": "^5.34.1", "graphql": "^16.8.1", "graphql-request": "^6.1.0", "solid-js": "^1.8.14" diff --git a/examples/solid/basic-typescript/package.json b/examples/solid/basic-typescript/package.json index 56b81d634f..4cc610c103 100644 --- a/examples/solid/basic-typescript/package.json +++ b/examples/solid/basic-typescript/package.json @@ -9,8 +9,8 @@ "test:types": "tsc" }, "dependencies": { - "@tanstack/solid-query": "^5.32.0", - "@tanstack/solid-query-devtools": "^5.32.0", + "@tanstack/solid-query": "^5.34.1", + "@tanstack/solid-query-devtools": "^5.34.1", "solid-js": "^1.8.14" }, "devDependencies": { diff --git a/examples/solid/default-query-function/package.json b/examples/solid/default-query-function/package.json index 2b20e3ca79..3d75ccc31c 100644 --- a/examples/solid/default-query-function/package.json +++ b/examples/solid/default-query-function/package.json @@ -9,8 +9,8 @@ "test:types": "tsc" }, "dependencies": { - "@tanstack/solid-query": "^5.32.0", - "@tanstack/solid-query-devtools": "^5.32.0", + "@tanstack/solid-query": "^5.34.1", + "@tanstack/solid-query-devtools": "^5.34.1", "solid-js": "^1.8.14" }, "devDependencies": { diff --git a/examples/solid/simple/package.json b/examples/solid/simple/package.json index e418168f13..db4c151cc9 100644 --- a/examples/solid/simple/package.json +++ b/examples/solid/simple/package.json @@ -9,12 +9,12 @@ "test:types": "tsc" }, "dependencies": { - "@tanstack/solid-query": "^5.32.0", - "@tanstack/solid-query-devtools": "^5.32.0", + "@tanstack/solid-query": "^5.34.1", + "@tanstack/solid-query-devtools": "^5.34.1", "solid-js": "^1.8.14" }, "devDependencies": { - "@tanstack/eslint-plugin-query": "^5.28.11", + "@tanstack/eslint-plugin-query": "^5.32.1", "typescript": "5.2.2", "vite": "^5.1.1", "vite-plugin-solid": "^2.9.1" diff --git a/examples/solid/solid-start-streaming/package.json b/examples/solid/solid-start-streaming/package.json index 0257b2e074..02ae20148d 100644 --- a/examples/solid/solid-start-streaming/package.json +++ b/examples/solid/solid-start-streaming/package.json @@ -11,8 +11,8 @@ "@solidjs/meta": "^0.29.2", "@solidjs/router": "^0.13.2", "@solidjs/start": "^1.0.0-rc.0", - "@tanstack/solid-query": "^5.32.0", - "@tanstack/solid-query-devtools": "^5.32.0", + "@tanstack/solid-query": "^5.34.1", + "@tanstack/solid-query-devtools": "^5.34.1", "solid-js": "^1.8.14", "vinxi": "^0.3.10" }, diff --git a/examples/svelte/auto-refetching/package.json b/examples/svelte/auto-refetching/package.json index bac08f418a..33565522d8 100644 --- a/examples/svelte/auto-refetching/package.json +++ b/examples/svelte/auto-refetching/package.json @@ -9,8 +9,8 @@ "test:types": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json" }, "dependencies": { - "@tanstack/svelte-query": "^5.32.0", - "@tanstack/svelte-query-devtools": "^5.32.0" + "@tanstack/svelte-query": "^5.34.1", + "@tanstack/svelte-query-devtools": "^5.34.1" }, "devDependencies": { "@sveltejs/adapter-auto": "^3.1.1", diff --git a/examples/svelte/basic/package.json b/examples/svelte/basic/package.json index 8cd496467d..94ac202c10 100644 --- a/examples/svelte/basic/package.json +++ b/examples/svelte/basic/package.json @@ -9,8 +9,8 @@ "test:types": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json" }, "dependencies": { - "@tanstack/svelte-query": "^5.32.0", - "@tanstack/svelte-query-devtools": "^5.32.0" + "@tanstack/svelte-query": "^5.34.1", + "@tanstack/svelte-query-devtools": "^5.34.1" }, "devDependencies": { "@sveltejs/adapter-auto": "^3.1.1", diff --git a/examples/svelte/load-more-infinite-scroll/package.json b/examples/svelte/load-more-infinite-scroll/package.json index 2bc2df3ef0..58eda65717 100644 --- a/examples/svelte/load-more-infinite-scroll/package.json +++ b/examples/svelte/load-more-infinite-scroll/package.json @@ -9,8 +9,8 @@ "test:types": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json" }, "dependencies": { - "@tanstack/svelte-query": "^5.32.0", - "@tanstack/svelte-query-devtools": "^5.32.0" + "@tanstack/svelte-query": "^5.34.1", + "@tanstack/svelte-query-devtools": "^5.34.1" }, "devDependencies": { "@sveltejs/adapter-auto": "^3.1.1", diff --git a/examples/svelte/optimistic-updates-typescript/package.json b/examples/svelte/optimistic-updates-typescript/package.json index d13348b607..50b267b50d 100644 --- a/examples/svelte/optimistic-updates-typescript/package.json +++ b/examples/svelte/optimistic-updates-typescript/package.json @@ -9,8 +9,8 @@ "test:types": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json" }, "dependencies": { - "@tanstack/svelte-query": "^5.32.0", - "@tanstack/svelte-query-devtools": "^5.32.0" + "@tanstack/svelte-query": "^5.34.1", + "@tanstack/svelte-query-devtools": "^5.34.1" }, "devDependencies": { "@sveltejs/adapter-auto": "^3.1.1", diff --git a/examples/svelte/playground/package.json b/examples/svelte/playground/package.json index dd49be2df0..a39fbd0cd3 100644 --- a/examples/svelte/playground/package.json +++ b/examples/svelte/playground/package.json @@ -9,8 +9,8 @@ "test:types": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json" }, "dependencies": { - "@tanstack/svelte-query": "^5.32.0", - "@tanstack/svelte-query-devtools": "^5.32.0" + "@tanstack/svelte-query": "^5.34.1", + "@tanstack/svelte-query-devtools": "^5.34.1" }, "devDependencies": { "@sveltejs/adapter-auto": "^3.1.1", diff --git a/examples/svelte/simple/package.json b/examples/svelte/simple/package.json index 07db774aed..b58ff4ecbc 100644 --- a/examples/svelte/simple/package.json +++ b/examples/svelte/simple/package.json @@ -9,8 +9,8 @@ "test:types": "svelte-check --tsconfig ./tsconfig.json" }, "dependencies": { - "@tanstack/svelte-query": "^5.32.0", - "@tanstack/svelte-query-devtools": "^5.32.0" + "@tanstack/svelte-query": "^5.34.1", + "@tanstack/svelte-query-devtools": "^5.34.1" }, "devDependencies": { "@sveltejs/vite-plugin-svelte": "^3.0.2", diff --git a/examples/svelte/ssr/package.json b/examples/svelte/ssr/package.json index d9649a9a53..d25137963c 100644 --- a/examples/svelte/ssr/package.json +++ b/examples/svelte/ssr/package.json @@ -9,8 +9,8 @@ "test:types": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json" }, "dependencies": { - "@tanstack/svelte-query": "^5.32.0", - "@tanstack/svelte-query-devtools": "^5.32.0" + "@tanstack/svelte-query": "^5.34.1", + "@tanstack/svelte-query-devtools": "^5.34.1" }, "devDependencies": { "@sveltejs/adapter-auto": "^3.1.1", diff --git a/examples/svelte/star-wars/package.json b/examples/svelte/star-wars/package.json index de4d721705..fcf69ab529 100644 --- a/examples/svelte/star-wars/package.json +++ b/examples/svelte/star-wars/package.json @@ -9,8 +9,8 @@ "test:types": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json" }, "dependencies": { - "@tanstack/svelte-query": "^5.32.0", - "@tanstack/svelte-query-devtools": "^5.32.0" + "@tanstack/svelte-query": "^5.34.1", + "@tanstack/svelte-query-devtools": "^5.34.1" }, "devDependencies": { "@sveltejs/adapter-auto": "^3.1.1", diff --git a/examples/vue/2.6-basic/package.json b/examples/vue/2.6-basic/package.json index 0cfe5037d3..da564902ec 100644 --- a/examples/vue/2.6-basic/package.json +++ b/examples/vue/2.6-basic/package.json @@ -8,7 +8,7 @@ "preview": "vite preview" }, "dependencies": { - "@tanstack/vue-query": "^5.32.0", + "@tanstack/vue-query": "^5.34.1", "@vue/composition-api": "1.7.2", "vue": "2.6.14", "vue-template-compiler": "2.6.14" diff --git a/examples/vue/2.7-basic/package.json b/examples/vue/2.7-basic/package.json index f126104075..7da578b70f 100644 --- a/examples/vue/2.7-basic/package.json +++ b/examples/vue/2.7-basic/package.json @@ -8,7 +8,7 @@ "serve": "vite preview" }, "dependencies": { - "@tanstack/vue-query": "^5.32.0", + "@tanstack/vue-query": "^5.34.1", "vue": "2.7.16", "vue-template-compiler": "2.7.16" }, diff --git a/examples/vue/basic/package.json b/examples/vue/basic/package.json index 65ab86c464..4eb0d0396c 100644 --- a/examples/vue/basic/package.json +++ b/examples/vue/basic/package.json @@ -8,8 +8,8 @@ "preview": "vite preview" }, "dependencies": { - "@tanstack/vue-query": "^5.32.0", - "@tanstack/vue-query-devtools": "^5.32.0", + "@tanstack/vue-query": "^5.34.1", + "@tanstack/vue-query-devtools": "^5.34.1", "vue": "^3.3.0" }, "devDependencies": { diff --git a/examples/vue/dependent-queries/package.json b/examples/vue/dependent-queries/package.json index 724d4d5e4c..c87b27c5aa 100644 --- a/examples/vue/dependent-queries/package.json +++ b/examples/vue/dependent-queries/package.json @@ -8,7 +8,7 @@ "preview": "vite preview" }, "dependencies": { - "@tanstack/vue-query": "^5.32.0", + "@tanstack/vue-query": "^5.34.1", "vue": "^3.3.0" }, "devDependencies": { diff --git a/examples/vue/nuxt3/package.json b/examples/vue/nuxt3/package.json index 1b4e60bc40..b0f8dc3505 100644 --- a/examples/vue/nuxt3/package.json +++ b/examples/vue/nuxt3/package.json @@ -7,7 +7,7 @@ "start": "node .output/server/index.mjs" }, "dependencies": { - "@tanstack/vue-query": "^5.32.0" + "@tanstack/vue-query": "^5.34.1" }, "devDependencies": { "nuxt": "^3.5.2" diff --git a/examples/vue/persister/package.json b/examples/vue/persister/package.json index 52e9b45067..b6c7e46606 100644 --- a/examples/vue/persister/package.json +++ b/examples/vue/persister/package.json @@ -8,10 +8,10 @@ "preview": "vite preview" }, "dependencies": { - "@tanstack/query-core": "^5.32.0", - "@tanstack/query-persist-client-core": "^5.32.0", - "@tanstack/query-sync-storage-persister": "^5.32.0", - "@tanstack/vue-query": "^5.32.0", + "@tanstack/query-core": "^5.34.1", + "@tanstack/query-persist-client-core": "^5.34.1", + "@tanstack/query-sync-storage-persister": "^5.34.1", + "@tanstack/vue-query": "^5.34.1", "idb-keyval": "^6.2.1", "vue": "^3.3.0" }, diff --git a/examples/vue/simple/package.json b/examples/vue/simple/package.json index 70708ce58e..c0b12521c0 100644 --- a/examples/vue/simple/package.json +++ b/examples/vue/simple/package.json @@ -8,8 +8,8 @@ "preview": "vite preview" }, "dependencies": { - "@tanstack/vue-query": "^5.32.0", - "@tanstack/vue-query-devtools": "^5.32.0", + "@tanstack/vue-query": "^5.34.1", + "@tanstack/vue-query-devtools": "^5.34.1", "vue": "^3.3.0" }, "devDependencies": { diff --git a/packages/angular-query-devtools-experimental/package.json b/packages/angular-query-devtools-experimental/package.json index ad027c8739..c4629f75e4 100644 --- a/packages/angular-query-devtools-experimental/package.json +++ b/packages/angular-query-devtools-experimental/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/angular-query-devtools-experimental", - "version": "5.32.0", + "version": "5.34.1", "description": "Developer tools to interact with and visualize the TanStack/angular-query cache", "author": "Arnoud de Vries", "license": "MIT", diff --git a/packages/angular-query-experimental/package.json b/packages/angular-query-experimental/package.json index dffbf10ac4..e3074ee478 100644 --- a/packages/angular-query-experimental/package.json +++ b/packages/angular-query-experimental/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/angular-query-experimental", - "version": "5.32.0", + "version": "5.34.1", "description": "Signals for managing, caching and syncing asynchronous and remote data in Angular", "author": "Arnoud de Vries", "license": "MIT", diff --git a/packages/angular-query-experimental/src/__tests__/inject-query.test.ts b/packages/angular-query-experimental/src/__tests__/inject-query.test.ts index 97b43a7bf8..5ba1ac4085 100644 --- a/packages/angular-query-experimental/src/__tests__/inject-query.test.ts +++ b/packages/angular-query-experimental/src/__tests__/inject-query.test.ts @@ -1,4 +1,11 @@ -import { Component, computed, input, signal } from '@angular/core' +import { + Component, + Injectable, + computed, + inject, + input, + signal, +} from '@angular/core' import { TestBed, fakeAsync, flush, tick } from '@angular/core/testing' import { QueryClient } from '@tanstack/query-core' import { describe, expect, vi } from 'vitest' @@ -297,4 +304,46 @@ describe('injectQuery', () => { 'signal-input-required-test', ) })) + + test('should run options in injection context', fakeAsync(async () => { + @Injectable() + class FakeService { + getData(name: string) { + return Promise.resolve(name) + } + } + + @Component({ + selector: 'app-fake', + template: `{{ query.data() }}`, + standalone: true, + providers: [FakeService], + }) + class FakeComponent { + name = signal('test name') + + query = injectQuery(() => { + const service = inject(FakeService) + + return { + queryKey: ['fake', this.name()], + queryFn: () => { + return service.getData(this.name()) + }, + } + }) + } + + const fixture = TestBed.createComponent(FakeComponent) + flush() + fixture.detectChanges() + + expect(fixture.componentInstance.query.data()).toEqual('test name') + + fixture.componentInstance.name.set('test name 2') + fixture.detectChanges() + flush() + + expect(fixture.componentInstance.query.data()).toEqual('test name 2') + })) }) diff --git a/packages/angular-query-experimental/src/inject-query.ts b/packages/angular-query-experimental/src/inject-query.ts index 4887741741..6d67674c40 100644 --- a/packages/angular-query-experimental/src/inject-query.ts +++ b/packages/angular-query-experimental/src/inject-query.ts @@ -1,4 +1,5 @@ import { QueryObserver } from '@tanstack/query-core' +import { runInInjectionContext } from '@angular/core' import { assertInjector } from './util/assert-injector/assert-injector' import { injectQueryClient } from './inject-query-client' import { createBaseQuery } from './create-base-query' @@ -186,8 +187,14 @@ export function injectQuery( optionsFn: (client: QueryClient) => CreateQueryOptions, injector?: Injector, ) { + const assertedInjector = assertInjector(injectQuery, injector) return assertInjector(injectQuery, injector, () => { const queryClient = injectQueryClient() - return createBaseQuery(optionsFn, QueryObserver, queryClient) + return createBaseQuery( + (client) => + runInInjectionContext(assertedInjector, () => optionsFn(client)), + QueryObserver, + queryClient, + ) }) } diff --git a/packages/eslint-plugin-query/package.json b/packages/eslint-plugin-query/package.json index 62b6216bad..33721825a3 100644 --- a/packages/eslint-plugin-query/package.json +++ b/packages/eslint-plugin-query/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/eslint-plugin-query", - "version": "5.28.11", + "version": "5.32.1", "description": "ESLint plugin for TanStack Query", "author": "Eliya Cohen", "license": "MIT", diff --git a/packages/query-async-storage-persister/package.json b/packages/query-async-storage-persister/package.json index 776b36480f..2b37a9647f 100644 --- a/packages/query-async-storage-persister/package.json +++ b/packages/query-async-storage-persister/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/query-async-storage-persister", - "version": "5.32.0", + "version": "5.34.1", "description": "A persister for asynchronous storages, to be used with TanStack/Query", "author": "tannerlinsley", "license": "MIT", diff --git a/packages/query-broadcast-client-experimental/package.json b/packages/query-broadcast-client-experimental/package.json index ec00a5358b..76cb4a8245 100644 --- a/packages/query-broadcast-client-experimental/package.json +++ b/packages/query-broadcast-client-experimental/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/query-broadcast-client-experimental", - "version": "5.32.0", + "version": "5.34.1", "description": "An experimental plugin to for broadcasting the state of your queryClient between browser tabs/windows", "author": "tannerlinsley", "license": "MIT", diff --git a/packages/query-core/package.json b/packages/query-core/package.json index 64624a28f8..b2cb54b225 100644 --- a/packages/query-core/package.json +++ b/packages/query-core/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/query-core", - "version": "5.32.0", + "version": "5.34.1", "description": "The framework agnostic core that powers TanStack Query", "author": "tannerlinsley", "license": "MIT", diff --git a/packages/query-core/src/__tests__/utils.test.tsx b/packages/query-core/src/__tests__/utils.test.tsx index 064795279b..fdecf0d992 100644 --- a/packages/query-core/src/__tests__/utils.test.tsx +++ b/packages/query-core/src/__tests__/utils.test.tsx @@ -73,6 +73,14 @@ describe('core/utils', () => { expect(isPlainObject(Object.create(Graph))).toBeFalsy() }) + + it('should return `false` for object with custom prototype', () => { + const CustomProto = Object.create({ a: 1 }) + const obj = Object.create(CustomProto) + obj.b = 2 + + expect(isPlainObject(obj)).toBeFalsy() + }) }) describe('isPlainArray', () => { diff --git a/packages/query-core/src/utils.ts b/packages/query-core/src/utils.ts index c100ac4baa..251b55cba1 100644 --- a/packages/query-core/src/utils.ts +++ b/packages/query-core/src/utils.ts @@ -300,6 +300,11 @@ export function isPlainObject(o: any): o is Object { return false } + // Handles Objects created by Object.create() + if (Object.getPrototypeOf(o) !== Object.prototype) { + return false + } + // Most likely a plain Object return true } diff --git a/packages/query-devtools/package.json b/packages/query-devtools/package.json index 7a7c0b0bc3..87da60d2df 100644 --- a/packages/query-devtools/package.json +++ b/packages/query-devtools/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/query-devtools", - "version": "5.28.10", + "version": "5.32.1", "description": "Developer tools to interact with and visualize the TanStack Query cache", "author": "tannerlinsley", "license": "MIT", diff --git a/packages/query-persist-client-core/package.json b/packages/query-persist-client-core/package.json index 5bf3e4e453..d47f133bdd 100644 --- a/packages/query-persist-client-core/package.json +++ b/packages/query-persist-client-core/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/query-persist-client-core", - "version": "5.32.0", + "version": "5.34.1", "description": "Set of utilities for interacting with persisters, which can save your queryClient for later use", "author": "tannerlinsley", "license": "MIT", diff --git a/packages/query-sync-storage-persister/package.json b/packages/query-sync-storage-persister/package.json index 117795676d..8621d1fb4d 100644 --- a/packages/query-sync-storage-persister/package.json +++ b/packages/query-sync-storage-persister/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/query-sync-storage-persister", - "version": "5.32.0", + "version": "5.34.1", "description": "A persister for synchronous storages, to be used with TanStack/Query", "author": "tannerlinsley", "license": "MIT", diff --git a/packages/react-query-devtools/package.json b/packages/react-query-devtools/package.json index 8e487c419f..36b60be18f 100644 --- a/packages/react-query-devtools/package.json +++ b/packages/react-query-devtools/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/react-query-devtools", - "version": "5.32.0", + "version": "5.34.1", "description": "Developer tools to interact with and visualize the TanStack/react-query cache", "author": "tannerlinsley", "license": "MIT", diff --git a/packages/react-query-next-experimental/package.json b/packages/react-query-next-experimental/package.json index 5a47c1bf09..194cfe57e4 100644 --- a/packages/react-query-next-experimental/package.json +++ b/packages/react-query-next-experimental/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/react-query-next-experimental", - "version": "5.32.0", + "version": "5.34.1", "description": "Hydration utils for React Query in the NextJs app directory", "author": "tannerlinsley", "license": "MIT", diff --git a/packages/react-query-persist-client/package.json b/packages/react-query-persist-client/package.json index e3efdea505..4e3029e0bc 100644 --- a/packages/react-query-persist-client/package.json +++ b/packages/react-query-persist-client/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/react-query-persist-client", - "version": "5.32.0", + "version": "5.34.1", "description": "React bindings to work with persisters in TanStack/react-query", "author": "tannerlinsley", "license": "MIT", diff --git a/packages/react-query/package.json b/packages/react-query/package.json index 2dfde7edd0..bdab173b23 100644 --- a/packages/react-query/package.json +++ b/packages/react-query/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/react-query", - "version": "5.32.0", + "version": "5.34.1", "description": "Hooks for managing, caching and syncing asynchronous and remote data in React", "author": "tannerlinsley", "license": "MIT", diff --git a/packages/solid-query-devtools/package.json b/packages/solid-query-devtools/package.json index b01530651a..f8465acf39 100644 --- a/packages/solid-query-devtools/package.json +++ b/packages/solid-query-devtools/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/solid-query-devtools", - "version": "5.32.0", + "version": "5.34.1", "description": "Developer tools to interact with and visualize the TanStack/solid-query Query cache", "author": "tannerlinsley", "license": "MIT", diff --git a/packages/solid-query-persist-client/package.json b/packages/solid-query-persist-client/package.json index f72f846a09..c9599d058b 100644 --- a/packages/solid-query-persist-client/package.json +++ b/packages/solid-query-persist-client/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/solid-query-persist-client", - "version": "5.32.0", + "version": "5.34.1", "description": "Solid.js bindings to work with persisters in TanStack/solid-query", "author": "tannerlinsley", "license": "MIT", diff --git a/packages/solid-query/package.json b/packages/solid-query/package.json index caf799a0b8..1ab3b2c3cb 100644 --- a/packages/solid-query/package.json +++ b/packages/solid-query/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/solid-query", - "version": "5.32.0", + "version": "5.34.1", "description": "Primitives for managing, caching and syncing asynchronous and remote data in Solid", "author": "tannerlinsley", "license": "MIT", diff --git a/packages/solid-query/src/__tests__/createQuery.test-d.tsx b/packages/solid-query/src/__tests__/createQuery.test-d.tsx index 5301d0c379..91717c34d7 100644 --- a/packages/solid-query/src/__tests__/createQuery.test-d.tsx +++ b/packages/solid-query/src/__tests__/createQuery.test-d.tsx @@ -14,12 +14,12 @@ describe('initialData', () => { }) it('TData should be defined when passed through queryOptions', () => { - const options = queryOptions(() => ({ + const options = queryOptions({ queryKey: ['key'], queryFn: () => ({ wow: true }), initialData: { wow: true }, - })) - const { data } = createQuery(options) + }) + const { data } = createQuery(() => options) expectTypeOf(data).toEqualTypeOf<{ wow: boolean }>() }) diff --git a/packages/solid-query/src/__tests__/queryOptions.test-d.tsx b/packages/solid-query/src/__tests__/queryOptions.test-d.tsx new file mode 100644 index 0000000000..080b23e5c3 --- /dev/null +++ b/packages/solid-query/src/__tests__/queryOptions.test-d.tsx @@ -0,0 +1,147 @@ +import { describe, expect, expectTypeOf, it } from 'vitest' +import { QueryClient, dataTagSymbol, skipToken } from '@tanstack/query-core' +import { createQuery, queryOptions } from '../createQuery' + +describe('queryOptions', () => { + it('should not allow excess properties', () => { + queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + // @ts-expect-error this is a good error, because stallTime does not exist! + stallTime: 1000, + }) + }) + it('should infer types for callbacks', () => { + queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + staleTime: 1000, + select: (data) => { + expectTypeOf(data).toEqualTypeOf() + }, + }) + }) + it('should work when passed to createQuery', () => { + const options = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + }) + + const { data } = createQuery(() => options) + expectTypeOf(data).toEqualTypeOf() + }) + it('should work when passed to fetchQuery', async () => { + const options = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + }) + + const data = await new QueryClient().fetchQuery(options) + expectTypeOf(data).toEqualTypeOf() + }) + it('should tag the queryKey with the result type of the QueryFn', () => { + expect(() => { + const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + }) + + expectTypeOf(queryKey[dataTagSymbol]).toEqualTypeOf() + }) + }) + it('should tag the queryKey even if no promise is returned', () => { + const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => 5, + }) + + expectTypeOf(queryKey[dataTagSymbol]).toEqualTypeOf() + }) + it('should tag the queryKey with unknown if there is no queryFn', () => { + const { queryKey } = queryOptions({ + queryKey: ['key'], + }) + + expectTypeOf(queryKey[dataTagSymbol]).toEqualTypeOf() + }) + it('should tag the queryKey with the result type of the QueryFn if select is used', () => { + const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + select: (data) => data.toString(), + }) + + expectTypeOf(queryKey[dataTagSymbol]).toEqualTypeOf() + }) + it('should return the proper type when passed to getQueryData', () => { + const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + }) + + const queryClient = new QueryClient() + const data = queryClient.getQueryData(queryKey) + expectTypeOf(data).toEqualTypeOf() + }) + it('should return the proper type when passed to getQueryState', () => { + const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + }) + + const queryClient = new QueryClient() + const state = queryClient.getQueryState(queryKey) + expectTypeOf(state?.data).toEqualTypeOf() + }) + it('should properly type updaterFn when passed to setQueryData', () => { + const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + }) + + const queryClient = new QueryClient() + const data = queryClient.setQueryData(queryKey, (prev) => { + expectTypeOf(prev).toEqualTypeOf() + return prev + }) + expectTypeOf(data).toEqualTypeOf() + }) + it('should properly type value when passed to setQueryData', () => { + const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + }) + + const queryClient = new QueryClient() + + // @ts-expect-error value should be a number + queryClient.setQueryData(queryKey, '5') + // @ts-expect-error value should be a number + queryClient.setQueryData(queryKey, () => '5') + + const data = queryClient.setQueryData(queryKey, 5) + expectTypeOf(data).toEqualTypeOf() + }) + + it('should infer even if there is a conditional skipToken', () => { + const options = queryOptions({ + queryKey: ['key'], + queryFn: Math.random() > 0.5 ? skipToken : () => Promise.resolve(5), + }) + + const queryClient = new QueryClient() + const data = queryClient.getQueryData(options.queryKey) + expectTypeOf(data).toEqualTypeOf() + }) + + it('should infer to unknown if we disable a query with just a skipToken', () => { + const options = queryOptions({ + queryKey: ['key'], + queryFn: skipToken, + }) + + const queryClient = new QueryClient() + const data = queryClient.getQueryData(options.queryKey) + expectTypeOf(data).toEqualTypeOf() + }) +}) diff --git a/packages/solid-query/src/createQueries.ts b/packages/solid-query/src/createQueries.ts index 48859abe7d..8157c75d50 100644 --- a/packages/solid-query/src/createQueries.ts +++ b/packages/solid-query/src/createQueries.ts @@ -37,9 +37,16 @@ type CreateQueryOptionsForCreateQueries< TQueryKey extends QueryKey = QueryKey, > = OmitKeyof< SolidQueryOptions, - 'placeholderData' + 'placeholderData' | 'suspense' > & { placeholderData?: TQueryFnData | QueriesPlaceholderDataFunction + /** + * @deprecated The `suspense` option has been deprecated in v5 and will be removed in the next major version. + * The `data` property on createQueries is a plain object and not a SolidJS Resource. + * It will not suspend when the data is loading. + * Setting `suspense` to `true` will be a no-op. + */ + suspense?: boolean } // Avoid TS depth-limit error in case of large array literal diff --git a/packages/solid-query/src/createQuery.ts b/packages/solid-query/src/createQuery.ts index 6d9f6261e9..098ccf0a7e 100644 --- a/packages/solid-query/src/createQuery.ts +++ b/packages/solid-query/src/createQuery.ts @@ -1,7 +1,7 @@ import { QueryObserver } from '@tanstack/query-core' import { createMemo } from 'solid-js' import { createBaseQuery } from './createBaseQuery' -import type { DefaultError, QueryKey } from '@tanstack/query-core' +import type { DataTag, DefaultError, QueryKey } from '@tanstack/query-core' import type { QueryClient } from './QueryClient' import type { Accessor } from 'solid-js' import type { @@ -39,26 +39,40 @@ export function queryOptions< TError = unknown, TData = TQueryFnData, TQueryKey extends QueryKey = QueryKey, - TOptions extends UndefinedInitialDataOptions< - TQueryFnData, - TError, - TData, - TQueryKey - > = UndefinedInitialDataOptions, ->(options: TOptions): TOptions + TOptions extends ReturnType< + UndefinedInitialDataOptions + > = ReturnType< + UndefinedInitialDataOptions + >, +>( + options: ReturnType< + UndefinedInitialDataOptions + >, +): ReturnType< + UndefinedInitialDataOptions +> & { + queryKey: DataTag +} export function queryOptions< TQueryFnData = unknown, TError = unknown, TData = TQueryFnData, TQueryKey extends QueryKey = QueryKey, - TOptions extends DefinedInitialDataOptions< - TQueryFnData, - TError, - TData, - TQueryKey - > = DefinedInitialDataOptions, ->(options: TOptions): TOptions + TOptions extends ReturnType< + DefinedInitialDataOptions + > = ReturnType< + DefinedInitialDataOptions + >, +>( + options: ReturnType< + DefinedInitialDataOptions + >, +): ReturnType< + DefinedInitialDataOptions +> & { + queryKey: DataTag +} export function queryOptions(options: unknown) { return options diff --git a/packages/solid-query/src/types.ts b/packages/solid-query/src/types.ts index 5fbcf1afd5..85d3ce4ecb 100644 --- a/packages/solid-query/src/types.ts +++ b/packages/solid-query/src/types.ts @@ -24,14 +24,23 @@ export interface CreateBaseQueryOptions< TData = TQueryFnData, TQueryData = TQueryFnData, TQueryKey extends QueryKey = QueryKey, -> extends QueryObserverOptions< - TQueryFnData, - TError, - TData, - TQueryData, - TQueryKey +> extends OmitKeyof< + QueryObserverOptions, + 'suspense' > { + /** + * Only applicable while rendering queries on the server with streaming. + * Set `deferStream` to `true` to wait for the query to resolve on the server before flushing the stream. + * This can be useful to avoid sending a loading state to the client before the query has resolved. + * Defaults to `false`. + */ deferStream?: boolean + /** + * @deprecated The `suspense` option has been deprecated in v5 and will be removed in the next major version. + * The `data` property on createQuery is a SolidJS resource and will automatically suspend when the data is loading. + * Setting `suspense` to `false` will be a no-op. + */ + suspense?: boolean } export interface SolidQueryOptions< @@ -93,10 +102,22 @@ export interface SolidInfiniteQueryOptions< TQueryKey, TPageParam >, - 'queryKey' + 'queryKey' | 'suspense' > { queryKey: TQueryKey + /** + * Only applicable while rendering queries on the server with streaming. + * Set `deferStream` to `true` to wait for the query to resolve on the server before flushing the stream. + * This can be useful to avoid sending a loading state to the client before the query has resolved. + * Defaults to `false`. + */ deferStream?: boolean + /** + * @deprecated The `suspense` option has been deprecated in v5 and will be removed in the next major version. + * The `data` property on createInfiniteQuery is a SolidJS resource and will automatically suspend when the data is loading. + * Setting `suspense` to `false` will be a no-op. + */ + suspense?: boolean } export type CreateInfiniteQueryOptions< diff --git a/packages/svelte-query-devtools/package.json b/packages/svelte-query-devtools/package.json index d5256f47ff..752a3073be 100644 --- a/packages/svelte-query-devtools/package.json +++ b/packages/svelte-query-devtools/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/svelte-query-devtools", - "version": "5.32.0", + "version": "5.34.1", "description": "Developer tools to interact with and visualize the TanStack/svelte-query cache", "author": "Lachlan Collins", "license": "MIT", diff --git a/packages/svelte-query-persist-client/package.json b/packages/svelte-query-persist-client/package.json index c7bcc2ca96..7326fca494 100644 --- a/packages/svelte-query-persist-client/package.json +++ b/packages/svelte-query-persist-client/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/svelte-query-persist-client", - "version": "5.32.0", + "version": "5.34.1", "description": "Svelte bindings to work with persisters in TanStack/svelte-query", "author": "Lachlan Collins", "license": "MIT", diff --git a/packages/svelte-query/package.json b/packages/svelte-query/package.json index 7419f64f97..ad82012234 100644 --- a/packages/svelte-query/package.json +++ b/packages/svelte-query/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/svelte-query", - "version": "5.32.0", + "version": "5.34.1", "description": "Primitives for managing, caching and syncing asynchronous and remote data in Svelte", "author": "Lachlan Collins", "license": "MIT", diff --git a/packages/vue-query-devtools/package.json b/packages/vue-query-devtools/package.json index 5a5860aa4b..3cd2d863b6 100644 --- a/packages/vue-query-devtools/package.json +++ b/packages/vue-query-devtools/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/vue-query-devtools", - "version": "5.32.0", + "version": "5.34.1", "description": "Developer tools to interact with and visualize the TanStack/vue-query cache", "author": "tannerlinsley", "license": "MIT", diff --git a/packages/vue-query/package.json b/packages/vue-query/package.json index 1528b3cafd..0665c84aeb 100644 --- a/packages/vue-query/package.json +++ b/packages/vue-query/package.json @@ -1,6 +1,6 @@ { "name": "@tanstack/vue-query", - "version": "5.32.0", + "version": "5.34.1", "description": "Hooks for managing, caching and syncing asynchronous and remote data in Vue", "author": "Damian Osipiuk", "license": "MIT", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 1a7ebbe118..d8597a3566 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -155,7 +155,7 @@ importers: specifier: ^17.3.3 version: 17.3.3(@angular/common@17.3.3)(@angular/core@17.3.3)(@angular/platform-browser@17.3.3)(rxjs@7.8.1) '@tanstack/angular-query-experimental': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/angular-query-experimental rxjs: specifier: ^7.8.1 @@ -177,7 +177,7 @@ importers: specifier: ^17.3.3 version: 17.3.3(@angular/compiler@17.3.3)(typescript@5.2.2) '@tanstack/angular-query-devtools-experimental': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/angular-query-devtools-experimental typescript: specifier: 5.2.2 @@ -210,7 +210,7 @@ importers: specifier: ^17.3.3 version: 17.3.3(@angular/common@17.3.3)(@angular/core@17.3.3)(@angular/platform-browser@17.3.3)(rxjs@7.8.1) '@tanstack/angular-query-experimental': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/angular-query-experimental rxjs: specifier: ^7.8.1 @@ -232,7 +232,7 @@ importers: specifier: ^17.3.3 version: 17.3.3(@angular/compiler@17.3.3)(typescript@5.2.2) '@tanstack/angular-query-devtools-experimental': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/angular-query-devtools-experimental typescript: specifier: 5.2.2 @@ -265,7 +265,7 @@ importers: specifier: ^17.3.3 version: 17.3.3(@angular/common@17.3.3)(@angular/core@17.3.3)(@angular/platform-browser@17.3.3)(rxjs@7.8.1) '@tanstack/angular-query-experimental': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/angular-query-experimental rxjs: specifier: ^7.8.1 @@ -287,7 +287,7 @@ importers: specifier: ^17.3.3 version: 17.3.3(@angular/compiler@17.3.3)(typescript@5.2.2) '@tanstack/angular-query-devtools-experimental': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/angular-query-devtools-experimental typescript: specifier: 5.2.2 @@ -320,7 +320,7 @@ importers: specifier: ^17.3.3 version: 17.3.3(@angular/common@17.3.3)(@angular/core@17.3.3)(@angular/platform-browser@17.3.3)(rxjs@7.8.1) '@tanstack/angular-query-experimental': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/angular-query-experimental rxjs: specifier: ^7.8.1 @@ -342,7 +342,7 @@ importers: specifier: ^17.3.3 version: 17.3.3(@angular/compiler@17.3.3)(typescript@5.2.2) '@tanstack/angular-query-devtools-experimental': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/angular-query-devtools-experimental typescript: specifier: 5.2.2 @@ -357,10 +357,10 @@ importers: specifier: 4.22.1 version: 4.22.1 '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools algoliasearch: specifier: 4.22.1 @@ -373,7 +373,7 @@ importers: version: 18.2.0(react@18.2.0) devDependencies: '@tanstack/eslint-plugin-query': - specifier: ^5.28.11 + specifier: ^5.32.1 version: link:../../../packages/eslint-plugin-query '@types/react': specifier: ^18.2.55 @@ -394,10 +394,10 @@ importers: examples/react/auto-refetching: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools axios: specifier: ^1.6.7 @@ -418,10 +418,10 @@ importers: examples/react/basic: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools axios: specifier: ^1.6.7 @@ -434,7 +434,7 @@ importers: version: 18.2.0(react@18.2.0) devDependencies: '@tanstack/eslint-plugin-query': - specifier: ^5.28.11 + specifier: ^5.32.1 version: link:../../../packages/eslint-plugin-query '@vitejs/plugin-react': specifier: ^4.2.1 @@ -446,10 +446,10 @@ importers: examples/react/basic-graphql-request: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools graphql: specifier: ^16.8.1 @@ -474,16 +474,16 @@ importers: examples/react/basic-typescript: dependencies: '@tanstack/query-sync-storage-persister': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/query-sync-storage-persister '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools '@tanstack/react-query-persist-client': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-persist-client axios: specifier: ^1.6.7 @@ -496,7 +496,7 @@ importers: version: 18.2.0(react@18.2.0) devDependencies: '@tanstack/eslint-plugin-query': - specifier: ^5.28.11 + specifier: ^5.32.1 version: link:../../../packages/eslint-plugin-query '@types/react': specifier: ^18.2.55 @@ -523,10 +523,10 @@ importers: examples/react/default-query-function: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools axios: specifier: ^1.6.7 @@ -548,10 +548,10 @@ importers: examples/react/infinite-query-with-max-pages: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools axios: specifier: ^1.6.7 @@ -575,10 +575,10 @@ importers: examples/react/load-more-infinite-scroll: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools axios: specifier: ^1.6.7 @@ -602,10 +602,10 @@ importers: examples/react/nextjs: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools ky: specifier: ^1.2.0 @@ -629,13 +629,13 @@ importers: examples/react/nextjs-suspense-streaming: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools '@tanstack/react-query-next-experimental': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-next-experimental next: specifier: ^14.0.0 @@ -663,19 +663,19 @@ importers: examples/react/offline: dependencies: '@tanstack/query-sync-storage-persister': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/query-sync-storage-persister '@tanstack/react-location': specifier: ^3.7.4 version: 3.7.4(react-dom@18.2.0)(react@18.2.0) '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools '@tanstack/react-query-persist-client': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-persist-client ky: specifier: ^1.2.0 @@ -703,10 +703,10 @@ importers: examples/react/optimistic-updates-cache: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools axios: specifier: ^1.6.7 @@ -740,10 +740,10 @@ importers: examples/react/optimistic-updates-ui: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools axios: specifier: ^1.6.7 @@ -777,10 +777,10 @@ importers: examples/react/pagination: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools axios: specifier: ^1.6.7 @@ -801,10 +801,10 @@ importers: examples/react/playground: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools react: specifier: ^18.2.0 @@ -823,10 +823,10 @@ importers: examples/react/prefetching: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools axios: specifier: ^1.6.7 @@ -856,10 +856,10 @@ importers: specifier: ^6.3.16 version: 6.3.16(@react-navigation/native@6.1.6)(react-native-gesture-handler@2.15.0)(react-native-safe-area-context@4.9.0)(react-native-screens@3.29.0)(react-native@0.73.4)(react@18.2.0) '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools expo: specifier: ^50.0.6 @@ -908,10 +908,10 @@ importers: examples/react/react-router: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools localforage: specifier: ^1.10.0 @@ -972,10 +972,10 @@ importers: specifier: ^5.15.2 version: 5.15.2(@types/react@18.2.61)(react@18.2.0) '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools react: specifier: ^18.2.0 @@ -1000,10 +1000,10 @@ importers: examples/react/shadow-dom: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools react: specifier: ^18.2.0 @@ -1046,10 +1046,10 @@ importers: examples/react/simple: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools axios: specifier: ^1.6.7 @@ -1083,10 +1083,10 @@ importers: specifier: ^5.15.2 version: 5.15.2(@types/react@18.2.61)(react@18.2.0) '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools react: specifier: ^18.2.0 @@ -1111,10 +1111,10 @@ importers: examples/react/suspense: dependencies: '@tanstack/react-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query '@tanstack/react-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/react-query-devtools axios: specifier: ^1.6.7 @@ -1157,10 +1157,10 @@ importers: specifier: ^7.5.3 version: 7.5.3(astro@4.6.2)(react@18.2.0) '@tanstack/solid-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/solid-query '@tanstack/solid-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/solid-query-devtools astro: specifier: ^4.6.1 @@ -1178,10 +1178,10 @@ importers: examples/solid/basic-graphql-request: dependencies: '@tanstack/solid-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/solid-query '@tanstack/solid-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/solid-query-devtools graphql: specifier: ^16.8.1 @@ -1206,10 +1206,10 @@ importers: examples/solid/basic-typescript: dependencies: '@tanstack/solid-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/solid-query '@tanstack/solid-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/solid-query-devtools solid-js: specifier: ^1.8.14 @@ -1228,10 +1228,10 @@ importers: examples/solid/default-query-function: dependencies: '@tanstack/solid-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/solid-query '@tanstack/solid-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/solid-query-devtools solid-js: specifier: ^1.8.14 @@ -1250,17 +1250,17 @@ importers: examples/solid/simple: dependencies: '@tanstack/solid-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/solid-query '@tanstack/solid-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/solid-query-devtools solid-js: specifier: ^1.8.14 version: 1.8.14 devDependencies: '@tanstack/eslint-plugin-query': - specifier: ^5.28.11 + specifier: ^5.32.1 version: link:../../../packages/eslint-plugin-query typescript: specifier: 5.2.2 @@ -1284,10 +1284,10 @@ importers: specifier: ^1.0.0-rc.0 version: 1.0.0-rc.0(@testing-library/jest-dom@6.4.2)(rollup@4.14.1)(solid-js@1.8.14)(vinxi@0.3.11)(vite@4.5.1) '@tanstack/solid-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/solid-query '@tanstack/solid-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/solid-query-devtools solid-js: specifier: ^1.8.14 @@ -1299,10 +1299,10 @@ importers: examples/svelte/auto-refetching: dependencies: '@tanstack/svelte-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query '@tanstack/svelte-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query-devtools devDependencies: '@sveltejs/adapter-auto': @@ -1330,10 +1330,10 @@ importers: examples/svelte/basic: dependencies: '@tanstack/svelte-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query '@tanstack/svelte-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query-devtools devDependencies: '@sveltejs/adapter-auto': @@ -1361,10 +1361,10 @@ importers: examples/svelte/load-more-infinite-scroll: dependencies: '@tanstack/svelte-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query '@tanstack/svelte-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query-devtools devDependencies: '@sveltejs/adapter-auto': @@ -1392,10 +1392,10 @@ importers: examples/svelte/optimistic-updates-typescript: dependencies: '@tanstack/svelte-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query '@tanstack/svelte-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query-devtools devDependencies: '@sveltejs/adapter-auto': @@ -1423,10 +1423,10 @@ importers: examples/svelte/playground: dependencies: '@tanstack/svelte-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query '@tanstack/svelte-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query-devtools devDependencies: '@sveltejs/adapter-auto': @@ -1454,10 +1454,10 @@ importers: examples/svelte/simple: dependencies: '@tanstack/svelte-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query '@tanstack/svelte-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query-devtools devDependencies: '@sveltejs/vite-plugin-svelte': @@ -1482,10 +1482,10 @@ importers: examples/svelte/ssr: dependencies: '@tanstack/svelte-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query '@tanstack/svelte-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query-devtools devDependencies: '@sveltejs/adapter-auto': @@ -1513,10 +1513,10 @@ importers: examples/svelte/star-wars: dependencies: '@tanstack/svelte-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query '@tanstack/svelte-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/svelte-query-devtools devDependencies: '@sveltejs/adapter-auto': @@ -1553,10 +1553,10 @@ importers: examples/vue/basic: dependencies: '@tanstack/vue-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/vue-query '@tanstack/vue-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/vue-query-devtools vue: specifier: ^3.3.0 @@ -1575,7 +1575,7 @@ importers: examples/vue/dependent-queries: dependencies: '@tanstack/vue-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/vue-query vue: specifier: ^3.3.0 @@ -1594,16 +1594,16 @@ importers: examples/vue/persister: dependencies: '@tanstack/query-core': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/query-core '@tanstack/query-persist-client-core': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/query-persist-client-core '@tanstack/query-sync-storage-persister': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/query-sync-storage-persister '@tanstack/vue-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/vue-query idb-keyval: specifier: ^6.2.1 @@ -1625,10 +1625,10 @@ importers: examples/vue/simple: dependencies: '@tanstack/vue-query': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/vue-query '@tanstack/vue-query-devtools': - specifier: ^5.32.0 + specifier: ^5.34.1 version: link:../../../packages/vue-query-devtools vue: specifier: ^3.3.0