import ReportIcon from "@mui/icons-material/Report";
import { Box, Divider, Typography } from "@mui/material";
import { toast } from "react-toastify";

const WarningNotification = (directionApp, t, status) => {
  toast(
    ({ closeToast }) => (
      <>
        <Box
          sx={{
            display: "flex",
            flexDirection: "column",
            alignItems: "start",
            justifyContent: "start",
          }}
        >
          <Box sx={{ display: "flex", alignItems: "center" }}>
            <ReportIcon color="warning" sx={{ mr: 1.6 }} />
            <Box sx={{ display: "flex", flexDirection: "column" }}>
              <Typography color="warning.main" variant="button">
                {t("warning")} ({t("code")}: {status})
              </Typography>
              <Typography variant="caption">
                {t("warning_static_text")}
              </Typography>
            </Box>
          </Box>
        </Box>
        <Divider sx={{ my: 1 }} />
      </>
    ),
    {
      position: directionApp === "ltr" ? "top-left" : "top-right",
      autoClose: false,
      closeOnClick: false,
      draggable: false,
    }
  );
};

export default WarningNotification;