Refetch cached queries with dinamic data (variable or http header)

[vicmosin]

Let's say I have bunch of queries against the API, which secured via Oauth2 standard. Meaning I have to pass the bearer token along each request. Now, token might be expired at some point and when it happens, API respond with 401. In such case I do refresh the token according to the specification and store in in local storage (which then will be used to read the token from). What I want to achieve is that after successful token refresh all the failed queries be refetched BUT with new token. Currently I used the suggested approach with custom cache implementation:

const queryCache = new QueryCache({
    onError: (error, query) => {
        console.error("Handling error", error)
        refreshToken(
            error,
            () => {
                queryClient.invalidateQueries()
                    .then(()=> queryClient.refetchQueries())
            },
            () => {
                router.push("/login")
            }
        )
    }
})

but it seems like all the queries (though retriggered) still use the old token. I found this topic but it's kinda old and I am not sure it's still relevant, might be some better solution already?
Thank you in advance

[TkDodo]

this should likely happen on your API layer, not the query layer.