/* eslint-disable @typescript-eslint/no-explicit-any */
"use client";

import AuthHead from "@/components/auth/AuthHead";
import AuthPageLayout, {
  AuthFormFooter,
  AuthPageContent,
} from "@/components/auth/AuthPageLayout";
import React, { useState } from "react";
import useAxios from "@/hooks/useAxios";
import { useRouter } from "next/navigation";
import AuthNextButton from "@/components/auth/AuthNextButton";
import toast from "react-hot-toast";
import { getSafeRedirectPath } from "@/lib/auth/postLogin";

function RegisterCompletePage() {
  const router = useRouter();
  const { request, loading } = useAxios();
  const [action, setAction] = useState<"app" | "continue" | null>(null);

  const finishRegistration = async (next: "app" | "continue") => {
    setAction(next);
    try {
      await request("POST", "/register/user_type", {
        user_type: "user",
      });
      localStorage.setItem("usertype", "user");

      if (next === "continue") {
        router.push("/verify/avatar");
      } else {
        router.push(getSafeRedirectPath());
      }
    } catch (err: any) {
      toast.error(err?.response?.data?.message || "خطا در تکمیل ثبت‌نام");
    } finally {
      setAction(null);
    }
  };

  return (
    <AuthPageLayout>
      <div className="flex w-full flex-1 flex-col items-center">
        <AuthPageContent>
          <AuthHead title="ثبت‌نام اولیه تکمیل شد" />
          <p className="text-sm text-gray-500 text-center max-w-sm mt-2">
            می‌توانید وارد برنامه شوید یا ثبت‌نام کامل (تایید هویت و پروفایل)
            را ادامه دهید.
          </p>
        </AuthPageContent>

        <AuthFormFooter>
          <div className="flex flex-col sm:flex-row gap-3 w-full max-w-sm justify-center items-center">
            <AuthNextButton
              type="button"
              onClick={() => finishRegistration("continue")}
              className="!border-[#0C8002] !text-[#0C8002] w-full sm:w-auto"
              disabled={loading}
              loading={loading && action === "continue"}
            >
              ادامه ثبت نام
            </AuthNextButton>
            <AuthNextButton
              type="button"
              onClick={() => finishRegistration("app")}
              className="!border-[#FF0000] !text-[#FF0000] w-full sm:w-auto"
              disabled={loading}
              loading={loading && action === "app"}
            >
              ورود به برنامه
            </AuthNextButton>
          </div>
        </AuthFormFooter>
      </div>
    </AuthPageLayout>
  );
}

export default RegisterCompletePage;
