Revert changes related to ListActions and updated docs

marmelab · Jun 7, 2021 · dd8f78a · dd8f78a
1 parent c859fc1
commit dd8f78a
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 13 deletions.
diff --git a/docs/List.md b/docs/List.md
@@ -94,25 +94,29 @@ You can add extra actions to a `<List>` by using the `actions` prop:
 
 ```jsx
 import * as React from 'react';
+import { cloneElement } from 'react';
 import { List, ListActions, Button } from 'react-admin';
 import IconEvent from '@material-ui/icons/Event';
 
-const CustomListActions = (props) => (
-    <ListActions {...props}>
+const ListActions = (props) => (
+    <TopToolbar>
+        {cloneElement(props.filters, { context: 'button' })}
+        <CreateButton/>
+        <ExportButton/>
         {/* Add your custom actions */}
         <Button
             onClick={() => { alert('Your custom action'); }}
             label="Show calendar"
         >
-            <IconEvent />
+            <IconEvent/>
         </Button>
-    </ListActions>
+    </TopToolbar>
 );
 
 export const PostList = (props) => (
-    <List {...props} actions={<CustomListActions />}>
-        ...
-    </List>
+        <List {...props} actions={<ListActions/>}>
+          ...
+        </List>
 );
 ```
 
@@ -130,12 +134,14 @@ import {
     ExportButton,
     Button,
     sanitizeListRestProps,
+    useListContext
 } from 'react-admin';
 import IconEvent from '@material-ui/icons/Event';
 
 const ListActions = (props) => {
     const {
         className,
+        filters,
         maxResults,
         ...rest
     } = props;

diff --git a/packages/ra-ui-materialui/src/list/ListActions.tsx b/packages/ra-ui-materialui/src/list/ListActions.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { cloneElement, useMemo, FC, ReactElement, ReactNode } from 'react';
+import { cloneElement, useMemo, FC, ReactElement } from 'react';
 import PropTypes from 'prop-types';
 import {
     sanitizeListRestProps,
@@ -36,7 +36,7 @@ import { CreateButton, ExportButton } from '../button';
  *          total,
  *     } = useListContext();
  *
- *     const PostCreateActions = ({ basePath }) => (
+ *     const PostListActions = ({ basePath }) => (
  *         <TopToolbar>
  *             <CreateButton basePath={basePath} />
  *             <ExportButton
@@ -57,7 +57,7 @@ import { CreateButton, ExportButton } from '../button';
  *     );
  */
 const ListActions: FC<ListActionsProps> = props => {
-    const { className, exporter, filters, children, ...rest } = props;
+    const { className, exporter, filters, ...rest } = props;
     const {
         currentSort,
         displayedFilters,
@@ -89,7 +89,6 @@ const ListActions: FC<ListActionsProps> = props => {
                         filterValues={filterValues}
                     />
                 )}
-                {children}
             </TopToolbar>
         ),
         [resource, displayedFilters, filterValues, selectedIds, filters, total] // eslint-disable-line react-hooks/exhaustive-deps
@@ -98,7 +97,6 @@ const ListActions: FC<ListActionsProps> = props => {
 
 ListActions.propTypes = {
     basePath: PropTypes.string,
-    children: PropTypes.node,
     className: PropTypes.string,
     currentSort: PropTypes.any,
     displayedFilters: PropTypes.object,
@@ -119,7 +117,6 @@ ListActions.defaultProps = {
 };
 
 export interface ListActionsProps extends ToolbarProps {
-    children?: ReactNode;
     currentSort?: SortPayload;
     className?: string;
     resource?: string;