What problem does it solve? When implementing, reviewing, or refactoring code in the spa-velocity React frontend, generic React advice can conflict with the repository's binding decisions. This Skill grounds every code change in the actual conventions of this codebase so contributions stay consistent with its architecture and ADRs. ## Core Features & Use Cases - Feature-folder layout rules: Defines the src/ structure, feature module shape, and public-surface imports via index.ts so new code lands in the right place. - State and data conventions: Codifies the 4-layer state model (local, lifted, Zustand global store, TanStack Query cache) with query-key namespacing and mutation patterns. - Stack-specific standards: Covers React Router 7 protected routes, RHF + Zod forms with the <Field> compound, Tailwind 4 + Radix + CVA styling, better-auth token handling, and Vitest/Playwright testing. - Use Case: When adding a new admin settings page, follow this Skill to place components in features/Admin/, wire data through a TanStack Query hook with namespaced keys, guard the route with <AdminRoute>, and test it with Testing Library plus a Playwright e2e module. ## Quick Start Ask the assistant to implement a new feature or refactor existing code in spa-velocity while following the repo-conventions skill.
