TanStack

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

Join

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

xenial-black

4/13/2023

Invalidating queries for queryKeys generated using tkdodo's key factory pattern with optional params

Hey guys, i've followed the excellent patterns defined by @TkDodo 🔮 : https://tkdodo.eu/blog/leveraging-the-query-function-context The only differing thing I have done is that some arguments passed into the query key factory are optional. An example: ``` export const projectKeys = {...

eastern-cyan

4/12/2023

Weird build error when building my app

yarn run v1.22.19 ``` $ tsc node_modules/@tanstack/query-core/src/queryObserver.ts:543:46 - error TS2345: Argument of type '(TQueryData & ({} | null)) | (TData & ({} | null))' is not assignable to parameter of type 'TData'. 'TData' could be instantiated with an arbitrary type which could be unrelated to '(TQueryData & ({} | null)) | (TData & ({} | null))'....

useful-bronze

4/12/2023

How to refresh credentials that are used within queryFn without making them part of the cacheKey?

I have a scenario where credentials need to be refreshed every x minutes for subsequent requests to succeed.
Currently the queryFn uses old cached credentials despite the react state containing the updated credentials. I assume queryFn is using some memorisation in some fashion internally. ...

correct-apricot

4/12/2023

how to type-safely pass an argument to useQuery from a previous request?

https://stackoverflow.com/questions/75997835/how-to-type-safely-pass-an-argument-to-usequery-from-a-previous-request

rare-sapphire

4/12/2023

Should you use `select` to "transform" data?

I am making a query for an autosuggest and I want to change its shape. Would using select be a bad choice? ```typescript useQuery({ queryKey: ["games"],...

subsequent-cyan

4/12/2023

Suspense with next-13, using the Pages not app DIR

Hello, all I was reading through the docs, and I thought to enable suspense it can be done at the query level? however I am running through some issue with getting a 500 when enabling the option, I am using next 13 "next": "13.1.1", but the pages. Here is how my query looks. Wondering if I am missing something?

plain-purple

4/12/2023

implement polling in react with useQuery

I want to implement a polling query in react, but i want the query to stop re-fetching as soon as the expected data hits the app It's more like re-fetching until the data has been defined (for context, I'm using it to verify solana pay transactions https://solanapay.com/ What's the best way to do this?...

extended-salmon

4/11/2023

Did Next 13.3 break react-query for someone else?

Askin for a friend.. 🙂

flat-fuchsia

4/11/2023

Sorting and filtering data only once.

I read @TkDodo 🔮 's blog on data transformations: https://tkdodo.eu/blog/react-query-data-transformations I want to fetch and cache a large amount of data in a query. Then on the client I want to filter and sort it, so that each component can subscribe to only the subset of data it needs. Filtering and sorting this data on the client can be expensive. For example, I might fetch 2 years of data, and a component might only need 1 week of that data. ...

quickest-silver

4/10/2023

Unable to troubleshoot "Missing queryFn"

Hello, I not able to troubleshoot this error. I am on Nextjs 13 I have a page /profile that loads up fine the first time user logs in (router.push('/profile') onsuccess) . This page has a component ProfileMain that calls : ```const { data: userData, isLoading } = useQuery( ["userData", userId], () => fetchUserData(userId),...

correct-apricot

4/10/2023

axios.get is success but useQuery throw "undefined" error

I'm using useQuery with axios in many case. In most case, everything is ok. But in a specific case, useQuery throw "got undefined" error. It's wired because when see server and frontend log, api response is ok. When data is passed to useQuery from axios, undefined erorr throw from here(https://github.com/TanStack/query/blob/8969dc1649e4f7c49103032ef565b076f05a9ee6/packages/query-core/src/query.ts#L466)...

rare-sapphire

4/10/2023

Cache AND Queries getting wiped from queryClient.

I am honestly stumped on this one. I don't know if it's ClerkAuth or React Query that is the issue here, but when I switch organizations using the org switcher. My cache is completely wiped out even though I have not navigated to another page. Very weird behavior. Anyone have any ideas on how to trace this? I can literally watch the cache state get wiped out in the react dev tools and RQ devtools. I just don't understand how the queries are getting unloaded by a totally different context changin...

rival-black

4/8/2023

initialData vs hydration, for SSR is always better hydration approach?

I have read these documentation: https://tanstack.com/query/v4/docs/react/guides/ssr#using-initialdata and https://tanstack.com/query/v4/docs/react/guides/ssr#using-hydration. For what I can understand the hydration method have more adventages that the initialData approach right?...

national-gold

4/8/2023

Why can't I update `setQueryData` mutably?

```ts queryClient.setQueryData<{ pages: Message[][] }>( queryKeys.channelMessages(channelId), (ctx) => { const shouldAdd =...

mute-gold

4/8/2023

Top Level Application State with React Query

We’re planning a refactoring and I want to enforce all fetch logic to be with react query. I’m tempted to create context for this though which is an anti pattern, but what other clean ways to solve this. Problem: Our application is wrapped by an auth layer then after auth, we fetch user settings which helps build UI. I want these to be called prior to rendering anything down the tree. ...

wise-white

4/8/2023

How to bust persisted cache on SSR

I am using local storage in my nextjs project for persisting the react query cache like below. I was wondering if there is a way I can bust the cache on server side or if there is a recommended way to do it. Any help will be appreciated, thanks! ```jsx <PersistQueryClientProvider client={queryClient}...

narrow-beige

4/7/2023

What method should i use to clean up the data before ovewrite it? trying with setQueryData to null.

Hello . I have a react and node project , and i encountered a problem by applying filters to my data , first i obtain general products for my page to render , then i want to apply filters to those products, and clean the previous products and only display the new ones.
I tried that by using the setQueryData to null and then setting the data to the one i needed, and it works in a weird way, cause the first time i click the button it renders me the right products but also the previous ones , and when i click it again , it works perfectly, it deletes the products i got on my first render and only shows me the filtered ones. ¿ What method should i use to clean up the data before ovewrite it? I have tried refetchQueries,invalidateQueries,cancelQueries, but none of those works (I know i´m probably not using them correctly, i´m new using reactQuery). Or is it a better way to do what i want ? To set the new queryData ("productos") to just the new ones for the first click. ...

xenial-black

4/7/2023

I have a failing overload for `useQuery`

this occured when I added the retry: (retryCount, error) => boolean | void function to my config

rare-sapphire

4/7/2023

Frequent Violation warnings for setTimeout and setInterval

I receive a lot of these when I have any queries running. Should I be concerned?

wise-white

4/6/2023

Multiple QueryClientProvider

Is creating multiple QueryClientProvider in the same application bad? The requests are being made to the same backend, but some pages want a different refetch interval. is it a bad practice to have multiple QueryClientProviders? Should I pass the config to the useQuery direct?...

Previous Next

Gaming

Programming

TanStack

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

TanStack

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