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

inland-turquoise
inland-turquoise3/27/2023

call 2 independent endpoints in one useMutation or should I use 2? What's the best practice?

I have one form and one save button, but the content of the form goes to 2 endpoints. They are somehow independent, which means they don't need result to each other to be operated successfully. Is it best that I have : ```js useQuery for endpoint 1 userQuery for endpoint 2 useMutation for endpoint 1...
conscious-sapphire
conscious-sapphire3/27/2023

data is possibly undefined

I'm guarding with if (error) return .. and if (isLoading) return .. like in the docs, however it still says data might be undefined? Whats the way to deal with this in tanstakc query now?
xenial-black
xenial-black3/27/2023

React-query devtools

Hello guys, im new here, im new in nextjs and new in react-query, the question is: can i use the react-query devtools in nextjs 13.2 with experimental appDir? please help me D:
national-gold
national-gold3/26/2023

React query with paginator.

What should I use if for example I have a list of items and they are paginated (see image). At the moment I would display 5 items per page (bubble) Preferably I would want to load all the data of each visible bubble. In this case 1 2 3 4 17 18 19 20...
No description
magic-amber
magic-amber3/26/2023

Multiple mutations based on dynamic list - separate mutation for each row in the table

Is it possible to have multiple (dynamic) lists of mutations? I have a list (table) of items. For each element I'd like to be able to click the 'Delete' button separately. So each row would have a different isLoading state for mutations. For example, imagine the following GUI: ```...
probable-pink
probable-pink3/26/2023

Invalidating a query from outside React context

Is there some reason I can't trigger queryClient.invalidateQueries() from outside the React context, like a timer or a socket.io listener? One use case is a session timer that periodically checks to see if the session is about to expire, so I can pop up a dialog. I'm seeing some strange things with queries not getting updated when I invalidate from my timer. I also want to be able to invalidate data when I get messages from a web socket, which is a similar problem....
deep-jade
deep-jade3/25/2023

useInfiniteQuery, refetch certain page

is it possible to fetch certain page instead of all pages? because i plan to insert some page in the middle, and fetch them
optimistic-gold
optimistic-gold3/24/2023

Cannot disable query with Solidjs signal

Have anyone had issue with enabling / disabling queries using signal in solid? I am trying to block query from refetching when user is editing the form but despite the state of the signal, query.isDisabled() is constantly false....
afraid-scarlet
afraid-scarlet3/24/2023

Cache query errors

Hello. I wonder if there is an option that I could cache useQuery errors to account for staleTime?
I have extracted useQuery into separate hook and I am using it in several places. I am also displaying error when request fails in onError callback of that useQuery. Now when re-used in several places it is causing the error to display several times. ...
correct-apricot
correct-apricot3/24/2023

Optimistic update when the request and response type are different

Let's say I have a task list. I use 2 apis - 1. getTask which gives a response of the type ``` type TaskData = { _id: ObjectId,...
xenial-black
xenial-black3/23/2023

The useQuery field isLoading is changing whenever I focus on window,

when i focus on window, the react query will refetch the api call, and my api return 400 with error code, this is expected behavior, but how do we prevent the isLoading from changing? For some reason the isLoading always changing from true to false, when it is refetch when focus on window. Though the api return the same 400 value. This is not the issue if my api return correct data . Thanks for the help!...
probable-pink
probable-pink3/23/2023

typescript parallel useQuery/useInfiniteQuery type guard for data?

Hey there! Is there a way/best practice to type guard multiple queries w/o using useQueries? I have a page that has a handful of mixed queries (regular and infinite) and what i would like to do is guarantee all have data before displaying anything. It's easily accomplished with a if ```ts if (query1.data && query2.data && query3.data) { ...
deep-jade
deep-jade3/23/2023

execute code after mutate

How do I wait for the mutate to done running before proceed to the code below? because when I tried to getQueryData, the data is outdated, most probably at that point mutate is not done yet. i know i can use the onSuccess event on the useMutation hook, but i think this is not the useMutation hook responsibility to handle this. I have also tried useMutationAsync, it works, but i'm not sure if i'm suppose to do that because i saw the blog discourage to do that....
No description
adverse-sapphire
adverse-sapphire3/23/2023

Cannot find module '@tanstack/react-query' or its corresponding type declarations.ts(2307)

I keep receiving this typescript error and I dont 'know how can I solve it, the package is installed and I'm using it
No description
stormy-gold
stormy-gold3/23/2023

useQuery is not refreshing data after setQueryData

Hello, why below snippet does not refresh useQuery which has queryKey equal to QueryKey.MyItems? As I log data from getQueryData, I see it's updated. ``` const { mutate: removeItem, isLoading } = useMutation( [QueryKey.RemoveFromMyLibrary],...
deep-jade
deep-jade3/22/2023

useInfiniteQuery: initial pageParams is unknown until first fetch

I have two APIs that will fetch chat messages api/chat/private/{roomId} - fetches latest bucket, for example if the latest bucket is ID 41, it will, fetch ID 41 without specifying bucketId api/chat/private/{roomId}/{bucketId} - fetches the specified bucket ID ...
No description
foreign-sapphire
foreign-sapphire3/22/2023

Prefetch Query and NextJS SSR

Hi, if I'm prefetching a query in SSR or ISR (in getStaticProps), does the prefetch actually block rendering/navigation? i.e. in the await prefetchQuery call, is the promise resolved when the actual function being executed in the prefetch resolves or does it resolve almost immediately? I basically want to know if there are any real downsides to prefetching my initial page queries, like if it can affect my initial render time or navigation time when ISR is not cached...
fascinating-indigo
fascinating-indigo3/21/2023

How to assert NonNullable data on UseQuery

I have a custom hook with infinite query. I check for undefined at the app first render and then it is reused so I know by then, the type should not be undefined. I would like to be able to infer its type without undefined conditionally. Can I do that? How to if so?? ``` export const useAppContext = (enabled = true) => api.appContext.getAppContext.useQuery(undefined, { staleTime: Infinity,...
criminal-purple
criminal-purple3/21/2023

Is error resolved with `onError` callback?

Hello Is the error resolved on the onError callback or do I need to await and parse it? ```ts...