Cursor Rules: React + TypeScript

Rules Include

Components

• Functional components only (no class components)
• Props interfaces (not type) with descriptive names
• React.FC avoided — use explicit return types
• Component files: one component per file, named exports

Hooks

• Custom hooks for shared logic (prefix with use)
• useMemo/useCallback only for measured performance issues
• useReducer for complex state, useState for simple

TypeScript

• Strict mode enabled
• Discriminated unions for component variants
• Generic components when type flexibility needed
• as const for literal types

Testing

• React Testing Library (not Enzyme)
• Test behavior, not implementation
• userEvent over fireEvent