import { FC } from 'react';

import Box from '@material-hu/mui/Box';
import Container from '@material-hu/mui/Container';

import CredentialsDialog from 'src/pages/dashboard/recognitions/components/CredentialsDialog';

export type LoginRecognitionsProps = {
  open: boolean;
  onClose: () => void;
  onLoggedUser: () => void;
};

const LoginRecognitions: FC<LoginRecognitionsProps> = props => {
  const { open, onClose, onLoggedUser } = props;

  return (
    <Box
      sx={{
        backgroundColor: 'background.default',
        minHeight: '100%',
        pt: 3,
        pb: 3,
      }}
    >
      <Container maxWidth="md">
        <Box sx={{ mt: 3, mb: 3 }}>
          <CredentialsDialog
            open={open}
            onClose={onClose}
            onLoggedUser={onLoggedUser}
          />
        </Box>
      </Container>
    </Box>
  );
};

export default LoginRecognitions;