@modeloslab/modelcode 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +73 -0
- package/SPEC.md +127 -0
- package/agents/code-reviewer.md +49 -0
- package/agents/debugger.md +25 -0
- package/agents/explore.md +22 -0
- package/agents/general-purpose.md +25 -0
- package/agents/plan.md +28 -0
- package/agents/researcher.md +26 -0
- package/agents/security-auditor.md +44 -0
- package/dist/BrowserWebSocketTransport-e6g854ra.mjs +8 -0
- package/dist/LaunchOptions-d24f2e73.mjs +8 -0
- package/dist/NodeWebSocketTransport-s3fsfh3j.mjs +9 -0
- package/dist/bidi-fwqajnyx.mjs +17261 -0
- package/dist/cli.mjs +1669 -0
- package/dist/devtools-fkz8mzpk.mjs +83 -0
- package/dist/fileFromPath-s8scncrt.mjs +128 -0
- package/dist/helpers-667kxskd.mjs +17 -0
- package/dist/index-4706p1xh.mjs +3238 -0
- package/dist/index-gp8nzd9n.mjs +1561 -0
- package/dist/main-0r35eyef.mjs +16229 -0
- package/dist/main-2aqyq9g6.mjs +24239 -0
- package/dist/main-5vqwebnv.mjs +54 -0
- package/dist/main-7f2pnmhh.mjs +2901 -0
- package/dist/main-7jta7ark.mjs +57 -0
- package/dist/main-8y3fe7c3.mjs +48 -0
- package/dist/main-9w13grbs.mjs +41 -0
- package/dist/main-d71btkt1.mjs +2478 -0
- package/dist/main-h8e68gyt.mjs +2819 -0
- package/dist/main-p2xnn95s.mjs +2240 -0
- package/dist/main-qfprs50h.mjs +1629 -0
- package/dist/main-tqg5vhra.mjs +19 -0
- package/dist/puppeteer-core-qdv3v3fq.mjs +1486 -0
- package/dist/tui-0r2q70wm.mjs +23768 -0
- package/package.json +66 -0
- package/skills/commit/SKILL.md +34 -0
- package/skills/debug/SKILL.md +44 -0
- package/skills/docker/SKILL.md +18 -0
- package/skills/init/SKILL.md +36 -0
- package/skills/nextjs-app-router/SKILL.md +16 -0
- package/skills/nextjs-data-fetching/SKILL.md +16 -0
- package/skills/nextjs-env-config/SKILL.md +18 -0
- package/skills/nextjs-metadata-seo/SKILL.md +17 -0
- package/skills/nextjs-middleware/SKILL.md +18 -0
- package/skills/nextjs-performance/SKILL.md +17 -0
- package/skills/nextjs-route-handler/SKILL.md +18 -0
- package/skills/nextjs-server-actions/SKILL.md +17 -0
- package/skills/nextjs-server-components/SKILL.md +18 -0
- package/skills/power-ui/SKILL.md +40 -0
- package/skills/pr/SKILL.md +38 -0
- package/skills/refactor/SKILL.md +40 -0
- package/skills/remember/SKILL.md +39 -0
- package/skills/review/SKILL.md +22 -0
- package/skills/security-review/SKILL.md +21 -0
- package/skills/simplify/SKILL.md +47 -0
- package/skills/skill-create/SKILL.md +37 -0
- package/skills/test/SKILL.md +34 -0
- package/skills/vercel-deploy/SKILL.md +16 -0
package/package.json
ADDED
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@modeloslab/modelcode",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "modelOS-native AI coding agent CLI — remembers like Hermes, codes like Claude Code, runs on modelOS (pay-per-use in MDL, no rate limits). Knowledge-graph memory, subagents, MCP, vision, spend caps.",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"bin": {
|
|
7
|
+
"modelcode": "dist/cli.mjs"
|
|
8
|
+
},
|
|
9
|
+
"files": [
|
|
10
|
+
"dist",
|
|
11
|
+
"agents",
|
|
12
|
+
"skills",
|
|
13
|
+
"README.md",
|
|
14
|
+
"SPEC.md"
|
|
15
|
+
],
|
|
16
|
+
"scripts": {
|
|
17
|
+
"dev": "bun run src/cli/main.ts",
|
|
18
|
+
"build": "bun run scripts/build.ts",
|
|
19
|
+
"typecheck": "tsc --noEmit",
|
|
20
|
+
"test": "bun test",
|
|
21
|
+
"start": "node dist/cli.mjs",
|
|
22
|
+
"smoke": "bun run build && node dist/cli.mjs config",
|
|
23
|
+
"prepublishOnly": "bun run typecheck && bun test && bun run build"
|
|
24
|
+
},
|
|
25
|
+
"engines": {
|
|
26
|
+
"node": ">=22.5.0"
|
|
27
|
+
},
|
|
28
|
+
"os": [
|
|
29
|
+
"darwin",
|
|
30
|
+
"linux"
|
|
31
|
+
],
|
|
32
|
+
"publishConfig": {
|
|
33
|
+
"access": "public"
|
|
34
|
+
},
|
|
35
|
+
"keywords": [
|
|
36
|
+
"ai",
|
|
37
|
+
"coding-agent",
|
|
38
|
+
"cli",
|
|
39
|
+
"llm",
|
|
40
|
+
"modelos",
|
|
41
|
+
"claude-code",
|
|
42
|
+
"agent",
|
|
43
|
+
"mcp",
|
|
44
|
+
"pay-per-use"
|
|
45
|
+
],
|
|
46
|
+
"dependencies": {
|
|
47
|
+
"@noble/curves": "^1.9.7",
|
|
48
|
+
"@noble/hashes": "^1.8.0",
|
|
49
|
+
"@scure/base": "^1.2.6",
|
|
50
|
+
"@scure/bip32": "^1.7.0",
|
|
51
|
+
"@scure/bip39": "^1.6.0",
|
|
52
|
+
"@scure/btc-signer": "^1.8.1",
|
|
53
|
+
"ink": "^7.1.0",
|
|
54
|
+
"openai": "^4.77.0",
|
|
55
|
+
"puppeteer-core": "^25.1.0",
|
|
56
|
+
"react": "^19.2.7",
|
|
57
|
+
"zod": "^3.23.8"
|
|
58
|
+
},
|
|
59
|
+
"devDependencies": {
|
|
60
|
+
"@types/better-sqlite3": "^7.6.11",
|
|
61
|
+
"@types/bun": "^1.1.14",
|
|
62
|
+
"@types/react": "^19.2.17",
|
|
63
|
+
"typescript": "^5.7.2"
|
|
64
|
+
},
|
|
65
|
+
"license": "MIT"
|
|
66
|
+
}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: commit
|
|
3
|
+
description: Stage changes, write a clear conventional-commit message grounded in the diff, and commit. Never pushes unless asked.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Commit: Stage and Commit
|
|
7
|
+
|
|
8
|
+
## Goal
|
|
9
|
+
Produce one clean, conventional commit whose message accurately reflects the diff.
|
|
10
|
+
|
|
11
|
+
## Steps
|
|
12
|
+
|
|
13
|
+
### 1. Inspect
|
|
14
|
+
Run `git status` and `git diff` (and `git diff --staged`). Understand what actually changed and why
|
|
15
|
+
before writing anything.
|
|
16
|
+
**Success criteria**: you can describe the change in one sentence.
|
|
17
|
+
|
|
18
|
+
### 2. Stage deliberately
|
|
19
|
+
If nothing is staged, stage the relevant files — do NOT blindly `git add -A`. Exclude junk, build
|
|
20
|
+
artifacts, debug scratch, and anything secret-looking (`.env`, keys, tokens). If the changes are
|
|
21
|
+
logically separate concerns, prefer splitting into multiple commits.
|
|
22
|
+
**Success criteria**: the staged set is exactly the intended change.
|
|
23
|
+
|
|
24
|
+
### 3. Write the message
|
|
25
|
+
Conventional-commit subject ≤ ~72 chars: `feat:` / `fix:` / `refactor:` / `docs:` / `test:` / `chore:` /
|
|
26
|
+
`perf:` (+ optional scope). Imperative mood. Add a short body explaining the **why** when it's not
|
|
27
|
+
obvious from the subject. Match the repo's existing commit style if it has one.
|
|
28
|
+
|
|
29
|
+
### 4. Commit
|
|
30
|
+
Commit, then show `git log -1` to confirm. Do NOT push unless the user explicitly asks. If a commit hook
|
|
31
|
+
fails, fix the issue (or report it) rather than bypassing with `--no-verify`.
|
|
32
|
+
|
|
33
|
+
## Notes
|
|
34
|
+
Never commit secrets — if you spot one in the diff, stop and warn instead of committing.
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: debug
|
|
3
|
+
description: Systematically root-cause a bug, failing test, or unexpected behavior and apply the minimal fix. Use for "X is broken", a stack trace, a failing test, or wrong output.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Debug: Root-Cause and Fix
|
|
7
|
+
|
|
8
|
+
## Goal
|
|
9
|
+
Find and fix the ROOT cause, not the symptom — via hypothesis and evidence, never guess-and-change.
|
|
10
|
+
|
|
11
|
+
## Steps
|
|
12
|
+
|
|
13
|
+
### 1. Reproduce
|
|
14
|
+
Run the failing command/test via bash; capture the exact error + full stack. If you can't reproduce it,
|
|
15
|
+
stop and get the exact steps/inputs/env from the user first — a fix you can't verify is a guess.
|
|
16
|
+
**Success criteria**: you can trigger the failure on demand.
|
|
17
|
+
|
|
18
|
+
### 2. Localize
|
|
19
|
+
Read the code at the failure site AND one level up the call chain. Narrow to the smallest region that
|
|
20
|
+
must contain the cause. Form ONE concrete hypothesis ("X is null because Y returns early when Z").
|
|
21
|
+
**Success criteria**: a single, testable hypothesis.
|
|
22
|
+
|
|
23
|
+
### 3. Confirm
|
|
24
|
+
Prove the hypothesis before changing anything — a focused log/assertion, reading the actual state, or a
|
|
25
|
+
minimal probe. If it's wrong, return to step 2 with what you learned. Don't fix on a hunch.
|
|
26
|
+
**Success criteria**: evidence the hypothesis is the actual cause.
|
|
27
|
+
|
|
28
|
+
### 4. Fix minimally
|
|
29
|
+
Make the smallest change that addresses the confirmed cause. No scope creep, no drive-by refactors.
|
|
30
|
+
If the real fix is bigger than the ask (design flaw, missing abstraction), say so and propose it rather
|
|
31
|
+
than papering over it.
|
|
32
|
+
|
|
33
|
+
### 5. Verify
|
|
34
|
+
Re-run the repro → green. Run the surrounding test suite to confirm you didn't break neighbors. Remove
|
|
35
|
+
any temporary probes you added.
|
|
36
|
+
**Success criteria**: repro passes, suite green.
|
|
37
|
+
|
|
38
|
+
### 6. Report
|
|
39
|
+
Root cause → the fix → verification output, in 2–3 lines.
|
|
40
|
+
|
|
41
|
+
## Heisenbugs (intermittent / can't-reproduce)
|
|
42
|
+
Check ordering/races, async timing, shared mutable state, uninitialized values, env differences
|
|
43
|
+
(versions, locale, timezone), and test pollution (state leaking between tests). Add logging to capture
|
|
44
|
+
the bad run rather than trying to catch it live.
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: docker
|
|
3
|
+
description: Containerize or run an app with Docker — write a correct, slim Dockerfile, .dockerignore, and compose, or build/run/debug containers. Use for "dockerize this", build failures, or local container runs. (Hermes DevOps.)
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
Produce correct, production-lean containers.
|
|
7
|
+
|
|
8
|
+
- **Dockerfile**: multi-stage (build stage → slim runtime); pin a specific base tag; copy only what's
|
|
9
|
+
needed; install deps before copying source (cache layers); run as a **non-root** user; set a
|
|
10
|
+
`HEALTHCHECK`; `EXPOSE` the port; use exec-form `CMD ["...", "..."]`.
|
|
11
|
+
- **.dockerignore**: exclude node_modules, .git, build artifacts, secrets, .env — keeps the build
|
|
12
|
+
context small and avoids leaking secrets.
|
|
13
|
+
- **compose**: define services + networks + volumes; never bake secrets into the image (use env/secrets).
|
|
14
|
+
- **Run/debug**: `docker build -t app .` then `docker run --rm -p ...`; for failures read the build log
|
|
15
|
+
(usually a missing dep or wrong path), and `docker logs` / `exec -it sh` to inspect a running container.
|
|
16
|
+
|
|
17
|
+
Verify: image builds, container starts + passes its healthcheck, app reachable on the mapped port. Keep
|
|
18
|
+
the final image small (check `docker images`).
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: init
|
|
3
|
+
description: Generate a MODELCODE.md describing this codebase — structure, build/test/run commands, conventions — so future sessions start with accurate project context.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Init: Generate Project Context
|
|
7
|
+
|
|
8
|
+
## Goal
|
|
9
|
+
Produce a concise, ACCURATE `MODELCODE.md` at the repo root that gives every future session the context
|
|
10
|
+
it needs to work correctly here. This file is loaded as context every session, so every line must earn
|
|
11
|
+
its place and be true.
|
|
12
|
+
|
|
13
|
+
## Steps
|
|
14
|
+
|
|
15
|
+
### 1. Explore
|
|
16
|
+
glob/grep/read the signal files: package manifests (`package.json`, `pyproject.toml`, `go.mod`, `Cargo.toml`),
|
|
17
|
+
README, CI config, lockfiles, and the `src` layout. Identify the language(s), framework(s), runtime, and
|
|
18
|
+
package manager.
|
|
19
|
+
**Success criteria**: you can state what the project is and how it's built without guessing.
|
|
20
|
+
|
|
21
|
+
### 2. Verify the commands
|
|
22
|
+
Don't copy commands blindly — confirm them against the actual scripts/config (e.g. `package.json`
|
|
23
|
+
scripts, Makefile, CI). Wrong commands here are worse than none.
|
|
24
|
+
**Success criteria**: build/test/run/lint commands are the ones this repo actually uses.
|
|
25
|
+
|
|
26
|
+
### 3. Write MODELCODE.md
|
|
27
|
+
- **Overview**: one paragraph — what the project is and does.
|
|
28
|
+
- **Commands**: exact build / test / run / lint / typecheck commands.
|
|
29
|
+
- **Layout**: the important directories and what lives in each (not every file).
|
|
30
|
+
- **Conventions**: style, patterns, and do/don'ts the agent must follow (e.g. "bun not npm",
|
|
31
|
+
"diff-based edits", naming rules) — pull real conventions from the code, don't invent.
|
|
32
|
+
- **Gotchas**: anything non-obvious that would trip up a change (codegen, required env, monorepo quirks).
|
|
33
|
+
|
|
34
|
+
### 4. Keep it lean
|
|
35
|
+
Concise > exhaustive. If a CLAUDE.md / AGENTS.md already exists, build on it rather than duplicating.
|
|
36
|
+
Confirm the file was written.
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: nextjs-app-router
|
|
3
|
+
description: Scaffold or work with the Next.js App Router (app/ dir) — pages, layouts, nested routes, loading/error/not-found states. Use for new routes or restructuring a Next.js app.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
Work in the **App Router** (`app/`), not the legacy `pages/`. Core conventions:
|
|
7
|
+
- `app/<route>/page.tsx` = a route's UI; `layout.tsx` = shared shell (persists across navigation);
|
|
8
|
+
`loading.tsx` = Suspense fallback; `error.tsx` (must be a Client Component) = error boundary;
|
|
9
|
+
`not-found.tsx` = 404. Route groups `(group)/` organize without affecting the URL.
|
|
10
|
+
- Components are **Server Components by default**; add `"use client"` only where you need state, effects,
|
|
11
|
+
or browser APIs. Keep client components small + at the leaves.
|
|
12
|
+
- Dynamic segments: `app/blog/[slug]/page.tsx` → `params.slug`. Use `generateStaticParams` for SSG.
|
|
13
|
+
- Colocate components/tests next to routes; share UI via a top-level `components/`.
|
|
14
|
+
|
|
15
|
+
Steps: confirm the route tree, create `page.tsx` (server) + a `layout.tsx` if shared, add
|
|
16
|
+
`loading`/`error` where useful, wire links with `next/link`. Verify with `next build` / `next lint`.
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: nextjs-data-fetching
|
|
3
|
+
description: Fetch + cache data correctly in the Next.js App Router — static vs dynamic, fetch cache options, revalidation (ISR), tags, and Suspense streaming. Use when adding/fixing data loading or stale data.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
Fetch directly in Server Components (`const data = await fetch(...)` / DB call). Control caching:
|
|
7
|
+
- `fetch(url)` is cached by default. Opt out per-request with `{ cache: "no-store" }` (dynamic) or set
|
|
8
|
+
time-based ISR with `{ next: { revalidate: 60 } }`. Tag for on-demand invalidation:
|
|
9
|
+
`{ next: { tags: ["posts"] } }` → later `revalidateTag("posts")`.
|
|
10
|
+
- Route-level: `export const revalidate = 60` (ISR) or `export const dynamic = "force-dynamic"`.
|
|
11
|
+
- Parallelize independent fetches (`Promise.all`) to avoid request waterfalls. Use `generateStaticParams`
|
|
12
|
+
for SSG of dynamic routes.
|
|
13
|
+
- Stream slow data: wrap in `<Suspense fallback={...}>` so the shell renders immediately.
|
|
14
|
+
|
|
15
|
+
Diagnose stale/slow data: check the cache option + revalidate, confirm tags are invalidated on mutation,
|
|
16
|
+
and look for accidental waterfalls. Verify with `next build` (it prints which routes are static/dynamic).
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: nextjs-env-config
|
|
3
|
+
description: Manage environment variables + config safely in Next.js — .env files, NEXT_PUBLIC_ exposure rules, server-only secrets, runtime vs build-time, typed env. Use when adding config/keys or fixing "undefined env".
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
Env rules that prevent leaks and "undefined in the browser":
|
|
7
|
+
- Files: `.env.local` (local secrets, gitignored), `.env` (defaults, committed if non-secret),
|
|
8
|
+
`.env.production`. NEVER commit real secrets.
|
|
9
|
+
- **Exposure**: only vars prefixed `NEXT_PUBLIC_` are sent to the browser (inlined at build). Everything
|
|
10
|
+
else is **server-only** — reading a non-public var in a Client Component yields `undefined`. Keep API
|
|
11
|
+
keys server-side (Server Components, Route Handlers, Server Actions).
|
|
12
|
+
- Public vars are inlined at BUILD time → rebuild after changing them. Server vars are read at runtime.
|
|
13
|
+
- Validate at startup with zod (a small `env.ts` that parses `process.env`) so missing/invalid config
|
|
14
|
+
fails fast with a clear message instead of a runtime `undefined`.
|
|
15
|
+
- Mark server-only modules with `import "server-only"`.
|
|
16
|
+
|
|
17
|
+
Fix "undefined env": confirm the prefix (needs `NEXT_PUBLIC_` for client), the file is loaded, and you
|
|
18
|
+
rebuilt. Verify with a typed `env.ts` that throws on missing keys.
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: nextjs-metadata-seo
|
|
3
|
+
description: Add SEO + social metadata in the Next.js App Router — the Metadata API, dynamic generateMetadata, Open Graph/Twitter cards, sitemap & robots. Use for titles, descriptions, sharing previews, indexing.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
Use the **Metadata API** (no manual `<head>` tags):
|
|
7
|
+
- Static: `export const metadata: Metadata = { title, description, openGraph, twitter }` in a
|
|
8
|
+
`layout.tsx` or `page.tsx`. Use a title template in the root layout:
|
|
9
|
+
`title: { default: "Site", template: "%s · Site" }`.
|
|
10
|
+
- Dynamic: `export async function generateMetadata({ params }): Promise<Metadata>` — fetch and build
|
|
11
|
+
per-page title/description/OG image.
|
|
12
|
+
- Social images: `opengraph-image.tsx` (or `.png`) in a route generates the OG card; same for
|
|
13
|
+
`twitter-image`. Use `next/og` `ImageResponse` for dynamic cards.
|
|
14
|
+
- Indexing: `app/sitemap.ts` (export default returning the URL list) and `app/robots.ts`.
|
|
15
|
+
- Set `metadataBase` in the root layout so relative OG image URLs resolve.
|
|
16
|
+
|
|
17
|
+
Verify: view source for correct `<title>`/`og:` tags; test the OG card with a preview tool.
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: nextjs-middleware
|
|
3
|
+
description: Add Next.js middleware (middleware.ts) for auth gating, redirects/rewrites, headers, and edge logic that runs before a request completes. Use for protecting routes, A/B, locale, or setting headers.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
`middleware.ts` at the project root runs on the Edge before matched requests. Keep it FAST and light
|
|
7
|
+
(no heavy deps, no DB) — it's on the hot path.
|
|
8
|
+
|
|
9
|
+
- Export `middleware(req: NextRequest)` returning `NextResponse.next()`, `.redirect(url)`,
|
|
10
|
+
`.rewrite(url)`, or a response with headers/cookies set.
|
|
11
|
+
- Scope it with `export const config = { matcher: ["/dashboard/:path*"] }` so it only runs where needed
|
|
12
|
+
(exclude `_next`, static assets).
|
|
13
|
+
- **Auth gating**: read the session cookie/token, redirect unauthenticated users to `/login`. Do a cheap
|
|
14
|
+
presence/JWT check here; do full verification in the page/handler.
|
|
15
|
+
- Also good for: setting security headers, locale/geo rewrites, maintenance mode, simple A/B.
|
|
16
|
+
|
|
17
|
+
Verify: hit a protected route logged-out (should redirect) and logged-in (should pass); confirm the
|
|
18
|
+
matcher doesn't accidentally run on assets.
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: nextjs-performance
|
|
3
|
+
description: Optimize a Next.js app's performance — next/image, next/font, dynamic import/code-splitting, bundle analysis, reducing client JS, Core Web Vitals. Use when the app is slow, heavy, or has layout shift.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
High-leverage Next.js performance moves:
|
|
7
|
+
- **Images**: use `next/image` (auto resize/lazy/AVIF); always set width/height (or `fill`) to avoid CLS;
|
|
8
|
+
add `priority` to the LCP image.
|
|
9
|
+
- **Fonts**: `next/font` (self-hosted, zero layout shift) instead of `<link>` to Google Fonts.
|
|
10
|
+
- **Less client JS**: keep components as Server Components; move `"use client"` to leaves; `dynamic(() =>
|
|
11
|
+
import(...), { ssr: false })` for heavy/below-the-fold client widgets.
|
|
12
|
+
- **Data**: parallelize fetches, cache/ISR appropriately (see nextjs-data-fetching), stream slow parts
|
|
13
|
+
with Suspense.
|
|
14
|
+
- **Bundle**: run the analyzer (`@next/bundle-analyzer`) to find big deps; replace/trim them.
|
|
15
|
+
|
|
16
|
+
Process: measure first (Lighthouse / `next build` output / analyzer), fix the biggest offenders (LCP
|
|
17
|
+
image, fonts, oversized client bundles), re-measure. Target good LCP/CLS/INP.
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: nextjs-route-handler
|
|
3
|
+
description: Build a Next.js API endpoint with App Router Route Handlers (app/api/.../route.ts) — GET/POST/etc, request parsing, JSON/streaming responses, status codes. Use for backend endpoints/webhooks.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
Create `app/api/<name>/route.ts` exporting async functions named for HTTP methods (`GET`, `POST`, `PUT`,
|
|
7
|
+
`DELETE`, `PATCH`). Use the Web `Request`/`Response` (and `NextRequest`/`NextResponse` for helpers).
|
|
8
|
+
|
|
9
|
+
Patterns:
|
|
10
|
+
- Read input: `await req.json()`, `req.nextUrl.searchParams`, headers via `req.headers`.
|
|
11
|
+
- Respond: `NextResponse.json(data, { status })`. Set proper status codes (400 bad input, 401/403 auth,
|
|
12
|
+
404, 500). Validate input (zod) before use.
|
|
13
|
+
- Dynamic: `app/api/items/[id]/route.ts` → second arg `{ params }`.
|
|
14
|
+
- Caching: route handlers are dynamic by default for non-GET; force with `export const dynamic =
|
|
15
|
+
"force-dynamic"` / `revalidate`. For streaming, return a `ReadableStream` with the right headers.
|
|
16
|
+
- Webhooks: read the RAW body for signature verification before parsing.
|
|
17
|
+
|
|
18
|
+
Verify: hit it with curl, check status + shape; add error handling so failures return clean JSON, not 500 HTML.
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: nextjs-server-actions
|
|
3
|
+
description: Implement Next.js Server Actions for mutations and forms (no manual API route) — "use server", form actions, validation, revalidation, optimistic UI. Use for create/update/delete from the UI.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
Server Actions run on the server and are callable from components/forms without a separate API route.
|
|
7
|
+
|
|
8
|
+
- Define with `"use server"` (top of file for a module of actions, or inline in a Server Component).
|
|
9
|
+
- Wire to a form: `<form action={myAction}>`; read `FormData` in the action. Or call from a Client
|
|
10
|
+
Component (e.g. inside a transition). Actions must be async and take serializable args.
|
|
11
|
+
- ALWAYS validate input server-side (zod) and check authz — actions are public endpoints.
|
|
12
|
+
- After a mutation, call `revalidatePath("/path")` or `revalidateTag("tag")` so the UI reflects new data;
|
|
13
|
+
or `redirect()` to navigate.
|
|
14
|
+
- UX: use `useFormStatus` for pending state and `useOptimistic` for optimistic updates in client forms.
|
|
15
|
+
|
|
16
|
+
Steps: write the action (validate → mutate → revalidate/redirect), bind it to the form, add pending +
|
|
17
|
+
error states. Verify the mutation persists and the page refreshes without a full reload.
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: nextjs-server-components
|
|
3
|
+
description: Decide and implement Server vs Client Components correctly in Next.js — minimize client JS, keep data/secrets on the server. Use when a component needs state/effects, or when trimming bundle size.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
Default to **Server Components**. Reach for `"use client"` ONLY when the component needs: useState/
|
|
7
|
+
useReducer, useEffect/lifecycle, event handlers, browser-only APIs, or a client-only library.
|
|
8
|
+
|
|
9
|
+
Rules that prevent the common mistakes:
|
|
10
|
+
- Server Components can be async and fetch data directly (DB, secrets, `fetch`) — never ship secrets to
|
|
11
|
+
the client. Client Components cannot be async and must not import server-only code.
|
|
12
|
+
- Push `"use client"` to the LEAVES. A server parent can render client children and pass
|
|
13
|
+
serializable props (no functions/Dates that don't serialize). Pass Server Components to client ones
|
|
14
|
+
via `children`/slots instead of importing them inside client code.
|
|
15
|
+
- Shared server-only utilities: mark with `import "server-only"` so they can't leak into client bundles.
|
|
16
|
+
|
|
17
|
+
When converting: split the interactive bit into a small `"use client"` component, keep data-fetching +
|
|
18
|
+
composition in the server parent. Verify the client bundle didn't balloon (`next build` output).
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: power-ui
|
|
3
|
+
description: Design and build a genuinely premium UI — the kind that looks shipped by a top product team. Use for new screens/components, redesigns, or when a UI "works but looks generic". Produces a small design system + polished, accessible, responsive implementation.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
You are an elite product designer-engineer. Your job is to make interfaces that feel **considered,
|
|
7
|
+
calm, and premium** — not generic framework defaults. Taste is the deliverable. Work in the user's
|
|
8
|
+
existing stack; if none, default to clean semantic HTML + CSS (no heavy UI kit unless asked).
|
|
9
|
+
|
|
10
|
+
## Operating procedure
|
|
11
|
+
1. **Understand the job.** One line: who uses this, the one primary action, the emotional tone
|
|
12
|
+
(e.g. trustworthy / playful / serious). If unclear, ask ONE question, then proceed.
|
|
13
|
+
2. **Establish the system before the screen.** Define tokens first — never hardcode scattered values:
|
|
14
|
+
- **Type scale** (modular, ~1.2–1.25 ratio), 2 weights max, generous line-height (1.5 body).
|
|
15
|
+
- **Spacing scale** (4px base: 4/8/12/16/24/32/48/64) — consistent rhythm everywhere.
|
|
16
|
+
- **Color**: one neutral ramp (bg/surface/border/text-muted/text) + ONE accent. Check contrast.
|
|
17
|
+
- **Radius + shadow**: one radius family, soft layered shadows (not a single harsh drop).
|
|
18
|
+
- **Motion**: 150–250ms ease-out for hover/enter; respect `prefers-reduced-motion`.
|
|
19
|
+
3. **Layout with intent.** Strong grid, deliberate alignment, real whitespace. One clear visual
|
|
20
|
+
hierarchy (size → weight → color → position). Limit to ~2 emphasis levels per view.
|
|
21
|
+
4. **Implement to a high bar.** Semantic HTML, keyboard-navigable, visible focus rings, ARIA where
|
|
22
|
+
needed, AA contrast, responsive (mobile-first, fluid type/space), empty/loading/error states.
|
|
23
|
+
5. **Then polish — the 20% that signals quality:** optical alignment, hover/active/focus states on
|
|
24
|
+
every interactive element, micro-interactions, consistent icon weight, no orphan/overflow, dark
|
|
25
|
+
mode if the project has it. Pixel-check spacing.
|
|
26
|
+
6. **Verify.** Build/lint it; if there's a browser tool, render and sanity-check layout + a11y.
|
|
27
|
+
Summarize the design decisions in 3–4 bullets (tokens, hierarchy, motion, accessibility).
|
|
28
|
+
|
|
29
|
+
## Principles (Claude-grade taste)
|
|
30
|
+
- Restraint > decoration. Remove before you add. White space is a feature.
|
|
31
|
+
- Consistency is the whole game — reuse tokens; never one-off values.
|
|
32
|
+
- Default state should be beautiful AND every state designed (hover/active/disabled/empty/error/loading).
|
|
33
|
+
- Accessibility is not optional: contrast, focus, reduced-motion, semantics.
|
|
34
|
+
- Performance is design: no layout shift, fast first paint, lightweight.
|
|
35
|
+
|
|
36
|
+
## Anti-patterns to refuse
|
|
37
|
+
- Center-everything with no hierarchy; rainbow palettes; 5 font weights; harsh pure-black shadows;
|
|
38
|
+
tiny low-contrast gray text; emoji as UI icons; copy-pasted Bootstrap look; motion that can't be disabled.
|
|
39
|
+
|
|
40
|
+
Deliver the tokens + component/screen + a short rationale. Make it look like it shipped.
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: pr
|
|
3
|
+
description: Open a clean GitHub pull request from the current changes — branch, commit, push, and create the PR with a strong title + body via the gh CLI. Use to ship a change for review.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# PR: Ship a Pull Request
|
|
7
|
+
|
|
8
|
+
## Goal
|
|
9
|
+
Turn the working changes into one focused, reviewable PR with a body a reviewer can act on. Only do this
|
|
10
|
+
when the user asked to ship.
|
|
11
|
+
|
|
12
|
+
## Steps
|
|
13
|
+
|
|
14
|
+
### 1. Branch
|
|
15
|
+
If on the default branch (`main`/`master`), create a descriptive feature branch first:
|
|
16
|
+
`git switch -c <type>/<short-desc>`. NEVER open a PR from the default branch.
|
|
17
|
+
**Success criteria**: on a dedicated branch.
|
|
18
|
+
|
|
19
|
+
### 2. Commit
|
|
20
|
+
Review `git diff`, stage the relevant files (skip junk/secrets), and write a conventional commit
|
|
21
|
+
(`feat:`/`fix:`/…) with a short **why**. Split unrelated concerns into separate commits.
|
|
22
|
+
|
|
23
|
+
### 3. Push
|
|
24
|
+
`git push -u origin <branch>`.
|
|
25
|
+
|
|
26
|
+
### 4. Create the PR
|
|
27
|
+
`gh pr create` with:
|
|
28
|
+
- **Title**: conventional-commit style, concise.
|
|
29
|
+
- **Body**: ## Summary (what + why) · ## Changes (bullets) · ## Testing (how you verified) · ## Risk /
|
|
30
|
+
rollout (migrations, flags, breaking changes). Link issues with `Closes #123`.
|
|
31
|
+
**Success criteria**: a reviewer could understand and verify the change from the body alone.
|
|
32
|
+
|
|
33
|
+
### 5. Finish
|
|
34
|
+
Output the PR URL. Do NOT merge unless asked.
|
|
35
|
+
|
|
36
|
+
## Discipline
|
|
37
|
+
One logical change per PR — if the diff spans unrelated concerns, propose splitting it. Confirm the
|
|
38
|
+
target base branch if it's not obvious.
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: refactor
|
|
3
|
+
description: Safely restructure code without changing behavior — extract, rename, dedupe, simplify, improve types — backed by tests. Use for "clean up", "refactor X", or reducing complexity in a module.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Refactor: Behavior-Preserving Restructure
|
|
7
|
+
|
|
8
|
+
## Goal
|
|
9
|
+
Change structure, NOT behavior — safely and reversibly, with tests proving nothing changed.
|
|
10
|
+
|
|
11
|
+
## Steps
|
|
12
|
+
|
|
13
|
+
### 1. Pin behavior first
|
|
14
|
+
Ensure tests exist and pass for the code you'll touch. If coverage is thin, add a characterization test
|
|
15
|
+
that captures current behavior BEFORE refactoring — otherwise you can't prove you preserved it. Note the
|
|
16
|
+
existing behavior/contract.
|
|
17
|
+
**Success criteria**: a green test you can re-run after each change.
|
|
18
|
+
|
|
19
|
+
### 2. One transformation at a time
|
|
20
|
+
Apply a single named transformation, then run tests, then the next:
|
|
21
|
+
- extract function/component/module
|
|
22
|
+
- rename for clarity
|
|
23
|
+
- remove duplication (DRY) — but only real, drift-prone duplication, not incidental similarity
|
|
24
|
+
- simplify control flow (early returns, collapse nesting, guard clauses)
|
|
25
|
+
- tighten types (replace `any`/stringly-typed with precise types/unions)
|
|
26
|
+
- delete dead code
|
|
27
|
+
**Success criteria**: tests green after EVERY step (so a regression is bisectable to one change).
|
|
28
|
+
|
|
29
|
+
### 3. Match the codebase
|
|
30
|
+
Follow existing patterns, naming, and file layout. A refactor that introduces a new style is just churn.
|
|
31
|
+
|
|
32
|
+
### 4. Keep diffs reviewable
|
|
33
|
+
Prefer the diff-based `edit` tool; avoid sweeping rewrites that obscure what actually changed.
|
|
34
|
+
|
|
35
|
+
### 5. Verify
|
|
36
|
+
Tests green + typecheck/lint clean + behavior identical. Run the build.
|
|
37
|
+
|
|
38
|
+
## Discipline
|
|
39
|
+
Refuse scope creep. If you spot a real bug, call it out SEPARATELY — don't silently "fix" it inside a
|
|
40
|
+
refactor (that defeats the whole point of a behavior-preserving change and hides the fix from review).
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: remember
|
|
3
|
+
description: Save a durable fact to long-term memory (cross-session) — preferences, project facts, conventions, constraints. Dedupes against existing memory.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Remember: Save to Long-Term Memory
|
|
7
|
+
|
|
8
|
+
## Goal
|
|
9
|
+
Capture something worth recalling in a FUTURE session as a concise, well-categorized fact — and avoid
|
|
10
|
+
duplicating what's already stored.
|
|
11
|
+
|
|
12
|
+
## Steps
|
|
13
|
+
|
|
14
|
+
### 1. Distill the fact
|
|
15
|
+
Reduce what the user wants remembered to ONE clear sentence. Strip the conversational framing — store the
|
|
16
|
+
durable fact, not "the user said X today". Convert relative dates to absolute.
|
|
17
|
+
**Success criteria**: a standalone sentence that makes sense with no other context.
|
|
18
|
+
|
|
19
|
+
### 2. Categorize
|
|
20
|
+
Tag it: `[identity]` / `[role]` / `[project]` / `[preference]` / `[constraint]` / `[interest]`, or
|
|
21
|
+
`[style]` for tone/format preferences. Pick the single best fit.
|
|
22
|
+
|
|
23
|
+
### 3. Scope it
|
|
24
|
+
Decide if it's **global** (applies everywhere — who the user is, broad preferences) or **project-scoped**
|
|
25
|
+
(this repo's conventions, current work). Store with the right scope so recall surfaces it in the right
|
|
26
|
+
places.
|
|
27
|
+
|
|
28
|
+
### 4. Dedupe + write
|
|
29
|
+
Check existing memory first. If a similar fact exists, UPDATE it rather than adding a duplicate; if a new
|
|
30
|
+
fact contradicts an old one, replace the old. Otherwise add it to the modelcode memory store
|
|
31
|
+
(`~/.modelcode/memory.db`, FTS5).
|
|
32
|
+
**Success criteria**: exactly one current entry per fact, no duplicates.
|
|
33
|
+
|
|
34
|
+
### 5. Confirm
|
|
35
|
+
State what was saved (and its category/scope) in one line.
|
|
36
|
+
|
|
37
|
+
## Don't store
|
|
38
|
+
Secrets, anything already obvious from the repo/CLAUDE.md, or session-only context that won't matter next
|
|
39
|
+
time. When unsure whether something is durable, ask rather than cluttering memory.
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: review
|
|
3
|
+
description: Review the pending diff for correctness, security, and design issues. Delegates to the code-reviewer subagent; can apply agreed fixes.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Review: Diff Code Review
|
|
7
|
+
|
|
8
|
+
## Phase 1: Scope
|
|
9
|
+
Run `git diff` and `git diff --staged` for the working tree. If the user named a branch/PR, use
|
|
10
|
+
`git diff <base>...HEAD`. If there are no changes, review the files edited earlier in this conversation.
|
|
11
|
+
**Success criteria**: you have the complete diff to review.
|
|
12
|
+
|
|
13
|
+
## Phase 2: Review
|
|
14
|
+
Delegate to the **code-reviewer** subagent with the full diff (and enough surrounding context that
|
|
15
|
+
changes are judged in context, not in isolation). For a large/sensitive change, also run the
|
|
16
|
+
**security-auditor** subagent in parallel.
|
|
17
|
+
|
|
18
|
+
## Phase 3: Report (and optionally fix)
|
|
19
|
+
Present findings grouped by severity (CRITICAL → HIGH → MEDIUM → LOW → NIT), each with `file:line`, the
|
|
20
|
+
concrete trigger scenario, and the fix. End with the verdict (✅ ready / ⚠️ fix HIGH+CRITICAL first /
|
|
21
|
+
❌ not ready). If the user passed `--fix`, apply the agreed fixes with `edit` after showing them, skip
|
|
22
|
+
false positives without arguing, then re-run the build/tests to confirm.
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: security-review
|
|
3
|
+
description: Security review of the pending changes (or a target path) — finds exploitable vulnerabilities with attack scenarios. Delegates to the security-auditor subagent.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Security Review
|
|
7
|
+
|
|
8
|
+
## Phase 1: Scope the attack surface
|
|
9
|
+
Get the diff (`git diff` / `git diff --staged`) or the target path. Identify where untrusted input
|
|
10
|
+
enters and what sensitive actions/data the changes can reach.
|
|
11
|
+
**Success criteria**: you know the entry points and sinks touched by the change.
|
|
12
|
+
|
|
13
|
+
## Phase 2: Audit
|
|
14
|
+
Delegate to the **security-auditor** subagent with the diff + context. It traces tainted data
|
|
15
|
+
source→sink and checks: injection (SQL/shell/path/template), authn/authz + IDOR, secrets handling,
|
|
16
|
+
SSRF, unsafe deserialization, crypto misuse, input limits/DoS, supply chain, and web vulns (XSS/CSRF).
|
|
17
|
+
|
|
18
|
+
## Phase 3: Report
|
|
19
|
+
Group by severity (CRITICAL → HIGH → MEDIUM → LOW/INFO). Per finding: `file:line`, the concrete
|
|
20
|
+
**attack scenario** (steps/payload), the **impact**, and the **fix**. Flag only real, exploitable
|
|
21
|
+
issues — no theoretical noise. If the user asks, apply the remediations with `edit` after showing them.
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: simplify
|
|
3
|
+
description: Clean up the changed code for reuse, quality, and efficiency — no bug hunting, no behavior change. Launches parallel review agents, then applies the fixes.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Simplify: Code Review and Cleanup
|
|
7
|
+
|
|
8
|
+
Review all changed files for reuse, quality, and efficiency, then fix what's found. Do NOT change
|
|
9
|
+
behavior and do NOT hunt for bugs (that's `/review`).
|
|
10
|
+
|
|
11
|
+
## Phase 1: Identify changes
|
|
12
|
+
Run `git diff` (and `git diff --staged`). If there are no git changes, review the files you edited
|
|
13
|
+
earlier in this conversation or that the user named.
|
|
14
|
+
**Success criteria**: you have the full diff in context.
|
|
15
|
+
|
|
16
|
+
## Phase 2: Review in parallel (three angles)
|
|
17
|
+
Launch three **subagent** reviews concurrently (one message), passing each the full diff:
|
|
18
|
+
|
|
19
|
+
### Agent 1 — Reuse
|
|
20
|
+
1. Search for existing utilities/helpers that could replace newly written code (utility dirs, shared
|
|
21
|
+
modules, files adjacent to the change).
|
|
22
|
+
2. Flag any new function duplicating existing functionality → name the existing one to use.
|
|
23
|
+
3. Flag inline logic that should use an existing util (hand-rolled string/path handling, ad-hoc env
|
|
24
|
+
checks, custom type guards).
|
|
25
|
+
|
|
26
|
+
### Agent 2 — Quality
|
|
27
|
+
1. Redundant state (duplicates existing state, derivable cached values, effects that could be direct calls).
|
|
28
|
+
2. Parameter sprawl (new params instead of restructuring).
|
|
29
|
+
3. Copy-paste with slight variation → unify with a shared abstraction.
|
|
30
|
+
4. Leaky abstractions / broken encapsulation.
|
|
31
|
+
5. Stringly-typed code where a constant/union/branded type already exists.
|
|
32
|
+
6. Unnecessary nesting/wrappers that add no value.
|
|
33
|
+
7. Unnecessary comments — narrating WHAT or the change/task → delete; keep only non-obvious WHY.
|
|
34
|
+
|
|
35
|
+
### Agent 3 — Efficiency
|
|
36
|
+
1. Unnecessary work (redundant compute, repeated reads, duplicate calls, N+1).
|
|
37
|
+
2. Missed concurrency (independent ops run sequentially).
|
|
38
|
+
3. Hot-path bloat (new blocking work in startup / per-request / per-render).
|
|
39
|
+
4. Recurring no-op updates in loops/intervals → add a change-detection guard.
|
|
40
|
+
5. Existence pre-checks before operating (TOCTOU) → operate and handle the error.
|
|
41
|
+
6. Memory: unbounded structures, missing cleanup, listener leaks.
|
|
42
|
+
7. Overly broad ops (reading whole files / loading all when one is needed).
|
|
43
|
+
|
|
44
|
+
## Phase 3: Apply
|
|
45
|
+
Aggregate the findings and fix each directly with `edit`, matching surrounding style. If a finding is a
|
|
46
|
+
false positive or not worth it, skip it — don't argue. Re-run the build/tests if behavior could be
|
|
47
|
+
affected (it shouldn't be). Summarize what you simplified.
|