A toast or snackbar is a small notification that pops up to give users feedback after an action. See https://mui.com/material-ui/react-snackbar/ for examples from MUI's Snackbar component. We'd like to integrate toasts for some actions, such as posting and deleting a post
Some requirements for the toast component are:
The toast should be a global toast that can be used across the app, ideally called using a custom hook
Expose MUI's Snackbar props in the hook so we can customize them
The toast position should be taken as a prop, but should have a default position of the top middle (see MUI's docs for more info about how to position their toast component)
The toast variant should also be a prop. For example, we can have a success variant, an error variant, ect (again, see MUI's docs for a good example of how we can use their Alert component to help with this)
The hide duration is another example of a prop it would be good to expose. The default should be 5 seconds
Bonus points if we can add additional actions using the hook (eg. an undo button, link, etc)
Only 1 toast should be shown at a time. If the user clicks on actions that trigger multiple toasts, dismiss the old ones and only display the new one
A toast or snackbar is a small notification that pops up to give users feedback after an action. See https://mui.com/material-ui/react-snackbar/ for examples from MUI's
Snackbar
component. We'd like to integrate toasts for some actions, such as posting and deleting a postSome requirements for the toast component are:
Snackbar
props in the hook so we can customize themAlert
component to help with this)