Add additional aria attributes to the rows in a grid that has row grouping enabled

Author: arminmeh

packages/x-data-grid-premium/src/DataGridPremium/DataGridPremium.tsx

@@ -15,7 +15,6 @@ import {
   propValidatorsDataGridPro,
   PropValidator,
   validateProps,
-  useGridRowAriaAttributes,
 } from '@mui/x-data-grid-pro/internals';
 import { useDataGridPremiumComponent } from './useDataGridPremiumComponent';
 import {
@@ -24,6 +23,7 @@ import {
 } from '../models/dataGridPremiumProps';
 import { useDataGridPremiumProps } from './useDataGridPremiumProps';
 import { getReleaseInfo } from '../utils/releaseInfo';
+import { useGridRowAriaAttributes } from '../hooks/features/rows/useGridRowAriaAttributes';
 
 export type { GridPremiumSlotsComponent as GridSlots } from '../models';
 

packages/x-data-grid-premium/src/hooks/features/rows/index.tsx

@@ -0,0 +1 @@
+export * from './useGridRowAriaAttributes';

packages/x-data-grid-premium/src/hooks/features/rows/useGridRowAriaAttributes.tsx

@@ -0,0 +1,12 @@
+import {
+  useGridRowAriaAttributes as useGridRowAriaAttributesPro,
+  useGridSelector,
+} from '@mui/x-data-grid-pro/internals';
+import { useGridPrivateApiContext } from '../../utils/useGridPrivateApiContext';
+import { gridRowGroupingModelSelector } from '../rowGrouping/gridRowGroupingSelector';
+
+export const useGridRowAriaAttributes = () => {
+  const apiRef = useGridPrivateApiContext();
+  const gridRowGroupingModel = useGridSelector(apiRef, gridRowGroupingModelSelector);
+  return useGridRowAriaAttributesPro(gridRowGroupingModel.length > 0);
+};

packages/x-data-grid-pro/src/hooks/features/rows/useGridRowAriaAttributes.tsx

@@ -11,7 +11,7 @@ import { useGridRowAriaAttributes as useGridRowAriaAttributesCommunity } from '@
 import { useGridPrivateApiContext } from '../../utils/useGridPrivateApiContext';
 import { useGridRootProps } from '../../utils/useGridRootProps';
 
-export const useGridRowAriaAttributes = () => {
+export const useGridRowAriaAttributes = (addTreeDataAttributes?: boolean) => {
   const apiRef = useGridPrivateApiContext();
   const props = useGridRootProps();
   const getRowAriaAttributesCommunity = useGridRowAriaAttributesCommunity();
@@ -26,12 +26,15 @@ export const useGridRowAriaAttributes = () => {
     gridExpandedSortedRowIdsLookupSelector,
   );
 
+  const addAttributes =
+    addTreeDataAttributes !== undefined ? addTreeDataAttributes : props.treeData === true;
+
   return React.useCallback(
     (rowId: GridRowId, index: number) => {
       const rowNode = apiRef.current.getRowNode(rowId);
       const ariaAttributes = getRowAriaAttributesCommunity(rowId, index);
 
-      if (rowNode === null || props.treeData !== true) {
+      if (!addAttributes || rowNode === null) {
         return ariaAttributes;
       }
 
@@ -56,7 +59,7 @@ export const useGridRowAriaAttributes = () => {
     },
     [
       apiRef,
-      props.treeData,
+      addAttributes,
       filteredTopLevelRowCount,
       filteredChildrenCountLookup,
       sortedVisibleRowPositionsLookup,