Estoy llamando a datos de firestore y paginándolos. Esta es mi consulta:

 const tradesRef = firebase .firestore() .collection("trades") .orderBy("quoteQty", "desc") .where("quoteQty", ">", 5000) .limit(12); useEffect(() => { tradesRef.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); }, []);

Estoy usando esta función para obtener los siguientes 12 intercambios:

 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); }); };

Estoy tratando de dar una opción de página anterior pero no puedo encontrar la manera de ir a la página anterior. Hasta ahora he probado esto que no funciona:

 const fetchPrevious = () => { tradesRef .endBefore(lastIndex) .limitToLast(12) .get() .then((collections) => { const tradesData = collections.docs.map((trade) => trade.data()); const lastDoc = collections.docs[collections.docs.length - 1]; setTrades(tradesData); setLastTrades(lastDoc); }); };

¿Alguna sugerencia sobre cómo puedo hacer que funcione el botón anterior?