import Link from 'next/link';

import styles from './MenuTitle.module.css';

import { useCurrentPath } from '@/hooks/useCurrentPath';

interface MenuTitleProps {
  name: string;
  path: string;
  variant: string;
}

export default function MenuTitle({ name, path, variant }: MenuTitleProps) {
  const { isCurrentPath } = useCurrentPath();
  return (
    <h2 className={`${styles.heading} ${styles[`${variant}`]}`}>
      <Link
        className={`${styles.mainlink} ${isCurrentPath(path) ? styles.current : ''}`}
        href={path}
      >
        {name}
      </Link>
    </h2>
  );
}