Files
got-gaming/components/Navigation.tsx

94 lines
3.1 KiB
TypeScript

"use client";
import Link from "next/link";
import { useSession, signOut } from "next-auth/react";
import PlayerStats from "./PlayerStats";
export default function Navigation() {
const { data: session } = useSession();
return (
<nav className="w-full fixed top-0 left-0 z-50 px-8 py-3 bg-black/80 backdrop-blur-sm border-b border-gray-800/30">
<div className="max-w-7xl mx-auto flex items-center justify-between">
{/* Logo - Left */}
<div className="flex flex-col">
<div className="text-white text-xl font-gaming font-bold tracking-tight">
GAME.OF.TECH
</div>
<div className="text-pixel-gold text-xs font-gaming-subtitle font-semibold flex items-center gap-1 tracking-wide">
<span></span>
<span>Peaksys</span>
<span></span>
</div>
</div>
{/* Navigation Links - Center */}
<div className="flex items-center gap-6">
<Link
href="/"
className="text-white hover:text-pixel-gold transition text-xs font-normal uppercase tracking-widest"
>
HOME
</Link>
<Link
href="/events"
className="text-white hover:text-pixel-gold transition text-xs font-normal uppercase tracking-widest"
>
EVENTS
</Link>
<Link
href="/leaderboard"
className="text-white hover:text-pixel-gold transition text-xs font-normal uppercase tracking-widest"
>
LEADERBOARD
</Link>
{session?.user?.role === "ADMIN" && (
<Link
href="/admin"
className="text-pixel-gold hover:text-orange-400 transition text-xs font-normal uppercase tracking-widest"
>
ADMIN
</Link>
)}
</div>
{/* Right Side */}
<div className="flex items-center gap-4">
{session ? (
<>
<PlayerStats />
<Link
href="/profile"
className="text-white hover:text-pixel-gold transition text-xs font-normal uppercase tracking-widest"
>
PROFIL
</Link>
<button
onClick={() => signOut()}
className="text-gray-400 hover:text-pixel-gold transition text-xs font-normal uppercase tracking-widest"
>
Déconnexion
</button>
</>
) : (
<>
<Link
href="/login"
className="text-white hover:text-pixel-gold transition text-xs font-normal uppercase tracking-widest"
>
Connexion
</Link>
<Link
href="/register"
className="px-4 py-2 border border-pixel-gold/50 bg-black/60 text-white uppercase text-xs tracking-widest rounded hover:bg-pixel-gold/10 hover:border-pixel-gold transition"
>
Inscription
</Link>
</>
)}
</div>
</div>
</nav>
);
}