From cfe13ccc79ebc4b8d1f2f9a18f664fa83d083ed9 Mon Sep 17 00:00:00 2001
From: Andrew Hudson <ahudson@gmail.com>
Date: Mon, 22 Feb 2021 10:09:41 +0000
Subject: [PATCH] [DataGrid] Fix checked checkbox when empty rows (#1068)

---
 .../grid/components/GridCheckboxRenderer.tsx         |  2 +-
 .../data-grid/src/tests/selection.DataGrid.test.tsx  | 12 ++++++++++++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/packages/grid/_modules_/grid/components/GridCheckboxRenderer.tsx b/packages/grid/_modules_/grid/components/GridCheckboxRenderer.tsx
index 5c367747236b7..f084d38aae347 100644
--- a/packages/grid/_modules_/grid/components/GridCheckboxRenderer.tsx
+++ b/packages/grid/_modules_/grid/components/GridCheckboxRenderer.tsx
@@ -24,7 +24,7 @@ export const GridHeaderCheckbox: React.FC<GridColParams> = () => {
 
   React.useEffect(() => {
     const isNewIndeterminate = totalSelectedRows > 0 && totalSelectedRows !== totalRows;
-    const isNewChecked = totalSelectedRows === totalRows || isIndeterminate;
+    const isNewChecked = (totalRows > 0 && totalSelectedRows === totalRows) || isIndeterminate;
     setChecked(isNewChecked);
     setisIndeterminate(isNewIndeterminate);
   }, [isIndeterminate, totalRows, totalSelectedRows]);
diff --git a/packages/grid/data-grid/src/tests/selection.DataGrid.test.tsx b/packages/grid/data-grid/src/tests/selection.DataGrid.test.tsx
index aab7980ac52f6..3a43687330a4e 100644
--- a/packages/grid/data-grid/src/tests/selection.DataGrid.test.tsx
+++ b/packages/grid/data-grid/src/tests/selection.DataGrid.test.tsx
@@ -46,6 +46,18 @@ describe('<DataGrid /> - Selection', () => {
       expect(row!.classList.contains('Mui-selected')).to.equal(false, 'class mui-selected 2');
       expect(checkbox).to.have.property('checked', false);
     });
+
+    it('with no rows, the checkbox should not be checked', () => {
+      render(
+        <div style={{ width: 300, height: 300 }}>
+          <DataGrid rows={[]} checkboxSelection columns={[{ field: 'brand', width: 100 }]} />
+        </div>,
+      );
+      const selectAll = screen.getByRole('checkbox', {
+        name: /select all rows checkbox/i,
+      });
+      expect(selectAll).to.have.property('checked', false);
+    });
   });
 
   describe('props: selectionModel', () => {