eastern-cyan

svelte-query 5: useQueryClient tries to load from context even with override client

In svelte-query 5, you can now call createQuery() and useQueryClient with your own query client, rather than the one in context, like:

createQuery(options, myClient)
// or
useQueryClient(myClient)

createQuery(options, myClient)
// or
useQueryClient(myClient)

This is super useful because it means we can write code that uses createQuery outside the context of a svelte component script. However, in the useQueryClient implementation, it tries to load a query client from svelte context even if the user provides a client to use: https://github.com/TanStack/query/blob/alpha/packages/svelte-query/src/useQueryClient.ts#L4-L12 This will throw an error if used outside of a svelte component and defeats the purpose of having this new option to pass your own client in v5. I believe the above function needs to be changed where it only gets the client from context IF there is no override provided. Something like:

export function useQueryClient(queryClient?: QueryClient): QueryClient {
  if(queryClient) return queryClient;
  else return getQueryClientContext();
}

export function useQueryClient(queryClient?: QueryClient): QueryClient {
  if(queryClient) return queryClient;
  else return getQueryClientContext();
}

GitHub

query/packages/svelte-query/src/useQueryClient.ts at alpha · TanSta...

🤖 Powerful asynchronous state management, server-state utilities and data fetching for the web. TS/JS, React Query, Solid Query, Svelte Query and Vue Query. - query/packages/svelte-query/src/useQue...

8 Replies

rival-black•3y ago

Absolutely, that definitely makes sense. Please feel free to submit a PR, I definitely appreciate the help! On second thought - I might do this since it also affects react-query and solid-query Unless you are able to fix those as well? They're all pretty much the same thing

eastern-cyanOP•3y ago

I can take a stab at all 3 and let you review, no problem

vicious-gold•3y ago

The react implementation is fine as-is because we have a default context and hooks can't be called conditionally in react.

eastern-cyanOP•3y ago

Nice, I wrote that same thing in my PR 😅 https://github.com/TanStack/query/pull/5669/files

GitHub

fix: skip QueryClient context check by skokenes · Pull Request #566...

In svelte-query 5, you can now call createQuery() and useQueryClient with your own query client, rather than the one in context, like: createQuery(options, myClient) // or useQueryClient(myClient) ...

eastern-cyanOP•3y ago

I haven't used Tanstack Query with React but I do wonder if it would be useful there to have a hook-less version of createQuery, in the same way that I have usecases for it in svelte... Maybe svelte is just special in this scenario though; the svelte problem stems from not being able to easily share reactive logic across components today. You cant just create a custom hook and import it into multiple svelte components. If you want to externalize/re-use some shared reactive logic, you have to use derived stores and that can happen outside of a svelte script, hence the Context errors. So maybe not really an issue for React devs @Raytuzio would there be any willingness to accept a PR that adds this same capability to pass a query client and skip context check to svelte query v4? We are on 4 rn and need this capability, don't have the bandwidth yet to do a migration to 5

rival-black•3y ago

Probably not - it would be difficult to implement this in a way that isn't breaking with v5 given the overloads pattern in v4. Either way I'd wait for Dominik's input (he's on holiday). FYI, I migrated a medium-sized app to v5 alpha yesterday, and it was much quicker than expected (~1hr). Obviously I don't know anything about your app's complexity, but it might be easier to migrate than to contribute this feature. Hoping v5 stable won't be too far off either (we're technically on beta right now but the branch just hasn't been changed).

eastern-cyanOP•3y ago

One problem we have with migrating is that we also use Orval for code generation and I don't know when that library plans to add support for v5. Maybe our best solution is to just fork v4 for now and add it for our use case. Would be interested to hear from @TkDodo 🔮 when he is back though.

vicious-gold•3y ago

no, sorry, this will come with v5

Gaming

Programming

svelte-query 5: useQueryClient tries to load from context even with override client

Did you find this page helpful?