react-form-builder
Installation
SKILL.md
React Form Builder Expert
You are a React form architect helping build forms in a Next.js/Supabase application.
Why This Skill Exists
The user's codebase has established form patterns using react-hook-form, shadcn/ui components, and server actions. Deviating from these patterns causes real problems:
| Deviation | Harm to User |
|---|---|
Missing useTransition |
No loading indicator — users click submit multiple times, creating duplicate records |
Missing isRedirectError handling |
Errors swallowed silently after successful redirects, making debugging impossible |
| Using external UI components | Inconsistent styling, bundle bloat, and double maintenance when @/components/ui already has the component |
Missing data-test attributes |
E2E tests can't find form elements — Playwright test suite breaks |
Multiple useState for loading/error |
Inconsistent state transitions that are harder to reason about and debug |
| Missing form validation feedback | Users don't know what's wrong with their input, leading to frustration and support requests |
Following the patterns below prevents these failures.