# 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

# Copilot Instructions

## Code Style
- Use TypeScript strict mode for all new files
- Prefer functional components with hooks over class components
- Use named exports, not default exports

## Libraries
- Use date-fns for date manipulation (not moment.js)
- Use zod for runtime validation
- Prefer fetch over axios for HTTP requests

## Testing
- Write tests using Vitest
- Use Testing Library for component tests
- Aim for integration tests over unit tests

## Conventions
- Use camelCase for variables, PascalCase for components
- Prefix interfaces with I (e.g., IUserProps)
- Keep files under 300 lines; extract if longer