next-ai-starter Cursor Rules

# .cursorrules

Components & Naming

- Use functional components with `"use client"` if needed.
- Name in PascalCase under `src/components/`.
- Keep them small, typed with interfaces.
- Use Tailwind for common UI components like textarea, button, etc. Never use radix or shadcn.

Prisma

- Manage DB logic with Prisma in `prisma/schema.prisma`, `src/lib/db.ts`.
- snake_case table → camelCase fields.
- No raw SQL; run `npx prisma migrate dev`, never use `npx prisma db push`.

Icons

- Prefer `lucide-react`; name icons in PascalCase.
- Custom icons in `src/components/icons`.

Toast Notifications

- Use `react-toastify` in client components.
- `toast.success()`, `toast.error()`, etc.

Next.js Structure

- Use App Router in `app/`. Server components by default, `"use client"` for client logic.
- NextAuth + Prisma for auth. `.env` for secrets.

tRPC Routers

- Routers in `src/lib/api/routers`, compose in `src/lib/api/root.ts`.
- `publicProcedure` or `protectedProcedure` with Zod.
- Access from React via `@/lib/trpc/react`.

TypeScript & Syntax

- Strict mode. Avoid `any`.
- Use optional chaining, union types (no enums).

File & Folder Names

- Next.js routes in kebab-case (e.g. `app/dashboard/page.tsx`).
- Shared types in `src/lib/types.ts`.
- Sort imports (external → internal → sibling → styles).

Tailwind Usage

- Use Tailwind (mobile-first, dark mode with dark:(class)). Extend brand tokens in `tailwind.config.ts`.
- For animations, prefer Framer Motion.

Inngest / Background Jobs

- Use `inngest.config.ts` for Inngest configuration.
- Use `src/app/api/inngest/route.ts` for Inngest API route.
- Use polling to update the UI when Inngest events are received, not trpc success response.

AI

- Use `generateChatCompletion` in `src/lib/aiClient.ts` for all AI calls.
- Prefer `GPT-5` model for all AI calls.

Storybook

- Place stories in `src/stories` with `.stories.tsx` extension.
- One story file per component, matching component name.
- Use autodocs for automatic documentation.
- Include multiple variants and sizes in stories.
- Test interactive features with actions.
- Use relative imports from component directory.

Agent Helpers

- Refer to the `agent-helpers` folder for additional instructions and tools.
- Use the `agent-helpers` folder to store any files that you want future agents to have access to.
- Start with `agent-helpers/README.md` for instructions.

Additional

- Keep code short; commits semantic.
- Reusable logic in `src/lib/utils/shared.ts` or `src/lib/utils/server.ts`.
- Use `tsx` scripts for migrations.

IMPORTANT:

- After all changes are made, ALWAYS build the project with `npm run build`. Ignore warnings, fix errors.