# tasks.md - Фронтенд Инфраструктура - Современный стек

<details>
<summary>Общее описание</summary>

Этот документ описывает пошаговые задачи по серьёзному техническому обновлению инфраструктуры фронтенда MoexVibe — внедрение современных библиотек и паттернов. Все библиотеки установлены, инфраструктура настроена. Остаётся миграция компонентов.

## Цель
Перевести фронтенд на современный стек библиотек: ky (HTTP), Zustand (state), MUI (UI), dayjs (dates), react-hook-form+zod (forms), clsx (styles), @tanstack/react-table (tables).
</details>

## Базовая инфраструктура — ✅ Выполнено

### Начальная подготовка
- [x] Ветка `codex/frontend-libraries-setup` создана из `main`
- [x] Папка `docs/features/frontend-libraries/` создана
- [x] `spec.md`, `plan.md`, `tasks.md` созданы
- [x] `apps/docs/docs/adr/ADR-015-frontend-libraries-modernization.md` создан

### Установка зависимостей
- [x] `@mui/material`, `@emotion/react`, `@emotion/styled`
- [x] `@mui/icons-material`
- [x] `zustand`
- [x] `ky`
- [x] `dayjs`
- [x] `react-hook-form`, `zod`, `@hookform/resolvers`
- [x] `clsx`
- [x] `@tanstack/react-table`
- [x] `@fontsource/roboto`
- [x] `react-is@^18.3.1` (overrides в package.json)
- [x] `npm run lint` — чисто
- [x] `npm run build` — успешно
- [x] `npm run test` — 111/111 тестов проходят

### Созданные файлы (инфраструктура)
- [x] `src/shared/api/kyClient.ts` — ky с интерцепторами авторизации
- [x] `src/entities/session/model/useSessionStore.ts` — Zustand store сессии
- [x] `src/app/styles/theme.ts` — MUI тема с CSS-переменными
- [x] `src/app/providers/AppProviders.tsx` — обёрнут ThemeProvider + CssBaseline
- [x] `src/shared/lib/dates/index.ts` — dayjs утилиты (formatDate, formatRelative)
- [x] `src/shared/lib/styles/clsx.ts` — функция cn()
- [x] `src/shared/ui/Table/Table.tsx` — базовый компонент таблицы

## Оставшиеся задачи — миграция компонентов

### MID-приоритет (следующий спринт)

- [ ] **Zustand**: переписать SessionProvider на `useSessionStore`, удалить ручной `useState`
- [ ] **MUI**: преобразовать страницу логина на MUI TextField + Button
- [ ] **dayjs**: заменить все `new Date().toLocaleString()` на `formatDate()` в виджетах
- [ ] **clsx**: заменить шаблоны `className="a b" + (c && "d")` на `cn()`
- [ ] **TanStack Table**: переписать таблицу позиций (`PortfolioPositionsTable`)

### LOW-приоритет (по мере необходимости)
- [ ] **Form + Zod**: добавить схемы в `shared/lib/schema/`, создать FormField
- [ ] **ky**: интегрировать ky в request flow (замена `fetch` на `kyApi`)
- [ ] **MUI**: полноценная реализация light/dark mode
- [ ] **MUI**: преобразование остальных страниц и виджетов
- [ ] **CLSX**: полный рефакторинг className по всему проекту
- [ ] **TanStack Table**: пагинация через TanStack Query