filterFromLeafRows table option does not work

[marcaltmann]

Describe the bug

The filterFromLeafRows table option seems to not work properly. It is filtering out way more rows than expected.

I used the React Table Expanding example (https://tanstack.com/table/v8/docs/examples/react/expanding) and modfified it, setting the option filterFromLeafRows on the table.

Now when filtering, it seems that the filter value must match both the sub row and the parent row in order for the rows to remain visible. If the filter value matches only the sub row, nothing is displayed (maybe an AND where an OR is needed?).

Your minimal, reproducible example

https://codesandbox.io/s/compassionate-gates-0bpvhg

Steps to reproduce

1. Expand the first row in the table, e.g. in my case the row "Jalon"
2. In the filter of the first column, enter what you see in one of the sub rows (e.g. the name "Bonnie")

Expected behavior

As a user, I expect the row "Bonnie" as well as its parent "Jalon" to remain.
Instead, both rows will disappear.

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

Linux, Firefox

react-table version

v8.2.6

TypeScript version

No response

Additional context

No response

Terms & Code of Conduct

• I agree to follow this project's Code of Conduct
• I understand that if my bug cannot be reliable reproduced in a debuggable environment, it will probably not be fixed and this issue may even be closed.

[rizwanliaqat97]

I'm facing same problem, currently worked around it by my own filter function

[marcaltmann]

I tried using a custom filter function, but it did not help. How did you do it?

[rizwanliaqat97]

In my case I had many level of subrows, (i.e a subrow could contain more subrows) so even if one subrow matched any level I had to show the the parent rows, I have recurssive function but that's just for my need as I can't tell how many levels deep I'll go, depends on the data.

So what my filter function does is it checks the data of current row and returns true if it matches, and then it also looks into subrow data (because subrow data is also part of parent row data), if any subrow matches, it still returns true for parent row

Something like this: (It's simplified, I had a recussive function for my subrows)

(row, colId, filterValue) => {
    if (current_row_matches) {
      return true;
    }

    // If the row doesn't match then add this row to result only if one of its child rows match
    if (check_if_this_row_has_subrows) {
      const subrowData = row.subrows;

      // go through subrow data to find a match (`Array.some()` is very handy here)
     const matchFound = subrowData.some(subrow => check_if_this_subrow_matches);

     if(matchFound) {
        return true;
        }
    }

    // if nor the current row neither any of its subrows matched, exclude this row from result
    return false;
  };

[rek]

I also have this issue when using filterFromLeafRows and expanded. Anyone have a custom working getFilteredRowModel we can use in the meantime?

[kasunnirmala]

Same issue here. Not filtering leaf elements though that flag is enabled.