From 95dc82c142790d0bfc460809c2e3a3604b04b4b3 Mon Sep 17 00:00:00 2001
From: artem <artexoid@gmail.com>
Date: Tue, 21 Jan 2020 00:00:32 +0300
Subject: [PATCH 1/2] Updated an example custom component for property
 "actions" of component List.

---
 docs/List.md | 100 +++++++++++++++++++++++++++++++++++----------------
 1 file changed, 70 insertions(+), 30 deletions(-)

diff --git a/docs/List.md b/docs/List.md
index f699bded81b..80a3687c60c 100644
--- a/docs/List.md
+++ b/docs/List.md
@@ -86,46 +86,86 @@ The title can be either a string, or an element of your own.
 You can replace the list of default actions by your own element using the `actions` prop:
 
 ```jsx
-import Button from '@material-ui/core/Button';
-import { CreateButton, ExportButton, RefreshButton } from 'react-admin';
-import Toolbar from '@material-ui/core/Toolbar';
+import React, { cloneElement, useMemo } from 'react';
+import PropTypes from 'prop-types';
+import {
+    TopToolbar, CreateButton, ExportButton, Button, sanitizeListRestProps,
+} from 'react-admin';
+import IconEvent from '@material-ui/icons/Event';
 
-const PostActions = ({
-    basePath,
+const ListActions = ({
     currentSort,
+    className,
+    resource,
+    filters,
     displayedFilters,
     exporter,
-    filters,
     filterValues,
-    onUnselectItems,
-    resource,
+    permanentFilter,
+    hasCreate,
+    basePath,
     selectedIds,
+    onUnselectItems,
     showFilter,
-    total
-}) => (
-    <Toolbar>
-        {filters && React.cloneElement(filters, {
-            resource,
-            showFilter,
-            displayedFilters,
-            filterValues,
-            context: 'button',
-        })}
-        <CreateButton basePath={basePath} />
-        <ExportButton
-            disabled={total === 0}
-            resource={resource}
-            sort={currentSort}
-            filter={filterValues}
-            exporter={exporter}
-        />
-        {/* Add your custom actions */}
-        <Button color="primary" onClick={customAction}>Custom Action</Button>
-    </Toolbar>
+    maxResults,
+    total,
+    ...rest
+}) => useMemo(
+    () => (
+        <TopToolbar className={className} {...sanitizeListRestProps(rest)}>
+            {filters && cloneElement(filters, {
+                resource,
+                showFilter,
+                displayedFilters,
+                filterValues,
+                context: 'button',
+            })}
+            {hasCreate && <CreateButton basePath={basePath} />}
+            {exporter !== false && (
+                <ExportButton
+                    disabled={total === 0}
+                    resource={resource}
+                    sort={currentSort}
+                    filter={{ ...filterValues, ...permanentFilter }}
+                    exporter={exporter}
+                    maxResults={maxResults}
+                />
+            )}
+            {/* Add your custom actions */}
+            <Button
+                onClick={() => { alert('Your custom action'); }}
+                label="Show calendar"
+            >
+                <IconEvent />
+            </Button>
+        </TopToolbar>
+    ),
+    [resource, displayedFilters, filterValues, selectedIds, filters, total],
 );
 
+ListActions.propTypes = {
+    basePath: PropTypes.string,
+    className: PropTypes.string,
+    currentSort: PropTypes.shape({}),
+    displayedFilters: PropTypes.shape({}),
+    exporter: PropTypes.oneOfType([PropTypes.func, PropTypes.bool]),
+    filters: PropTypes.element,
+    filterValues: PropTypes.shape({}),
+    hasCreate: PropTypes.bool,
+    resource: PropTypes.string,
+    onUnselectItems: PropTypes.func.isRequired,
+    selectedIds: PropTypes.arrayOf(PropTypes.any),
+    showFilter: PropTypes.func,
+    total: PropTypes.number,
+};
+
+ListActions.defaultProps = {
+    selectedIds: [],
+    onUnselectItems: () => null,
+};
+
 export const PostList = (props) => (
-    <List {...props} actions={<PostActions />}>
+    <List {...props} actions={<ListActions />}>
         ...
     </List>
 );

From a9a93685eb569e27916c50632c25b8ce6e2cf2c1 Mon Sep 17 00:00:00 2001
From: artem <artexoid@gmail.com>
Date: Wed, 22 Jan 2020 18:30:18 +0300
Subject: [PATCH 2/2] Removed from the example useMemo, propTypes, also
 simplified the example.

---
 docs/List.md | 77 +++++++++++++++++++---------------------------------
 1 file changed, 28 insertions(+), 49 deletions(-)

diff --git a/docs/List.md b/docs/List.md
index 80a3687c60c..b8c03e402cd 100644
--- a/docs/List.md
+++ b/docs/List.md
@@ -99,10 +99,10 @@ const ListActions = ({
     resource,
     filters,
     displayedFilters,
-    exporter,
+    exporter, // you can hide ExportButton if exporter = (null || false)
     filterValues,
     permanentFilter,
-    hasCreate,
+    hasCreate, // you can hide CreateButton if hasCreate = false
     basePath,
     selectedIds,
     onUnselectItems,
@@ -110,55 +110,34 @@ const ListActions = ({
     maxResults,
     total,
     ...rest
-}) => useMemo(
-    () => (
-        <TopToolbar className={className} {...sanitizeListRestProps(rest)}>
-            {filters && cloneElement(filters, {
-                resource,
-                showFilter,
-                displayedFilters,
-                filterValues,
-                context: 'button',
-            })}
-            {hasCreate && <CreateButton basePath={basePath} />}
-            {exporter !== false && (
-                <ExportButton
-                    disabled={total === 0}
-                    resource={resource}
-                    sort={currentSort}
-                    filter={{ ...filterValues, ...permanentFilter }}
-                    exporter={exporter}
-                    maxResults={maxResults}
-                />
-            )}
-            {/* Add your custom actions */}
-            <Button
-                onClick={() => { alert('Your custom action'); }}
-                label="Show calendar"
-            >
-                <IconEvent />
-            </Button>
-        </TopToolbar>
-    ),
-    [resource, displayedFilters, filterValues, selectedIds, filters, total],
+}) => (
+    <TopToolbar className={className} {...sanitizeListRestProps(rest)}>
+        {filters && cloneElement(filters, {
+            resource,
+            showFilter,
+            displayedFilters,
+            filterValues,
+            context: 'button',
+        })}
+        <CreateButton basePath={basePath} />
+        <ExportButton
+            disabled={total === 0}
+            resource={resource}
+            sort={currentSort}
+            filter={{ ...filterValues, ...permanentFilter }}
+            exporter={exporter}
+            maxResults={maxResults}
+        />
+        {/* Add your custom actions */}
+        <Button
+            onClick={() => { alert('Your custom action'); }}
+            label="Show calendar"
+        >
+            <IconEvent />
+        </Button>
+    </TopToolbar>
 );
 
-ListActions.propTypes = {
-    basePath: PropTypes.string,
-    className: PropTypes.string,
-    currentSort: PropTypes.shape({}),
-    displayedFilters: PropTypes.shape({}),
-    exporter: PropTypes.oneOfType([PropTypes.func, PropTypes.bool]),
-    filters: PropTypes.element,
-    filterValues: PropTypes.shape({}),
-    hasCreate: PropTypes.bool,
-    resource: PropTypes.string,
-    onUnselectItems: PropTypes.func.isRequired,
-    selectedIds: PropTypes.arrayOf(PropTypes.any),
-    showFilter: PropTypes.func,
-    total: PropTypes.number,
-};
-
 ListActions.defaultProps = {
     selectedIds: [],
     onUnselectItems: () => null,