komarovalexander / ka-table

Lightweight MIT React Table component with Sorting, Filtering, Grouping, Virtualization, Editing and many more
http://ka-table.com
MIT License
788 stars 58 forks source link

Using the SelectionHeader example from the docs cause crash when 'dispatch' function is passed into the table component. #383

Closed cryptrr closed 9 months ago

cryptrr commented 9 months ago

There is no such issues if the DispatchFunc is not passed.

headCell: {
      content: (props) => {
        if (props.column.key === 'selection-cell') {
            return <SelectionHeader />;
        }
    },
const SelectionHeader = () => {
    const table = useTableInstance();
    const areAllRowsSelected = kaPropsUtils.areAllFilteredRowsSelected(table.props);

    return (
        <input
            type='checkbox'
            checked={areAllRowsSelected}
            onChange={(event) => {
                if (event.currentTarget.checked) {
                    table.selectAllFilteredRows(); // also available: selectAllVisibleRows(), selectAllRows()
                } else {
                    table.deselectAllFilteredRows(); // also available: deselectAllVisibleRows(), deselectAllRows()
                }
            }}
        />
    );
};

useTableInstance warning: ka-table is not initialized, instanse is empty because: table is not rendered yet OR controlled mode is used

Uncaught TypeError: Cannot read properties of undefined (reading 'selectedRows') at Object.areAllFilteredRowsSelected (chunk-UFJC7EMJ.js?v=13efd348:1165:22) at SelectionHeader

komarovalexander commented 9 months ago

Hi this error happens because table is used in controlled mode (when you pass dispatch and control it by yourself) docs and error is correct

Working example https://komarovalexander.github.io/ka-table/#/selection