How to use Polling + Pagination

[jimmiebtlr]

How should this work?

const fetchHOC = graphql(fetchBotGQL, {
  options: () => ({
    pollInterval: 1000, // ms to poll
    variables: {
      offset: null,
      limit: null,
    },
  }),
  props({ data: { loading, fetchMore }, ownProps }) {
    return {
      ...ownProps,
      loading,
      doc,
      loadMoreEntries({ startDocIndex, endDocIndex }) {
        return fetchMore({
          variables: {
            limit: endDocIndex - startDocIndex,
            offset: startDocIndex,
          },
          updateQuery: (previousResult, { fetchMoreResult }) => {
            if (!fetchMoreResult.data) { return previousResult; }
            const arraySize = endDocIndex > previousResult.bot.events.length ? endDocIndex : previousResult.doc.events.length;
            const events = new Array(arraySize);
            previousResult.doc.events.forEach((e, i) => { events[i] = e; });
            fetchMoreResult.data.doc.events.forEach((e, i) => {
              events[i + startDocIndex] = e;
            });

            return Object.assign({}, previousResult, {
              // Append the new dialogs results to the old one
              doc: {
                ...previousResult.doc,
                events,
              },
            });
          },
        });
      },
    };
  },
});

It looks like every time the poll hit's, it completely overwrites the other fetch more portion of things. Is there any way to have the primary query just update query instead of overwriting?

[helfer]

@jimmiebtlr I think this is a duplicate of #1087. The short answer is that they weren't intended to be used together. I thought we had a warning at some point, but it seems that's not the case any more, so we should add it back in.

[tcoughlin3]

Are there any current or future plans to support polling + pagination?

[brayhoward]

Workaround

  // Poll interval that works with pagination
  useEffect(() => {
    const intervalId = setInterval(() => {
      const total =
        (queryResult.data?.countSessions.edges.length || 0) +
        queryResult.variables.first!;

      queryResult?.refetch({
        ...queryResult.variables,
        first: total
      });
    }, 15_000);

    return () => clearInterval(intervalId);
    // eslint-disable-next-line
  }, [
    ...Object.values(queryResult.variables).flat(),
    queryResult.data?.countSessions.pageInfo.endCursor
  ]);

[mattlysf]

Is polling + pagination still unsupported? If so, this still isn't documented.