25 lines
786 B
TypeScript
25 lines
786 B
TypeScript
"use client";
|
|
import Link from "next/link";
|
|
import { usePathname } from "next/navigation";
|
|
|
|
export function NavLink({ href, label, symbol }: { href: string; label: string; symbol?: string }) {
|
|
const pathname = usePathname();
|
|
const active = pathname === href || (href !== "/" && pathname.startsWith(href));
|
|
return (
|
|
<Link
|
|
href={href}
|
|
className={`px-2.5 py-1.5 text-sm rounded-lg transition-colors flex items-center gap-1.5 whitespace-nowrap ${
|
|
active
|
|
? "bg-gray-900 text-white font-semibold"
|
|
: "text-gray-500 hover:text-gray-900 hover:bg-gray-100"
|
|
}`}
|
|
>
|
|
{symbol && (
|
|
<span className="text-[13px] leading-none" aria-hidden>
|
|
{symbol}
|
|
</span>
|
|
)}
|
|
<span>{label}</span>
|
|
</Link>
|
|
);
|
|
}
|