diff --git a/docs/Admin.md b/docs/Admin.md index 10877667f12..968aa048127 100644 --- a/docs/Admin.md +++ b/docs/Admin.md @@ -46,6 +46,7 @@ Here are all the props accepted by the component: - [`ready`](#ready) - [`requireAuth`](#requireauth) - [`store`](#store) +- [`notification`](#notification) ## `dataProvider` @@ -399,20 +400,20 @@ const App = () => ( ); ``` -Your custom layout can simply extend [the default `` component](./Layout.md) if you only want to override the appBar, the menu, the notification component, or the error page. For instance: +Your custom layout can simply extend [the default `` component](./Layout.md) if you only want to override the appBar, the menu, or the error page. For instance: ```jsx // in src/MyLayout.js import { Layout } from 'react-admin'; import MyAppBar from './MyAppBar'; import MyMenu from './MyMenu'; -import MyNotification from './MyNotification'; +import MyError from './MyError'; const MyLayout = (props) => ; export default MyLayout; @@ -533,6 +534,33 @@ const App = () => ( ); ``` +## `notification` + +You can override the notification component, for instance to change the notification duration. A common use case is to change the `autoHideDuration`, and force the notification to remain on screen longer than the default 4 seconds. For instance, to create a custom Notification component with a 5 seconds default: + +```jsx +// in src/MyNotification.js +import { Notification } from 'react-admin'; + +const MyNotification = () => ; + +export default MyNotification; +``` + +To use this custom notification component, pass it to the `` component as the `notification` prop: + +```jsx +// in src/App.js +import MyNotification from './MyNotification'; +import dataProvider from './dataProvider'; + +const App = () => ( + + // ... + +); +``` + ## Declaring resources at runtime You might want to dynamically define the resources when the app starts. To do so, you have two options: using a function as `` child, or unplugging it to use a combination of `AdminContext` and `` instead. diff --git a/docs/Theming.md b/docs/Theming.md index ee68f4c7924..1bab6dfb332 100644 --- a/docs/Theming.md +++ b/docs/Theming.md @@ -1009,13 +1009,13 @@ const App = () => ( ## Notifications -You can override the notification component, for instance to change the notification duration. It defaults to 4000, i.e. 4 seconds, and you can override it using the `autoHideDuration` prop. For instance, to create a custom Notification component with a 5 seconds default: +You can override the notification component, for instance to change the notification duration. A common use case is to change the `autoHideDuration`, and force the notification to remain on screen longer than the default 4 seconds. For instance, to create a custom Notification component with a 5 seconds default: ```jsx // in src/MyNotification.js import { Notification } from 'react-admin'; -const MyNotification = props => ; +const MyNotification = () => ; export default MyNotification; ```