supersam/docs/architecture.md

Архитектура фронтенда

Модули

• src/context/AuthContext.jsx — OTP-аутентификация через Supabase Auth и загрузка профиля пользователя с ролью.
• src/context/ThemeContext.jsx — управление светлой и тёмной темой через data-theme.
• src/hooks/usePwaStatus.js — клиентское состояние PWA: online/offline, install prompt, standalone и offline readiness.
• src/hooks/useOrders.js — локальный state заказов, истории, чатов, фильтров и действий.
• src/services/orderService.js — чистые функции бизнес-логики заказов, покрытые тестами.
• src/services/supabase/orderRepository.js — адаптер реальных чтений/записей заказов и чатов в Supabase.
• src/layouts/AppShell.jsx — общий shell с боковой навигацией, уведомлениями и переключением темы.
• src/components/orders/* — фильтры, список заказов, карточка заказа, история статусов и поиск по чату.
• src/components/orders/OrderEditorPanel.jsx — создание и редактирование заказа менеджером или администратором.
• src/components/dashboard/ProductionQueuePanel.jsx — отдельный блок производственной очереди.
• src/components/admin/UserDirectoryPanel.jsx — панель пользователей, ролей и последних входов.
• src/components/logistics/BotControlPanel.jsx — сценарии отправки в чатбот и переноса слотов доставки.
• src/components/admin/AuditPanel.jsx — журнал ошибок, исключений и обзор последних системных событий.

Ролевой доступ

• Менеджер видит только свои заказы и может менять статусы на этапах подтверждения.
• Начальник производства переводит заказ через очередь и производство к готовности.
• Логист работает только со своими заказами, слотами и сообщениями чатбота.
• Водитель видит только назначенные ему доставки и может переводить их через статусы Загружен, В пути, Доставлен.
• Администратор видит весь массив заказов и системные логи.

Ключевые экраны

• /login — email + OTP flow. При отсутствии VITE_SUPABASE_* включается demo-режим.
• /dashboard — role-based control center: KPI, фильтры, список заказов, детализация, боты, аудит.
• public/manifest.webmanifest + public/service-worker.js — installable PWA-оболочка и базовое кеширование shell для demo offline.
• src/services/orderService.test.js — smoke-проверки фильтрации, статусов, метрик и автодистрибуции.

Дизайн-концепт

• Минималистичная сетка с крупными панелями, прозрачными поверхностями и мягкими границами.
• Светлая тема использует холодно-зелёный акцент на светлом фоне.
• Тёмная тема построена на глубоких графитовых поверхностях с ярким мятным accent.
• Мобильная версия складывает layout в вертикальный поток; боковая панель становится верхним блоком.

Интеграционный слой

• src/supabaseClient.js создаёт клиент Supabase через env-переменные.
• src/services/safeSupabaseCall.js стандартизирует обработку ошибок.
• Данные UI уже разложены по сущностям, совпадающим с таблицами Supabase: orders, order_history, chat_messages, delivery_slots.
• В orders синхронизированы поля status, delivery_agreement_status, assigned_driver_id, чтобы backend и demo-режим использовали одну процессную модель.