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
`No QueryClient set, use QueryClientProvider` jest test error despite passing queryClient
Hi folks. I'm on React 18 and react-query 4.22.4 and I am trying to get started with jest testing. I've written a custom hook that uses useQuery and looks like this:
```
export const useCheckTokenPermissions = () => {
const queryKey = ["auth"]
const params = {...
useEffect on cache invalidation?
Hello, Is it possible to use the
queryClient to detect a specific cache being invalidated.
I have something like this in mind. Sorry If this is a bad question. I have spent a lot of time looking but cannot find the solution.
```...Preserve part of the cache when refetchOnWindowFocus refreshes data.
Hi folks, I have a situation where I am rendering messages to the chat. Messages are the array of objects with all relevant data.
I use an optimistic update (with mutation) when the user sends the message. onMutate: I am updating the "MESSAGES" cache and its msgStatus to 'pending', onSuccess changes its status to 'success'.
When a message fails to send (mutation) I am setting its status to msgStatus: 'error' in the onError function and I render a "retry" small button beside the message.
I have "refetchOnWindowFocus: true" for updating the messages and it overrides the cache and deletes the last saved message with the "msgStatus: error". I tried to set the select function and I try to get the "MESSAGES" snapshot and merge it with the data but it is not working. It still deletes the error message somehow....
@tanstack/react-query not working with Vite
what I am using: .
When I am trying to execute a basic query against supabase, using Vite and react-query, useQuery gets stuck in loading state....
vite/4.1.4 darwin-arm64 node-v18.3.0,"@supabase/supabase-js": "^2.8.0","@tanstack/react-query": "^4.24.10",
vite/4.1.4 darwin-arm64 node-v18.3.0,"@supabase/supabase-js": "^2.8.0","@tanstack/react-query": "^4.24.10",
Is it possible to get the queryKey provided to useQuery from the return value of the same useQuery?
e.g.
const todoQueryResult = useQuery({queryKey: [a, b, c], queryFn: () => {fetch(url)}});
...
queryClient.setQueryData(todoQueryResult.queryKey, ....)...
Return latest result from query key?
My end goal is to have a query that sets a current search term, with a query key of
["query", searchTerm], and another query that returns the latest "query" search term, so the latest query of key ["query", *]. I'd like to do this so that I can keep a "history" of previous search terms, since it's computationally expensive to run them. I know it's not a very good explanation, but I hope it makes sense! The tl;dr is that I need a component "subscribe" to all queries that start with "query"...svelte-query
I am integrating sevlte query to an app with svelte/sveltekit. Should I use @sveltestack/svelte-query or @tanstack/svelte-query? I guess the 1st one is older, but it has good documentation. The latter is very sparsely documented, and there are things I still can't do because of it. I would really appreciate help with that.
Combine/Transform result of multiple queries
I’m trying to create a hook that combines the data from 2 endpoints. I was able to transform the incoming data of a single query using
select. What I really need is the data of 2 parallal queries combined tho. I was trying to use the select function for this purpose like below, but i'm not sure this is the best way of going about it. Also, this way hook useC only returns the data, without any of the query information like loading or errors.
```
const useC = () => {
const [c, setC] = useState();...Module Federation and QueryClientProvider
Is there a pattern for using a single QueryClient when using module federation?
I have a host app and a few sub applications:
host...
svelte query integration with SvelteKit form actions
Is there a way to use svelte query mutations with form actions or does it even make sense to do so?
ModuleDependencyError: export 'useRef' (imported as 'React') was not found in 'react'
Using tanstack version
4.24.9, React 18.2.0 and Next 13.1.1. Initially had it in a turborepo monorepo, but even when standalone and installed via node18 still get this errorUnsure if PersistQueryClientProvider is working with Next.js
Here is the code for my _app.js file:
```
function MyApp({ Component, pageProps }) {
const router = useRouter()
const [supabaseClient] = useState(() => createBrowserSupabaseClient())...
Query Persistence Confusion
When I persist a query it seems to completely ignore the specific cacheTime and staleTime I set on the hook level - instead it will just abide by the default values I set on the queryClient.
I just want to make sure I'm understanding the nuances here, if someone could confirm that's the case and maybe provide some strategies as to how to deal with the inability to set a cacheTime, staleTime, or other options on the hook level...
Best practices for defining using persistQueryClient with Next.js
A few parts to to this:
a) Where should you normally define a queryClient, outside of the one used inside the _app.js file's state for initialising the QueryClientProvider
b) Should I use persistQueryClientSave every time I want to perform a mutation on data that will then be persisted in the cache
c) Is it acceptable to have multiple queryClients in a file within the pages directory, particularly when using getStaticProps or getServerSideProps?...
Deduplication of requests using Realtime with Supabase
So I'm using Realtime with Supabase and I have a component that uses data from 2 separate tables.
I have an RPC at
/api/analysis which aggregates data from both of these tables.
I have created a subscription to each individual table which then invalidates the queryKey: ["analysis"] whenever rows in the respective tables change.
Whilst this does work, it is making duplicate requests....Can I use Tanstack Query within node.js?
Hi!
I use Firebase Functions as a backend and have requests to different API from there.
I want to use Query library to make this requests more convenient. Firebase functions handles by node.js, so I wonder is it a good idea to use Query on backend with node.js?
Can't find any example or even discussion of such usage.
...
rerender for status change
I'm wondering when the useQuery status change, why it doesn't trigger rerender ? I used the isSuccess property returned from useQuery but I don't see the useEffect gets called when data is successfully fetched. Any help is appreciated !
const component = () => {
const { data, isLoading, isSuccess } = useQuery(
['image'],...
UseQuery Parameters in Typescript
Good Afternoon, does anyone know if there is an updated example for a Optimistic RQ Usage? The one in the docs look to be broken due to the older version: https://codesandbox.io/s/github/tannerlinsley/react-query/tree/v3/examples/optimistic-updates-typescript
I was getting an issue on my side with the updated version specific to the queryKey equaling 'roles'. I changed that value to ['roles'], then the error went back to the one in codesandbox link with the options.
```import { AxiosError } from 'axios';...
QueryObserver multiple keys
How i can observe any task? I want to know which task is created, updated or deleted.
i use mutations to create, update, delete tasks, maybe the tan stack query has its own mutation observer? (изменено)...
useQuery inside webworker/sharedWorker
Hello there,
I am trying to use useQuery from react query inside web worker to seperate api and call and other calculation from main thread, and for which I need a way to call useQuery inside web worker.
can you please help me out with this?...