Carbon: [DataTable] No possibility to apply custom filter for rows with Select All functionality - React

[tomkdgun]

Currently there is no possibility to apply custom filter for rows with Select All functionality, when filterInputValue is not provided.

Probably new prop is required, where I could provide my custom filter function, and this function should be called always, regardless on search input. This function can also take search input into account.

Currently there is an option to provide custom filter function.
https://github.com/carbon-design-system/carbon/blob/master/packages/react/src/components/DataTable/DataTable.js

Function is called when filterInputValue is provided.

This impacts how Select All works, when filterInputValue provided, it will unselect all rows, and selects only filtered rows.

I would like to apply custom filter function to DataTable, e.g. show only selected rows, filter by some custom row type (e.g. show rows with value under column ABC to be equal e.g. 'string' or 'number'), and any combination of these e.g. show selected rows with type string or number, which optionally contains search string
and
to have this custom filter function taken into account in handleSelectAll function.

Functionality is required in one of IBM product.

What package(s) are you using?

"carbon-components": "10.10.1",
"carbon-components-react": "7.10.1",
"carbon-icons": "7.0.7",

[emyarod]

it might be more practical to implement this in a custom state manager and build with the table UI components (Table, TableHeader, TableBody, TableRow, TableCell, etc). I'm not sure if we will bake this into the DataTable component's state manager with the way it is currently architected, at least not before a major release

[tomkdgun]

IBM SPSS Statistics needs this.
I was requested this, since few lines can fix this issue, without a need to create it's own component with thousand of lines e.g. replace line 437 code below.

typeof this.state.filterInputValue === 'string' || this.props.externalFilterApplied

Different name can be selected, externalFilterApplied can be a boolean or object with actual custom filter, which can be passed to this.props.filterRow.
This new prop, together with filterRow function provided by user as props, could solve the problem

[bitfede]

@tomkdgun I love that solution, I am in an EXTREME need for custom filtering too, it will make the DataTable a component much more usable for SaaS applications and enterprise tools where data needs to be filtered, searched, and selected.

@emyarod in case I am forced to do this with a custom state manager, who should receive the ids of the rows selected, so that as I filter/search the selection is not forgotten but remembered by the table? Can you elaborate a bit on your proposed solution?

Thank you very much, hope to see some activity in this thread soon

[emyarod]

@bitfede does this example help? https://codesandbox.io/s/github/carbon-design-system/carbon/tree/master/packages/react/examples/custom-data-table-state-manager

[bitfede]

Amazing! It does show everything clearly. Appreciate you showing us how a custom table is done.