import { useRouter } from "next/navigation";
import React from "react";
import { getRegistrationRoute } from "@/lib/auth/registrationRoutes";

function CompleteRegister({
  user_name,
  first_name,
  user_type,
}: {
  user_name: string | null;
  first_name: string | null;
  user_type: string | null;
}) {
  const router = useRouter();
  const step =
    typeof window !== "undefined" ? localStorage.getItem("step") : null;

  const resolveStep = () => {
    if (!user_name) return "user_name";
    if (step === "password") return "password";
    if (!first_name) return "first_name";
    if (!user_type) return "registration_choice";
    return "complete";
  };

  return (
    <button
      onClick={() => {
        const targetStep = resolveStep();
        if (targetStep === "complete") {
          router.push("/verify/avatar");
        } else {
          router.push(getRegistrationRoute(targetStep));
        }
      }}
      className="flex items-center gap-3 text-xs md:text-sm font-semibold mt-4"
    >
      <div className="w-4 h-4 rounded-full bg-[#FF0000]"></div>
      <span>تکمیل ثبت نام</span>
    </button>
  );
}

export default CompleteRegister;
