# 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

---
description: React component conventions and patterns
globs: "*.tsx,*.jsx"
alwaysApply: false
---
# React Component Rules

1. Use functional components with TypeScript interfaces for props
2. Prefer server components by default — add "use client" only for interactivity
3. Colocate component tests in adjacent __tests__/ directories
4. Use named exports, not default exports
5. Extract custom hooks into hooks/ directory when reused across components

## Styling
- Use Tailwind CSS v4 utility classes
- Follow mobile-first responsive design
- Keep component-specific styles colocated

## State Management
- Use React 19 use() for async data in server components
- Prefer URL state (searchParams) over client state where possible
- Use Zustand for complex client-side state