mantine-react-table icon indicating copy to clipboard operation
mantine-react-table copied to clipboard

Columns with null value in first item are excluded from global filter

Open rhyek opened this issue 1 year ago • 2 comments

mantine-react-table version

2.0.0-beta.7

react & react-dom versions

18.3.1

Describe the bug and the steps to reproduce it

When the first item in the data array has a column with a null value, the global filter excludes that column completely during search.

Steps to reproduce:

  • Open the codesandbox
  • Type any city name in the global filter, eg: Hunt
  • No rows are matched even though the fourth row has city === 'Huntington'

Minimal, Reproducible Example - (Optional, but Recommended)

https://codesandbox.io/p/sandbox/unruffled-hellman-j6hk64

Screenshots or Videos (Optional)

No response

Do you intend to try to help solve this bug with your own PR?

No, because I do not have time to dig into it

Terms

  • [X] I understand that if my bug cannot be reliably reproduced in a debuggable environment, it will probably not be fixed and this issue may even be closed.

rhyek avatar Nov 10 '24 01:11 rhyek

This issue is realted to TanStack. There would be several workarounds.

  1. return never null or undefined in accessorFn, it has to be always of type string
  2. use column filterFn: 'includesString' to remove nullisch entries
  3. Enable explicitly global filtering for the affected rows: getColumnCanGlobalFilter: (column) => return true 3.1 Keep in mind if you will to that you have to implement your globalFilterFn by your own to handle nullisch values
        filterFns: {
            customContains: (row, id, filterValue) => {
                return row.getValue<TData>(id)?.includes(filterValue) || false;
            }
        },

TanStack/table#4919

desytech avatar Nov 18 '24 17:11 desytech

Taking a quick stab at it, the first option worked.

rhyek avatar Nov 19 '24 02:11 rhyek