supersam/docs/superpowers/plans/2026-03-13-orders-ui-simpli...

3.2 KiB
Raw Permalink Blame History

Orders UI Simplification Implementation Plan

For agentic workers: REQUIRED: Use superpowers:subagent-driven-development (if subagents available) or superpowers:executing-plans to implement this plan. Steps use checkbox (- [ ]) syntax for tracking.

Goal: Упростить раздел Заказы: вынести создание заказа в отдельное действие, заменить псевдо-календарь на настоящий календарный вид, разнести архив и исключения, скрывать завершённые заказы по умолчанию.

Architecture: Логику отбора активных/завершённых/исключений и канбан-колонок вынести в отдельные чистые helper-функции с тестами. UI Заказов перестроить вокруг четырёх понятных вкладок: Реестр, Календарь, Канбан, Архив, а создание заказа открыть через модальное окно вместо постоянной тяжёлой формы в рабочей области.

Tech Stack: React 18, Vite, Vitest, existing UI components.


Chunk 1: View Logic

Task 1: Вынести и покрыть тестами правила отображения заказов

Files:

  • Create: src/services/orderViews.js

  • Create: src/services/orderViews.test.js

  • Написать failing tests на скрытие завершённых заказов, отдельную колонку исключений и архив.

  • Прогнать таргетированный тест и увидеть корректный red-state.

  • Реализовать минимальные helper-функции.

  • Повторно прогнать тест.

Chunk 2: Data and UI

Task 2: Перестроить раздел Заказы

Files:

  • Modify: src/pages/DashboardPage.jsx

  • Modify: src/data/mockAppData.js

  • Modify: src/components/orders/OrderEditorPanel.jsx

  • Create: src/components/orders/OrdersCalendarView.jsx

  • Добавить demo-заказ в архивный финальный статус.

  • Убрать вкладку Оформление, добавить вкладку Архив.

  • В Реестре добавить кнопку Добавить заказ, открывающую модалку.

  • Убрать постоянный editor из рабочей области заказа.

  • Заменить текущий календарь на месячную сетку.

  • В канбане выделить Исключения в отдельную колонку и скрывать завершённые по умолчанию.

Chunk 3: Verification

Task 3: Полная проверка

Files:

  • No code changes expected

  • Запустить npm test.

  • Запустить npm run lint.

  • Запустить npm run build.

  • Зафиксировать, что именно стало проще для заказчика в демонстрации.