Files
vod-system/frontend/src/components/buttons/SidebarButton.tsx

24 lines
695 B
TypeScript

import MenuButton from "./MenuButton.tsx";
import { Link, useLocation } from "react-router-dom";
type Props = {
url: string;
logo: React.ReactNode;
label: string;
}
const SidebarButton = ({url, logo, label}: Props) => {
const { pathname } = useLocation();
const isActive = url === "/" ? pathname === "/" : pathname.startsWith(url);
return (
<Link className="w-full" to={url}>
<MenuButton className={`flex items-center gap-2.5 w-full px-3 py-2 text-sm font-medium rounded-md ${isActive ? "bg-gray-100 text-gray-900" : "text-gray-600"}`}>
{logo}{label}
</MenuButton>
</Link>
)
}
export default SidebarButton;