'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