Add openspec/config.yaml with project context (React 19/Vite, FSD layers, auth flow, CSS Modules) and per-artifact rules so agents generate proposals, specs, designs, and tasks aligned with project conventions. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
52 lines
2.4 KiB
YAML
52 lines
2.4 KiB
YAML
schema: spec-driven
|
|
|
|
# Project context (optional)
|
|
# This is shown to AI when creating artifacts.
|
|
# Add your tech stack, conventions, style guides, domain knowledge, etc.
|
|
context: |
|
|
Project: elcsa frontend — a crypto/finance web app (currency converter,
|
|
wallet, networks, auth) for the ЭКСА platform.
|
|
|
|
Tech stack:
|
|
- React 19 + Vite, TypeScript (strict, tsc -b before build)
|
|
- TanStack Query (React Query) for server state
|
|
- React Router for routing
|
|
- Plain CSS Modules (.module.css) — NO Tailwind, NO CSS-in-JS
|
|
- Design tokens live in src/app/styles/variables.css
|
|
|
|
Architecture — Feature-Sliced Design (FSD). Layers are strictly ordered;
|
|
a lower layer must never import from a higher one:
|
|
app → pages → widgets → features → entities → shared
|
|
Path aliases map to layers: @app/* @pages/* @widgets/* @features/*
|
|
@entities/* @shared/*. Each widget/feature owns its model/, ui/ and a
|
|
barrel index.ts.
|
|
|
|
Key conventions:
|
|
- Auth is two-step email+code for both register and login. Access token is
|
|
kept in an in-memory tokenStore (NOT localStorage); refreshed via an
|
|
HttpOnly cookie against the auth service. Every request attaches a cached
|
|
CSRF token and retries once on 401 after a silent refresh.
|
|
- Reusable UI lives in shared/ui (Button, PrimaryButton, FormField, Pill,
|
|
Title, TokenIcon, Notification), each with its own CSS Module.
|
|
- Routes are centralized in shared/config/routes.ts (ROUTES const).
|
|
ProtectedRoute / GuestRoute guard auth-only and guest-only pages.
|
|
- VITE_API_URL must be set (src/shared/config/env.ts).
|
|
- No test runner is configured.
|
|
|
|
# Per-artifact rules (optional)
|
|
# Add custom rules for specific artifacts.
|
|
rules:
|
|
proposal:
|
|
- Keep it concise and focused on user-facing behavior and the "why".
|
|
- State which FSD layer(s) the change touches and any cross-layer impact.
|
|
specs:
|
|
- Write requirements as observable behavior, not implementation details.
|
|
- Cover the error/edge paths (network failure, 401 refresh, validation).
|
|
design:
|
|
- Place new code in the correct FSD layer and justify the placement.
|
|
- Reuse existing shared/ui components and shared/api helpers before adding new ones.
|
|
- Note any new env vars, routes (ROUTES const), or React Query keys.
|
|
tasks:
|
|
- Break work into small, verifiable steps ordered by FSD dependency (shared → up).
|
|
- Include a "type-check passes (npm run build)" and "npm run lint" step; there are no automated tests.
|