Getting previous documents using firestore pagination-CodePudding

I am using Firestore database to store my crypto trades. Since there are a lot of them, I have to load them using the .limit(numberOfTrades) query.

My query: const tradesRef = firebase.firestore().collection("trades").limit(15);

Inside my useEffect:

useEffect(() => {
      tradesRef
        .where("type", "==", "fiveMinutes")
        .get()
        .then((collections) => {
          const tradesData = collections.docs.map((trade) => trade.data());
          const lastDoc = collections.docs[collections.docs.length - 1];
          setTrades(tradesData);
          setLastTrades(lastDoc);
        });
    
    setDataLoading(false);
  }, [filter]);

However, I do need pagination in order to load the next set of trades. The pagination of next is already implemented and fairly simple. This is the function I am using for next page:

const fetchMore = () => {
    tradesRef
      .startAfter(lastTrades)
      .get()
      .then((collections) => {
        const tradesData = collections.docs.map((trade) => trade.data());
        const lastDoc = collections.docs[collections.docs.length - 1];
        setTrades(tradesData);
        setLastTrades(lastDoc);
      });
  }

Now I am trying to figure out how to implement a previous page query that gets the previous 12 trades. I have researched and implemented a few queries but I am not even close to solving the issue. Any help would be appreciated.

CodePudding user response：

If you want to paginate backwards, you need to use a combination of:

.endBefore(firstItemOnNextPage)
.limitToLast(12)

So firstItemOnNextPage is the first item on page N 1, where you're paginating backwards from. And you're then asking for the last 12 items before that anchor item.