Vue-apollo: Smart query is not shared between components

[kandrejevs]

Describe the bug
Consider having 2 components- one is input form, the other is data table.
after submitting form and calling this.$apollo.queries.<name>.refetch() results in cannot call refetch() on undefined.

Expected behavior
I would like to be able to refetch query across components.

[Austio]

@kandrejevs could you create a small example of this in order to help with isolating what you are running into?

[Marooner5]

I think what kandrejevs is describing is let's say you have two components: a "NewUserForm" and a "UserTable". The user table is a list of users that you receive via vue-apollo from your db via a smart query "users".

The functionality they are requesting is being able to simply call this.$apollo.queries.users.refetch() inside the "NewUserForm" componenet after successfully submitting the new user form. This would streamline refreshing data and/or cache inside vue-apollo when adding new data.

Quick summary edit:
So even though the smart query "users" was created inside the "UserTable" component, it would be helpful to be able to refresh that smart query in other components.

[kandrejevs]

Yes, this is exactly what I had in mind.
Currently if you have used same query in 2 components, refetching it in one automatically updates other. It would make sense to be able to update some queries without using query in component.

[frandiox]

I'm also interested in having a global way to access the smart queries for refetching. My use case is a bit different but requires the same feature:

Working with GraphQL subscriptions is a pain for different reasons, so I'd like to have just one single subscription at the top level that gets a key of what has been updated from the server. Then, based on this key, it refetches the related query ($apollo.queries[key]?.refetch() or similar). The problem is that we cannot find queries from other components like this. Any idea of how to implement this, @Akryum ?

[impowski]

I have the same thing when I have Filters component and LoadsTable component and when I change something inside Filters component I need to refetch the existing query with different parameters.

[imperator6]

Same problem here, but found this workaround:

https://stackoverflow.com/questions/58395077/vue-apollo-share-query-definition-between-components

If you comming from vuex it's really confusing that there is no globle store for smart query.