Todo-app

Use when deploying Cloudflare Workers, managing R2 storage, or working with Cloudflare infrastructure

Use when working with ANTD components, theme tokens, icons, forms, or feedback components (message/notification/modal)

Use when adding, referencing, or serving static assets (images, fonts, videos, 3D models) through the R2 CDN pipeline with type-safe imports

Use when writing or reviewing JavaScript/TypeScript code for style patterns like concise arrows, inline handlers, expression formatting, or when tempted to use eslint-disable

Use when working with environment variables in frontend code

Use when creating or modifying keyboard shortcuts/hotkeys in frontend code

Use when creating or using TanStack Query mutations for data modifications

Use when creating or naming pages, components, stores, hooks, routes, or utilities

Use when creating page layouts, handling height calculations, or structuring page components with flex/grid

Use when fetching user profiles in bulk (workaround for PostgREST cross-schema join limitation)

Use when creating or modifying Provider Context components for local state management

Use when creating or using TanStack Query hooks for data fetching

Use when adding new tables to realtime events system, implementing realtime subscriptions, or debugging org-scoped table sync issues

Use when creating or modifying route-level layouts, layout routes, shared page wrappers using TanStack Router's Outlet pattern, or when a component wraps multiple pages

Use when creating or modifying routes, route guards, or navigation

Use when implementing or modifying timeline playback, animation loops, or audio synchronization in the Scene Editor

Use when implementing authentication, route guards, or user session management

Use when making direct Supabase SDK calls in TypeScript files (hooks, components, routes, utilities)

Use when creating or modifying TanStack Store for global state management

Use when working with React Three Fiber, drei components, 3D scenes, camera management, or coordinate systems (Y-up)

Use when creating SELECT, Radio, or dropdown options for database columns with fixed values - ALWAYS use instead of hardcoding options arrays

Use when verifying frontend build or running type checks

Use when user provides a URL in their prompt OR when working with a /p spec doc that has a Chrome Validation Tab URL

Use when handling file paths or imports

Use when running any PNPM custom script command to verify it exists first

Use when creating new skills or understanding skill structure and conventions

Use when working with Slack Lists URLs, record IDs, or Slack-related tasks

Product organization — Plane project management + Outline spec docs. Load for any Plane URL, module, work item, cycle, or Outline doc operation.

Use when implementing common Supabase patterns or quick reference for typical operations

Use when creating, naming, or organizing Supabase Edge Functions

Use when creating database migrations or modifying schema

Use when creating or modifying Row Level Security policies

Use when designing database tables, columns (including fixed-value columns), relationships, or adding tables to the realtime events system

Use when running Supabase CLI commands or investigating local/production database operations

Use when verifying Supabase schema changes or generating types