"use client";

import Link from "next/link";
import { signOut } from "next-auth/react";
import { useSession } from "next-auth/react";
import { useRouter } from "next/navigation";

export default function Header() {
  const { data: session } = useSession();
  const router = useRouter();

  return (
    <header className="sticky top-0 z-50 border-b border-white/10 bg-dark-900/90 backdrop-blur-md">
      <div className="mx-auto flex max-w-3xl items-center justify-between px-4 py-3">
        <Link href="/" className="text-lg font-bold">
          🥊 Juanito<span className="text-primary-500">Sport</span>
        </Link>

        {session?.user ? (
          <div className="flex items-center gap-2">
            <Link
              href={
                session.user.role === "ADMIN"
                  ? "/admin"
                  : session.user.isMuayThai
                  ? "/member/muay-thai"
                  : "/member/yoga"
              }
              className="btn-primary !px-4 !py-2 text-sm"
            >
              Mon espace
            </Link>
            <button
              onClick={() => signOut({ callbackUrl: "/" })}
              className="text-sm text-white/60 hover:text-white"
            >
              Déconnexion
            </button>
          </div>
        ) : (
          <Link href="/login" className="btn-primary !px-4 !py-2 text-sm">
            Connexion
          </Link>
        )}
      </div>
    </header>
  );
}