diff --git a/docs/useNotify.md b/docs/useNotify.md index 9c70925be7e..72418c84a50 100644 --- a/docs/useNotify.md +++ b/docs/useNotify.md @@ -30,7 +30,7 @@ The hook takes no argument and returns a callback. The callback takes 2 argument - `type`: The notification type (`info`, `success`, `error` or `warning` - the default is `info`) - `messageArgs`: options to pass to the `translate` function (because notification messages are translated if your admin has an `i18nProvider`). It is useful for inserting variables into the translation. - `undoable`: Set it to `true` if the notification should contain an "undo" button - - `autoHideDuration`: Duration (in milliseconds) after which the notification hides. Set it to `0` if the notification should not be dismissible. + - `autoHideDuration`: Duration (in milliseconds) after which the notification hides. Set it to `null` if the notification should not be dismissible. - `multiLine`: Set it to `true` if the notification message should be shown in more than one line. - `anchorOrigin`: The position of the notification. The default is `{ vertical: 'top', horizontal: 'right' }`. See [the Material UI documentation](https://mui.com/material-ui/react-snackbar/) for more details. diff --git a/packages/ra-core/src/notification/types.ts b/packages/ra-core/src/notification/types.ts index d023f97f3df..757db33e448 100644 --- a/packages/ra-core/src/notification/types.ts +++ b/packages/ra-core/src/notification/types.ts @@ -3,8 +3,8 @@ import { ReactNode } from 'react'; export type NotificationType = 'success' | 'info' | 'warning' | 'error'; export interface NotificationOptions { - // The duration in milliseconds the notification is shown - autoHideDuration?: number; + // The duration in milliseconds the notification is shown (pass null to disable auto hide) + autoHideDuration?: number | null; // Arguments used to translate the message messageArgs?: any; // If true, the notification shows the message in multiple lines diff --git a/packages/ra-ui-materialui/src/layout/Notification.stories.tsx b/packages/ra-ui-materialui/src/layout/Notification.stories.tsx index e135dc3a042..6082941e0f4 100644 --- a/packages/ra-ui-materialui/src/layout/Notification.stories.tsx +++ b/packages/ra-ui-materialui/src/layout/Notification.stories.tsx @@ -76,6 +76,20 @@ export const AutoHideDuration = () => ( ); +const NoAutoHideNotification = () => { + const notify = useNotify(); + React.useEffect(() => { + notify('hello, world', { autoHideDuration: null }); + }, [notify]); + return null; +}; + +export const NoAutoHide = () => ( + + + +); + const UndoableNotification = () => { const notify = useNotify(); React.useEffect(() => {