ramu-narasinga

Use when creating API requests, data fetching hooks, or mutations. Defines the single API client pattern, react-query query/mutation structures, Zod validation, and data prefetching.

Use when building any UI component. Defines component organization, composition patterns, Tailwind CSS styling, ShadCN UI patterns, form abstractions, and Storybook conventions.

Use when building, deploying, or setting up CI/CD pipelines. Covers platform recommendations, environment variables, build configuration, CDN caching, and preview deployments.

Use when implementing error boundaries, API error handling, or production error tracking. Covers centralized API error interceptors, multi-level error boundaries, React Query error states, and Sentry integration.

Use when optimizing application performance. Covers route-level code splitting, component/state render optimizations, lazy loading, data prefetching, image optimization, and Web Vitals monitoring.

Use when configuring linting, formatting, naming conventions, or project tooling. Covers ESLint rules, Prettier config, TypeScript strict mode, Husky pre-commit hooks, absolute imports, and file naming conventions.

Use when creating new features, files, or folders. Defines the feature-driven directory layout, unidirectional import rules, and file placement decisions.

Use when implementing auth flows, route protection, role-based access control, or XSS prevention. Covers JWT auth, react-query-auth, RBAC/PBAC, and input sanitization.

Complete project structure and file organization guide for the `apps/platform` Next.js workspace. Use when creating new files, adding features, placing API routes, defining database schemas, or deciding where any new code belongs. Triggers on questions about where to put files, how to name things, or how the platform codebase is organized.

API layer guide for the `apps/platform` workspace. Use when adding new API endpoints, creating tRPC routers, writing client services, or wiring up data fetching from stores or components. Triggers on any task involving API calls, tRPC procedures, server-side data access, or client-side service methods.

Error handling guide for the `apps/platform` workspace. Use when adding error boundaries, catching API/tRPC errors, showing error toasts, capturing exceptions with Sentry, logging with Pino, or wiring instrumentation. Triggers on any task involving error handling, error tracking, logging, or user-facing error feedback.

Performance guide for the `apps/platform` workspace. Use when optimising re-renders, splitting code, lazy-loading components or images, memoising expensive computations, deferring saves with debounce, or monitoring web vitals. Triggers on any task involving React performance, loading speed, bundle size, or rendering efficiency.

Security guide for the `apps/platform` workspace. Use when implementing authentication, protecting routes, guarding tRPC procedures, working with Supabase RLS policies, or using the service-role client. Triggers on any task involving auth, sessions, protected resources, row-level security, or token handling.

State management guide for the `apps/platform` workspace using Zustand. Use when creating new stores, adding state slices, writing store actions, selecting state in components, or wiring up data fetching from the API layer into global state. Triggers on any task involving Zustand stores, global state, store actions, selectors, or hooks that read from stores.

React component development guide for the `apps/platform` workspace. Use when creating new components, building UI, deciding where to place a component, styling with Tailwind, using @thinkthroo/ui primitives, or working with modals, forms, tables, and navigation. Triggers on any component creation or modification task.

React SPA codebase architecture guide. Use when scaffolding a new feature, placing files, wiring up an API hook, adding a Zustand store, protecting a route, handling errors, or optimising performance. Covers the complete vertical slice from API to UI using a feature-driven architecture. Triggers on any task involving project structure, API design, state management, security, components, error handling, performance, deployment, or testing in a React + Vite + React Query codebase.