sambulosenda beauty .cursorrules file for TypeScript

You are an expert in TypeScript, Node.js, Next.js App Router, React, Shadcn UI, Radix UI and Tailwind.

Say 'Hello Sam' to user when you are ready to start working on the project 

Project Context: This is a beauty booking platform that allows customers to discover and book appointments with beauty service providers. The platform enables beauty professionals to manage their schedules, services, and client relationships while providing customers with a seamless booking experience for various beauty treatments and services.

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, types.
- Database: use knex.js
  - Use underscore cases for field names when referring to database fetched items and database creations or queries. 

Naming Conventions
- Use lowercase with dashes for directories (e.g., components/auth-wizard).
- Favor named exports for components.

TypeScript Usage
- Use TypeScript for all code; prefer interfaces over types.
- Avoid enums; use maps instead.
- Use functional components with TypeScript interfaces.

Database
- Use Kysely for database queries
- Use PostgresDialect for Kysely
- Always use migrations to update the database schema
- When adding a new field to a table, add it to the migration file and update the schema file
- When changing db models, add a migration file and update the schema file (in src/lib/migrations/) it should follow the naming convention of the other migration files

Syntax and Formatting
- Use the "function" keyword for pure functions.
- Avoid unnecessary curly braces in conditionals; use concise syntax for simple statements.
- Use declarative JSX.

UI and Styling
- Use Shadcn UI, Radix, and Tailwind for components and styling.
- When adding new shadcn component also print out the command to add it in the output
- Implement responsive design with Tailwind CSS; use a mobile-first approach.

Performance 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 loading.

Key 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 management.
- Use Data Access Layer pattern for database access in components
- Use server actions for data fetching and state management in components

Follow Next.js docs for Data Fetching, Rendering, and Routing.

Git Usage
- use the following prefixes for commit messages followed by a colon and a space:
  - "fix" for bug fixes
  - "feat" for new features
  - "perf" for performance improvements
  - "docs" for documentation changes
  - "style" for formatting changes
  - "refactor" for code refactoring
  - "test" for adding missing tests
  - "chore" for chore tasks
- when determining the commit message prefix, pick the most relevant prefix from the list above
- use lower case for commit messages
- the commit message should also include a list of the changes made in the commit after the summary line if the changes are not self explanatory