melodyclue
melodyclue•11mo ago

Sometimes invalidate not work...

hello sometimes invalidate method does not work in onSuccess anyone same? using NextJS, pnpm
No description
18 Replies
Typedef
Typedef•10mo ago
Im having this problem aswell, @melodyclue have you found a solution?
melodyclue
melodyclue•10mo ago
well, The problem is solved by writing an invalidate directly after the asynchronous process, instead of "onSuccess". We do not know why "onSuccess" does not work. In some cases it works, so I am confused.
Typedef
Typedef•10mo ago
are you still invalidating through useContext? but just after the async
melodyclue
melodyclue•10mo ago
yes I use ``` const utils = trpc.useContext() ... onSuccess() { utils. .... .invalidate() }
Typedef
Typedef•10mo ago
Ahh, in my case onSuccess works all the time, but the utils...invalidate() doesnt.
David
David•9mo ago
How did you solve this? cc @melodyclue
melodyclue
melodyclue•9mo ago
@David In fact, it has not been resolved. It seems that invalidating within onSuccess does not execute. However, there are some that are executed and I am confused. For now, directly in the function await utils.project.getProject.invalidate({ project_id: projectId }); in the function for example, it seems to be executed.
David
David•9mo ago
Damn that is rough, thanks for the quick response! A follow up question, do you happen to have 2 QueryClientProviders in your tree?
melodyclue
melodyclue•9mo ago
@David 🧐 no, I dont use QueryClientProviders. instead I use export default trpc.withTRPC(App)
David
David•9mo ago
I figured, thanks for the info! It seems that doing this:
const queryClient = useQueryClient()

// onSuccess
await queryClient.invalidateQueries(getQueryKey(trpc.path.to.query))
const queryClient = useQueryClient()

// onSuccess
await queryClient.invalidateQueries(getQueryKey(trpc.path.to.query))
melodyclue
melodyclue•9mo ago
@David so useQueryClient is the key to solve this problrem? I will try !
David
David•9mo ago
Bit of a workaround
Typedef
Typedef•9mo ago
I had 2 queryClient providers thats why mine wasnt working 👍🏽
melodyclue
melodyclue•9mo ago
@David oh you are talking about v9. mine is v10 actually...
David
David•9mo ago
Nope, talking about v10 but later realized that also is not consistent it seems
melodyclue
melodyclue•9mo ago
@David I think await queryClient.invalidateQueries(getQueryKey(trpc.path.to.query)) is the way how it works on v9 🤔
David
David•9mo ago
It's just one of the standard react-query ways to do it
melodyclue
melodyclue•9mo ago
@David ok figured out! you're right David. And this issue (invalidate not works) is fully resolved !!! https://trpc.io/docs/client/react/getQueryKeytrpcold
getQueryKey | tRPC
We provide a getQueryKey helper that accepts a router or procedure so that you can easily provide the native function the correct query key.