0

I'm trying to create a subscription in Apollo client, but every time I save my component, which causes a refresh, I get this error:

enter image description here

Here's my code:

const QUERY = gql`
  {
    getEventsSection(id: "trending") {
      _id,
      events 
    }
  }
`;

const SUBSCRIPTION = gql`
    subscription {
      getEventsSection(id: "trending") {
        _id,
        events 
      }
    }
`;
    const [state, setState] = useState(null);
        const { loading, error, data, subscribeToMore } = useQuery(QUERY);

        useEffect(() => {
            const unsubscribe = subscribeToMore({
                document: SUBSCRIPTION,
                updateQuery: (prev, {subscriptionData}) => {
                    console.log(subscriptionData);
                }
            });
            return () => unsubscribe();
        }, [data])

What am I doing wrong? Thanks!

Dennis Vash
  • 50,196
  • 9
  • 100
  • 118
Lucas Veiga
  • 1,758
  • 7
  • 27
  • 45

1 Answers1

0

You don't seem to return anything in updateQuery callback.

As per docs

Note that the updateQuery callback must return an object of the same shape as the initial query data, otherwise the new data won't be merged. Here the new comment is pushed in the comments list of the entry:

Also remove unsubscribe in useEffect

gdh
  • 13,114
  • 2
  • 16
  • 28
  • I tried with ```const {data} = subscriptionData; return Object.assign({}, prev, data);``` and I'm still getting the error. It seems that ```subscribeToMore``` is sometimes undefined on a component refresh. The first time the component load, the subscription works, but I can't for example save the file, which causes a component reload. Im also returning the same shape of the data query object. – Lucas Veiga Jun 13 '20 at 21:49
  • Did you ever figure out what was causing this? – nprz Apr 28 '21 at 05:27