[DataGrid] Fix deselection not working with isRowSelectable (#15692)

Co-authored-by: Armin Mehinovic <[email protected]>
Co-authored-by: Kenan Yusuf <[email protected]>

docs/data/migration/migration-data-grid-v7/migration-data-grid-v7.md

@@ -38,6 +38,7 @@ Below are described the steps you need to make to migrate from v7 to v8.
 - The default value of the `rowSelectionPropagation` prop has been changed to `{ parents: true, descendants: true }` which means that the selection will be propagated to the parents and descendants by default.
   To revert to the previous behavior, pass `rowSelectionPropagation={{ parents: false, descendants: false }}`.
 - The prop `indeterminateCheckboxAction` has been removed. Clicking on an indeterminate checkbox "selects" the unselected descendants.
+- The "Select all" checkbox would now be checked when all the selectable rows are selected, ignoring rows that are not selectable because of the `isRowSelectable` prop.
 
 ### Changes to the public API
 

packages/x-data-grid/src/components/columnSelection/GridHeaderCheckbox.tsx

@@ -68,10 +68,14 @@ const GridHeaderCheckbox = React.forwardRef<HTMLButtonElement, GridColumnHeaderP
       // Convert to an object to make O(1) checking if a row exists or not
       // TODO create selector that returns visibleRowIds/paginatedVisibleRowIds as an object
       return rowIds.reduce<Record<GridRowId, true>>((acc, id) => {
+        if (!apiRef.current.isRowSelectable(id)) {
+          return acc;
+        }
         acc[id] = true;
         return acc;
       }, {});
     }, [
+      apiRef,
       rootProps.pagination,
       rootProps.checkboxSelectionVisibleOnly,
       paginatedVisibleRowIds,

packages/x-data-grid/src/tests/rowSelection.DataGrid.test.tsx

@@ -671,6 +671,17 @@ describe('<DataGrid /> - Row selection', () => {
         );
       }).not.toErrorDev();
     });
+
+    it('should set the "Select all" checkbox to selected state on clicking even when some rows are not selectable', () => {
+      render(
+        <TestDataGridSelection
+          checkboxSelection
+          isRowSelectable={({ id }) => Number(id) % 2 === 0}
+        />,
+      );
+      fireEvent.click(getColumnHeaderCell(0).querySelector('input')!);
+      expect(getColumnHeaderCell(0).querySelector('input')).to.have.property('checked', true);
+    });
   });
 
   describe('prop: rows', () => {