useLazyQuery's refetch method allows updating variables but should also allow updating the query without having to remount the component it's used in

[atomless]

It's an odd omission to not be able to update the gql query when calling the reFetch method returned by useLazyQuery. This forces us to trigger a complete remounting of the component in which it's used just to update the query. You can override the variables, so why not the query?

Versions
@apollo/client: 3.5.10
graphql: 16.0.1
System:
OS: macOS 10.15.7
Binaries:
Node: 16.13.0 - ~/.nvm/versions/node/v16.13.0/bin/node
npm: 8.1.0 - ~/.nvm/versions/node/v16.13.0/bin/npm
Browsers:
Chrome: 99.0.4844.83 (Official Build) (x86_64)

[FreddieHoy]

@atomless did you find a solution to this apart form remounting the entire component?

[bignimbus]

Hi all, thanks so much for the discussion here! I'm moving this to our feature requests repo for tracking purposes.

[bignimbus]

Thanks for posting here! I'm new-ish and still getting acquainted with some of the decisions made on the project but I'm curious about why you'd expect a function called refetch to be able to change the query? When I think of the meaning of refetch I think about doing something again. But updating the query seems to be initiating a new fetch, not re-fetching a previously-fetched query.

Regarding this question:

You can override the variables, so why not the query?

Variables are eventually interpolated but do not impact the structure of the query itself.

Anyhow, I hope my comment makes sense, thanks again!

[jerelmiller]

Hey @atomless 👋

This functionality was added in v3.7.11. You can call the execute function returned from useLazyQuery to update the query document.

const [execute] = useLazyQuery(document)

// will execute the query using `newDocument` instead
execute({ query: newDocument });

Hope this helps!