2021-10-13 23:25:58 +02:00
|
|
|
import React, { useEffect } from "react";
|
|
|
|
import { useSnackbar, SnackbarProvider as SB } from "notistack";
|
2021-09-25 20:10:32 +02:00
|
|
|
import { EventEmitter } from "../../utils/EventEmitter";
|
2021-10-13 23:25:58 +02:00
|
|
|
import Alert from "@mui/material/Alert";
|
2021-09-25 20:10:32 +02:00
|
|
|
import Paper from "@mui/material/Paper";
|
|
|
|
|
2021-10-13 23:25:58 +02:00
|
|
|
interface IProps {
|
|
|
|
children: React.ReactNode | React.ReactNode[];
|
|
|
|
}
|
|
|
|
|
|
|
|
export function SnackbarProvider(props: IProps): React.ReactElement {
|
|
|
|
return (
|
|
|
|
<SB dense maxSnack={9} anchorOrigin={{ horizontal: "right", vertical: "bottom" }} autoHideDuration={2000}>
|
|
|
|
{props.children}
|
|
|
|
</SB>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
2021-12-20 19:29:04 +01:00
|
|
|
export const SnackbarEvents = new EventEmitter<[string, "success" | "warning" | "error" | "info", number]>();
|
2021-09-25 20:10:32 +02:00
|
|
|
|
|
|
|
export function Snackbar(): React.ReactElement {
|
2021-10-13 23:25:58 +02:00
|
|
|
const { enqueueSnackbar } = useSnackbar();
|
2021-09-25 20:10:32 +02:00
|
|
|
|
2021-10-13 23:25:58 +02:00
|
|
|
useEffect(() =>
|
2021-12-20 19:29:04 +01:00
|
|
|
SnackbarEvents.subscribe((s, variant, duration) =>
|
2021-10-13 23:25:58 +02:00
|
|
|
enqueueSnackbar(<Alert severity={variant}>{s}</Alert>, {
|
|
|
|
content: (k, m) => <Paper key={k}>{m}</Paper>,
|
|
|
|
variant: variant,
|
2021-12-20 19:29:04 +01:00
|
|
|
autoHideDuration: duration,
|
2021-10-13 23:25:58 +02:00
|
|
|
}),
|
|
|
|
),
|
2021-09-25 20:10:32 +02:00
|
|
|
);
|
2021-10-13 23:25:58 +02:00
|
|
|
return <></>;
|
2021-09-25 20:10:32 +02:00
|
|
|
}
|