1"use client";
2import { SidebarMenuButton } from "@/components/ui/sidebar";
3import Link from "next/link";
4import { usePathname } from "next/navigation";
5import { JSX } from "react";
6
7interface SidebarLinkProps {
8  label: string;
9  url: string;
10  icon: JSX.Element;
11}
12
13export default function SidebarLink(props: SidebarLinkProps) {
14  const pathname = usePathname();
15  const isActive = props.url === pathname;
16
17  return (
18    <SidebarMenuButton isActive={isActive} asChild>
19      <Link href={props.url}>
20        <div
21          className={`[&>svg]:size-4 [&>svg]:shrink-0 ${isActive ? "text-primary " : ""}`}
22        >
23          {props.icon}
24        </div>
25        {props.label}
26      </Link>
27    </SidebarMenuButton>
28  );
29}
30
Copy