"use client"
import MainButton from "@/components/ui/MainButton"
import TranslateClient from "@/components/ui/localization/TranslateClient"
import { ForgetPassFormState } from "@/modules/authentication/authFormState"
import LogoTitle from "../LogoTitle"

type Props = {
  setForgetState: React.Dispatch<React.SetStateAction<ForgetPassFormState>>
  phone: string
}

const PinCodeMessage = ({ setForgetState, phone }: Props) => {
  return (
    <div className="py-8">
      <LogoTitle title="send_pin_code" />
      <p className="text-center text-mainGray !mt-4 px-8 leading-[35px]">
        <TranslateClient text="pin_code_sent_to" />{" "}
        <span className="text-mainBlue">{phone}</span>{" "}
        <TranslateClient text="successfully_please_write_pin_code" />{" "}
      </p>
      <MainButton
        type="button"
        size="sm"
        fullWidth
        className="!mt-10"
        onClick={() => setForgetState("pinCode")}
      >
        <TranslateClient text="submit" />
      </MainButton>
    </div>
  )
}

export default PinCodeMessage