add "expand_all" toggle to datagrid header

packages/ra-core/src/controller/list/useExpanded.tsx

@@ -49,3 +49,24 @@ export const useExpanded = (
 
     return [expanded, toggleExpanded];
 };
+
+export const useExpandedMultiple = (
+    resource: string,
+    ids: Identifier[]
+): [boolean, () => void] => {
+    const [expandedIds, setExpandedIds] = useStore<Identifier[]>(
+        `${resource}.datagrid.expanded`,
+        []
+    );
+
+    const expanded = expandedIds.some(id => ids.some(id2 => id2 == id));
+
+    const setExpanded = useCallback(() => {
+        const filtered = expandedIds.filter(
+            expanded_id => !ids.some(id => id == expanded_id)
+        );
+        setExpandedIds(expanded ? filtered : filtered.concat(ids));
+    }, [expandedIds, setExpandedIds, expanded, ids]);
+
+    return [expanded, setExpanded];
+};

packages/ra-ui-materialui/src/list/datagrid/DatagridHeader.tsx

@@ -2,6 +2,7 @@ import * as React from 'react';
 import { Children, isValidElement, useCallback } from 'react';
 import PropTypes from 'prop-types';
 import {
+    useExpandedMultiple,
     useListContext,
     useResourceContext,
     Identifier,
@@ -12,6 +13,7 @@ import {
 import { Checkbox, TableCell, TableHead, TableRow } from '@mui/material';
 import clsx from 'clsx';
 
+import ExpandRowButton from './ExpandRowButton';
 import DatagridHeaderCell from './DatagridHeaderCell';
 import { DatagridClasses } from './useDatagridStyles';
 
@@ -52,6 +54,11 @@ export const DatagridHeader = (props: DatagridHeaderProps) => {
 
     const updateSort = setSort ? updateSortCallback : null;
 
+    const [expanded, toggleExpanded] = useExpandedMultiple(
+        resource,
+        data.map(record => record.id)
+    );
+
     const handleSelectAll = useCallback(
         event =>
             onSelect(
@@ -93,7 +100,15 @@ export const DatagridHeader = (props: DatagridHeaderProps) => {
                             DatagridClasses.headerCell,
                             DatagridClasses.expandHeader
                         )}
-                    />
+                    >
+                        <ExpandRowButton
+                            className={clsx(DatagridClasses.expandIcon, {
+                                [DatagridClasses.expanded]: expanded,
+                            })}
+                            expanded={expanded}
+                            onClick={toggleExpanded}
+                        />
+                    </TableCell>
                 )}
                 {hasBulkActions && selectedIds && (
                     <TableCell