how to persist the query client?
I want to persist the trpc query client cache, but don't want to create a new query client, I want to use the one trpc already creates.
Is this doable?
13 Replies
I assume you’re on NextJS?
This is really a question that react-query docs probably have the answer to, and if withTRPC doesn’t expose the right stuff to set it up you should open a GitHub issue 🙂
Thank you for the reply, yes I'm on NextJS 13 without the app directory.
This is how you use the
persistQueryClient
from the docs, I would like to know if there is a way to get the queryClient from TRPC in v10I’m not much of a next user so haven’t played with the HOC we provide. Probably useQueryClient though from RQ
Do you know if I would have to use the useQueryClient through RQ in all my procedures for the caching to work? Different queryClients different caches?
There should only be one in your whole application, if you have two you should remove one 🙂
but trpc already creates one right?
I just can't access it
UseQueryClient would get it from the provider
Not create one
oh! for some reason I mixed
useQueryClient
with useQuery
, thank you very much that was exactly what I needed, I read the bit of documentation in https://trpc.io/docs/migrate-from-v9-to-v10 "queryClient is no longer exposed through tRPC context", but for some reason flew over my head.Migrate from v9 to v10 | tRPC
Welcome to tRPC v10! We're excited to bring you a new major version to continue the journey towards perfect end-to-end type safety with excellent DX.
Hi @ygor perez , did you resolve this? I have the persist working with RN, but still trying to figure out the Next side.
GitHub
spotify-api-challenge/usePersistQueryClient.ts at main · YgorPerez/...
A challenge from https://github.com/RodyRafa/challenge/tree/master/react - spotify-api-challenge/usePersistQueryClient.ts at main · YgorPerez/spotify-api-challenge
I created this hook, I call it in the app.tsx file
Thank you
Hey @ygor perez , this hook replace the client used by the trpc?