moex/moex-vibe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
moex-vibe/docs/features/broker-dashboard-redesign/tasks.md
Sergey Krylov 8df94a51dd feat: broker dashboard redesign with top tabs, single-column layout, and clickable chip filters 
- Move navigation from left sidebar to horizontal top tabs in BrokerAccountLayout
- Change dashboard blocks to single-column layout (Events, Income, Analytics, Allocation)
- Extend DS Chip with onClick/selected/disabled/aria-pressed
- Add clickable chip filters to Events and Income cards with immediate filtering
- Disable backend query when all types deselected (show validation message)
- Add useBrokerEvents/useBrokerOperations options.enabled param
- Update dashboard skeleton to single-column shape
- Add userEvent tests for chip filter interactions
2026-06-26 10:47:08 +03:00

4.0 KiB
Raw Blame History

Редизайн overview брокерского счёта в инвестиционный дашборд — задачи

Дата: 2026-06-26 Статус: готово к реализации

Документация и pre-flight

  • Выбрать scope: /broker/:accountId становится единым дашбордом.
  • Выбрать визуальный стиль: структура temp.html, текущая светлая DS-тема.
  • Исключить график истории стоимости из первой версии.
  • Добавить backlog-задачу на историю стоимости брокерского портфеля.
  • Создать ветку codex/broker-dashboard-redesign.
  • Запустить baseline: rtk npm run test:backend && rtk npm run test:frontend && rtk npm run test:design-system.
  • Написать spec.md.
  • Написать plan.md.

Реализация

  • Добавить pure helpers для фильтрации и суммирования доходных операций dashboard.
  • Добавить helpers для фильтров дат, пресетов, валидации и mapping income types → operationTypes.
  • Добавить dashboard presentation helpers для fallback, event labels и statuses.
  • Добавить локальный BrokerDashboardCard pattern или точечно расширить DS, если локального pattern недостаточно.
  • Добавить BrokerDashboardHero с KPI по portfolio и analytics.
  • Добавить BrokerDashboardEventsCard на основе useBrokerEvents.
  • Добавить BrokerDashboardIncomeCard на основе useBrokerOperations.
  • Перенести навигацию счёта из левой колонки в горизонтальные вкладки над контентом.
  • Перестроить dashboard на один блок на строке для События, Доходы, Аналитика доходности, Аллокация.
  • Добавить кликабельные chip-фильтры типов для События.
  • Добавить фильтры периода, пресеты, reset/apply actions для События.
  • Добавить локальную пагинацию по 10 событий в События.
  • Добавить кликабельные chip-фильтры типов для Доходы.
  • Добавить фильтры периода, пресеты, reset/apply actions для Доходы.
  • Добавить cursor-пагинацию по 10 операций в Доходы.
  • Добавить BrokerDashboardAnalyticsCard на основе useBrokerAnalytics.
  • Добавить BrokerDashboardAllocationCard на основе существующей аллокации.
  • Добавить BrokerDashboardSkeleton.
  • Добавить BrokerDashboard как top-level composition widget.
  • Заменить текущий vertical overview в BrokerAccountOverviewPage на BrokerDashboard.
  • Добавить unit/component tests для helpers и dashboard composition.
  • Проверить desktop layout /broker/2084014113.
  • Проверить mobile layout /broker/2084014113.

Definition of Done

  • rtk npm run test:frontend проходит (31 files, 135 tests).
  • rtk npm run test:design-system проходит (28 files, 162 tests).
  • rtk npm run lint -w apps/frontend проходит.
  • rtk npm run build:frontend проходит.
  • Dashboard соответствует acceptance criteria из spec.md.
  • Существующие вкладки Акции, Облигации, Операции, События, Аналитика остаются доступны.
  • graphify update . выполнен после code changes.