34 lines
680 B
JavaScript
34 lines
680 B
JavaScript
import { Flex, Icon, Text } from "@chakra-ui/react";
|
|
|
|
export default function SidebarItem({
|
|
icon,
|
|
label,
|
|
active = false,
|
|
setFilters,
|
|
name,
|
|
}) {
|
|
return (
|
|
<Flex
|
|
align="center"
|
|
gap={3}
|
|
px={4}
|
|
py={3}
|
|
borderRadius="lg"
|
|
cursor="pointer"
|
|
bg={active ? "purple.50" : "transparent"}
|
|
color={active ? "purple.600" : "gray.700"}
|
|
_hover={{
|
|
bg: "purple.50",
|
|
color: "purple.600",
|
|
}}
|
|
transition="all 0.2s"
|
|
onClick={(e) => setFilters({ tab_menu: name })}
|
|
>
|
|
<Icon as={icon} boxSize={5} />
|
|
<Text fontSize="md" fontWeight="medium">
|
|
{label}
|
|
</Text>
|
|
</Flex>
|
|
);
|
|
}
|