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

fascinating-indigo

2/28/2024

Best way to get data inside inner components?

Hello, thank you in advance for your time. I am really new in Tanstack query and I would appreciate your help. I am using NextJs for a project and I have in my index this code. const { data: store, isFetching,...

fair-rose

2/28/2024

useQuery always refetching

Hi 👋 I'm new to using useQuery and I think I already follow the instructions from the documentation, so here is the snippet of my code, `const { data, isLoading, error } = useQuery({ queryKey: ["financialSankey", ticker], queryFn: () => fetchReport(ticker),...

correct-apricot

2/28/2024

how to define types for querykey?

Hello, a lot of times when I end up with some bugs in my app, i noticed that I was always using wrong querykey with methods such as setQueryData and I was wondering, is there a way to define the types, so that when I use setQueryData I would know that im entering correct queryKey. ``` export function useGetWeeklyDiaryNew( userId: string | undefined | null,...

passive-yellow

2/27/2024

"Lazy Query" dependent on an event occurrence - best approach?

Hey there. My problem is quite simple, but I struggle to find a good approach. The case looks like this:...

other-emerald

2/27/2024

Why is my query refetching when using the same query key?

I have this setup ```tsx const dataQuery = useQuery( [...

correct-apricot

2/27/2024

What is the generic type TContext in useMutation?

I can't find anything about in the docs

conscious-sapphire

2/27/2024

Potential Bug: RefetchIntervall callback fn is called even when the useQuery enabled = false

`function useCheckSpotify(isCheckingSpotifyAccountConnection: boolean) { return useQuery({ queryKey: ['isSpotifyAccountConnected'], queryFn: async () => { const response = await Axios({...

absent-sapphire

2/26/2024

svelte-query re-rendering page on preload

Hi, I'm trying to use svelte-query and I have a lot of it working, but I'm seeing unwanted behaviour, and I'm not sure where the fix would be. I have a page /1 that has a link to a sub page /1/foo/a. Both pages prefetch the same query as part of the load function. When viewing the /1 page you can trigger preload of the sub page by hovering/mousedown on the link depending on svelte config. This triggers the prefetch of the query if it is stale, which then triggers a re-render of the page you are viewing, which means that you scroll to the top, which is totally confusing....

environmental-rose

2/26/2024

Invalidation triggers re-fetch but not re-render of content

I have a mutation, where in it's onSuccess callback I do a query invalidation. When the invalidation is done the following happens: 1. The query is invalidated 2. A refetch is triggered 3. No re-render is done (i.e. the data is not updated in the view)...

correct-apricot

2/26/2024

confusing return type of `select`

When I use select, I encounter type errors because the return type is identical. I am confused about why we must return the data shape if there's no need for using select! ```ts /** * This option can be used to transform or select a part of the data returned by the query function. */...

national-gold

2/26/2024

Difference isPending and the isLoading(isFetching && isPending ) in react-query @v5

Many times around my app I do something like this ```tsx const {...

broad-brown

2/25/2024

calendar negative pages?

can I use this for a calendar view? planning on setting this up so that the query will get events for the current month, moving forward/backward will change the "page" number but then would it work with negative numbers if the current month is set as page 0? or is there a better way to handle this case? maybe set the current month page to be months from unix time 0, then set the default page number to that? im not sure what the best way to go around this is, and I would love some advice/feedback...

considerable-lavender

2/24/2024

Is it a bad design to use Suspense and SSR together?

Firstly, I apologize for my provocative and novice question. I tried to implement with Next.js@14.1 app router, react-query@v5, and Suspense, along with virtual infinite scroll (react-virtuoso). In fact, to take advantage of SSR, I think it’s better to write as a server component and use pagination instead of infinite scroll. However, it’s hard to give up infinite scroll because it’s so good on mobile screens. So, I tried to use next.js, Suspense, and react-query together, and I wondered if it’s...

modern-teal

2/24/2024

Strange useInfiniteQuery behavior

Hi everyone! I am experiencing strange behavior with useInfiniteQuery intermittently, with no root cause have been concluded so far (the issue has been there for a few months). Here is the error that are recorded in sentry (see attached picture). And also the code that calls useChatMessages (attached as well). I assume since in the code snippets i provide, the useChatMessages will only be enabled if the activeChat is not falsy right? Then i still don't get why it still evers throw the error that are reported in Sentry. Is it possible that there is some cases which this scenario happens? If so, how do i design the code so that it doesn't ever throw unexpected error as i provide on the Sentry log? (In short, i want to make sure that the function called inside must respect the enabled options) ...

flat-fuchsia

2/23/2024

useMutation's `isPending` stays on `undefined` after calling mutate

so I have a custom useMutation hook ```js return useMutation({ mutationFn: api.Profiles.acceptFriendRequestInNotification, onSuccess: async (_data, { requestId, notificationId, metadata }) => {...

exotic-emerald

2/23/2024

Why doesn't cache invalidation work during mutation?

` const { data: data2, fetchNextPage, refetch,...

sunny-green

2/23/2024

Save modified response in query cache (React Query v3)

I have a situation where my API response is not normalised. Which means when I fetch the data from api, I want to first filter and normalise the data which should be then stored in cache. Currently I can not have the API response modified. So that is out of question. This is one idea, i dont know if its right or not. ...

constant-blue

2/22/2024

How to abort a useMutation ?

Hello, I have a use case where i have to do several mutations in a promise, but i want to cleanup the queries at unmount. Now : i am using a signal with an abortController, is there a simpler solution ? ...

rival-black

2/22/2024

is a promise returned from onError callback on a mutation awaited?

Hey all, just a quick question. I know when we do for example an onsuccess and return a promise to invalidate a given query i will be awaited. Does this also count for the onError callback? I need to do some logic whenever a mutation failes, and after that retry the mutation. ...

generous-apricot

2/22/2024

Only query when value is not null?

I have a function that returns a useQuery object: ```ts const getSubmissions = (currentProject) => { const endpoint = endpoints.api.submissions.index.replace(':id', currentProject);...

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