import { API_Instance } from "@/api/axios.instance";
import { getAxiosErrorMessage } from "@/utils/index.utils";
import { useEffect, useState } from "react";
import toast from "react-hot-toast";

const EmailVerify = () => {
  const [status, setStatus] = useState<"loading" | "success" | "failed">(
    "loading",
  );

  const verify = async (token: string) => {
    try {
      const response = await API_Instance.get(`/auth/verify/${token}`);
      toast.success(response.data.message);
      if (response.status === 201) {
        setStatus("success");
      }
    } catch (error: any) {
      setStatus("failed");
      toast.error(getAxiosErrorMessage(error));
    }
  };

  useEffect(() => {
    const token = window.location.pathname.split("/").pop();
    verify(token);
  }, []);

  return (
    <div className="min-h-screen flex items-center justify-center bg-gray-100 px-4">
      <div className="bg-white p-10 shadow-lg rounded-xl text-center max-w-md w-full">
        {status === "loading" && (
          <>
            <h2 className="text-xl font-semibold">Verifying your email...</h2>
          </>
        )}

        {status === "success" && (
          <>
            <h2 className="text-2xl font-bold text-green-600 mb-2">
              Email Verified
            </h2>
            <p>Your account has been successfully verified.</p>
            <a
              href="/login"
              className="hidden mt-6 inline-block bg-green-600 text-white px-6 py-2 rounded-sm md:block"
            >
              Go to Login
            </a>
            <a
              href="examinfra://reset-success"
              className="mt-6 inline-block bg-green-600 text-white px-6 py-2 rounded-sm md:hidden"
            >
              Go to Login
            </a>
          </>
        )}

        {status === "failed" && (
          <>
            <h2 className="text-2xl font-bold text-red-600 mb-2">
              Verification Failed
            </h2>
            <p>Your verification link is invalid or expired.</p>
            {/* <a
              href="/resend-verification"
              className="mt-6 inline-block bg-red-600 text-white px-6 py-2 !rounded-md"
            >
              Resend Verification Email
            </a> */}
          </>
        )}
      </div>
    </div>
  );
};

export default EmailVerify;