import { buildStyles, CircularProgressbar } from 'react-circular-progressbar';
import style from './index.module.scss';

interface OtpProgressBar {
  percentage?: number;
}

const OtpProgress = ({ percentage = 0 }: OtpProgressBar) => {
  return (
    <CircularProgressbar
      value={percentage}
      text={`${percentage}%`}
      strokeWidth={8}
      className={`${style.circularProgress}`}
      styles={buildStyles({
        textColor: '#000',
        pathColor: `#387C44`,
      })}
    />
  );
};

export default OtpProgress;
