How can I determine if a UseQueryResult is enabled or not?

[jcready]

A custom hook might return a useQuery(). How can the consumer know if the query is enabled or not?

[TkDodo]

What do you want to achieve by knowing that? Generally, a query cannot be enabled or disabled - only an observer can. The query is still subscribed to the cache and will return cached data - enabled or not. enabled:false just means: This observer won't fetch data by itself. And that info usually isn't that relevant.

If you write a custom hook, you would have to return that information alongside your query, e.g.:

const useMyHook(some, inputs, here) => {

 const enabled = some(inputs, here)

 const query = useQuery(queryKey, queryFn, enabled)

 return [query, enabled]
}

[TkDodo]

you can use queryClient.refetchQueries, which will respect enabled. refetch is unconditional because it's meant to be the thing to bypass enabled

[jcready]

Using queryClient.refetchQueries means the caller needs to know at least the queryKey, and probably needs to know the queryFn. Neither of which are provided by the UseQueryResult which is the thing being passed around. And refetch is unconditional, but again, the consumer lacks knowledge about if it should refetch.

It's unclear to me why UseQueryResult has to hide (or at least won't expose) all kinds of useful information (queryOptions) when we know it's available in its scope. Is the reason technical or just philosophical?

[TkDodo]

we have access to all the options so we can return options on the result, which would then be everything you passed in. Given that we also merge multiple layers of defaults, it might be good to know what was actually used. It feels a bit like an axios respsonse returning the request config as well (which it does).

Do you want to contribute this?

[Jac0xb]

doom guy didnt want to contribute :(

[tncbbthositg]

We are bumping into the same problem. We need consumers to have the ability to refetch but they don't know if a refetch should happen or not. They also don't have access (and shouldn't really) to the query key. So, we were going to wrap refetch in a callback that checks the enabled condition first and then executes a refetch.

However, we can't memoize that function because it needs to return a Promise<UseQueryResult> and the object returned by useQuery can't be in the deps list because it's not memoized.