snackbar

Question 1

snackbar

Answer 1

https://mui.com/material-ui/react-snackbar/
import Snackbar, { SnackbarCloseReason } from “@mui/material/Snackbar”
import Alert from “@mui/material/Alert”
import { SyntheticEvent, useState } from “react”

export const ErrorSnackbar = () => {
const [open, setOpen] = useState(false)

const handleClose = (_event?: SyntheticEvent | Event, reason?: SnackbarCloseReason) => {
if (reason === “clickaway”) {
return
}

setOpen(false)   }

return (
<Snackbar open={open} autoHideDuration={6000} onClose={handleClose}>
<Alert onClose={handleClose} severity=”error” variant=”filled”>
This is a error Alert!
</Alert>
</Snackbar>
)
}