From aa09274a7d044d75ebc83ba11deeaa763c8a49b2 Mon Sep 17 00:00:00 2001 From: Simcha Date: Sun, 10 Mar 2024 10:33:08 +0200 Subject: [PATCH 1/3] fix(selection): update logic to fix selection of disabled rows --- examples/react/row-selection/src/main.tsx | 12 ++--- .../table-core/src/features/RowSelection.ts | 53 +++++++++++++------ 2 files changed, 42 insertions(+), 23 deletions(-) diff --git a/examples/react/row-selection/src/main.tsx b/examples/react/row-selection/src/main.tsx index 05a22ca29e..8ba07ec6ff 100644 --- a/examples/react/row-selection/src/main.tsx +++ b/examples/react/row-selection/src/main.tsx @@ -30,7 +30,7 @@ function App() { @@ -110,8 +110,8 @@ function App() { state: { rowSelection, }, - enableRowSelection: true, //enable row selection for all rows - // enableRowSelection: row => row.original.age > 18, // or enable row selection conditionally per row + // enableRowSelection: true, //enable row selection for all rows + enableRowSelection: row => row.original.age > 18, // or enable row selection conditionally per row onRowSelectionChange: setRowSelection, getCoreRowModel: getCoreRowModel(), getFilteredRowModel: getFilteredRowModel(), @@ -180,7 +180,7 @@ function App() { @@ -344,9 +344,9 @@ function IndeterminateCheckbox({ React.useEffect(() => { if (typeof indeterminate === 'boolean') { - ref.current.indeterminate = !rest.checked && indeterminate + ref.current.indeterminate = indeterminate } - }, [ref, indeterminate]) + }, [ref, indeterminate, rest.checked]) return ( @@ -118,7 +118,7 @@ export interface RowSelectionInstance { * @link [API Docs](https://tanstack.com/table/v8/docs/api/features/row-selection#getisallpagerowsselected) * @link [Guide](https://tanstack.com/table/v8/docs/guide/row-selection) */ - getIsAllPageRowsSelected: () => boolean + getIsAllPageRowsSelected: (ignoreCanSelect?: boolean) => boolean /** * Returns whether or not all rows in the table are selected. * @link [API Docs](https://tanstack.com/table/v8/docs/api/features/row-selection#getisallrowsselected) @@ -130,7 +130,7 @@ export interface RowSelectionInstance { * @link [API Docs](https://tanstack.com/table/v8/docs/api/features/row-selection#getissomepagerowsselected) * @link [Guide](https://tanstack.com/table/v8/docs/guide/row-selection) */ - getIsSomePageRowsSelected: () => boolean + getIsSomePageRowsSelected: (ignoreCanSelect?: boolean) => boolean /** * Returns whether or not any rows in the table are selected. * @link [API Docs](https://tanstack.com/table/v8/docs/api/features/row-selection#getissomerowsselected) @@ -238,6 +238,9 @@ export const RowSelection: TableFeature = { }) } else { preGroupedFlatRows.forEach(row => { + if (!row.getCanSelect()) { + return + } delete rowSelection[row.id] }) } @@ -253,7 +256,6 @@ export const RowSelection: TableFeature = { : !table.getIsAllPageRowsSelected() const rowSelection: RowSelectionState = { ...old } - table.getRowModel().rows.forEach(row => { mutateRowIsSelected(rowSelection, row.id, resolvedValue, true, table) }) @@ -405,17 +407,20 @@ export const RowSelection: TableFeature = { return isAllRowsSelected } - table.getIsAllPageRowsSelected = () => { - const paginationFlatRows = table - .getPaginationRowModel() - .flatRows.filter(row => row.getCanSelect()) + table.getIsAllPageRowsSelected = (ignoreCanSelect?: boolean) => { + const paginationFlatRows = table.getPaginationRowModel().flatRows + + const filterPaginationFlatRows = ignoreCanSelect + ? paginationFlatRows + : paginationFlatRows.filter(row => row.getCanSelect()) + const { rowSelection } = table.getState() - let isAllPageRowsSelected = !!paginationFlatRows.length + let isAllPageRowsSelected = !!filterPaginationFlatRows.length if ( isAllPageRowsSelected && - paginationFlatRows.some(row => !rowSelection[row.id]) + filterPaginationFlatRows.some(row => !rowSelection[row.id]) ) { isAllPageRowsSelected = false } @@ -433,13 +438,25 @@ export const RowSelection: TableFeature = { ) } - table.getIsSomePageRowsSelected = () => { + table.getIsSomePageRowsSelected = (ignoreCanSelect?: boolean) => { const paginationFlatRows = table.getPaginationRowModel().flatRows - return table.getIsAllPageRowsSelected() + + const getSelectedRowsBySelectCondition = () => { + return ignoreCanSelect + ? paginationFlatRows.some( + d => d.getIsSelected() || d.getIsSomeSelected() + ) && + paginationFlatRows.some( + d => !d.getIsSelected() && !d.getIsSomeSelected() + ) + : paginationFlatRows + .filter(row => row.getCanSelect()) + .some(d => d.getIsSelected() || d.getIsSomeSelected()) + } + + return table.getIsAllPageRowsSelected(ignoreCanSelect) ? false - : paginationFlatRows - .filter(row => row.getCanSelect()) - .some(d => d.getIsSelected() || d.getIsSomeSelected()) + : getSelectedRowsBySelectCondition() } table.getToggleAllRowsSelectedHandler = () => { @@ -552,14 +569,16 @@ const mutateRowIsSelected = ( // !isGrouped || // (isGrouped && table.options.enableGroupingRowSelection) // ) { + + const canSelect = row.getCanSelect() if (value) { if (!row.getCanMultiSelect()) { Object.keys(selectedRowIds).forEach(key => delete selectedRowIds[key]) } - if (row.getCanSelect()) { + if (canSelect) { selectedRowIds[id] = true } - } else { + } else if (canSelect) { delete selectedRowIds[id] } // } From 5f25ff98e44817cd089584b017479368e9a94d19 Mon Sep 17 00:00:00 2001 From: Simcha Date: Sun, 10 Mar 2024 10:47:51 +0200 Subject: [PATCH 2/3] fix(selection): update logic to fix selection of disabled rows --- packages/table-core/src/features/RowSelection.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/table-core/src/features/RowSelection.ts b/packages/table-core/src/features/RowSelection.ts index b616151ba9..d8d9280177 100644 --- a/packages/table-core/src/features/RowSelection.ts +++ b/packages/table-core/src/features/RowSelection.ts @@ -447,7 +447,7 @@ export const RowSelection: TableFeature = { d => d.getIsSelected() || d.getIsSomeSelected() ) && paginationFlatRows.some( - d => !d.getIsSelected() && !d.getIsSomeSelected() + d => !d.getIsSelected() || !d.getIsSomeSelected() ) : paginationFlatRows .filter(row => row.getCanSelect()) From 173e6e9c80a0b9283e2c5287c3c99845330a66ed Mon Sep 17 00:00:00 2001 From: Simcha Date: Sun, 10 Mar 2024 10:54:14 +0200 Subject: [PATCH 3/3] fix(selection): update logic to fix selection of disabled rows --- packages/table-core/src/features/RowSelection.ts | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/packages/table-core/src/features/RowSelection.ts b/packages/table-core/src/features/RowSelection.ts index d8d9280177..1955fa7245 100644 --- a/packages/table-core/src/features/RowSelection.ts +++ b/packages/table-core/src/features/RowSelection.ts @@ -178,7 +178,10 @@ export interface RowSelectionInstance { * @link [API Docs](https://tanstack.com/table/v8/docs/api/features/row-selection#toggleallpagerowsselected) * @link [Guide](https://tanstack.com/table/v8/docs/guide/row-selection) */ - toggleAllPageRowsSelected: (value?: boolean) => void + toggleAllPageRowsSelected: ( + value?: boolean, + ignoreCanSelect?: boolean + ) => void /** * Selects/deselects all rows in the table. * @link [API Docs](https://tanstack.com/table/v8/docs/api/features/row-selection#toggleallrowsselected) @@ -248,12 +251,12 @@ export const RowSelection: TableFeature = { return rowSelection }) } - table.toggleAllPageRowsSelected = value => + table.toggleAllPageRowsSelected = (value, ignoreCanSelect) => table.setRowSelection(old => { const resolvedValue = typeof value !== 'undefined' ? value - : !table.getIsAllPageRowsSelected() + : !table.getIsAllPageRowsSelected(ignoreCanSelect) const rowSelection: RowSelectionState = { ...old } table.getRowModel().rows.forEach(row => { @@ -441,7 +444,7 @@ export const RowSelection: TableFeature = { table.getIsSomePageRowsSelected = (ignoreCanSelect?: boolean) => { const paginationFlatRows = table.getPaginationRowModel().flatRows - const getSelectedRowsBySelectCondition = () => { + const getIsSomeSelectedByCondition = () => { return ignoreCanSelect ? paginationFlatRows.some( d => d.getIsSelected() || d.getIsSomeSelected() @@ -456,7 +459,7 @@ export const RowSelection: TableFeature = { return table.getIsAllPageRowsSelected(ignoreCanSelect) ? false - : getSelectedRowsBySelectCondition() + : getIsSomeSelectedByCondition() } table.getToggleAllRowsSelectedHandler = () => {