PNSPS-frontend-MaterialUI/src/pages/authentication/auth-forms/PasswordAlertDialog.js

import React, {
  // useEffect,
  // useState
} from 'react';

// material-ui
import {
  Button,
  // Link,
  Stack,
  Typography,
  Dialog,
  DialogActions,
  DialogContent,
  DialogContentText,
  DialogTitle
} from '@mui/material';
import CancelOutlinedIcon from '@mui/icons-material/CancelOutlined';
import {FormattedMessage} from "react-intl";

const PasswordAlertDialog = (props) => {
  return (
    <Dialog
      open={props.open}
      onClose={props.handleClose}
      aria-labelledby="alert-dialog-title"
      aria-describedby="alert-dialog-description"
    >
      <DialogTitle id="alert-dialog-title">
        <Stack mt={1} mr={4} direction="row" justifyContent="flex-start" alignItems="center" spacing={2}>
          <CancelOutlinedIcon color="error" sx={{ width: "35px", height: "40px" }} />
          {
            props.errorMassage === 'ACCOUNT_LOCKED_ERROR' ?
              <Stack direction="column">
                <Typography display="inline">
                <FormattedMessage id="loginErrorMessage1"/>
                </Typography>
                <Typography display="inline">
                  <FormattedMessage id="loginErrorMessage2"/>
                </Typography>
              </Stack> :
              props.errorMassage === 'ACCOUNT_VERIFIED_ERROR' ?
                <Typography display="inline">
                  <FormattedMessage id="loginErrorMessage3"/>
                </Typography> :
                props.errorMassage === 'CONNECTION_ERROR' ?
                  <Typography display="inline">
                    <FormattedMessage id="loginErrorMessage4"/>
                  </Typography>:
                props.errorMassage === 'PUBLIC_LOGIN_DISABLE' ?
                  <Typography display="inline">
                    <FormattedMessage id="loginErrorMessage7"/>
                  </Typography>:
                  <Typography display="inline">
                    <FormattedMessage id="loginErrorMessage5"/>
                  </Typography>
          }
        </Stack>
      </DialogTitle>
      <DialogContent>
        <DialogContentText id="alert-dialog-description">
          {""}
        </DialogContentText>
      </DialogContent>
      <DialogActions>
        <Button variant="contained" color="error" onClick={props.handleClose} autoFocus>
          <FormattedMessage id="close"/>
        </Button>
      </DialogActions>
    </Dialog>
  );
};

export default PasswordAlertDialog;