{"path":"src/components/Header.tsx","size":4697,"locked":false,"binary":false,"truncated":false,"content":"\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport Link from \"next/link\";\nimport { useRouter } from \"next/navigation\";\nimport { createClient } from \"@/lib/supabase/client\";\nimport { brandConfig } from \"@/lib/brand\";\n\nexport function Header({ nav, name: dynamicName }: { nav: any[]; name?: string }) {\n  const [user, setUser] = useState<any>(null);\n  const [loading, setLoading] = useState(true);\n  const [isAdmin, setIsAdmin] = useState(false);\n  const supabase = createClient();\n  const router = useRouter();\n\n  useEffect(() => {\n    if (!supabase) {\n      setLoading(false);\n      return;\n    }\n\n    supabase.auth.getUser().then(({ data }) => {\n      const currentUser = data.user ?? null;\n      setUser(currentUser);\n      if (currentUser) {\n        // Check if the user is an admin\n        supabase\n          .from(\"admin_users\")\n          .select(\"user_id\")\n          .eq(\"user_id\", currentUser.id)\n          .maybeSingle()\n          .then(({ data: adminRow }) => {\n            setIsAdmin(!!adminRow);\n            setLoading(false);\n          });\n      } else {\n        setLoading(false);\n      }\n    });\n\n    const { data: listener } = supabase.auth.onAuthStateChange((_event, session) => {\n      const currentUser = session?.user ?? null;\n      setUser(currentUser);\n      if (currentUser) {\n        supabase\n          .from(\"admin_users\")\n          .select(\"user_id\")\n          .eq(\"user_id\", currentUser.id)\n          .maybeSingle()\n          .then(({ data: adminRow }) => {\n            setIsAdmin(!!adminRow);\n          });\n      } else {\n        setIsAdmin(false);\n      }\n    });\n\n    return () => listener?.subscription.unsubscribe();\n  }, [supabase]);\n\n  const handleSignOut = async () => {\n    if (!supabase) return;\n    await supabase.auth.signOut();\n    router.push(\"/\");\n    router.refresh();\n  };\n\n  const displayName = dynamicName || brandConfig.name;\n  const nameLength = displayName.length;\n  const fontSizeClass =\n    nameLength > 18\n      ? \"text-xs md:text-sm\"\n      : nameLength > 12\n      ? \"text-sm md:text-lg\"\n      : \"text-lg md:text-xl\";\n\n  return (\n    <header className=\"sticky top-0 z-50 w-full border-b border-neutral-200/60 bg-white/70 backdrop-blur-md\">\n      <div className=\"mx-auto flex h-16 md:h-20 items-center justify-between px-4 md:px-6 max-w-7xl\">\n        <nav className=\"hidden md:flex items-center gap-6 lg:gap-8 text-[11px] uppercase font-medium tracking-[0.2em] text-neutral-500\">\n          {(nav || []).map((item: any) => (\n            <a\n              key={item.label}\n              href={item.href}\n              className={`hover:text-black transition-colors ${\n                item.active ? \"text-black border-b border-black pb-1\" : \"\"\n              }`}\n            >\n              {item.label}\n            </a>\n          ))}\n        </nav>\n\n        <Link\n          href=\"/\"\n          className={`font-serif font-medium tracking-[0.2em] md:tracking-[0.3em] uppercase text-center ${fontSizeClass}`}\n        >\n          {displayName}\n        </Link>\n\n        <div className=\"flex items-center gap-4 md:gap-6 text-neutral-800\">\n          {loading ? null : user ? (\n            <>\n              {/* Profile circle – only a link if user is admin */}\n              {isAdmin ? (\n                <Link\n                  href=\"/admin\"\n                  title={user.email}\n                  className=\"flex items-center justify-center w-8 h-8 rounded-full bg-neutral-900 text-white text-xs font-medium uppercase\"\n                >\n                  {user.email?.[0] ?? \"?\"}\n                </Link>\n              ) : (\n                <span className=\"flex items-center justify-center w-8 h-8 rounded-full bg-neutral-900 text-white text-xs font-medium uppercase\">\n                  {user.email?.[0] ?? \"?\"}\n                </span>\n              )}\n              <button\n                onClick={handleSignOut}\n                className=\"text-[10px] md:text-[11px] uppercase tracking-wider text-neutral-500 hover:text-black transition font-medium\"\n              >\n                Sign out\n              </button>\n            </>\n          ) : (\n            <>\n              <Link\n                href=\"/login\"\n                className=\"text-[11px] uppercase tracking-wider text-neutral-500 hover:text-black transition font-medium\"\n              >\n                Sign in\n              </Link>\n              <Link\n                href=\"/signup\"\n                className=\"text-[11px] uppercase tracking-wider bg-black text-white px-4 py-2.5 rounded-sm hover:bg-neutral-800 transition font-medium\"\n              >\n                Sign up\n              </Link>\n            </>\n          )}\n        </div>\n      </div>\n    </header>\n  );\n}\n"}