Is it possible to globally configure a base queryKey?

[avegatolber]

In my application, users can log in under different "companies," with each company having its own data for the same API endpoints.

The issue happens when a user logs in with Company A and then switches to Company B. For a few seconds, the data from Company A is displayed while the application revalidates and fetches the data for Company B. To resolve this, I plan to include the company ID in all queryKeys so that these requests are treated as independent.

I can manually add the company ID to each queryKey, but I’d like to know if there’s a way to configure a global base queryKey. Ideally, this would work like Axios interceptors, where you can globally add base headers.

// This doesn't work, it's just an example of what i mean
const queryClient = new QueryClient({
    defaultOptions: {
        queries: {
            baseQueryKey: companyId, 
        },
    },
})

[arnoud-dv]

Recently the possibility to register global query and mutation types was added, which is a nice solution for this. A type error will then occur if a key doesn't start with one of the allowed prefixes.

TypeScript playground

[avegatolber]

That's good for having it typed, but it doesn't add it globally for all queries. I understand that this functionality is not currently implemented. It would be great if it could be added in the future, as I believe it could be useful for many people, since I've seen this topic in discussions on GitHub.

[arnoud-dv]

Isn't queryClient.clear() or queryClient.removeQueries() what you need then? The first would remove everything from the cache, while with removeQueries you can be more specific. E.g. you could remove only company specific queries.

Another option is using separate query clients for the company specific part.

It's not entirely clear to me if the separate companies in your application require their own login information. If it's going through the application's main authentication process I would choose to clear all of the application in memory state, it's probably the safest and simplest option. One way to do this is just do a hard refresh so the application is restarted.