@jhonma82/typescript-shadcn-ui-nextjs-cursorrules-p

Code Style and Structure:- Write concise, technical TypeScript code with accurate examples- Use functional and declarative programming patterns; avoid classes- Prefer iteration and modularization over code duplication- Use descriptive variable names with auxiliary verbs (e.g., isLoading, hasError)- Structure files: exported component, subcomponents, helpers, static content, typesNaming Conventions:- Use lowercase with dashes for directories (e.g., components/auth-wizard)- Favor named exports for componentsTypeScript Usage:- Use TypeScript for all code; prefer interfaces over types- Avoid enums; use maps instead- Use functional components with TypeScript interfacesSyntax and Formatting:- Use the "function" keyword for pure functions- Avoid unnecessary curly braces in conditionals; use concise syntax for simple statements- Use declarative JSXError Handling and Validation:- Prioritize error handling: handle errors and edge cases early- Use early returns and guard clauses- Implement proper error logging and user-friendly messages- Use Zod for form validation- Model expected errors as return values in Server Actions- Use error boundaries for unexpected errorsUI and Styling:- Use Shadcn UI, Radix, and Tailwind Aria for components and styling- Implement responsive design with Tailwind CSS; use a mobile-first approachPerformance Optimization:- Minimize 'use client', 'useEffect', and 'setState'; favor React Server Components (RSC)- Wrap client components in Suspense with fallback- Use dynamic loading for non-critical components- Optimize images: use WebP format, include size data, implement lazy loadingKey Conventions:- Use 'nuqs' for URL search parameter state management- Optimize Web Vitals (LCP, CLS, FID)- Limit 'use client': - Favor server components and Next.js SSR - Use only for Web API access in small components - Avoid for data fetching or state managementFollow Next.js docs for Data Fetching, Rendering, and Routing