useQuery reusing variables from old requests

[tim-millar]

Intended outcome:

We have a feature in which users can access a list of items and filter the list based on certain attributes present on the items. The feature has tabs which link to predefined filters (i.e. a particular subset of the list, based on a particular configuration of the filters). This feature is backed by apollo-client's useQuery hook, into which we pass the filters as variables for the resolver on the backend. We also paginate results using relay style pagination, where appropriate.

For example, one tab displays all items whose origin is a particular store. Another tab shows all of the items whose destination is a particular store. When the user clicks on the origins tab, we expect them to be shown a list of items with origin X. When the user then clicks on the destinations tab, we expect them to be shown the list of items of destination X.

Actual outcome:

What actually happens when the user click origins and destinations is that they first see the list of items of origin X, but the second list is always empty.

This is because what gets sent to the server contains the variables from the first request as well, so that effectively we query for all items whose origin and destination are X, which is a set with no members.

In fact, its quite common to receive empty results for a query which should be non-empty, because as a user submits more queries, all of the variables are retained (apparently by apollo-client - it's not something which is happening in our application code) and resubmitted with every request, which quickly results in an incoherent query.

For e.g., user has arrived at what looks like a query with no results:

But actually, if you start the session with this query, you can see that it is non-empty:

Is this intended behaviour of apollo-client? It doesn't seem to be something which is documented.

Is there a way to opt-out or override the persisting of old variables and merging with new ones?

Many thanks.

Versions

System:
OS: macOS 12.4
Binaries:
Node: 14.18.1 - ~/.nvm/versions/node/v14.18.1/bin/node
Yarn: 1.22.17 - ~/node_modules/.bin/yarn
npm: 8.1.4 - ~/.nvm/versions/node/v14.18.1/bin/npm
Browsers:
Chrome: 104.0.5112.79
Safari: 15.5
npmPackages:
@apollo/client: ^3.6.1 => 3.6.1

[mjgasior]

I think I have posted a message on Stack Overflow with simila issue here. Created also an issue here on this GitHub.