Cursor rule

1---
2description: Rules for working with the React project in the /frontend folder
3globs: fastapi_react_app/frontend/**/*
4alwaysApply: false
5---
6This project should use the modern, concise, and best practices for building React 18+ with TypeScript
7 
8# Primary Libraries
9 
10See [package.json](mdc:fastapi_react_app/frontend/package.json) for the specific libraries and versions you should use!
11When making recommendations, make sure you are referencing the correct verions! Double check your work.
12 
13- Mantine (the latest version, >= v.7) for the UI
14- Tailwind CSS (the latest version, >= v.4) for styling if you can't do this with Mantine (always prefer Mantine)
15- TanStack Router
16- TanStack Query
17- Zustand, 
18- react-hook-form
19- Zod
20- automatic generation of typescript types for my OpenAPI compatible fastAPI backend in `../backend.py`
21 
22# Rules
23 
24- Use TypeScript for all code. Prefer interfaces over types. Avoid enums, use const objects or maps.
25- Use recommended practices routing with TanStack Router
26- Prefer using just Mantine for the UI but also apply tailwind CSS as needed.
27- Implement responsive, mobile-first design with Mantine.
28- Use lowercase with dashes for directories (e.g., components/auth-wizard).
29- Optimize images: Use WebP format, include size data, implement lazy loading.
30- Use Zustand for state management.
31- Use Zod for form validation and input schema definition.
32- Use fetch API, Axios, or TanStack Query (React Query) for data fetching where appropriate
33- Implement error boundaries using error.tsx and global-error.tsx files.
34- Ensure all components meet WCAG 2.1 AA standards.
35- Use Prettier for consistent code formatting.