156 lines
3.5 KiB
TypeScript
156 lines
3.5 KiB
TypeScript
"use client"
|
||
|
||
import Link from 'next/link'
|
||
import { usePathname } from 'next/navigation'
|
||
import { cn } from '@/lib/utils'
|
||
import {
|
||
Home,
|
||
Settings,
|
||
Users,
|
||
LogOut,
|
||
Activity,
|
||
Package,
|
||
UserCheck,
|
||
ShoppingCart,
|
||
Receipt,
|
||
Palette,
|
||
Star,
|
||
Image,
|
||
Shield
|
||
} from 'lucide-react'
|
||
import { Button } from '@/components/ui/button'
|
||
import { useAuth } from '@/components/providers/AuthProvider'
|
||
|
||
interface SidebarProps {
|
||
className?: string
|
||
}
|
||
|
||
const navigationItems = [
|
||
{
|
||
title: 'Главная',
|
||
href: '/dashboard',
|
||
icon: Home,
|
||
},
|
||
{
|
||
title: 'Каталог',
|
||
href: '/dashboard/catalog',
|
||
icon: Package,
|
||
},
|
||
{
|
||
title: 'Кража',
|
||
href: '/dashboard/kraja',
|
||
icon: Shield,
|
||
},
|
||
{
|
||
title: 'Навигация сайта',
|
||
href: '/dashboard/navigation',
|
||
icon: Star,
|
||
},
|
||
{
|
||
title: 'Товары главной',
|
||
href: '/dashboard/homepage-products',
|
||
icon: Star,
|
||
},
|
||
{
|
||
title: 'Баннеры героя',
|
||
href: '/dashboard/hero-banners',
|
||
icon: Image,
|
||
},
|
||
{
|
||
title: 'Заказы',
|
||
href: '/dashboard/orders',
|
||
icon: ShoppingCart,
|
||
},
|
||
{
|
||
title: 'Клиенты',
|
||
href: '/dashboard/clients',
|
||
icon: UserCheck,
|
||
},
|
||
{
|
||
title: 'Счета',
|
||
href: '/dashboard/invoices',
|
||
icon: Receipt,
|
||
},
|
||
{
|
||
title: 'Менеджеры',
|
||
href: '/dashboard/managers',
|
||
icon: Users,
|
||
},
|
||
{
|
||
title: 'Аудит',
|
||
href: '/dashboard/audit',
|
||
icon: Activity,
|
||
},
|
||
{
|
||
title: 'Настройки',
|
||
href: '/dashboard/settings',
|
||
icon: Settings,
|
||
},
|
||
{
|
||
title: 'Тест стилей',
|
||
href: '/dashboard/test-styles',
|
||
icon: Palette,
|
||
},
|
||
]
|
||
|
||
export const Sidebar = ({ className }: SidebarProps) => {
|
||
const pathname = usePathname()
|
||
const { user, logout } = useAuth()
|
||
|
||
const handleLogout = async () => {
|
||
await logout()
|
||
window.location.href = '/login'
|
||
}
|
||
|
||
return (
|
||
<div className={cn("flex flex-col h-full", className)}>
|
||
<div className="flex-1">
|
||
<div className="space-y-4 py-4">
|
||
<div className="px-3 py-2">
|
||
<div className="mb-8">
|
||
<h2 className="mb-2 px-4 text-lg font-semibold tracking-tight">
|
||
ProtekAuto CMS
|
||
</h2>
|
||
<div className="px-4 text-sm text-muted-foreground">
|
||
{user?.firstName} {user?.lastName}
|
||
</div>
|
||
</div>
|
||
<div className="space-y-1">
|
||
{navigationItems.map((item) => {
|
||
const Icon = item.icon
|
||
const isActive = pathname === item.href
|
||
|
||
return (
|
||
<Button
|
||
key={item.href}
|
||
variant={isActive ? "secondary" : "ghost"}
|
||
className={cn(
|
||
"w-full justify-start",
|
||
isActive && "bg-muted font-medium"
|
||
)}
|
||
asChild
|
||
>
|
||
<Link href={item.href}>
|
||
<Icon className="mr-2 h-4 w-4" />
|
||
{item.title}
|
||
</Link>
|
||
</Button>
|
||
)
|
||
})}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div className="p-3 border-t">
|
||
<Button
|
||
variant="outline"
|
||
className="w-full justify-start"
|
||
onClick={handleLogout}
|
||
>
|
||
<LogOut className="mr-2 h-4 w-4" />
|
||
Выйти
|
||
</Button>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|