diff --git a/docs/Actions.md b/docs/Actions.md
index eb6fd7f45ef..b90672a7afb 100644
--- a/docs/Actions.md
+++ b/docs/Actions.md
@@ -86,7 +86,7 @@ You can destructure the return value of the `useQuery` hook as `{ data, total, e
 
 ## `useQueryWithStore` Hook
 
-Internally, react-admin uses a more powerful version of `useQuery` called `useQueryWithStore`, which has an internal cache. In practice, `useQueryWithStore` persist the response from the dataProvider in the internal react-admin store, so that result remains available if the hook is called again in the future.  
+Internally, react-admin uses a more powerful version of `useQuery` called `useQueryWithStore`, which has an internal cache. In practice, `useQueryWithStore` persist the response from the dataProvider in the internal react-admin redux store, so that result remains available if the hook is called again in the future.  
 
 You can use this hook to avoid showing the loading indicator if the query was already fetched once. 
 
@@ -164,7 +164,7 @@ export const CommentList = (props) =>
     </List>;
 ```
 
-**Tip**: For simple mutations, you can use a specialised hook like `useUpdate` instead of the more generic `useMutation`. The main benefit is that `useUpdate` will update the recod in Redux store first, allowing optimistic rendering of the UI:
+**Tip**: For simple mutations, you can use a specialised hook like `useUpdate` instead of the more generic `useMutation`. The main benefit is that `useUpdate` will update the record in Redux store first, allowing optimistic rendering of the UI:
 
 ```jsx
 import { useUpdate } from 'react-admin';
@@ -206,9 +206,12 @@ Here is how to add notifications and a redirection to the `ApproveButton` compon
 
 ```diff
 // in src/comments/ApproveButton.js
