feat: модульная архитектура sidebar и улучшения навигации

🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-08-30 15:51:41 +03:00
parent 8391f40e87
commit b40ac083ab
128 changed files with 9366 additions and 17283 deletions
--- a/src/components/dashboard/sidebar/FulfillmentSidebar.tsx
+++ b/src/components/dashboard/sidebar/FulfillmentSidebar.tsx
@ -0,0 +1,88 @@
+'use client'
+
+import { LogOut } from 'lucide-react'
+import { usePathname, useRouter } from 'next/navigation'
+
+import { useAuth } from '@/hooks/useAuth'
+import { useSidebar } from '@/hooks/useSidebar'
+
+import { NavigationButton } from './core/NavigationButton'
+import { NotificationBadge } from './core/NotificationBadge'
+import { SidebarLayout } from './core/SidebarLayout'
+import { UserProfile } from './core/UserProfile'
+import { useSidebarData } from './hooks/useSidebarData'
+import { fulfillmentNavigation } from './navigations/fulfillment'
+
+// Компонент уведомлений для поставок фулфилмента
+function FulfillmentSuppliesNotification({ count }: { count: number }) {
+  if (count === 0) return null
+
+  return (
+    <div className="absolute -top-1 -right-1 bg-red-500 text-white text-xs rounded-full min-w-[18px] h-[18px] flex items-center justify-center font-bold animate-pulse">
+      {count > 99 ? '99+' : count}
+    </div>
+  )
+}
+
+export function FulfillmentSidebar() {
+  const { user, logout } = useAuth()
+  const router = useRouter()
+  const pathname = usePathname()
+  const { isCollapsed, toggleSidebar } = useSidebar()
+  const { totalUnreadCount, incomingRequestsCount, supplyOrdersCount } = useSidebarData()
+
+  if (!user) return null
+
+  const handleNavigationClick = (path: string) => {
+    router.push(path)
+  }
+
+  return (
+    <SidebarLayout isCollapsed={isCollapsed} onToggle={toggleSidebar}>
+      {/* Информация о пользователе */}
+      <UserProfile 
+        isCollapsed={isCollapsed}
+        user={{
+          avatar: user.avatar,
+          name: user.organization?.name || user.organization?.fullName || 'Организация',
+          role: 'Фулфилмент',
+        }}
+      />
+
+      {/* Навигация */}
+      <div className="flex-1 space-y-1">
+        {fulfillmentNavigation.map((item) => (
+          <NavigationButton
+            key={item.id}
+            isActive={item.isActive(pathname)}
+            isCollapsed={isCollapsed}
+            label={item.label}
+            icon={item.icon}
+            onClick={() => handleNavigationClick(item.path)}
+            notification={
+              item.id === 'messenger' ? (
+                <NotificationBadge count={totalUnreadCount} isCollapsed={isCollapsed} />
+              ) : item.id === 'partners' ? (
+                <NotificationBadge count={incomingRequestsCount} isCollapsed={isCollapsed} />
+              ) : item.id === 'supplies' ? (
+                <FulfillmentSuppliesNotification count={supplyOrdersCount} isCollapsed={isCollapsed} />
+              ) : null
+            }
+          />
+        ))}
+      </div>
+
+      {/* Кнопка выхода */}
+      <div>
+        <NavigationButton
+          isActive={false}
+          isCollapsed={isCollapsed}
+          label="Выйти"
+          icon={LogOut}
+          onClick={logout}
+          notification={null}
+        />
+      </div>
+    </SidebarLayout>
+  )
+}