import React from 'react';
import { Typography, Box } from '@mui/material';
import { Check, Clear } from '@mui/icons-material';
import { useStyles } from '../loginStyles';
// import vectorIcon from '../../../assets/images/icon/Vector.png';

function PasswordValidation({ isValid, text }) {
  const classes = useStyles();
  return (
    <Box display="flex" alignItems="center">
      {isValid ? (
        <Check fontSize="small" color="success" />
      ) : (
        <Clear fontSize="small" color="error" />
      )}
      <Typography variant="body2" className={classes.passwordValidationText}>
        {text}
      </Typography>
    </Box>
  );
}

export default PasswordValidation;
