63 lines
2.0 KiB
TypeScript
63 lines
2.0 KiB
TypeScript
import { type FC, type ReactNode } from 'react'
|
|
import { Link } from 'react-router-dom'
|
|
import { clx } from '../helpers/utils'
|
|
import { Pages } from '../config/Pages'
|
|
import { useSharedStore } from './store/sharedStore'
|
|
import { removeToken, removeRefreshToken } from '../config/func'
|
|
// import { useGetAdminPermissions } from '../pages/users/hooks/useUserData'
|
|
|
|
type Props = {
|
|
icon: ReactNode,
|
|
title: string,
|
|
isActive: boolean,
|
|
link: string,
|
|
isLogout?: boolean,
|
|
name?: string,
|
|
activeName?: string
|
|
}
|
|
|
|
const SideBarItem: FC<Props> = (props: Props) => {
|
|
|
|
const { hasSubMenu, setSubMenuName, setSubtMenu } = useSharedStore()
|
|
// const { data: adminPermissions } = useGetAdminPermissions()
|
|
const handleLogout = () => {
|
|
removeToken()
|
|
removeRefreshToken()
|
|
window.location.href = Pages.auth.login
|
|
}
|
|
|
|
const handleClick = () => {
|
|
if (props.name) {
|
|
setSubMenuName(props.name)
|
|
setSubtMenu(true)
|
|
}
|
|
}
|
|
// if (props.activeName === '' || props.activeName && adminPermissions?.data?.permissions?.some((permission: { name: string }) => permission.name === props.activeName)) {
|
|
if (true) {
|
|
return (
|
|
<Link onClick={props.isLogout ? handleLogout : handleClick} to={props.link} className={clx(
|
|
'flex text-xs gap-9 mt-4',
|
|
hasSubMenu && 'flex-col',
|
|
)}>
|
|
<div className={clx(
|
|
'w-1 bg-black h-6',
|
|
!props.isActive && 'invisible',
|
|
hasSubMenu && 'hidden',
|
|
)}></div>
|
|
<div className={clx(
|
|
'flex gap-3 items-center',
|
|
hasSubMenu && 'flex-col text-[10px]',
|
|
)}>
|
|
{props.icon}
|
|
<div className={props.isActive ? 'text-black' : ''}>
|
|
{props.title}
|
|
</div>
|
|
</div>
|
|
|
|
</Link>
|
|
)
|
|
}
|
|
|
|
}
|
|
|
|
export default SideBarItem |