Skip to content
This repository has been archived by the owner on Apr 13, 2023. It is now read-only.

Feature: add onSubscriptionData callback to <Subscription> #1966

Merged
merged 6 commits into from
Aug 21, 2018

Conversation

jedwards1211
Copy link
Contributor

For most of what I do with GraphQL subscriptions, I find myself wishing I could just use ApolloClient.writeQuery to update the cache, rather than the subscribeToMore/updateQuery approach. The new <Subscription> components alleviates the pain of unsubscribing and resubscribing in my own code when I need to change variables, but it doesn't currently provide any way of updating the cache, so it's fairly useless for my needs.

But with this PR, I get a callback from <Subscription> with the ApolloClient and the subscription data, so I can use writeQuery to update the cache:

// subscribes to multiple items; each response will be a single item
const subscription = gql`subscription ($ids: [Int!]!) {
  Item: Items(ids: $ids) {
    name
  }
}`

// query for writing a single item
const query = gql`query ($id: Int!) {
  Item(id: $id) {
    name
  }
}`

const App = ({itemsToShow}) => (
  <Subscription
    subscription={RepoSubscription}
    variables={{ids: itemsToShow}}
    onSubscriptionData={({client, subscriptionData}) => {
      if (subscriptionData.data) {
        const {Item} = subscriptionData.data
        client.writeQuery({
          query: RepoQuery,
          variables: {id: Item.id},
          data: {Item},
        })
      }
    }}
  />
)

@hwillson
Copy link
Member

Thanks for this PR @jedwards1211. What are your main concerns / complaints about the subscribeToMore / updateQuery approach?

@hwillson hwillson self-assigned this Jun 19, 2018
@jedwards1211
Copy link
Contributor Author

jedwards1211 commented Jun 19, 2018

@hwillson for one, sometimes doing an initial query is completely unnecessary. For another, it pushes all of the work of unsubscribing and resubscribing when relevant variables change onto the developer.

Sometimes subscriptions can be decoupled: there are some things my app always needs to be subscribed to, so it is better to manage that subscription with a single component, even though multiple views query the data that is updated by the subscription.

It is more awkward to make cache update logic reusable with updateQuery than with writeQuery.

But the chief problem with the query-then-subscribe paradigm is that updates can be lost if changes occur between the time the server responds to the initial query and the client initiates a subscription. I explain that in more detail here: apollographql/apollo-client#2892

Copy link
Member

@hwillson hwillson left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for working on this @jedwards1211 - LGTM! 👍

@hwillson hwillson merged commit 8e374f2 into apollographql:master Aug 21, 2018
hwillson added a commit to apollographql/apollo-client that referenced this pull request Aug 21, 2018
williamboman added a commit to williamboman/react-apollo that referenced this pull request Aug 29, 2018
* master: (112 commits)
  chore(deps): update dependency danger to v3.8.8
  chore(deps): update dependency enzyme to v3.5.0
  chore(deps): update dependency apollo-client to v2.4.1
  chore(deps): update dependency apollo-cache-inmemory to v1.2.9
  chore(deps): update dependency apollo-cache to v1.1.16
  chore(deps): update dependency @types/react to v16.4.12
  chore(deps): update dependency rollup-plugin-commonjs to v9.1.6
  chore(deps): update dependency @types/node to v10.9.2
  chore(deps): update dependency react-scripts to v1.1.5
  chore(deps): update dependency ts-jest to v23.1.4
  Avoid importing lodash directly (apollographql#2045)
  type graphql.options.skip HOC property (apollographql#2208)
  Replace duplicate ObservableQueryFields types defined in apollo-client (apollographql#2281)
  Make mock links mock parameter readonly (apollographql#2284)
  test-utils: allow passing a custom cache object to `MockedProvider` (apollographql#2254)
  Query: Fix data is undefined on error (apollographql#1983)
  Don't mutate options object when calculating variables from props (apollographql#1968)
  Feature: add onSubscriptionData callback to <Subscription> (apollographql#1966)
  Changelog update
  Example of a mutation including tests (apollographql#1998)
  ...
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants