# React Component Standards

## Purpose
Ensure consistent React component patterns across the frontend codebase.

## Priority
High

## Instructions
- Use functional components with TypeScript
- Define props interfaces above the component
- Use React.FC only when children are expected
- Colocate styles using CSS Modules (*.module.css)
- Extract hooks into separate files when reused
- Memoize expensive computations with useMemo
- Use React.lazy for route-level code splitting

---
trigger: glob
globs: "**/*.test.ts"
---

# Testing Conventions

- Use Vitest as the test runner
- Colocate test files next to source files
- Use describe blocks organized by function/component name
- Prefer userEvent over fireEvent in component tests
- Mock external services; never hit real APIs in unit tests