The following code will get you all the records from every table:

const base = useBase();

const tables = base.tables

const queries = tables.map(table => table.selectRecords())



useLoadable(queries)

useWatchable((queries), ['records'])



const recordsFromQueries = queries.map(x => x.records)

Your issue now is to filter records by the field where “Complete” is a possible value, and since that would be a different field for each table, you’d either need to map those fields in your app’s settings or hope they’re all named the same thing and remain named the same thing.

const incompleteRecords = recordsFromQueries.filter(record => record.getCellValue("a field name consistent across every single table") !== "Complete")

Thanks for your quick response, @Kamille_Parks

It almost works except for that filtering part.

I do have a consistent field (Checkbox type) named “Completed”.

The issue is that when I run:

const incompleteRecords = recordsFromQueries.filter((record) => record.getCellValue("Completed") !== true);

I get TypeError: record.getCellValue is not a function

I guess this is happening because I’m trying to run the getCellValue method on an array? That’s what seems to be assigned to record inside that filter function.

If its returning an array then nest another .map() function.

@Kamille_Parks

I was actually able to solve the issue with the array by doing a reduce like this:

const batchRecordsFromQueries = queries.map((x) => x.records);



  const recordsFromQueries = batchRecordsFromQueries.reduce((accum, item) => {

    accum = [...accum, ...item];

    return accum;

  }, []);



  const filteredRecords = recordsFromQueries.filter(

    (record) =>

      !record.getCellValue("Completed") &&

      record.getCellValueAsString(assignedToFieldName) ==

        base.getCollaboratorByIdIfExists(selectedCollaborator).name

  );

It works as expected, it does gets all records and filters them by these criteria, the only issue now is that they are not reactive as I was first concerned…

For example, I have a checkbox that marks task as completed. When hitting this, it does update the record inside Airtable but nothing happens inside the App so I need to reload it in order to see the updates… Could you please help me with that?

This is my updating method:

function TaskDoneCheckbox({ record }) {

  function onChange(event) {

    record.parentTable.updateRecordAsync(record, {

      Completed: event.currentTarget.checked,

    });

  }



  return (

    <input

      type="checkbox"

      checked={!!record.getCellValue("Completed")}

      onChange={onChange}

    />

  );

}

const batchRecordsFromQueries = queries.map((x) => x.records);



  const recordsFromQueries = batchRecordsFromQueries.reduce((accum, item) => {

    accum = [...accum, ...item];

    return accum;

  }, []);



  const filteredRecords = recordsFromQueries.filter(

    (record) =>

      !record.getCellValue("Completed") &&

      record.getCellValueAsString(assignedToFieldName) ==

        base.getCollaboratorByIdIfExists(selectedCollaborator).name

  );

function TaskDoneCheckbox({ record }) {

  function onChange(event) {

    record.parentTable.updateRecordAsync(record, {

      Completed: event.currentTarget.checked,

    });

  }



  return (

    <input

      type="checkbox"

      checked={!!record.getCellValue("Completed")}

      onChange={onChange}

    />

  );

}

Add “cellValues” or “cellValueInField: fieldId” as a watched key in useWatchable. Documentation.

It works!!!

Thanks a LOT for all your help