Search code examples
reactjsgraphqlapollo-clientsubscriptionprisma

Subscription Refetch Updating Data

I wanted to get your opinion on something.

I'm trying to understand how a subscription works. however, I couldn't find a way to pull an array of objects in a subscription. for example, if I use createMany, I can not return all the result via subscription.

The second issue is if I return a single item for example if it's a new item, I have to "manually (air quote)" add that item to the list that is already displayed. But this feels to me I don't actually display real-time true data.

So my question is using something like

 useEffect(() => {
    // refetching original query when subscription is triggered
    refetch();
 }, [updatedNotificationData]);

would there be any downside like hitting up the server more than I should? let's say every time there is a refetching happens I might be pulling thousands of notifications (I know there is caching but still) or is there a better way to deal with bringing new data.

Also, I tried adding subscribed data to the original list but for some reason react adds 2 of the same item every time.

Thanks in advance if you can give me in the right direction.

Solution

  • if I use createMany, I can not return all the result via subscription.

    That shouldn't be a problem if you define the return type of the subscription as array.

    type Subscription{
  onChange:[ObjectType]
}

    It would allow you to avoid fetching again but updating cache can get a bit complicated.

    Also, I tried adding subscribed data to the original list but for some reason react adds 2 of the same item every time.

    In case you are using the the subscribeToMore method it's not really reacts fault but the way how the updateQuery method works: github issue regarding this.

    My workaround was to subscribe via the useSubscription hook and handle the cache modifications inside the onSubscriptionData callback apollo documentation and also setting the useQuery hooks skip option once I get the data so it wont query on each rerender.