TanStackT
TanStack•16mo ago
colossal-harlequin

Filter grouped rows based on leaf counts

I'm struggling to filter grouped rows based on the group's leaf count. I'm not sure this can be done with tanstack-table.

I've put together this silly codesandbox that shows the issue : https://codesandbox.io/p/devbox/wonderful-cohen-gdhgq8
The table is grouped on the "age" column, I'd like to hide all rows that have less than MIN_LEAVES persons (currently, 6) with a given age. 

const filterRowsWithSubrows: FilterFn<Person> = (
  row,
  columnId,
  filterValue
) => {
  const countLeafDescendants = (row: Row<Person>): number => {
    if (row.subRows.length === 0) {
      return 1;
    }
    return row.subRows.reduce(
      (count, subRow) => count + countLeafDescendants(subRow),
      0
    );
  };
  const leafCount = countLeafDescendants(row);
  if (row.getIsGrouped() && leafCount < MIN_LEAVES) {
    return false;
  }
  return true;
};


{
  accessorKey: "age",
  header: () => "Age",
  aggregatedCell: ({ getValue }) =>
    Math.round(getValue<number>() * 100) / 100,
  aggregationFn: "median",
  filterFn: filterRowsWithSubrows,
  enableColumnFilter: true,
  enableGlobalFilter: true,
},


Oviously, this doesn't work - it seems that the filters only run on the non-grouped rows?
Was this page helpful?