"use client" import Link from "next/link" import { useSession } from "./SessionProvider" import { authClient } from "@/lib/auth-client" import { useEffect, useState } from "react" export default function Navigation() { const { session, loading } = useSession() const [userRole, setUserRole] = useState(null) // Fetch user role whenever session changes useEffect(() => { const fetchUserRole = async () => { const userId = (session?.user as { id?: string })?.id if (userId) { try { const response = await fetch(`/api/users/${userId}/role`) if (response.ok) { const data = await response.json() setUserRole(data.role) } else { setUserRole(null) } } catch { setUserRole(null) } } else { setUserRole(null) } } fetchUserRole() }, [session]) const handleLogout = async () => { await authClient.signOut() window.location.href = '/auth/login' } // Determine wordmark href based on session and role // If session exists but role is not yet loaded, use /rankings as default for players const wordmarkHref = session ? (userRole === "club_admin" || userRole === "site_admin") ? "/admin" : "/rankings" : "/"; return ( ) }