42 lines
1.0 KiB
TypeScript
42 lines
1.0 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import { styled } from "@mui/system";
|
|
import { ISidebarLink } from "@/app/features/dashboard/sidebar/SidebarLink.interfaces";
|
|
|
|
const LinkContainer = styled("div")(({ theme }) => ({
|
|
display: "flex",
|
|
alignItems: "center",
|
|
padding: "12px 1px",
|
|
borderRadius: "4px",
|
|
color: theme.palette.text.tertiary,
|
|
textDecoration: "none",
|
|
transition: "background 0.2s ease-in-out",
|
|
|
|
"&:hover": {
|
|
color: "rgb(255, 255, 255)",
|
|
background: "rgba(255, 255, 255, 0.08)",
|
|
backgroundColor: theme.palette.action.hover,
|
|
cursor: "pointer",
|
|
},
|
|
}));
|
|
|
|
const LinkText = styled("span")(({ theme }) => ({
|
|
color: theme.palette.text.tertiary,
|
|
marginLeft: "12px",
|
|
fontWeight: 500,
|
|
}));
|
|
|
|
export default function PageLinks({ title, path, icon: Icon }: ISidebarLink) {
|
|
return (
|
|
<Link href={path} passHref legacyBehavior>
|
|
<a style={{ textDecoration: "none" }}>
|
|
<LinkContainer>
|
|
{Icon && <Icon />}
|
|
<LinkText>{title}</LinkText>
|
|
</LinkContainer>
|
|
</a>
|
|
</Link>
|
|
);
|
|
}
|