agent skills

These are the Cursor Agent Skills I wrote while building this site — each one encodes a convention or pattern the AI agent needs to produce correct, consistent code in this codebase.

Browse them below, click through to read and copy any skill in full, or grab the raw markdown from /llm/skills/<slug> for AI-friendly consumption. Source repo: github.com/1chooo/skills.

project foundation

foundation

I wanted a single source of truth for the project conventions that every AI agent session could start from — stack, routing, code placement, and design tokens in one place.

route groupscode placement guideimport conventionsdesign system tokens
view skill →
📁.cursor/skills/
📁1chooo-project/
📄SKILL.md

next.js app router

routing

Next.js 16 has breaking changes from older versions. This skill captures the exact patterns that work — async params, proxy.ts instead of middleware, and full-bleed escape hatch.

async paramsproxy.ts authserver/client splitfull-bleed escape
view skill →
📁.cursor/skills/
📁nextjs-app-router/
📄SKILL.md

applies to

app/**/*.{ts,tsx}

api routes

routing

Consistent API routes mean the AI can generate handlers that immediately match the project's auth, validation, and error response patterns without manual correction.

requireUser()Zod validationSupabase queriesresponse shapes
view skill →
📁.cursor/skills/
📁api-routes/
📄SKILL.md

applies to

app/api/**/*.ts

types & constants

data

Mixing types and constants causes circular imports and blurs the boundary between data shapes and runtime logic. This rule kept the codebase clean across 237 TypeScript files.

types/ vs lib/ splitservice type foldersNavItem collision fixbarrel exports
view skill →
📁.cursor/skills/
📁types-and-constants/
📄SKILL.md

applies to

**/*.{ts,tsx}

auth & supabase

data

Supabase has multiple client modes (server, browser, service-role). Getting the wrong one causes subtle bugs — RLS bypass, missing cookies, or browser-only code on the server.

client matrixrequireUser()cookie optionsCORS setup
view skill →
📁.cursor/skills/
📁utils-auth-supabase/
📄SKILL.md

applies to

utils/**/*.ts
proxy.ts

mdx content

content

MDX frontmatter in this project is a JS export, not YAML. The demo registration pipeline (component → index → mdx-components.tsx) needs to follow a specific order to avoid SSR issues.

JS frontmatterscaffolding commandsdemo registrationLLM routes
view skill →
📁.cursor/skills/
📁mdx-content/
📄SKILL.md

applies to

app/(home)/(article)/**/*.{mdx,tsx}

article components

content

Interactive demos need a consistent visual container so readers can focus on the concept, not UI inconsistencies. The two-column shell and rurikon palette create a cohesive look across all articles.

two-column shellbutton variantsrurikon color palettedemo file structure
view skill →
📁.cursor/skills/
📁article-components/
📄SKILL.md

applies to

components/articles/**/*.tsx

shared ui primitives

ui

The project uses the unified radix-ui package (not @radix-ui/react-*) and a custom Dialog API with lowercase titles. Getting these wrong means styles silently diverge.

radix-ui packageDialog/ConfirmDialogSonner placementChart wrapper
view skill →
📁.cursor/skills/
📁components-ui/
📄SKILL.md

applies to

components/ui/**/*.tsx

services ui

ui

All authenticated services share a lowercase, monospace aesthetic. Consistent button states and dialog patterns make each new service feel native to the suite.

lowercase copymono buttonsworkspace shellclient fetch
view skill →
📁.cursor/skills/
📁services-ui/
📄SKILL.md

applies to

app/(services)/**/*.tsx

confirm dialogs & toasts

ui

window.confirm() breaks the visual design and is not customizable. Every destructive action gets a Radix-based confirm dialog; every mutation result gets a Sonner toast.

ConfirmDialogSonner toastsdestructive patternstock category rule
view skill →
📁.cursor/skills/
📁services-confirm-toasts/
📄SKILL.md

applies to

app/(services)/**/*.tsx

admin ui

ui

Radix TabsTrigger active-state overrides fail silently with Tailwind. Plain buttons with useState give predictable, debuggable behavior and match the minimal admin aesthetic.

plain button tabssquare cornersactive/inactive statesno Radix Tabs
view skill →
📁.cursor/skills/
📁admin-ui/
📄SKILL.md

applies to

app/(admin)/**/*.tsx