import React from 'react';
//import zxcvbn from '@zxcvbn-ts/core';
import { Box, LinearProgress, Typography } from '@mui/material';

interface PasswordStrengthCheckerProps {
  password?: string;
}

const PasswordStrengthChecker: React.FC<PasswordStrengthCheckerProps> = ({ password }) => {
  //const strength = password ? zxcvbn(password).score : 0;

  const getStrengthLabel = () => {
    switch (strength) {
      case 0:
        return 'Weak';
      case 1:
        return 'Fair';
      case 2:
        return 'Good';
      case 3:
        return 'Strong';
      case 4:
        return 'Very Strong';
      default:
        return '';
    }
  };

  const getStrengthColor = () => {
    switch (strength) {
      case 0:
        return 'error';
      case 1:
        return 'warning';
      case 2:
        return 'info';
      case 3:
        return 'success';
      case 4:
        return 'success';
      default:
        return 'grey';
    }
  };

  return (
    <Box>
      <LinearProgress
        variant="determinate"
        value={(strength + 1) * 20}
        color={getStrengthColor()}
      />
      <Typography variant="caption" color="textSecondary">
        {getStrengthLabel()}
      </Typography>
    </Box>
  );
};

export default PasswordStrengthChecker;
