- Added a new linting command for OpenAPI specifications in the package.json, improving code quality checks. - Updated frontend documentation to clarify component usage and structure, including detailed descriptions for `SettingsShell` and `Auth callback`. - Refactored agent-related API routes to streamline control-plane functionalities, consolidating multiple routes for better organization. - Improved error handling in the API to provide more informative responses for validation errors, enhancing user feedback during interactions. These changes enhance the overall development experience and improve the management of agents within the application.
102 lines
4.3 KiB
Plaintext
102 lines
4.3 KiB
Plaintext
---
|
|
description: Frontend — shadcn primitives + ReUI PRO blocks; CLI-first; kit patterns
|
|
globs: apps/web/**/*,packages/ui/**/*
|
|
alwaysApply: false
|
|
---
|
|
|
|
# Frontend — shadcn/ui + ReUI PRO
|
|
|
|
**Источник истины:** MCP **`user-reui`** (pages/blocks/KPI/settings) + MCP `plugin-shadcn-shadcn` (primitives) + docs. Не выдумывать UI.
|
|
|
|
Monorepo — [`frontend-monorepo.mdc`](frontend-monorepo.mdc). ReUI — [`reui-mcp.mdc`](reui-mcp.mdc). Patterns — [`frontend-ui-patterns.mdc`](frontend-ui-patterns.mdc).
|
|
|
|
| Документ | URL |
|
|
|----------|-----|
|
|
| **shadcn Components** | https://ui.shadcn.com/docs/components |
|
|
| **ReUI Blocks** | https://reui.io/blocks |
|
|
| **ReUI llms.txt** | https://reui.io/llms.txt |
|
|
| **ReUI Settings** | https://reui.io/blocks/application/settings |
|
|
| **Installation** | https://ui.shadcn.com/docs/installation |
|
|
| **Monorepo** | https://ui.shadcn.com/docs/monorepo |
|
|
| **Forms (RHF)** | https://ui.shadcn.com/docs/forms/react-hook-form |
|
|
|
|
## Шаг 0 — перед любым UI-кодом
|
|
|
|
0. Найти существующие `reui-kit/*` / shared
|
|
1. **Pages / KPI / settings / enterprise** → MCP `user-reui` (`search` → `get_block` / `compose_page`) + cite `previewUrl`
|
|
2. **Primitives** → MCP `plugin-shadcn-shadcn` + `pnpm dlx shadcn@latest docs <component>`
|
|
3. CLI add из `apps/web` → adapt
|
|
|
|
**Новая страница** → сначала ReUI PRO `compose_page` / blocks ([reui.io/blocks](https://reui.io/blocks)), не ui.shadcn.com/blocks как primary.
|
|
|
|
## Shared / kit (обязательно)
|
|
|
|
| Component | Файл |
|
|
|-----------|------|
|
|
| `PageShell` | `page-shell.tsx` |
|
|
| `ResourcePage` | `reui-kit/resource-page.tsx` |
|
|
| `OpsDashboard` / `KpiStatGrid` / `QuickActionGrid` | `reui-kit/ops-dashboard.tsx`, `kpi-stat-grid.tsx`, `quick-action-grid.tsx` |
|
|
| `DetailPanel` | `reui-kit/detail-panel.tsx` |
|
|
| `SettingsShell` | `reui-kit/settings-shell.tsx` (multi-tab; single-page settings — PageShell + Frame) |
|
|
| `EmptyState` | `empty-state.tsx` |
|
|
| `QueryState` | `query-state.tsx` |
|
|
| `ConfirmDialog` | `confirm-dialog.tsx` |
|
|
| `StatusBadge` | `status-badge.tsx` |
|
|
| `FormSheet` | `form-sheet.tsx` |
|
|
| `FormField` | `form-field.tsx` |
|
|
| `LoadingButton` | `loading-button.tsx` |
|
|
| `SettingRow` | `setting-row.tsx` |
|
|
|
|
**Не использовать как эталон:** устаревшие `PageHeader` / `SectionCards` / `DataGridCard` / `TableCard` (если удалены или мёртвы).
|
|
|
|
**Overlay:** Sheet — forms; AlertDialog — destructive confirm.
|
|
|
|
## Шаг 1 — CLI
|
|
|
|
```bash
|
|
cd apps/web
|
|
pnpm dlx shadcn@latest add button field input ...
|
|
pnpm dlx shadcn@latest add @reui/frame @reui/data-grid @reui/filters
|
|
pnpm dlx shadcn@latest add @reui/stats-12 @reui/card-35 @reui/settings-16 @reui/auth-13
|
|
pnpm dlx shadcn@latest apply b2fA --only theme -y
|
|
```
|
|
|
|
## Приоритет композиции
|
|
|
|
1. `@evofw/ui/components/*` (primitives)
|
|
2. ReUI PRO block → adapt (`blocks/` reference + kit)
|
|
3. `reui-kit/*` + shared
|
|
4. Domain-обёртка
|
|
|
|
## Запрещено
|
|
|
|
| ❌ | ✅ |
|
|
|----|-----|
|
|
| `<table>`, raw select | DataGrid / `Select` |
|
|
| `bg-emerald-*` | semantic / ReUI `variant` |
|
|
| Card как ops-shell | ReUI `Frame` |
|
|
| Hand-roll KPI | `KpiStatGrid` / [stats-12](https://reui.io/preview/base/stats-12) |
|
|
| `space-y-*` | `flex` + `gap-*` |
|
|
| `@/components/ui/*` | `@evofw/ui/components/*` |
|
|
|
|
## Эталоны проекта
|
|
|
|
| Зона | Файл | Preview |
|
|
|------|------|---------|
|
|
| Shell | `layout/app-shell.tsx` | [app-shell-12](https://reui.io/preview/base/app-shell-12) |
|
|
| Auth callback | `routes/auth.callback.tsx` (SSO portal) | [auth-13](https://reui.io/preview/base/auth-13) · [empty-state-12](https://reui.io/preview/base/empty-state-12) |
|
|
| Dashboard | `routes/_auth/index.tsx` | [stats-12](https://reui.io/preview/base/stats-12) / dashboard-1 |
|
|
| Lists | `ResourcePage` | [data-grid-filtering-2](https://reui.io/preview/base/data-grid-filtering-2) |
|
|
| Settings | `routes/_auth/settings.tsx` | [settings-16](https://reui.io/preview/base/settings-16) |
|
|
|
|
## Чеклист
|
|
|
|
- [ ] `user-reui` + preview/docs для зоны
|
|
- [ ] Frame surface
|
|
- [ ] CLI add при новых items
|
|
- [ ] `pnpm --filter @evofw/web build`
|
|
|
|
## Язык
|
|
|
|
Ответы — русский. Commits — [`commit-messages-ru.mdc`](commit-messages-ru.mdc).
|