# Frontend

## Назначение и authority

React/Vite-клиент WealthLedger. Workspace layout и reference policy —
в root `AGENTS.md`. Для planning, implementation, validation и завершения
читай [canonical lifecycle](../docs/development/openspec-authority-and-lifecycle.md);
для recovery и выбора relevant evidence —
[context discipline](../docs/development/agent-token-efficiency.md).
Они доступны без optional agent skills или commands.

Frontend-specific conventions: [`docs/CONVENTIONS.md`](docs/CONVENTIONS.md),
[`docs/STRUCTURE.md`](docs/STRUCTURE.md), [`docs/API-LAYER.md`](docs/API-LAYER.md),
[`docs/UI-PATTERN.md`](docs/UI-PATTERN.md) и [`docs/TESTING.md`](docs/TESTING.md).

## Canonical gate

Перед Node-командами активировать `.nvmrc` через `nvm use --silent`; это выбирает
Node 22. Не запускать отдельную проверку версии, кроме диагностики runtime issue.
После lockfile install единственный completion gate:

```bash
npm ci
npm run verify
```

Gate non-mutating и проверяет strict TypeScript, Biome, risk-based tests/coverage ratchet, Knip, dependency boundaries и build. Если backend API contract меняется, committed frontend snapshot `src/shared/api/spec/openapi.json` обновляется явным копированием backend OpenAPI document, затем `npm run openapi:generate` регенерирует committed types; обе стороны API contract сверяются отдельной backend командой `npm run test:openapi-contract`.
Актуальные scripts проверять в `package.json`/`npm run`.

## Enforceable boundaries

- Code style и i18n: [`docs/CONVENTIONS.md`](docs/CONVENTIONS.md), исполняются Biome и TypeScript.
- React component declaration, props и export style: [`docs/CONVENTIONS.md`](docs/CONVENTIONS.md), часть исполняется Biome, часть является mandatory review convention.
- FSD и public API: [`docs/STRUCTURE.md`](docs/STRUCTURE.md), исполняются dependency-cruiser и Knip; направление `app → pages → features → entities → shared`.
- HTTP и types: [`docs/API-LAYER.md`](docs/API-LAYER.md); только typed client и generated OpenAPI `paths[...]`, без ручных transport DTO и прямых T-Bank calls.
- UI states и VM/view boundary: [`docs/UI-PATTERN.md`](docs/UI-PATTERN.md); container вызывает page VM hook, VM владеет data/state/derived presentation data, `*.view.tsx` получает props и рендерит. View files дробить по semantic responsibility, когда section/state можно назвать отдельно.
- Тесты: [`docs/TESTING.md`](docs/TESTING.md); новый тест обязателен по risk trigger, а не из-за появления файла или coverage процента.

Непроверяемые эстетические предпочтения считаются guidance. Не добавлять Storybook, Playwright, CI, browser MSW worker или mock development mode без утверждённого change.