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

like-gold
like-gold10/28/2023

Shuffle array in dependent query forever loop

Hi guys, I have this query: ``` function shuffleArray(array) { for (let i = array.length - 1; i > 0; i--) {...
foreign-sapphire
foreign-sapphire10/27/2023

cache craziness?

can someone sanity check something for me? i'm using sst + trpc + drizzleorm + aws + rds + postgres on the server, and i guess trpc + tanstack-query on the client side... when i do mutations, to say delete something from a list and go optimistically update the client state, via useUtils setData etc... everything is fine... then a few seconds later the browser does a request (tanstack query?) and gets OLD data back from "disk cache" and updates the view to how it was before my mutation! then a...
foreign-sapphire
foreign-sapphire10/27/2023

Nextjs 14 support for experimental streaming

Hi, will there be a release soon for @tanstack/react-query-next-experimental for Nextjs 14?
rising-crimson
rising-crimson10/27/2023

Why is my component not rerendering

Hello I have a component in which I call the useDocuments hook: ```ts const { data: documents, isLoading, isStale } = useDocuments(contracts); useEffect(() => {...
provincial-silver
provincial-silver10/27/2023

useMutation in library not receiving props from mutate

Hello everyone. I'm currently building a library with v5 of react-query. This library exports some hooks which are basically predefined useMutation hooks. When i now use these hooks the props passed to the mutate function are always undefined in the mutationFn. Doses anybody have an idea why that is happening?
variable-lime
variable-lime10/27/2023

Hydartion boundary (version 5) Next Js

When using hydration boundary with useInfiniteQuery , then useInfiniteQuery throwing error " Cannot read properties of undefined (reading 'length') at getNextPageParam " server component <HydrationBoundary state={dehydratedState}> ...
stormy-gold
stormy-gold10/26/2023

error while using react-query prefetching and SSR in nextJs with Shadcn/ui

Hello, I'm creating a data-table component with shadcn/ui and I've noticed that when when I try to fetch the data and pass it to component It takes a little while to render, since the component takes a data prop of type <Stock[]>, but the data returned by the query adds an undefined type to it so I have to wait until Its successful then pass it to the component. So I thought If of prefetching the query according to the docs to make it a little faster, but I get this error in the console and nothing changed pretty much. Here is the code to the important files (since the post is too long I had to put in a file) and the error from the console: the error: ...
extended-salmon
extended-salmon10/26/2023

Best way to poll for new data and merge with cache?

Basically, I have an expensive query that I want to make more efficient by only fetching new data based on an updateTime field that lives on every document, and then merging that in with existing data in the cache. This feels like something ReactQuery would handle natively, but it doesn't seem like it does. Am I missing something? Is there a way to do this "natively" or a more efficient approach? I asked this over on StackOverflow (https://stackoverflow.com/questions/77368878/how-to-efficiently-poll-for-data-with-react-query) with example code and more details, but then I noticed this lovely Discord channel....
metropolitan-bronze
metropolitan-bronze10/26/2023

useInfiniteQuery returns unmodified data after manual refetch triggered

Hello, I am trying to use useInfiniteQuery to implement pagination. I am using next v13 and @tanstack/react-query v4.27.0. The issue I am facing is that the useInfiniteQuery does not modify its returns on manual refetch. ...
grumpy-cyan
grumpy-cyan10/26/2023

global onError handling

With v4, we had this global handling of an inactive session. Basically when a refresh token expired, we would use this: ``` const queryClient = useQueryClient(); ...
fair-rose
fair-rose10/25/2023

Best practices for manipulating large data tables with react query

Hi, I am developing both backend and frontend of my application. I am running into troubles when fetching and manipulating data for a big table. I will explain a simplified scenario that highlights my problem. I have 3 database tables: documents, tags and comments....
helpful-purple
helpful-purple10/25/2023

onError global cache-level callbacks

Hi ! How can I prevent a component that throws an error from using the global onError? In other words, how can we avoid the global onError from executing sometimes?...
No description
optimistic-gold
optimistic-gold10/24/2023

TanStack query eslint prefer object syntax rule not found

Hi everyone, I'm just in the process of updating my react-native mobile app and I've come across an eslint error. The error suggests that the object syntax rule definition can't be found which doesn't seem right as the eslint config is taken directly from the eslint plugin docs see https://tanstack.com/query/v4/docs/react/eslint/eslint-plugin-query...
No description
harsh-harlequin
harsh-harlequin10/24/2023

Cannot remove "roles" on logout. Only works if refreshed.

I'm trying to clear "roles" since I'm fetching from my backend to authorize the flow to certain routes based on the role. When the user clicks "log out," I'm running the following code: ```js...
passive-yellow
passive-yellow10/24/2023

sideEffect on useMutation not working

Hey, I am trying to update a state upon success of a useMutation, before I added the sideEffect itt was all working fine but when I implemented the onSuccess side effect I am getting error I posted below. postMessage is an asycn function I am exporting from another file. It takes 3 parameters sessionId, userId, input
No description
deep-jade
deep-jade10/24/2023

ReactQuery Data error

I am saving token in localstorage with PersistQueryClientProvider but getting error message
Query data cannot be undefined. Please make sure to return a value other than undefined from your query function. Affected query key: ["token"]
Query data cannot be undefined. Please make sure to return a value other than undefined from your query function. Affected query key: ["token"]
...
conscious-sapphire
conscious-sapphire10/23/2023

Typescript error for empty array with useQueries

In following this example for dependent queries with useQueries, https://tanstack.com/query/latest/docs/react/guides/dependent-queries#usequeries-dependent-query Typescript is reporting an error when passing in an empty array for queries. Here are two variants showing the error while trying to troubleshoot the issue,...
flat-fuchsia
flat-fuchsia10/23/2023

useQuery AbortSignal does not cancel server operation

When using useQuery, the signal that is provided from queryFn does not work the exact same way as just cancelling it manually, right? ```ts export const useProducts = () => { const productSearchValue = useProductSearchValue();...
unwilling-turquoise
unwilling-turquoise10/22/2023

Did react query use to lock/freeze data before?

To put it simply, lets say that I return a list of todos from a queryFn, and if I try to mutate that array within mutateFn by just pushing to the same array I would get an error about it being locked/frozen. Now it seems its no longer the case. Did anything change regarding that?...
crude-lavender
crude-lavender10/21/2023

Migration to v5

I'm currently testing migration to V5 and was wondering why if I run the codemod its not picking up that I'm using the old syntax when setting query keys. I receive a number of unmodified files., with 0 errors, 0 skipped and 0 ok. Is there something I'm doing wrong?