james.maesandClaude Opus 4.6
66db82b3ce
Full Next.js 15 + React 19 + Tailwind CSS 4 + shadcn/ui implementation of the QQQ Admin UI, covering all 6 work packages: **P1 — Scaffold, Auth, Layout Shell** - Next.js 15 App Router, TypeScript strict, Tailwind CSS 4, shadcn/ui - Auth system: FULLY_ANONYMOUS, MOCK, OAuth2, Auth0 support - Axios API client with global 401 interceptor - Layout shell: sidebar, header, breadcrumbs, environment banners - Route generation from backend metadata (fully dynamic) - QContext provider, theme system with CSS variable injection **P2 — Record Query** - TanStack Table v8 DataGrid: sorting, column resize, density toggle - FilterBuilder: 20 operators, AND/OR groups, URL-persisted state - ColumnConfig: show/hide/reorder with drag-and-drop - Pagination with shareable URL state - BulkActionBar, ExportButton, SavedViewsMenu (localStorage) - Cell renderers for all QFieldType values **P3 — Record View + CRUD** - RecordView with field sections, associated records - FieldValue renderer for all QFieldType + AdornmentType values - DynamicForm + EntityForm (reused by P4 processes) - Full field type components: text, number, boolean, date, select, file, password - PossibleValueSelect async combobox with debounced search - Zod schema generation from field metadata - Delete confirmation dialog **P4 — Process Execution** - ProcessRun orchestrator with full async lifecycle + polling - StepWizard progress indicator - Step types: FORM, VALIDATION, RECORD_LIST, BULK_LOAD - ProcessResultStep, ProcessErrorState - use-process hook with TanStack Query **P5 — Dashboard + Widgets** - AppHome dashboard with per-widget data fetching - StatisticsWidget, BarChartWidget, LineChartWidget, PieChartWidget (Recharts) - RecordGridWidget, BlockWidget, QuickLinksWidget, AlertWidget - WidgetBlock container, WidgetGrid responsive layout - WidgetErrorBoundary (per-widget isolation) **P6 — Polish + Parity** - Command palette (Cmd+K) with fuzzy search over all metadata routes - Toast notifications (sonner) on save/delete/process complete - EmptyState + Skeleton components - Responsive sidebar drawer for mobile (<768px) - Accessibility: skip link, aria-live regions, focus management - ErrorBoundary component - Developer tools pages (table/record JSON views) - Custom CSS injection from branding metadata - robots.txt, favicon placeholder **Mock API Layer (MSW v2)** - Full backend-free development mode (NEXT_PUBLIC_MOCK_API=true) - CRM app: People (25), Companies (10), Orders (20) - Inventory app: Products (15), Suppliers (8) - In-memory mutable store, pagination, filter, possible values - Process flows: importPeople (3-step), sendEmail (2-step) - Dashboard widgets: stats, bar chart, line chart, record grid Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
10 lines
160 B
JSON
10 lines
160 B
JSON
{
|
|
"semi": false,
|
|
"singleQuote": true,
|
|
"trailingComma": "es5",
|
|
"tabWidth": 2,
|
|
"printWidth": 100,
|
|
"bracketSpacing": true,
|
|
"arrowParens": "always"
|
|
}
|