36 lines
983 B
TypeScript
36 lines
983 B
TypeScript
"use client";
|
|
|
|
import { NAV_ITEMS } from "@/lib/constans";
|
|
import Link from "next/link";
|
|
import { usePathname } from "next/navigation";
|
|
|
|
const NavItems = () => {
|
|
const pathname = usePathname();
|
|
const isActive = (path: string) => {
|
|
if(path === '/') return pathname === '/';
|
|
|
|
return pathname.startsWith(path);
|
|
}
|
|
return (
|
|
<ul className="flex flex-col sm:flex-row p-2 gap-3 sm:gap-10 font-medium">
|
|
{NAV_ITEMS.map(({ label, href }) => {
|
|
const active = isActive(href);
|
|
|
|
return (
|
|
<li key={href}>
|
|
<Link href={href} className={`hover:text-yellow-500 transition-colors ${
|
|
active
|
|
? 'text-gray-100 font-bold'
|
|
: ''
|
|
}`}
|
|
>
|
|
{label}
|
|
</Link>
|
|
</li>
|
|
);
|
|
})}
|
|
</ul>
|
|
);
|
|
};
|
|
|
|
export default NavItems; |