[DataGridPremium] Fix expanded groups being collapsed after calling `…

…updateRows` (#8823)
mui · May 4, 2023 · 92641bd · 92641bd
1 parent fc4392c
commit 92641bd
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 1 deletion.
diff --git a/packages/grid/x-data-grid-premium/src/tests/rowGrouping.DataGridPremium.test.tsx b/packages/grid/x-data-grid-premium/src/tests/rowGrouping.DataGridPremium.test.tsx
@@ -2634,4 +2634,24 @@ describe('<DataGridPremium /> - Row Grouping', () => {
 
     await waitFor(() => expect(getCell(1, 3).textContent).to.equal('username 2'));
   });
+
+  // See https://github.com/mui/mui-x/issues/8580
+  it('should not collapse expanded groups after `updateRows`', async () => {
+    render(
+      <Test
+        columns={[{ field: 'id' }, { field: 'group' }, { field: 'username', width: 150 }]}
+        rows={[{ id: 1, group: 'A', username: 'username' }]}
+        rowGroupingModel={['group']}
+      />,
+    );
+
+    fireEvent.click(screen.getByRole('button', { name: 'see children' }));
+
+    act(() => apiRef.current.updateRows([{ id: 1, group: 'A', username: 'username 2' }]));
+
+    await waitFor(() => {
+      expect(screen.getByRole('button', { name: 'hide children' })).toBeVisible();
+    });
+    await waitFor(() => expect(getCell(1, 3).textContent).to.equal('username 2'));
+  });
 });
diff --git a/packages/grid/x-data-grid-pro/src/utils/tree/utils.ts b/packages/grid/x-data-grid-pro/src/utils/tree/utils.ts
@@ -35,13 +35,15 @@ export const getNodePathInTree = ({
 
   while (node.id !== GRID_ROOT_GROUP_ID) {
     path.push({
-      field: (node as GridGroupNode).groupingField,
+      field: node.type === 'leaf' ? null : node.groupingField,
       key: node.groupingKey,
     });
 
     node = tree[node.parent!] as GridGroupNode | GridLeafNode;
   }
 
+  path.reverse();
+
   return path;
 };