Pagination and Flutterflow using Datatables (back end is using Buildship)

Widgets & Design

Hello, I am using FF for the front end and Buildship for the backend.

I am having a page with a Datatable that queries the database of Buildship (Firestore at the moment). Now this table has ~600 rows. I tried some code that is supposed to implement pagination (to reduce loading time) but I am not sure it works. This is the code I use on Buildship:

import { Firestore } from "@google-cloud/firestore";

export default async function (
  adminId: NodeInputs,
  { logging, env }: NodeScriptOptions,
): NodeOutput {
  /* Log values while executing the node/workflow */

  const firestore = new Firestore();

  let num = Number(adminId.adminId);

  async function fetchDocumentsExcludingMaster(collectionName, pageSize = 12, lastDoc = null) {
    try {
      const collectionRef = firestore.collection(collectionName);
      let query = collectionRef.where('visitorEnterBy', '==', num).limit(pageSize);

      if (lastDoc) {
        query = query.startAfter(lastDoc);
      }

      const snapshot = await query.get();

      if (snapshot.empty) {
        logging.log('No matching documents.');
        return { documents: [], lastDocument: null };
      }

      const documents = [];
      let lastDocument = null;
      snapshot.forEach(doc => {
        documents.push({ id: doc.id, ...doc.data() });
        lastDocument = doc;
      });

      return { documents, lastDocument };
    } catch (error) {
      logging.log('Error in fetchDocumentsExcludingMaster:', error);
      throw error;
    }
  }

  try {
    // Initial fetch
    let { documents, lastDocument } = await fetchDocumentsExcludingMaster('visitor_table');
    logging.log('Documents:', documents);

    // Fetch additional pages if needed
    while (true) {
      const result = await fetchDocumentsExcludingMaster('visitor_table', 12, lastDocument);
      const newDocs = result.documents || [];
      const newLastDoc = result.lastDocument || null;
      if (newDocs.length === 0) break;

      documents = documents.concat(newDocs);
      lastDocument = newLastDoc;
      logging.log('Additional Documents:', newDocs);
    }

    // Return the documents as part of the node output
    return { documents };
  } catch (error) {
    logging.log('Error fetching documents:', error);
    throw error; // Rethrow the error to indicate failure in the node
  }
}

To me it seems like all the data are loaded at once, since when I click the arrows of the datatable the data of the next page load almost immediately. What am I doing wrong? How can I implement pagination correctly using FF and Buildship?

What have you tried so far?

Tried implementing pagination in FF and Buildship.

Did you check FlutterFlow's Documentation for this topic?
Yes
1