"use client";
import { cn } from "@/utils/styles";
import Link from "next/link";
import { usePathname } from "next/navigation";

interface Site {
	name: string;
	path: string;
}

export function HeaderNavigation() {
	const pathname = usePathname();
	const sites: Site[] = [
		{
			name: "Mein Dashboard",
			path: "/",
		},
		/* {
			name: "Meine Druckaufträge",
			path: "/my/jobs",
		}, */
		{
			name: "Mein Profil",
			path: "/my/profile",
		},
	];

	return (
		<nav className="font-medium text-sm flex items-center gap-4 flex-row">
			{sites.map((site) => (
				<Link
					key={site.path}
					href={site.path}
					className={cn("transition-colors hover:text-neutral-50", {
						"text-neutral-50": pathname === site.path,
						"text-neutral-500": pathname !== site.path,
					})}
				>
					{site.name}
				</Link>
			))}
		</nav>
	);
}
