TanStack

T

TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs

Join

react-query-questions

solid-query-questions

table-questions

virtual-questions

router-questions

react-charts-questions

ranger-questions

vue-query-questions

svelte-query-questions

bling-questions

form-questions

angular-query-questions

start-questions

db-questions

start-showcase

router-showcase

📣-announcements

stormy-gold
stormy-gold11/24/2025

anyone know why fast refresh would cause the useQuery to become unresponsive?

it works before fast refresh without any issue but the moment i save something it stops working.
quickest-silver
quickest-silver11/24/2025

How to combine two TanStack Query results into a single object in Angular?

I have two separate queries using @tanstack/angular-query: ```ts roles = injectQuery(() => ({ enabled: this.user.data(),...
foreign-sapphire
foreign-sapphire11/21/2025

Refactoring queries

I'm working on a big enterprise project that grew out of a startup. Just like any other startup, it has all the same problems—fast-growing, constantly changing requirements, tons of code, different architectural approaches, etc. With a growing codebase, I started to observe query key collisions, and I want to clean this mess up, as it's becoming harder to maintain and catch bugs. I was looking into 2 possible solutions: 1. query-key-factory 2. query options To give you an example of the code, everywhere in the project we use custom hooks like this one:...
implicit-lime
implicit-lime11/20/2025

Looking for work as a Frontend developer

As an Angular/Vue.js developer with 6 years' experience, I craft fast web apps using RxJS/NgRx and Composition API/Pinia for state management. Modern TypeScript/JavaScript drives these implementations, paired with MUI/Tailwind CSS for polished interfaces. Seamless REST/GraphQL API connections bridge to backends, occasionally enhanced with Node.js/.NET support and SQL/MongoDB databases. Recent projects incorporate AI tools like OpenAI/ChatGPT for smart features in Angular/Vue environments....
rising-crimson
rising-crimson11/20/2025

Does the queryFn need to have a stable reference?

When providing useQuery with a queryFn, will the query fire each time it receives a new queryFn reference? E.g., when defining a function inline: ```ts function useFoo() { const queryFn = () => Promise.resolve("ok");...
extended-salmon
extended-salmon11/19/2025

Next.js (16.0.3) | useMutation | An unexpected response was received from the server.

Hey guys, I am trying to move from next 15.3.4 -> 16.0.3 and react 19 -> 19.2 and I have been experiencing some errors that I can't figure out how to solve. What was working before the version bump, now throws the error you can see commented out and skips the onSuccess. The only way I have managed to bypass the problem is to switch to onSettled but that doesn't feel like the right solution...
```javascript...
absent-sapphire
absent-sapphire11/17/2025

Infinite query's fetchNextPage manual hasNextPage check

Hi, I was wondering why fetchNextPage doesn't automatically check if there is a next page to fetch. For example the docs give this example. I get why isFetching is not automatically checked but I can't find any logical reason for the hasNextPage not automatically be included in the fetchNextPage. ...
rare-sapphire
rare-sapphire11/15/2025

recommended pattern to work with

hi, i love this library but there is one catch with it and is when adding a new service/endpoint requests, it feels kinda a slow process (at least the way im doing it) which is the following add a new directory in the api folder with the endpoint name make an index.ts file with the querykeys for that service...
inland-turquoise
inland-turquoise11/14/2025

Idea: add pendingMs / minPendingMs for mutation isPending

Hello! I was wondering if it could make sense to add pendingMs and minPendingMs (similar to what exists in TanStack Router) for the isPending state (or more likely a derived state, I don't know) in TanStack Query. For context, I generally avoid optimistic updates (complexity and other reasons lol), so I use the onSuccess callback of mutations to update the data. While a mutation is in progress, I disable parts of my UI (like reduce opacityor show a loading state) so the user knows something is happening....
ambitious-aqua
ambitious-aqua11/13/2025

Is there a reason MutationObserver.#updateResult is private?

Hey! I made a MobX adapter for TanStack Query v4. It works great - we have a MobxQuery, MobxMutation and MobxQueries that are same as the corresponding React hooks, reactivity works, everything is well. When trying to upgrade to v5, MobxMutation no longer works. The reason is, at some point in the lifecycle, I called the "private" function updateResult on my local MutationObserver instance. In v4 it was just a Typescript "private" so calling it worked on runtime. Not optimal but fits my needs. Now in v5 it's actually nonexistent outside of the class. My adapter behavior relies on calling this. ...
firm-tan
firm-tan11/13/2025

tanstack query devtool is not showing on staging server ( not production )

we have different environments, it used to show on staging env ( the devtool ) and now it is not showing up
like-gold
like-gold11/12/2025

React query + TanStack forms for immediate mutations instead of on submit

Hi, I have a form where I would like to save the edits to the fields immediately (or in case of text inputs with a debounce) to the server instead of when the user hits submit. So basically this should work like an autosave feature. The tanstack form onChange + onChangeDebounceMs api seems ideal for this. How should I handle rapid API calls that lead to potential race conditions and how do I notice when the form state and server state get out of sync?...
optimistic-gold
optimistic-gold11/11/2025

Is this best practice or what is the best way to achieve this?

What I want; - fetch all data in the beginning as batch and only once - merge batch with initial data, that needs to load immedtiately, because fetched data belongs with initialdata , but initialdata needs to be present immediately - provide a o(1) lookup of each spice, individual data, to make it easy and accessible to set new data, check/look it up and get it, I can’t use maps, since they don’t serialize well and objects are clunky. ...
No description
frail-apricot
frail-apricot11/7/2025

Calling dependent queries declaratively and imperatively

Hi, is there any good way to be able to call dependent queries both via hooks and imperatively? For independent queries, it's great that you can do this ```ts const projectsOpts = (userId: string) => ({ queryKey: ['user', userId, 'projects'], queryFn: () => fetchProjects(userId),...
vicious-gold
vicious-gold11/7/2025

Pass custom data to mutate function

Hi I have a custom hook wrapping useMutation. onSuccess callback is used to invalidate some qeries and show a notification. Basically this notificaitons is needed for each call except one. Can I pass a condition to onSuccess so I can control the behaviour when calling mutate() ? thanks...
foreign-sapphire
foreign-sapphire11/6/2025

How to re-render with query and useForm

Hi guys, i have make a hooks with tanstack query and i want to sorted my data with useForm, so i select a profile and i put this profile in my query for sorted but my query don't want re-render so it's happens nothing, how to do for my query re-renders ? Code : ```typescript import { PlanningTodo, Projet } from '@/utils/types/databaseTypes';...
conscious-sapphire
conscious-sapphire11/6/2025

Is it bad practice to use useMutation or useQuery inside a service class (React Query + TypeScript)?

I’ve built an authentication flow using React Query and TypeScript, and everything works fine. But I’m not sure if calling useMutation() inside a service class is considered a bad practice, instead of defining it directly inside the React component. Does this approach break any React rules ?...
No description
modern-teal
modern-teal11/5/2025

Benchmarking experimental persist plugin

The experimental_createQueryPersister seems to be slower compared to the <PersistQueryClientProvider /> one. I get that experimental_createQueryPersister restores from disk when needed, while <PersistQueryClientProvider /> restores the whole cache over RQ's in-memory cache. I am asking if there are any known methods of benchmarking the plugin. I am trying to use op-sqlite's KV storage too, so I want to rule out the possibility of the KV storage being too slow....
gradual-turquoise
gradual-turquoise11/4/2025

Performance Question. useQuery in each component or pass the data in as a prop to each?

From a performance standpoint, if I have a list of 500 items that all need a big object that is in the query cache, is it better for me to have a useQuery call in each of the 500 components or have one call in the parent and pass the whole object as a prop to each of the 500 items.
extended-salmon
extended-salmon11/4/2025

Prevent useSuspenseQuery throw

Hi all. The thing is that I have a suspense query that get's an array which I use to build up a navigation. I've got static navigation items and with the suspense query I check if dynamic children should be added. ...
Next