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
Best practice for dealing with mutation function that doesn't error
Hey all,
I have a useMutation that wraps a function that returns a type like follows:
```ts
type Return = {...
Why do PATCH and DELETE requests not refetch the data from the database?
Hello!
When I store data in the database, I usually do it the following way:
```js...
Need help to find out why my query is not marked as stale
Hey guys, I don't understand what I am doing wrong. Maybe it is just some async stuff.
I have one query to fetch some bank data. On top of that I have written some more queries which filter the list of bank data I am getting. Once I am posting new data I want to invalidate all filters and the initial query which gets the data. However, one query is always using initial data set and not the updated data set.
```ts...
Using react-query with Axios and intercepting requests and responses
Does anyone have a good example of using react-query with Axios and intercepting requests and responses? I googled it quite a bit and couldn't find any good examples. I am using react-query for the first time. From the tutorials I've looked it, it seems pretty straight forward for basic use cases. Just struggling with this example.
Using infinite query to restore and scroll to certain cursor point
Hi,
Have a question on a use case that I'm about to start implementing, but a little unsure how best to implement it with useInfiniteQuery
We basically have a thread of messages (which is list of messages in date order - think the same as a slack channel where message are displayed based on a cursor (timestamp the message was created))....
Handling Error
When i make a request, when api fails i dont receive the api payload from the api that has been sent.
Here is the mutation fn
```
export const verifyEmail = async (token: string) => {...
queryClient type issue?
Hello,
Please see attached screenshot. Can anyone point me in the right direction?...
Paginated queries, optimistic updates and data structure
Hello everyone! I have been using react-query for over 2 years, and normally it solves all my problems related to fetching and caching data, but there's always been a specific problem I haven't been able to solve, so I'm wondering if I'm missing something.
Imagine a blog page where a user can write comments about the post they are seeing.
The normal flow is to fetch the post comments in a paginated manner that allows the user to keep loading more comments as he scrolls. If the user writes a comment, we produce an optimistic update by displaying the comment in a transient state in the list of comments. If the comment's publication succeeds, the transient state is removed. If the publishing fails, the comment is updated to an error state, and the user can retry the action.
Furthermore, the user can take actions such as deleting comments, editing comments, and so on....
useQuery not updating after query key changing in custom hook
Hi all, thank you for your time.
I'm composing a custom hook to retrieve an array in this manner. I realized that destructured data returning from useQuery was not being updated on query key changes when pageUp or down is called. Could anyone point out my mistake?
```js
import { useQuery, useQueryClient } from '@tanstack/react-query';...
Refresh Infinite Query on Interval
We are using useInfiniteQuery but want to fetch the previous page every 5 seconds. So we've created a custom hook that calls useInfiniteQuery and then has a useEffect that sets up an interval. However, when there are multiple components calling the hook, we only want one interval between them. Is there a way to check how many subscribers a hook has (which we can use to set up an interval on the first subscriber)?
Handling HTTP errors using Fetch with useQuery
First, new to react. New to react-query.
I have a POST API where the server is returning a 422. And while checking to see if the response is okay using fetch(), i'm struggling to how to pass the error back to useQuery, because if i just pass the response.json, useQuery obviously isn't going to see the error.
` // my .tsx file ...
Store non-sequential page with Infinite Query
Hi, is it possible to store result
page of queryfn of useInfiniteQuery non-sequentially when a custom a custom page param is passed to fetchNextPage function of useInfiniteQuery
eg. When we do this:
` // Pass your own page param
const skipToCursor50 = () => fetchNextPage({ pageParam: 50 })...fetch and consume data during ssr process
Hi, my goal is to fetch external data and share the result to a prefetchInfiniteQuery() and all that during ssr
data is fetched from there
``export default async function useGetProjects() {...
Fetch during server side render
I am trying to run my useQuery's during SSR on a custom Vite setup, but for some reason it is not working due to do queries being in the
idle fetchingStatus while their status is loading. When does the fetchingStatus change? And how can I force this/wait for this during SSR?
Thanks...TS error:
Argument type UseQueryOptions<T, Register extends {defaultError: infer TError} ? TError : Error, T, string[]> & {initialData?: undefined} & {queryKey: DataTag<string[], T>} is not assignable to parameter type FetchQueryOptions<[T][T extends any ? 0 : never] & T, Register extends {defaultError: infer TError} ? TError : Error, T, QueryKey>
I would not know what are details are necessary but it seems like
lightsListQueryOptions does not implement correctly FetchQueryOptions...
Solid-query - query.isPending causing Type Error
I am getting the error "Cannot read properties of undefined (reading 'when')" on the
switch branch for when={query.isPending} on the page load. On page refresh it resolves the content. Commenting out the branch removes the error. I can't find relevant issues on GitHub for this. Can anyone advise how to deal with the type issue on that?
using solid-query v 5.15.0...
Subscribe to a query without useQuery
I have a list of 300+ items rendered on the page and want to avoid mounting useQuery for each item. However, each item is wrapped with React.memo and I need the component to update whenever one particular query's data is updated. is there a way to subscribe to one particular query's changes and update the component accordingly without performance issues? thanks!
re-route and fetch new data via refetchQueries
i want when click to a button to re-route and fetch new data base search params
when i wait for refetchInterval to refetch data it success
but i'm looking for similar behavior via queryClient.refetchQueries({ queryKey: ['x'] });
but i don't success, any help to trigger the update?
...
Recommendation on storing list data as is and by id with one server side response
After reading through the deprecation post on onSuccess for useQuery, I'm having a hard time wrapping my head around how to massage a single response from my API into multiple query keys.
I have a number of JSON APIs that return back a list of Widgets that the user has in their account. We fetch them all in one go and each JSON object of a widget returns a unique id for that widget. There are routes that require all widgets and some that focus on a single Widget by ID in that list.
Ex.
[ { "widgetId": "1", ... }, { "widgetId": "2", ... }] etc ...Only throw error if there is no data in the cache
Hi everyone, I'm configuring react-query with
throwOnError option set to true but I only want the error to be throw when there's no data in the cache. Is there any way to achieve that with react-query ?