import React from "react";
import { makeStyles } from "@material-ui/core/styles";
import { Alert, AlertTitle } from "@material-ui/lab";
import { useTranslation } from "react-i18next";

const useStyles = makeStyles(theme => ({
  alert: {
    width: "100%",
    "& > * + *": {
      marginTop: theme.spacing(1)
    }
  }
}));

const NotAllowed = () => {
  const classes = useStyles();
  const { t } = useTranslation();

  return (
    <div className={classes.alert}>
      <Alert variant="outlined" severity="error">
        <AlertTitle>{t("Announcements.NotAllowed.Title")}</AlertTitle>
        {t("Announcements.NotAllowed.Message")}
      </Alert>
    </div>
  );
};

export default NotAllowed;