TanStack / table

🤖 Headless UI for building powerful tables & datagrids for TS/JS - React-Table, Vue-Table, Solid-Table, Svelte-Table
https://tanstack.com/table
MIT License
25.02k stars 3.07k forks source link

Global Filter Fails When First Row Value is Undefined #4783

Open codebycarlos opened 1 year ago

codebycarlos commented 1 year ago

Describe the bug

If the first row of a table has an undefined value in a column, the global filter won't work on that column, regardless of valid values in subsequent rows.

Take for example:

ID Other
test
hello test
world test

Searching for hello with the global filter fails, even though it's clearly there. As soon as the order of the rows within the data is reversed, the global filters begins to work again.

Your minimal, reproducible example

https://codesandbox.io/p/sandbox/adoring-sid-ro5tmg?file=%2Fsrc%2Fmain.tsx&selection=%5B%7B%22endColumn%22%3A26%2C%22endLineNumber%22%3A56%2C%22startColumn%22%3A26%2C%22startLineNumber%22%3A56%7D%5D

Steps to reproduce

Create a table where the first row of data has an undefined value. Subsequent rows should have string values. Upon using the global filter to search for an existing value, nothing is shown.

Expected behavior

Global filter should work, regardless of row order.

How often does this bug happen?

Every time

Screenshots or Videos

https://user-images.githubusercontent.com/91962855/228718000-77c0218e-7e71-4447-8994-41b8ccf247a0.mp4

Platform

react-table version

8.8.2

TypeScript version

No response

Additional context

This may be due to the default getColumnCanGlobalFilter implementation: https://github.com/TanStack/table/blob/134414e7c5c6ff732c839a6c8b8f43a933967d3e/packages/table-core/src/features/Filters.ts#L190-L196

It seems to check the first row's values to determine if certain columns can be globally filtered.

Terms & Code of Conduct

codebycarlos commented 1 year ago

Potentially related to https://github.com/TanStack/table/issues/4711, https://github.com/TanStack/table/issues/4673, https://github.com/TanStack/table/issues/4594.

codebycarlos commented 1 year ago

I'm not familiar with the motivation behind getColumnCanGlobalFilter. But the idea of determining column filterability based on the first row will undoubtedly be a footgun for many people using TanStack/table. Perhaps it's best that the default implementation always returns true?