-import { useMutation, UPDATE } from 'react-admin';
+-import { useMutation, UPDATE } from 'react-admin';
++import { useMutation, useNotify, useRedirect, UPDATE } from 'react-admin';
 
 const ApproveButton = ({ record }) => {
++   const notify = useNotify();
++   const redirect = useRedirect();
     const [approve, { loading }] = useMutation(
         {
             type: UPDATE,
@@ -216,30 +219,25 @@ const ApproveButton = ({ record }) => {
             payload: { id: record.id, data: { isApproved: true } },
         },
 +       {
-+           onSuccess: {
-+               notification: { body: 'Comment approved', level: 'info' },
-+               redirectTo: '/comments',
-+           },
-+           onFailure: {
-+               notification: {
-+                   body: 'Error: comment not approved',
-+                   level: 'warning',
-+               },
++           onSuccess: ({ data }) => {
++               notify('Comment approved', 'info');,
++               redirect('/comments'),
 +           },
++           onFailure: (error) => notify(`Error: ${error.message}`, 'warning'),
 +       }
     );
     return <FlatButton label="Approve" onClick={approve} disabled={loading} />;
 };
 ```
 
-React-admin can handle the following side effects:
+The `onSuccess` function is called with the response from the `dataProvider` as argument. The `onError` function is called with the error returned by the `dataProvider`.
 
-- `notification`: Display a notification. The property value should be an object describing the notification to display. The `body` can be a translation key. `level` can be either `info` or `warning`.
-- `redirectTo`: Redirect the user to another page. The property value should be the path to redirect the user to.
-- `refresh`: Force a rerender of the current view (equivalent to pressing the Refresh button). Set to true to enable.
-- `unselectAll`: Unselect all lines in the current datagrid. Set to true to enable.
-- `callback`: Execute an arbitrary function. The value should be the function to execute. React-admin will call the function with an object as parameter (`{ requestPayload, payload, error }`). The `payload` contains the decoded response body when it's successful. When it's failed, the response body is passed in the `error`.
-- `basePath`: This is not a side effect, but it's used internally to compute redirection paths. Set it when you have a redirection side effect.
+React-admin provides the following hooks to handle most common side effects:
+
+- `useNotify`: Return a function to display a notification. The arguments should be a message (it can be a translation key), a level (either `info` or `warning`), an options object to pass to the `translate()` function, and a boolean to set to `true` if the notification should contain an "undo" button.
+- `useRedirect`: Return a function to redirect the user to another page. The arguments should be the path to redirect the user to, and the current `basePath`.
+- `useRefresh`: Return a function to force a rerender of the current view (equivalent to pressing the Refresh button).
+- `useUnselectAll`: Return a function to unselect all lines in the current datagrid. Pass the name of the resource as argument.
 
 ## Optimistic Rendering and Undo
 
@@ -264,13 +262,12 @@ const ApproveButton = ({ record }) => {
         },
         {
 +           undoable: true,
-            onSuccess: {
-                notification: { body: 'Comment approved', level: 'info' },
-                redirectTo: '/comments',
+            onSuccess: ({ data }) => {
+-               notify('Comment approved', 'info');,
++               notify('Comment approved', 'info', {}, true);,
+                redirect('/comments'),
             },
-            onError: {
-                notification: { body: 'Error: comment not approved', level: 'warning' }
-            }
+            onFailure: (error) => notify(`Error: ${error.message}`, 'warning'),
         }
     );
     return <FlatButton label="Approve" onClick={approve} disabled={loading} />;
@@ -394,21 +391,20 @@ When calling the API to update ("mutate") data, use the `<Mutation>` component i
 Here is a version of the `<ApproveButton>` component demonstrating `<Mutation>`:
 
 ```jsx
-import { Mutation, UPDATE } from 'react-admin';
-
-const options = {
-    undoable: true,
-    onSuccess: {
-        notification: { body: 'Comment approved', level: 'info' },
-        redirectTo: '/comments',
-    },
-    onError: {
-        notification: { body: 'Error: comment not approved', level: 'warning' }
-    }
-};
+import { Mutation, UPDATE, useNotify, useRedirect } from 'react-admin';
 
 const ApproveButton = ({ record }) => {
+    const notify = useNotify();
+    const redirect = useRedirect();
     const payload = { id: record.id, data: { ...record, is_approved: true } };
+    const options = {
+        undoable: true,
+        onSuccess: ({ data }) => {
+            notify('Comment approved', 'info', {}, true);,
+            redirect('/comments'),
+        },
+        onFailure: (error) => notify(`Error: ${error.message}`, 'warning'),
+    };
     return (
         <Mutation
             type={UPDATE}
@@ -478,23 +474,25 @@ There is no special react-admin sauce in that case. Here is an example implement
 // in src/comments/ApproveButton.js
 import React, { useState } from 'react';
 import { useDispatch } from 'react-redux';
-import { showNotification, fetchStart, fetchEnd } from 'react-admin';
+import { useNotify, , useRedirect, fetchStart, fetchEnd } from 'react-admin';
 import { push } from 'connected-react-router';
 
 const ApproveButton = ({ record }) => {
     const dispatch = useDispatch();
-    const [loading, setLoading] = useState(false;)
+    const redirect = useRedirect();
+    const notify = useNotify();
+    const [loading, setLoading] = useState(false);
     const handleClick = () => {
         setLoading(true);
         dispatch(fetchStart()); // start the global loading indicator 
         const updatedRecord = { ...record, is_approved: true };
         fetch(`/comments/${record.id}`, { method: 'PUT', body: updatedRecord })
             .then(() => {
-                dispatch(showNotification('Comment approved'));
-                dispatch(push('/comments'));
+                notify('Comment approved');
+                redirect('/comments');
             })
             .catch((e) => {
-                dispatch(showNotification('Error: comment not approved', 'warning'))
+                notify('Error: comment not approved', 'warning')
             })
             .finally(() => {
                 setLoading(false);
@@ -508,100 +506,8 @@ const ApproveButton = ({ record }) => {
 export default ApproveButton;
 ```
 
-If you use `fetch`, you'll have to handle side effects on your own using Redux actions, as shown in this example.
-
-`showNotification` and `push` are *action creators*. This is a Redux term for functions that return a simple action object. 
-
 **TIP**: APIs often require a bit of HTTP plumbing to deal with authentication, query parameters, encoding, headers, etc. It turns out you probably already have a function that maps from a REST request to an HTTP request: your [Data Provider](./DataProviders.md). So it's often better to use `useDataProvider` instead of `fetch`.
 
-## Using a Custom Action Creator 
-
-In some rare cases, several components may share the same data fetching logic. In these cases, you will probably want to extract that logic into a custom Redux action. 
-
-Warning: This is for advanced use cases only, and it requires a good level of understanding of Redux and react-admin internals. In most cases, `useDataProvider` is enough.
-
-First, extract the request into a custom action creator. Use the dataProvider verb (`UPDATE`) as the `fetch` meta, pass the resource name as the `resource` meta, and pass the request parameters as the action `payload`:
-
-```jsx
-// in src/comment/commentActions.js
-import { UPDATE } from 'react-admin';
-
-export const COMMENT_APPROVE = 'COMMENT_APPROVE';
-export const commentApprove = (id, data, basePath) => ({
-    type: COMMENT_APPROVE,
-    payload: { id, data: { ...data, is_approved: true } },
-    meta: { fetch: UPDATE, resource: 'comments' },
-});
-```
-
-Upon dispatch, this action will trigger the call to `dataProvider(UPDATE, 'comments', { id, data: { ...data, is_approved: true })`, dispatch a `COMMENT_APPROVE_LOADING` action, then after receiving the response, dispatch either a `COMMENT_APPROVE_SUCCESS`, or a `COMMENT_APPROVE_FAILURE`.
-
-To use the new action creator in the component, `dispatch` it:
-
-```jsx
-// in src/comments/ApproveButton.js
-import { dispatch } from 'react-redux';
-import { commentApprove } from './commentActions';
-
-const ApproveButton = ({ record }) => {
-    const dispatch = useDispatch();
-    const handleClick = () => {
-        dispatch(commentApprove(record.id, record));
-        // how about push and showNotification?
-    }
-    return <Button onClick={handleClick}>Approve</Button>;
-}
-
-export default ApproveButton;
-```
-
-It works fine: when a user presses the "Approve" button, the API receives the `UPDATE` call, and that approves the comment. Another added benefit of using custom actions with the `fetch` meta is that react-admin automatically handles the loading state, so you don't need to mess up with `fetchStart()` and `fetchEnd()` manually.
-
-But it's not possible to call `push` or `showNotification` in `handleClick` anymore. This is because `commentApprove()` returns immediately, whether the API call succeeds or not. How can you run a function only when the action succeeds?
-
-## Adding Side Effects to Actions
-
-Just like for the `useDataProvider` hook, you can associate side effects to a fetch action declaratively by setting the appropriate keys in the action `meta`.
-
-So the side effects will be declared in the action creator rather than in the component. For instance, to display a notification when the `COMMENT_APPROVE` action is successfully dispatched, add the `notification` meta:
-
-```diff
-// in src/comment/commentActions.js
-import { UPDATE } from 'react-admin';
-export const COMMENT_APPROVE = 'COMMENT_APPROVE';
-export const commentApprove = (id, data, basePath) => ({
-    type: COMMENT_APPROVE,
-    payload: { id, data: { ...data, is_approved: true } },
-    meta: {
-        resource: 'comments',
-        fetch: UPDATE,
-+       onSuccess: {
-+           notification: {
-+               body: 'resources.comments.notification.approved_success',
-+               level: 'info',
-+           },
-+           redirectTo: '/comments',
-+           basePath,
-+       },
-+       onFailure: {
-+           notification: {
-+               body: 'resources.comments.notification.approved_failure',
-+               level: 'warning',
-+           },
-+       },
-    },
-});
-```
-
-The side effects accepted in the `meta` field of the action are the same as in the fourth parameter of the function returned by `useQuery`, `useMutation`, or `withDataProvider`:
-
-- `notification`: Display a notification. The property value should be an object describing the notification to display. The `body` can be a translation key. `level` can be either `info` or `warning`.
-- `redirectTo`: Redirect the user to another page. The property value should be the path to redirect the user to.
-- `refresh`: Force a rerender of the current view (equivalent to pressing the Refresh button). Set to true to enable.
-- `unselectAll`: Unselect all lines in the current datagrid. Set to true to enable.
-- `callback`: Execute an arbitrary function. The value should be the function to execute. React-admin will call the function with an object as parameter (`{ requestPayload, payload, error }`). The `payload` contains the decoded response body when it's successful. When it's failed, the response body is passed in the `error`.
-- `basePath`: This is not a side effect, but it's used internally to compute redirection paths. Set it when you have a redirection side effect.
-
 ## Making An Action Undoable
 
 When using the `useMutation` hook, you could trigger optimistic rendering and get an undo button for free. The same feature is possible using custom actions. You need to decorate the action with the `startUndoable` action creator:
@@ -681,42 +587,6 @@ const PostCreateToolbar = props => (
 );
 ```
 
-## Custom Side Effects
-
-Sometimes, you may want to trigger other *side effects* - like closing a popup window, or sending a message to an analytics server. The easiest way to achieve this is to use the `callback` side effect:
-
-```diff
-// in src/comment/commentActions.js
-import { UPDATE } from 'react-admin';
-export const COMMENT_APPROVE = 'COMMENT_APPROVE';
-export const commentApprove = (id, data, basePath) => ({
-    type: COMMENT_APPROVE,
-    payload: { id, data: { ...data, is_approved: true } },
-    meta: {
-        resource: 'comments',
-        fetch: UPDATE,
-        onSuccess: {
-            notification: {
-                body: 'resources.comments.notification.approved_success',
-                level: 'info',
-            },
-            redirectTo: '/comments',
-+           callback: ({ payload, requestPayload }) => { /* your own logic */ }
-            basePath,
-        },
-        onFailure: {
-            notification: {
-                body: 'resources.comments.notification.approved_failure',
-                level: 'warning',
-            },
-+           callback: ({ payload, requestPayload }) => { /* your own logic */ }
-        },
-    },
-});
-```
-
-Under the hood, `useDataProvider` uses the `callback` side effect to provide a Promise interface for dispatching fetch actions. As chaining custom side effects will quickly lead you to callback hell, we recommend that you use the `callback` side effect sparingly.
-
 ## Custom Sagas
 
 React-admin promotes a programming style where side effects are decoupled from the rest of the code, which has the benefit of making them testable.
diff --git a/docs/_layouts/default.html b/docs/_layouts/default.html
index a1640f44303..c7d88f8f968 100644
--- a/docs/_layouts/default.html
+++ b/docs/_layouts/default.html
@@ -743,12 +743,6 @@
                             <li class="chapter">
                                 <a href="#querying-the-api-with-fetch">Querying The API With <code>fetch</code></a>
                             </li>
-                            <li class="chapter">
-                                <a href="#using-a-custom-action-creator">Using a Custom Action Creator</a>
-                            </li>
-                            <li class="chapter">
-                                <a href="#adding-side-effects-to-actions">Adding Side Effects to Actions</a>
-                            </li>
                             <li class="chapter">
                                 <a href="#making-an-action-undoable">Undoable Action</a>
                             </li>
@@ -756,9 +750,6 @@
                                 <a href="#altering-the-form-values-before-submitting">Altering the Form Values before
                                     Submitting</a>
                             </li>
-                            <li class="chapter">
-                                <a href="#custom-side-effects">Custom Side Effects</a>
-                            </li>
                             <li class="chapter">
                                 <a href="#custom-sagas">Custom Sagas</a>
                             </li>
diff --git a/packages/ra-core/src/controller/useCreateController.ts b/packages/ra-core/src/controller/useCreateController.ts
index fdae4cd125b..4c82bf30304 100644
--- a/packages/ra-core/src/controller/useCreateController.ts
+++ b/packages/ra-core/src/controller/useCreateController.ts
@@ -8,7 +8,8 @@ import { useCheckMinimumRequiredProps } from './checkMinimumRequiredProps';
 import { Location } from 'history';
 import { match as Match } from 'react-router';
 import { Record } from '../types';
-import { RedirectionSideEffect } from '../sideEffect';
+import { useNotify, useRedirect, RedirectionSideEffect } from '../sideEffect';
+
 import { useTranslate } from '../i18n';
 
 export interface CreateControllerProps {
@@ -67,35 +68,34 @@ const useCreateController = (props: CreateProps): CreateControllerProps => {
     } = props;
 
     const translate = useTranslate();
+    const notify = useNotify();
+    const redirect = useRedirect();
     const recordToUse = getRecord(location, record);
 
-    const [create, { loading: isSaving }] = useCreate(
-        resource,
-        {}, // set by the caller
-        {
-            onSuccess: {
-                notification: {
-                    body: 'ra.notification.created',
-                    level: 'info',
-                    messageArgs: {
-                        smart_count: 1,
-                    },
-                },
-                basePath,
-            },
-            onFailure: {
-                notification: {
-                    body: 'ra.notification.http_error',
-                    level: 'warning',
-                },
-            },
-        }
-    );
+    const [create, { loading: isSaving }] = useCreate(resource);
 
     const save = useCallback(
         (data: Partial<Record>, redirectTo = 'list') =>
-            create(null, { data }, { onSuccess: { redirectTo } }),
-        [create]
+            create(
+                null,
+                { data },
+                {
+                    onSuccess: ({ data: newRecord }) => {
+                        notify('ra.notification.created', 'info', {
+                            smart_count: 1,
+                        });
+                        redirect(redirectTo, basePath, newRecord.id, newRecord);
+                    },
+                    onFailure: error =>
+                        notify(
+                            typeof error === 'string'
+                                ? error
+                                : error.message || 'ra.notification.http_error',
+                            'warning'
+                        ),
+                }
+            ),
+        [basePath, create, notify, redirect]
     );
 
     const resourceName = translate(`resources.${resource}.name`, {
diff --git a/packages/ra-core/src/controller/useEditController.ts b/packages/ra-core/src/controller/useEditController.ts
index 0c35728a891..d047c3b6126 100644
--- a/packages/ra-core/src/controller/useEditController.ts
+++ b/packages/ra-core/src/controller/useEditController.ts
@@ -8,7 +8,12 @@ import useVersion from './useVersion';
 import { useCheckMinimumRequiredProps } from './checkMinimumRequiredProps';
 import { REDUX_FORM_NAME } from '../form';
 import { Record, Identifier } from '../types';
-import { RedirectionSideEffect } from '../sideEffect';
+import {
+    useNotify,
+    useRedirect,
+    useRefresh,
+    RedirectionSideEffect,
+} from '../sideEffect';
 import { useGetOne, useUpdate } from '../fetch';
 import { useTranslate } from '../i18n';
 
@@ -56,18 +61,17 @@ const useEditController = (props: EditProps): EditControllerProps => {
     useCheckMinimumRequiredProps('Edit', ['basePath', 'resource'], props);
     const { basePath, id, resource, undoable = true } = props;
     const translate = useTranslate();
+    const notify = useNotify();
+    const redirect = useRedirect();
+    const refresh = useRefresh();
     const dispatch = useDispatch();
     const version = useVersion();
     const { data: record, loading } = useGetOne(resource, id, {
-        basePath,
         version, // used to force reload
-        onFailure: {
-            notification: {
-                body: 'ra.notification.item_doesnt_exist',
-                level: 'warning',
-            },
-            redirectTo: 'list',
-            refresh: true,
+        onFailure: () => {
+            notify('ra.notification.item_doesnt_exist', 'warning');
+            redirect('list', basePath);
+            refresh();
         },
     });
 
@@ -89,32 +93,37 @@ const useEditController = (props: EditProps): EditControllerProps => {
         resource,
         id,
         {}, // set by the caller
-        record,
-        {
-            onSuccess: {
-                notification: {
-                    body: 'ra.notification.updated',
-                    level: 'info',
-                    messageArgs: {
-                        smart_count: 1,
-                    },
-                },
-                basePath,
-            },
-            onFailure: {
-                notification: {
-                    body: 'ra.notification.http_error',
-                    level: 'warning',
-                },
-            },
-            undoable,
-        }
+        record
     );
 
     const save = useCallback(
         (data: Partial<Record>, redirectTo = 'list') =>
-            update(null, { data }, { onSuccess: { redirectTo } }),
-        [update]
+            update(
+                null,
+                { data },
+                {
+                    onSuccess: () => {
+                        notify(
+                            'ra.notification.updated',
+                            'info',
+                            {
+                                smart_count: 1,
+                            },
+                            undoable
+                        );
+                        redirect(redirectTo, basePath, data.id, data);
+                    },
+                    onFailure: error =>
+                        notify(
+                            typeof error === 'string'
+                                ? error
+                                : error.message || 'ra.notification.http_error',
+                            'warning'
+                        ),
+                    undoable,
+                }
+            ),
+        [basePath, notify, redirect, undoable, update]
     );
 
     return {
diff --git a/packages/ra-core/src/controller/useListController.ts b/packages/ra-core/src/controller/useListController.ts
index cbf80e4ddbd..431ce4cac98 100644
--- a/packages/ra-core/src/controller/useListController.ts
+++ b/packages/ra-core/src/controller/useListController.ts
@@ -9,6 +9,7 @@ import useVersion from './useVersion';
 import { useTranslate } from '../i18n';
 import { SORT_ASC } from '../reducer/admin/resource/list/queryReducer';
 import { ListParams } from '../actions/listActions';
+import { useNotify } from '../sideEffect';
 import { Sort, RecordMap, Identifier } from '../types';
 import useGetList from './../fetch/useGetList';
 
@@ -109,6 +110,7 @@ const useListController = (props: ListProps): ListControllerProps => {
         );
     }
     const translate = useTranslate();
+    const notify = useNotify();
     const version = useVersion();
 
     const [query, queryModifiers] = useListParams({
@@ -132,12 +134,13 @@ const useListController = (props: ListProps): ListControllerProps => {
         { ...query.filter, ...filter },
         {
             version,
-            onFailure: {
-                notification: {
-                    body: 'ra.notification.http_error',
-                    level: 'warning',
-                },
-            },
+            onFailure: error =>
+                notify(
+                    typeof error === 'string'
+                        ? error
+                        : error.message || 'ra.notification.http_error',
+                    'warning'
+                ),
         }
     );
 
diff --git a/packages/ra-core/src/controller/useShowController.ts b/packages/ra-core/src/controller/useShowController.ts
index 704cae86e92..c5bc8ee0874 100644
--- a/packages/ra-core/src/controller/useShowController.ts
+++ b/packages/ra-core/src/controller/useShowController.ts
@@ -5,6 +5,7 @@ import { useCheckMinimumRequiredProps } from './checkMinimumRequiredProps';
 import { Record, Identifier } from '../types';
 import { useGetOne } from '../fetch';
 import { useTranslate } from '../i18n';
+import { useNotify, useRedirect, useRefresh } from '../sideEffect';
 
 export interface ShowProps {
     basePath: string;
@@ -48,17 +49,16 @@ const useShowController = (props: ShowProps): ShowControllerProps => {
     useCheckMinimumRequiredProps('Show', ['basePath', 'resource'], props);
     const { basePath, id, resource, undoable = true } = props;
     const translate = useTranslate();
+    const notify = useNotify();
+    const redirect = useRedirect();
+    const refresh = useRefresh();
     const version = useVersion();
     const { data: record, loading } = useGetOne(resource, id, {
-        basePath,
         version, // used to force reload
-        onFailure: {
-            notification: {
-                body: 'ra.notification.item_doesnt_exist',
-                level: 'warning',
-            },
-            redirectTo: 'list',
-            refresh: true,
+        onFailure: () => {
+            notify('ra.notification.item_doesnt_exist', 'warning');
+            redirect('list', basePath);
+            refresh();
         },
     });
 
diff --git a/packages/ra-core/src/fetch/index.ts b/packages/ra-core/src/fetch/index.ts
index dd56e8622c6..4e0d8809f62 100644
--- a/packages/ra-core/src/fetch/index.ts
+++ b/packages/ra-core/src/fetch/index.ts
@@ -11,6 +11,7 @@ import useGetOne from './useGetOne';
 import useGetList from './useGetList';
 import useUpdate from './useUpdate';
 import useCreate from './useCreate';
+import useDelete from './useDelete';
 
 export {
     fetchUtils,
@@ -24,6 +25,7 @@ export {
     useGetList,
     useUpdate,
     useCreate,
+    useDelete,
     useQueryWithStore,
     withDataProvider,
 };
diff --git a/packages/ra-core/src/fetch/useCreate.ts b/packages/ra-core/src/fetch/useCreate.ts
index 6639c8a2778..fcc7d7c90b2 100644
--- a/packages/ra-core/src/fetch/useCreate.ts
+++ b/packages/ra-core/src/fetch/useCreate.ts
@@ -28,7 +28,7 @@ import useMutation from './useMutation';
  *     return <button disabled={loading} onClick={create}>Like</div>;
  * };
  */
-const useCreate = (resource: string, data?: any, options?: any) =>
+const useCreate = (resource: string, data: any = {}, options?: any) =>
     useMutation(
         { type: CREATE, resource, payload: { data } },
         { ...options, action: CRUD_CREATE }
diff --git a/packages/ra-core/src/fetch/useDataProvider.ts b/packages/ra-core/src/fetch/useDataProvider.ts
index 821f9280fbd..e89d8cfa89b 100644
--- a/packages/ra-core/src/fetch/useDataProvider.ts
+++ b/packages/ra-core/src/fetch/useDataProvider.ts
@@ -13,6 +13,17 @@ interface UseDataProviderOptions {
     onFailure?: any;
 }
 
+const getSideEffects = (effects): [(args: any) => void, any] => {
+    let functionSideEffect = () => null;
+    let objectSideEffect = {};
+    if (effects instanceof Function) {
+        functionSideEffect = effects;
+    } else {
+        objectSideEffect = effects;
+    }
+    return [functionSideEffect, objectSideEffect];
+};
+
 /**
  * Hook for getting an instance of the dataProvider as prop
  *
@@ -67,6 +78,8 @@ const useDataProvider = () => {
                 onFailure = {},
                 ...rest
             } = options;
+            const [successFunc, successObj] = getSideEffects(onSuccess);
+            const [failureFunc, failureObj] = getSideEffects(onFailure);
             return new Promise((resolve, reject) => {
                 const queryAction = {
                     type: action,
@@ -76,25 +89,28 @@ const useDataProvider = () => {
                         resource,
                         fetch: type,
                         onSuccess: {
-                            ...onSuccess,
+                            ...successObj,
                             callback: ({ payload: response }) => {
-                                if (onSuccess.callback) {
-                                    onSuccess.callback({ payload: response });
+                                resolve(response);
+                                if (successObj.callback) {
+                                    successObj.callback({ payload: response });
                                 }
-                                return resolve(response);
+                                successFunc(response);
+                                return;
                             },
                         },
                         onFailure: {
-                            ...onFailure,
+                            ...failureObj,
                             callback: ({ error }) => {
-                                if (onFailure.callback) {
-                                    onFailure.callback({ error });
-                                }
-                                return reject(
-                                    new Error(
-                                        error.message ? error.message : error
-                                    )
+                                const exception = new Error(
+                                    error.message ? error.message : error
                                 );
+                                reject(exception);
+                                if (failureObj.callback) {
+                                    failureObj.callback({ error });
+                                }
+                                failureFunc(exception);
+                                return;
                             },
                         },
                     },
diff --git a/packages/ra-core/src/fetch/useDelete.ts b/packages/ra-core/src/fetch/useDelete.ts
new file mode 100644
index 00000000000..8976592c3d8
--- /dev/null
+++ b/packages/ra-core/src/fetch/useDelete.ts
@@ -0,0 +1,45 @@
+import { CRUD_DELETE } from '../actions/dataActions/crudDelete';
+import { DELETE } from '../dataFetchActions';
+import useMutation from './useMutation';
+import { Identifier } from '../types';
+
+/**
+ * Get a callback to call the dataProvider with a DELETE verb, the result
+ * of the call (the deleted record), and the loading state.
+ *
+ * The return value updates according to the request state:
+ *
+ * - start: [callback, { loading: true, loaded: false }]
+ * - success: [callback, { data: [data from response], loading: false, loaded: true }]
+ * - error: [callback, { error: [error from response], loading: false, loaded: true }]
+ *
+ * @param resource The resource name, e.g. 'posts'
+ * @param id The resource identifier, e.g. 123
+ * @param data The data to initialize the new record with, e.g. { title: 'hello, world" }
+ * @param previousData The record before the delete is applied
+ * @param options Options object to pass to the dataProvider. May include side effects to be executed upon success of failure, e.g. { onSuccess: { refresh: true } }
+ *
+ * @returns The current request state. Destructure as [delete, { data, error, loading, loaded }].
+ *
+ * @example
+ *
+ * import { useDelete } from 'react-admin';
+ *
+ * const DeleteButton = ({ record }) => {
+ *     const [deleteOne, { loading, error }] = useDelete('likes', record.id);
+ *     if (error) { return <p>ERROR</p>; }
+ *     return <button disabled={loading} onClick={deleteOne}>Delete</div>;
+ * };
+ */
+const useDelete = (
+    resource: string,
+    id: Identifier,
+    previousData: any = {},
+    options?: any
+) =>
+    useMutation(
+        { type: DELETE, resource, payload: { id, previousData } },
+        { ...options, action: CRUD_DELETE }
+    );
+
+export default useDelete;
diff --git a/packages/ra-core/src/sideEffect/fetch.ts b/packages/ra-core/src/sideEffect/fetch.ts
index aaa9a2d1e6d..d012a9b12e0 100644
--- a/packages/ra-core/src/sideEffect/fetch.ts
+++ b/packages/ra-core/src/sideEffect/fetch.ts
@@ -92,6 +92,8 @@ export function* handleFetch(
         meta: { fetch: fetchMeta, onSuccess, onFailure, ...meta },
     } = action;
     const restType = fetchMeta;
+    const successSideEffects = onSuccess instanceof Function ? {} : onSuccess;
+    const failureSideEffects = onFailure instanceof Function ? {} : onFailure;
 
     try {
         const isOptimistic = yield select(
@@ -122,7 +124,7 @@ export function* handleFetch(
             requestPayload: payload,
             meta: {
                 ...meta,
-                ...onSuccess,
+                ...successSideEffects,
                 fetchResponse: restType,
                 fetchStatus: FETCH_END,
             },
@@ -136,7 +138,7 @@ export function* handleFetch(
             requestPayload: payload,
             meta: {
                 ...meta,
-                ...onFailure,
+                ...failureSideEffects,
                 fetchResponse: restType,
                 fetchStatus: FETCH_ERROR,
             },
diff --git a/packages/ra-core/src/sideEffect/index.ts b/packages/ra-core/src/sideEffect/index.ts
index b7e47f72573..c047a5905a5 100644
--- a/packages/ra-core/src/sideEffect/index.ts
+++ b/packages/ra-core/src/sideEffect/index.ts
@@ -10,6 +10,10 @@ import refreshSaga, { RefreshSideEffect } from './refresh';
 import i18nSaga from './i18n';
 import undoSaga from './undo';
 import unloadSaga from './unload';
+import useRedirect from './useRedirect';
+import useNotify from './useNotify';
+import useRefresh from './useRefresh';
+import useUnselectAll from './useUnselectAll';
 
 export {
     adminSaga,
@@ -28,4 +32,8 @@ export {
     i18nSaga,
     undoSaga,
     unloadSaga,
+    useRedirect,
+    useNotify,
+    useRefresh,
+    useUnselectAll,
 };
diff --git a/packages/ra-core/src/sideEffect/useNotify.ts b/packages/ra-core/src/sideEffect/useNotify.ts
new file mode 100644
index 00000000000..ee9613432bf
--- /dev/null
+++ b/packages/ra-core/src/sideEffect/useNotify.ts
@@ -0,0 +1,43 @@
+import { useCallback } from 'react';
+import { useDispatch } from 'react-redux';
+import {
+    showNotification,
+    NotificationType,
+} from '../actions/notificationActions';
+
+/**
+ * Hook for Notification Side Effect
+ *
+ * @example
+ *
+ * const notify = useNotify();
+ * // simple message (info level)
+ * notify('Level complete');
+ * // specify level
+ * notify('A problem occurred', 'warning')
+ * // pass arguments to the translation function
+ * notify('Deleted %{count} elements', 'info', { smart_count: 23 })
+ * // show the action as undoable in the notification
+ * notify('Post renamed', 'info', {}, true)
+ */
+const useNotify = () => {
+    const dispatch = useDispatch();
+    return useCallback(
+        (
+            message: string,
+            type: NotificationType = 'info',
+            messageArgs: any = {},
+            undoable: boolean = false
+        ) => {
+            dispatch(
+                showNotification(message, type, {
+                    messageArgs,
+                    undoable,
+                })
+            );
+        },
+        [dispatch]
+    );
+};
+
+export default useNotify;
diff --git a/packages/ra-core/src/sideEffect/useRedirect.ts b/packages/ra-core/src/sideEffect/useRedirect.ts
new file mode 100644
index 00000000000..350af322f03
--- /dev/null
+++ b/packages/ra-core/src/sideEffect/useRedirect.ts
@@ -0,0 +1,50 @@
+import { useCallback } from 'react';
+import { push } from 'connected-react-router';
+import { useDispatch } from 'react-redux';
+import { reset } from 'redux-form';
+
+import { Identifier, Record } from '../types';
+import resolveRedirectTo from '../util/resolveRedirectTo';
+
+type RedirectToFunction = (
+    basePath?: string,
+    id?: Identifier,
+    data?: Record
+) => string;
+
+export type RedirectionSideEffect = string | false | RedirectToFunction;
+
+/**
+ * Hook for Redirection Side Effect
+ *
+ * @example
+ *
+ * const redirect = useRedirect();
+ * // redirect to list view
+ * redirect('list', '/posts');
+ * // redirect to edit view
+ * redirect('edit', '/posts', 123);
+ * // do not redirect (resets the record form)
+ * redirect(false);
+ * // redirect to the result of a function
+ * redirect((redirectTo, basePath, is, data) => ...)
+ */
+const useRedirect = () => {
+    const dispatch = useDispatch();
+    return useCallback(
+        (
+            redirectTo: RedirectionSideEffect,
+            basePath: string = '',
+            id?: Identifier,
+            data?: Partial<Record>
+        ) =>
+            redirectTo
+                ? dispatch(
+                      push(resolveRedirectTo(redirectTo, basePath, id, data))
+                  )
+                : dispatch(reset('record-form')), // explicit no redirection, reset the form
+        [dispatch]
+    );
+};
+
+export default useRedirect;
diff --git a/packages/ra-core/src/sideEffect/useRefresh.ts b/packages/ra-core/src/sideEffect/useRefresh.ts
new file mode 100644
index 00000000000..14825aa52d4
--- /dev/null
+++ b/packages/ra-core/src/sideEffect/useRefresh.ts
@@ -0,0 +1,21 @@
+import { useCallback } from 'react';
+import { useDispatch } from 'react-redux';
+import { refreshView } from '../actions/uiActions';
+
+/**
+ * Hook for Refresh Side Effect
+ *
+ * @example
+ *
+ * const refresh = useRefresh();
+ * refresh();
+ */
+const useRefresh = () => {
+    const dispatch = useDispatch();
+    return useCallback(
+        (doRefresh = true) => doRefresh && dispatch(refreshView()),
+        [dispatch]
+    );
+};
+
+export default useRefresh;
diff --git a/packages/ra-core/src/sideEffect/useUnselectAll.ts b/packages/ra-core/src/sideEffect/useUnselectAll.ts
new file mode 100644
index 00000000000..ac8e7885a0c
--- /dev/null
+++ b/packages/ra-core/src/sideEffect/useUnselectAll.ts
@@ -0,0 +1,21 @@
+import { useCallback } from 'react';
+import { useDispatch } from 'react-redux';
+import { setListSelectedIds } from '../actions';
+
+/**
+ * Hook for Unselect All Side Effect
+ *
+ * @example
+ *
+ * const unselectAll = useUnselectAll('posts');
+ * unselectAll();
+ */
+const useUnselectAll = resource1 => {
+    const dispatch = useDispatch();
+    return useCallback(
+        resource2 => dispatch(setListSelectedIds(resource2 || resource1, [])),
+        [dispatch, resource1]
+    );
+};
+
+export default useUnselectAll;
diff --git a/packages/ra-ui-materialui/src/button/Button.js b/packages/ra-ui-materialui/src/button/Button.js
index 496be60973a..fa0667381f3 100644
--- a/packages/ra-ui-materialui/src/button/Button.js
+++ b/packages/ra-ui-materialui/src/button/Button.js
@@ -3,13 +3,13 @@ import PropTypes from 'prop-types';
 import MuiButton from '@material-ui/core/Button';
 import Tooltip from '@material-ui/core/Tooltip';
 import IconButton from '@material-ui/core/IconButton';
-import { withStyles, createStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@material-ui/core/styles';
 import classnames from 'classnames';
 import { useTranslate } from 'ra-core';
 
 import Responsive from '../layout/Responsive';
 
-const styles = createStyles({
+const useStyles = makeStyles({
     button: {
         display: 'inline-flex',
         alignItems: 'center',
@@ -34,7 +34,7 @@ const styles = createStyles({
 const Button = ({
     alignIcon = 'left',
     children,
-    classes = {},
+    classes: classesOverride,
     className,
     color,
     disabled,
@@ -43,6 +43,7 @@ const Button = ({
     ...rest
 }) => {
     const translate = useTranslate();
+    const classes = useStyles({ classes: classesOverride });
     return (
         <Responsive
             xsmall={
@@ -121,4 +122,4 @@ Button.defaultProps = {
     size: 'small',
 };
 
-export default withStyles(styles)(Button);
+export default Button;
diff --git a/packages/ra-ui-materialui/src/button/DeleteWithConfirmButton.js b/packages/ra-ui-materialui/src/button/DeleteWithConfirmButton.js
index bae35e03988..970c1f4b198 100644
--- a/packages/ra-ui-materialui/src/button/DeleteWithConfirmButton.js
+++ b/packages/ra-ui-materialui/src/button/DeleteWithConfirmButton.js
@@ -1,13 +1,17 @@
-import React, { Fragment, Component } from 'react';
+import React, { Fragment, useState } from 'react';
 import PropTypes from 'prop-types';
-import { connect } from 'react-redux';
-import compose from 'recompose/compose';
-import { withStyles, createStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@material-ui/core/styles';
 import { fade } from '@material-ui/core/styles/colorManipulator';
 import ActionDelete from '@material-ui/icons/Delete';
 import classnames from 'classnames';
 import inflection from 'inflection';
-import { translate, crudDelete } from 'ra-core';
+import {
+    useTranslate,
+    useDelete,
+    useRefresh,
+    useNotify,
+    useRedirect,
+} from 'ra-core';
 
 import Confirm from '../layout/Confirm';
 import Button from './Button';
@@ -15,7 +19,6 @@ import Button from './Button';
 const sanitizeRestProps = ({
     basePath,
     classes,
-    crudDelete,
     filterValues,
     handleSubmit,
     handleSubmitWithRedirect,
@@ -30,91 +33,110 @@ const sanitizeRestProps = ({
     ...rest
 }) => rest;
 
-const styles = theme =>
-    createStyles({
-        deleteButton: {
-            color: theme.palette.error.main,
-            '&:hover': {
-                backgroundColor: fade(theme.palette.error.main, 0.12),
-                // Reset on mouse devices
-                '@media (hover: none)': {
-                    backgroundColor: 'transparent',
-                },
+const useStyles = makeStyles(theme => ({
+    deleteButton: {
+        color: theme.palette.error.main,
+        '&:hover': {
+            backgroundColor: fade(theme.palette.error.main, 0.12),
+            // Reset on mouse devices
+            '@media (hover: none)': {
+                backgroundColor: 'transparent',
             },
         },
-    });
+    },
+}));
 
-class DeleteWithConfirmButton extends Component {
-    state = { isOpen: false };
+const DeleteWithConfirmButton = ({
+    basePath,
+    classes: classesOverride,
+    className,
+    icon,
+    label = 'ra.action.delete',
+    onClick,
+    record,
+    resource,
+    redirect: redirectTo,
+    ...rest
+}) => {
+    const [open, setOpen] = useState(false);
+    const translate = useTranslate();
+    const notify = useNotify();
+    const redirect = useRedirect();
+    const refresh = useRefresh();
+    const classes = useStyles({ classes: classesOverride });
+    const [deleteOne] = useDelete(resource, record.id, record, {
+        onSuccess: () => {
+            notify('ra.notification.deleted', 'info', { smart_count: 1 });
+            redirect(redirectTo, basePath);
+            refresh();
+        },
+        onFailure: error =>
+            notify(
+                typeof error === 'string'
+                    ? error
+                    : error.message || 'ra.notification.http_error',
+                'warning'
+            ),
+        undoable: false,
+    });
 
-    handleClick = e => {
-        this.setState({ isOpen: true });
+    const handleClick = e => {
+        setOpen(true);
         e.stopPropagation();
     };
 
-    handleDialogClose = () => {
-        this.setState({ isOpen: false });
+    const handleDialogClose = e => {
+        setOpen(false);
+        e.stopPropagation();
     };
 
-    handleDelete = () => {
-        const { crudDelete, resource, record, basePath, redirect } = this.props;
-        crudDelete(resource, record.id, record, basePath, redirect);
+    const handleDelete = () => {
+        deleteOne();
+        if (typeof onClick === 'function') {
+            onClick();
+        }
     };
 
-    render() {
-        const {
-            classes = {},
-            className,
-            icon,
-            label = 'ra.action.delete',
-            onClick,
-            record,
-            resource,
-            translate,
-            ...rest
-        } = this.props;
-        return (
-            <Fragment>
-                <Button
-                    onClick={this.handleClick}
-                    label={label}
-                    className={classnames(
-                        'ra-delete-button',
-                        classes.deleteButton,
-                        className
-                    )}
-                    key="button"
-                    {...sanitizeRestProps(rest)}
-                >
-                    {icon}
-                </Button>
-                <Confirm
-                    isOpen={this.state.isOpen}
-                    title="ra.message.delete_title"
-                    content="ra.message.delete_content"
-                    translateOptions={{
-                        name: inflection.humanize(
-                            translate(`resources.${resource}.name`, {
-                                smart_count: 1,
-                                _: inflection.singularize(resource),
-                            }),
-                            true
-                        ),
-                        id: record.id,
-                    }}
-                    onConfirm={this.handleDelete}
-                    onClose={this.handleDialogClose}
-                />
-            </Fragment>
-        );
-    }
-}
+    return (
+        <Fragment>
+            <Button
+                onClick={handleClick}
+                label={label}
+                className={classnames(
+                    'ra-delete-button',
+                    classes.deleteButton,
+                    className
+                )}
+                key="button"
+                {...sanitizeRestProps(rest)}
+            >
+                {icon}
+            </Button>
+            <Confirm
+                isOpen={open}
+                title="ra.message.delete_title"
+                content="ra.message.delete_content"
+                translateOptions={{
+                    name: inflection.humanize(
+                        translate(`resources.${resource}.name`, {
+                            smart_count: 1,
+                            _: inflection.singularize(resource),
+                        }),
+                        true
+                    ),
+                    id: record.id,
+                }}
+                onConfirm={handleDelete}
+                onClose={handleDialogClose}
+            />
+        </Fragment>
+    );
+};
 
 DeleteWithConfirmButton.propTypes = {
     basePath: PropTypes.string,
     classes: PropTypes.object,
     className: PropTypes.string,
-    crudDelete: PropTypes.func.isRequired,
     label: PropTypes.string,
     record: PropTypes.object,
     redirect: PropTypes.oneOfType([
@@ -122,8 +144,7 @@ DeleteWithConfirmButton.propTypes = {
         PropTypes.bool,
         PropTypes.func,
     ]),
-    resource: PropTypes.string.isRequired,
-    translate: PropTypes.func,
+    resource: PropTypes.string,
     icon: PropTypes.element,
 };
 
@@ -132,11 +153,4 @@ DeleteWithConfirmButton.defaultProps = {
     icon: <ActionDelete />,
 };
 
-export default compose(
-    connect(
-        null,
-        { crudDelete }
-    ),
-    translate,
-    withStyles(styles)
-)(DeleteWithConfirmButton);
+export default DeleteWithConfirmButton;
diff --git a/packages/ra-ui-materialui/src/button/DeleteWithUndoButton.js b/packages/ra-ui-materialui/src/button/DeleteWithUndoButton.js
index c8cb8c8c96c..899ffc33273 100644
--- a/packages/ra-ui-materialui/src/button/DeleteWithUndoButton.js
+++ b/packages/ra-ui-materialui/src/button/DeleteWithUndoButton.js
@@ -1,19 +1,16 @@
-import React, { Component } from 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
-import { connect } from 'react-redux';
-import compose from 'recompose/compose';
-import { withStyles, createStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@material-ui/core/styles';
 import { fade } from '@material-ui/core/styles/colorManipulator';
 import ActionDelete from '@material-ui/icons/Delete';
 import classnames from 'classnames';
-import { translate, crudDelete, startUndoable } from 'ra-core';
+import { useDelete, useRefresh, useNotify, useRedirect } from 'ra-core';
 
 import Button from './Button';
 
 export const sanitizeRestProps = ({
     basePath,
     classes,
-    dispatchCrudDelete,
     filterValues,
     handleSubmit,
     handleSubmitWithRedirect,
@@ -23,75 +20,81 @@ export const sanitizeRestProps = ({
     resource,
     saving,
     selectedIds,
-    startUndoable,
     undoable,
     redirect,
     submitOnEnter,
-    translate,
     ...rest
 }) => rest;
 
-const styles = theme =>
-    createStyles({
-        deleteButton: {
-            color: theme.palette.error.main,
-            '&:hover': {
-                backgroundColor: fade(theme.palette.error.main, 0.12),
-                // Reset on mouse devices
-                '@media (hover: none)': {
-                    backgroundColor: 'transparent',
-                },
+const useStyles = makeStyles(theme => ({
+    deleteButton: {
+        color: theme.palette.error.main,
+        '&:hover': {
+            backgroundColor: fade(theme.palette.error.main, 0.12),
+            // Reset on mouse devices
+            '@media (hover: none)': {
+                backgroundColor: 'transparent',
             },
         },
-    });
+    },
+}));
 
-class DeleteWithUndoButton extends Component {
-    handleDelete = event => {
+const DeleteWithUndoButton = ({
+    label = 'ra.action.delete',
+    classes: classesOverride,
+    className,
+    icon,
+    onClick,
+    resource,
+    record,
+    basePath,
+    redirect: redirectTo,
+    ...rest
+}) => {
+    const classes = useStyles({ classes: classesOverride });
+    const notify = useNotify();
+    const redirect = useRedirect();
+    const refresh = useRefresh();
+    const [deleteOne, { loading }] = useDelete(resource, record.id, record, {
+        onSuccess: () => {
+            notify('ra.notification.deleted', 'info', { smart_count: 1 }, true);
+            redirect(redirectTo, basePath);
+            refresh();
+        },
+        onFailure: error =>
+            notify(
+                typeof error === 'string'
+                    ? error
+                    : error.message || 'ra.notification.http_error',
+                'warning'
+            ),
+        undoable: true,
+    });
+    const handleDelete = event => {
         event.stopPropagation();
-        const {
-            startUndoable,
-            resource,
-            record,
-            basePath,
-            redirect,
-            onClick,
-        } = this.props;
-
-        startUndoable(
-            crudDelete(resource, record.id, record, basePath, redirect)
-        );
-
+        deleteOne();
         if (typeof onClick === 'function') {
             onClick();
         }
     };
 
-    render() {
-        const {
-            label = 'ra.action.delete',
-            classes = {},
-            className,
-            icon,
-            onClick,
-            ...rest
-        } = this.props;
-        return (
-            <Button
-                onClick={this.handleDelete}
-                label={label}
-                className={classnames(
-                    'ra-delete-button',
-                    classes.deleteButton,
-                    className
-                )}
-                key="button"
-                {...sanitizeRestProps(rest)}
-            >
-                {icon}
-            </Button>
-        );
-    }
-}
+    return (
+        <Button
+            onClick={handleDelete}
+            disabled={loading}
+            label={label}
+            className={classnames(
+                'ra-delete-button',
+                classes.deleteButton,
+                className
+            )}
+            key="button"
+            {...sanitizeRestProps(rest)}
+        >
+            {icon}
+        </Button>
+    );
+};
 
 DeleteWithUndoButton.propTypes = {
     basePath: PropTypes.string,
@@ -104,9 +107,7 @@ DeleteWithUndoButton.propTypes = {
         PropTypes.bool,
         PropTypes.func,
     ]),
-    resource: PropTypes.string.isRequired,
-    startUndoable: PropTypes.func,
-    translate: PropTypes.func,
+    resource: PropTypes.string,
     icon: PropTypes.element,
 };
 
@@ -116,11 +117,4 @@ DeleteWithUndoButton.defaultProps = {
     icon: <ActionDelete />,
 };
 
-export default compose(
-    connect(
-        null,
-        { startUndoable }
-    ),
-    translate,
-    withStyles(styles)
-)(DeleteWithUndoButton);
+export default DeleteWithUndoButton;