import { FC, useEffect, useState } from "react";

type props = {
  setCaptcha?: (x: number) => void;
};

const Captcha: FC<props> = ({ setCaptcha = () => {} }) => {
  const [randomNumber, setRandomNumber] = useState<number | undefined>(
    undefined
  );
  useEffect(() => {
    if (!randomNumber) {
      let num = Math.floor(1000 + Math.random() * 9000);
      setRandomNumber(num);
      setCaptcha(num);
    }
  }, [randomNumber]);
  let Func = (randomNumber) => Number(randomNumber);
  return (
    <>
      {randomNumber &&
        Array.from(String(randomNumber), Func).map((num: number, index) => (
          <p key={index} className="text-stroke">
            {num}
          </p>
        ))}
    </>
  );
};

export default Captcha;
