Verified Commit c8b753a2 authored by Florent Chehab's avatar Florent Chehab
Browse files

docs(frontend): removed outdated information oubout notifications

parent fa85051b
Notifications in the app
The visual notifications in the app are based on the [`Snackbars`]( component of our frontend framework `material-ui`.
To ease the use of notifications throughout the app, we use the [`notistack`]( module.
## Don't miss notistack doc
The very good documentation is available [here](
## How to use it
### 1. The standard way\*
!> \* Only when it's used in a *class-based* component that won't be extended.
You simply need to wrap your component in the `withSnackbar` function provided by `notistack` when exporting it.
import React, { Component } from "react";
import { withSnackbar } from "notistack";
* Never forget to comment your code by the way
* @class ADumbComponent
* @extends {Component}
class ADumbComponent extends Component {
// ....
export default withSnackbar(ADumbComponent);
By doing so, two `props` functions will be added to your component: `enqueueSnackbar` (to dispatch a notification) and `closeSnackbar` (to close a specific notification, see [doc](
Then in your component you can simply call `enqueueSnackbar`:
"My awesome message",
variant: "success", // or "error", "warning" or "info"
autoHideDuration: 5000 // duration of the notification
// And other parameters you can find in the doc.
### 2. The \* workaround
When the condition for 1 is not met, you can use the `Notifier` component available in `frontend/src/components/common/Notifier.js`. This component will display a notification as soon as it is added to the DOM. You should pass the parameters in its `props`, as follow:
message={"My awesome error message."}
options={{ variant: "error" }}
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment