web-humas-fe/components/page/menu-link.tsx

34 lines
717 B
TypeScript

"use client";
import React from "react";
import styles from "./menuLinks.module.css";
import Link from "next/link";
import { usePathname } from "next/navigation";
interface MenuLinksProps {
item: {
// icon: JSX.Element;
title: string;
path: any;
};
}
const MenuLinks: React.FC<MenuLinksProps> = ({ item }) => {
const pathname = usePathname();
console.log(pathname);
return (
<Link
href={item.path}
className={`flex items-center gap-2 hover:bg-slate-400 dark:hover:bg-[#2e374a] p-2 rounded-md ${
pathname === item.path ? "bg-slate-300 dark:bg-[#2e374a]" : ""
}`}
>
{/* {item.icon} */}
{item.title}
</Link>
);
};
export default MenuLinks;