hamid zarghami
21 lines
778 B
TypeScript
21 lines
778 B
TypeScript
import { FC } from "react"
|
|
import { SidebarInterface } from "../../../types"
|
|
import clsx from "clsx"
|
|
import { Link, useLocation } from "react-router-dom"
|
|
|
|
type Props = {
|
|
item: SidebarInterface
|
|
}
|
|
export const SidebarItem: FC<Props> = ({ item }) => {
|
|
const { pathname } = useLocation()
|
|
return (
|
|
<Link to={item?.route} className={clsx("w-full flex flex-row gap-x-3 items-center rounded-[20px] p-3 min-w-52", {
|
|
"bg-secondary-color": item?.route === pathname
|
|
})}>
|
|
{item?.route === pathname ? item?.activeIcon : item?.icon}
|
|
<p className={clsx("font-normal text-sm text-secondary-text-color", {
|
|
"!text-primary-text-color": item?.route === pathname
|
|
})}>{item?.title}</p>
|
|
</Link>
|
|
)
|
|
} |