How to fetch an entire paginated list / refetch the entire paginated list?

Viewed 372

I have a "classic" cursor based pagination of items.
I have to do two things with this items:

  1. fetch all items of this list when components did mount

  2. refetch all the list when a button is pressed

Using react-apollo for the first point my solution is:

  1. use a Query component to load the first data set

  2. when the last fetched data set is loaded I get the endCursor from it

  3. use the endCursor and the fetchMore (from the Query render props) to load the next data set (passing variables and updateQuery to the fetchMore function)

  4. if there are more results loop to #2

For the second solution:

  1. I'm using refetch (from the Query render props) to reload the piece of the store with new data

  2. Use the same loop of the first solution (with the loadMore function) to fetch other results


All of these implementations are not so easy to write / maintain / reuse, so my question are:

am I missing something? there is a better solution to this scenario?

0 Answers
Related