Optional queries using enabled flag?

[cuongluu8]

Example code:

const requiresExtraData = true;
const { data } = useQuery([query, variables], fetch, { enabled: requiresExtraData } );

// data = { some: "data" };

.... some other event that cause requiresExtraData = false;

const { data } = useQuery([query, variables], fetch, { enabled: requiresExtraData } );
// data = { some: "data" };

I kind of expected the 2nd data to be null because enabled is false, i.e. this query is disabled. But I guess it's still returning the cached value.

After reading the docs on enabled option, I can't decide whether this is expected behaviour or not. If it is, then is there an alternative option that can be used or added as a new feature?

[TkDodo]

If you have some local state that you use to enable the query, it will react to that change. The query will enable / disable according to that state. But this just means that the query won't request something from the backend. if you have data in the cache, you will always get that. What you can do is:

• add a select option that transforms your data to null if you don't want it:

{ enabled: requiresExtraData, select: data => requiresExtraData ? null : data  }

• just add an if statement / conditional

const { data } = useQuery([query, variables], fetch, { enabled: requiresExtraData } );
const extraData = requiresExtraData ? null : data

[cuongluu8]

yes, that is exactly what I am doing at the moment after making the incorrect assumption on what enabled was for and fixing that issue.
I was just a little wondering whether having this built into useQuery make sense or not.

[TkDodo]

I was just a little wondering whether having this built into useQuery make sense or not.

I don't think it does. If you have data in the cache, its almost always better to display it. That's what stale while revalidate is all about: showing stale data until you have something better. In this case, you have stale data, but you choose to not revalidate by disabling the query. If you also want to choose to not display it at all, this is up to you, but it sounds like a use-case that is not very common. Adding more and more flags / options to the lib to support every use-case will make the lib harder to understand and maintain, and if it's something you can do with a one-liner in user-land, I wouldn't add it unless its a very common case