# Финальный редизайн брокерского overview по HTML — задачи

Дата: 2026-06-27
Статус: документация подготовлена, реализация не начата

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

- [x] Создать `docs/features/broker-account-overview-html-parity/spec.md`.
- [x] Создать `docs/features/broker-account-overview-html-parity/plan.md`.
- [x] Создать `docs/features/broker-account-overview-html-parity/tasks.md`.
- [x] Зафиксировать canonical visual reference:
  `docs/research/frontend-overview-redesign/example.html`.
- [x] Зафиксировать, что `docs/research/2026-06-27-broker-account-redesign.html` не является
  source of truth для этой итерации.
- [x] Зафиксировать финальный порядок блоков:
  `Заголовок счёта → Стоимость портфеля за 6 месяцев → Аналитика доходности → Структура → Последние события`.
- [x] Зафиксировать, что production UI не переносит demo-toggle `Данные / Загрузка`.
- [ ] Перед началом реализации убедиться, что работа идёт в feature branch.
- [ ] Перед началом реализации запустить baseline checks текущей ветки.

## Backend contract

- [ ] Расширить `BrokerAnalyticsDto` полями `totalFees` и `totalTaxesPaid`.
- [ ] Обновить `BrokerAnalyticsService`: считать комиссии из executed операций категории `fee`.
- [ ] Обновить `BrokerAnalyticsService`: считать уплаченные налоги из executed операций категории `tax`.
- [ ] Обновить `broker-analytics.service.spec.ts` для новых агрегатов и округления.
- [ ] Добавить DTO для `BrokerPortfolioHistoryData`.
- [ ] Добавить envelope DTO для portfolio history endpoint.
- [ ] Добавить `BrokerPortfolioHistoryService`.
- [ ] Добавить endpoint `GET /api/v1/broker/accounts/:accountId/portfolio/history?months=6`.
- [ ] Покрыть portfolio history default months и response shape тестами.
- [ ] Добавить `categories?: string` в `BrokerOperationQueryDto`.
- [ ] Обновить `BrokerOperationsService`: применять category filtering для operations response.
- [ ] Покрыть `categories=income,tax,fee` и неизвестные категории тестами.
- [ ] Обновить `TBankController` и `tbank.controller.spec.ts` под новый endpoint/DTO.

## OpenAPI и frontend data layer

- [ ] Запустить backend dev server для Swagger JSON.
- [ ] Выполнить `npm run codegen -w apps/frontend`.
- [ ] Проверить, что generated types содержат `totalFees`, `totalTaxesPaid` и portfolio history schemas.
- [ ] Экспортировать новый `BrokerPortfolioHistory` alias из `apps/frontend/src/shared/api/index.ts`.
- [ ] Добавить `getBrokerPortfolioHistory`.
- [ ] Добавить `useBrokerPortfolioHistory`.
- [ ] Добавить `categories` в frontend `BrokerOperationQuery`.
- [ ] Не редактировать `apps/frontend/src/shared/api/types.ts` вручную.

## Frontend composition

- [ ] Перестроить `BrokerDashboard` на финальный порядок блоков.
- [ ] Убрать `BrokerDashboardHero` из overview-render path.
- [ ] Перенести compact yield UI в заголовок счёта рядом с `Брокерский счёт`.
- [ ] Убедиться, что page title loading state не показывает skeleton-полосы.
- [ ] Создать `BrokerPortfolioHistoryCard`.
- [ ] Подключить `useBrokerPortfolioHistory(accountId, { months: 6 })`.
- [ ] Заменить overview `BrokerDashboardIncomeCard` на `BrokerPortfolioHistoryCard`.
- [ ] Обновить `BrokerDashboardSkeleton` под финальный порядок и стабильные высоты.

## Frontend visual parity

- [ ] Карточка `Стоимость портфеля за 6 месяцев`: зелёный градиентный фон и зелёная рамка.
- [ ] График стоимости: 6 месячных значений, 6 подписей месяцев, плавная линия без visible markers.
- [ ] График стоимости: первая точка у левого края, последняя у правого края.
- [ ] Loading графика: chart-like indicator без skeleton месяцев.
- [ ] Analytics summary: только `Стоимость портфеля` и `Всего доходов`.
- [ ] Analytics detail grid: `Пополнения`, `Выводы`, `Дивиденды`, `Купоны`, `Комиссия`,
  `Уплаченные налоги`.
- [ ] Analytics overview не показывает `Нетто` и `Всего получено`.
- [ ] `Комиссия` и `Уплаченные налоги` отображаются как отрицательные UI-суммы.
- [ ] Карточка структуры называется `Структура`.
- [ ] Карточка структуры не показывает subtitle `Структура портфеля`.
- [ ] Карточка структуры показывает итоговую стоимость под заголовком.
- [ ] Карточка структуры показывает бары `Акции`, `Облигации`, `Деньги`.
- [ ] Карточка последних событий называется `Последние события`.
- [ ] Последние события используют executed operations, а не calendar events.
- [ ] Последние события отсортированы новые → старые.
- [ ] Последние события не показывают toolbar, count badge, footer summary и колонку `Статус`.
- [ ] Инструмент в последних событиях: название сверху жирным, ticker/ISIN снизу серым.
- [ ] Налоги/комиссии/списания отображаются красным и с корректным бейджем типа.
- [ ] На mobile нет page-level horizontal overflow.

## Tests

- [ ] Backend targeted:
  `npm run test -w apps/backend -- src/modules/tbank/services/broker-analytics.service.spec.ts src/modules/tbank/services/broker-operations.service.spec.ts src/modules/tbank/tbank.controller.spec.ts`
- [ ] Frontend targeted:
  `npm run test -w apps/frontend -- --run src/widgets/broker-dashboard`
- [ ] Full frontend:
  `npm run test:frontend`
- [ ] Frontend lint:
  `npm run lint -w apps/frontend`
- [ ] Frontend build:
  `npm run build:frontend`
- [ ] Проверить OpenAPI/codegen после backend изменений.

## Visual QA

- [ ] Проверить `/broker/:accountId` на desktop против
  `docs/research/frontend-overview-redesign/example.html`.
- [ ] Проверить `/broker/:accountId` на viewport `390x844`.
- [ ] Проверить, что loading/loaded высоты карточек не вызывают layout shift.
- [ ] Проверить, что подписи месяцев графика не выходят за границы карточки.
- [ ] Проверить, что таблица последних событий читаема на mobile.

## Definition of Done

- [ ] Все acceptance criteria из `spec.md` выполнены.
- [ ] Backend tests проходят.
- [ ] Frontend targeted tests проходят.
- [ ] `npm run test:frontend` проходит.
- [ ] `npm run lint -w apps/frontend` проходит.
- [ ] `npm run build:frontend` проходит.
- [ ] Generated OpenAPI types обновлены через codegen.
- [ ] Visual QA desktop/mobile выполнена.
- [ ] Существующие detailed вкладки `Акции`, `Облигации`, `Операции`, `События`, `Аналитика`
  остаются доступны.
- [ ] `tasks.md` обновлён по факту выполнения.