diff --git a/src/components/dashboard/sidebar.tsx b/src/components/dashboard/sidebar.tsx index 8eaaafe..ff76f13 100644 --- a/src/components/dashboard/sidebar.tsx +++ b/src/components/dashboard/sidebar.tsx @@ -28,6 +28,7 @@ export function Sidebar() { const pathname = usePathname() const { isCollapsed, toggleSidebar } = useSidebar() + // Загружаем список чатов для подсчета непрочитанных сообщений const { data: conversationsData } = useQuery(GET_CONVERSATIONS, { pollInterval: 60000, // Обновляем каждую минуту в сайдбаре - этого достаточно @@ -141,300 +142,316 @@ export function Sidebar() { const isPartnersActive = pathname.startsWith('/partners') return ( -
-
- {/* Кнопка сворачивания */} -
- + + {/* Подсказка только в свернутом состоянии */} + {isCollapsed && ( +
+
+
+
+ ⚡ Развернуть +
+
+
+ )} +
+
+ +
+ {/* Информация о пользователе */} + + {!isCollapsed ? ( + // Развернутое состояние +
+
+
+ + {user?.avatar ? ( + + ) : null} + + {getInitials()} + + +
+
+
+

+ {getOrganizationName()} +

+
+
+

+ {getCabinetType()} +

+
+
+
+
) : ( - - )} - -
- - {/* Информация о пользователе */} - - {!isCollapsed ? ( - // Развернутое состояние -
-
- - {user?.avatar ? ( - - ) : null} - - {getInitials()} - - -
-
-
-

- {getOrganizationName()} -

-
-
-

- {getCabinetType()} -

+ // Свернутое состояние - более компактное и красивое +
+
+
+ + {user?.avatar ? ( + + ) : null} + + {getInitials()} + + +
+
-
- ) : ( - // Свернутое состояние -
-
- - {user?.avatar ? ( - - ) : null} - - {getInitials()} - - -
-
-
-

- {getOrganizationName().length > 12 - ? getOrganizationName().substring(0, 12) + '...' - : getOrganizationName() - } -

-
-
+ )} + + + {/* Навигация */} +
+ + +
-
- )} - + )} + - {/* Навигация */} -
- + - )} - - )} - - {/* Услуги - только для фулфилмент центров */} - {user?.organization?.type === 'FULFILLMENT' && ( + {/* Мои поставки - для селлеров */} + {user?.organization?.type === 'SELLER' && ( + + )} + + {/* Входящие поставки - для фулфилмент */} + {user?.organization?.type === 'FULFILLMENT' && ( + + )} + + {/* Отгрузки - для оптовиков */} + {user?.organization?.type === 'WHOLESALE' && ( + + )} + + {/* Перевозки - для логистов */} + {user?.organization?.type === 'LOGIST' && ( + + )} + + {/* Склад - только для оптовиков */} + {user?.organization?.type === 'WHOLESALE' && ( + + )} + - )} +
- {/* Сотрудники - только для фулфилмент центров */} - {user?.organization?.type === 'FULFILLMENT' && ( + {/* Кнопка выхода */} +
- )} - - {/* Мои поставки - для селлеров */} - {user?.organization?.type === 'SELLER' && ( - - )} - - {/* Входящие поставки - для фулфилмент */} - {user?.organization?.type === 'FULFILLMENT' && ( - - )} - - {/* Отгрузки - для оптовиков */} - {user?.organization?.type === 'WHOLESALE' && ( - - )} - - {/* Перевозки - для логистов */} - {user?.organization?.type === 'LOGIST' && ( - - )} - - {/* Склад - только для оптовиков */} - {user?.organization?.type === 'WHOLESALE' && ( - - )} - - -
- - {/* Кнопка выхода */} -
- +
diff --git a/src/hooks/useSidebar.tsx b/src/hooks/useSidebar.tsx index a597109..05b6db5 100644 --- a/src/hooks/useSidebar.tsx +++ b/src/hooks/useSidebar.tsx @@ -20,7 +20,7 @@ export function SidebarProvider({ children }: { children: ReactNode }) { const getSidebarMargin = () => { // Учитываем отступ слева (left-4) + ширина сайдбара + дополнительный отступ - return isCollapsed ? 'ml-20' : 'ml-64' + return isCollapsed ? 'ml-24' : 'ml-64' } return (