Files
lume/src/components/activeLink.tsx
2023-04-20 10:57:32 +07:00

26 lines
552 B
TypeScript

'use client';
import Link from 'next/link';
import { useSelectedLayoutSegments } from 'next/navigation';
export const ActiveLink = ({
href,
className,
activeClassName,
children,
}: {
href: string;
className: string;
activeClassName: string;
children: React.ReactNode;
}) => {
const segments = useSelectedLayoutSegments();
const isActive = href.includes(segments[1]);
return (
<Link prefetch={false} href={href} className={`${className}` + ' ' + (isActive ? `${activeClassName}` : '')}>
{children}
</Link>
);
};