From claude-toolkit
Opt-in code review on your changed files — refactoring nudges with pros/cons, DTO insights with mermaid diagrams for PR descriptions
How this skill is triggered — by the user, by Claude, or both
Slash command
/claude-toolkit:code-insightsThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
After finishing a first draft. Not a gate — a colleague looking at your diff.
After finishing a first draft. Not a gate — a colleague looking at your diff.
Trigger: user says "check my changes", "run code insights", /code-insights, or answers yes to "Want to run a quick refactoring check?"
Ask:
I can check your changed files. What would you like?
- Quick nudges — small improvements on your diff (2 min)
- Deep insights — DTO analysis + mermaid diagrams for PR description (5 min)
- Both
git diff --name-only main...HEAD 2>/dev/null || git diff --name-only HEAD~1
Split into frontend (.ts/.tsx) and backend (.cs) files.
Frontend (.tsx/.ts) — React 19 aware
NOTE: React 19 with React Compiler handles memoization automatically. Do NOT suggest useMemo/useCallback/React.memo — the compiler does this. Focus on things the compiler can't fix:
| Pattern | Look for | Why it matters |
|---|---|---|
| Async waterfall | Sequential await a(); await b(); where independent | Double wait time. Use Promise.all |
| Computation in JSX | .sort()/.filter()/.reduce() chains in the return statement | Readability issue. Extract to a named const above the return |
| Inline function in JSX loop | {items.map(i => <Item onClick={() => handle(i)} />)} | Not a perf issue in React 19 (compiler), but readability — extract if complex |
| Missing error boundary | New page/route component without error handling | One crash takes down the whole page |
| Barrel imports | import { X } from './index' or from '@/ui' | Pulls in entire module. Direct import is tree-shakeable |
| Large component (> 150 lines) | Single file keeps growing | Split into smaller components or custom hooks |
| Hardcoded magic values | if (items.length > 50) | Extract to named constant |
| Missing key or index key | key={index} on dynamic lists | Causes bugs on reorder/delete. Use stable ID |
| New dependency imported | New import from node_modules | Check bundle impact — is it tree-shakeable? How big? |
Backend (.cs) — .NET patterns
| Pattern | Look for | Why it matters |
|---|---|---|
| Sequential awaits | await a; await b; when independent | Use Task.WhenAll for parallel |
| Missing AsNoTracking | Read queries without .AsNoTracking() | ~30% slower for reads |
| N+1 query | Loop with await inside, or lazy loading in API | Use .Include() or batch |
| Unbounded query | .ToListAsync() without .Take() or pagination | Can return millions of rows |
| Large method (> 30 lines) | Method doing too many things | Split into well-named privates |
| Catch-all exception | catch (Exception) { return null; } | Catch specific, log, handle |
| String concat in loop | result += item in foreach | Use StringBuilder |
| New HttpClient | new HttpClient() in method | Socket exhaustion. Use IHttpClientFactory |
| Blocking async | .Result or .Wait() | Thread pool starvation |
| Missing CancellationToken | Async method without token param | Can't cancel long operations |
| Entity in API response | Returning EF entity directly from controller | Leaks DB schema. Use DTO |
| Missing validation | Public endpoint without input validation | Add FluentValidation |
If the changed files include:
React.lazy), check bundle impactMax 5-7, highest impact first:
📌 UserList.tsx:42 — Async waterfall
Now: const user = await getUser(id); const posts = await getPosts(id);
Better: const [user, posts] = await Promise.all([getUser(id), getPosts(id)])
✅ Why: Halves the wait time — these are independent requests
⏭️ Skip if: Second call depends on first result
End with:
These are suggestions, not requirements. Want me to apply any of them?
git diff main...HEAD --stat
git diff main...HEAD --name-only
Look for:
Dto, Request, Response, ViewModelModels/, Entities/ directories[Table] attribute❓ [ClassName] — [what changed]
Current: [key properties]
Proposed: [what's added/removed/changed]
Pros:
+ [concrete benefit]
+ [concrete benefit]
Cons:
- [concrete risk]
Alternative:
→ [different approach if one exists]
Only if relevant to actual changes:
Data flow (API endpoint changes):
flowchart LR
Client -->|POST /api/resource| Controller
Controller -->|CreateDto| Service
Service -->|Entity| Repository
Repository -->|SQL| Database
Entity relationships (model changes):
erDiagram
EntityA ||--o{ EntityB : has
EntityB }|--|| EntityC : belongs_to
Cross-service impact (multiple services touched):
flowchart TB
subgraph Changed
ServiceA
end
subgraph Affected
ServiceB
end
ServiceA -->|event| ServiceB
🤔 Questions for reviewers:
1. [Design choice question]
Context: [why it matters]
2. [Trade-off question]
Context: [what's at stake]
Copyable block:
## Architecture Insights
### Data Flow
[mermaid diagram if relevant]
### Changes
| File | What changed | Impact |
|------|-------------|--------|
| [file] | [change] | [breaking/non-breaking/new] |
### DTO Analysis
[questions with pros/cons]
### Questions for Reviewers
[numbered list]
Here's the architecture insights section. Want me to paste it into the PR description?
# React 19 + TypeScript + perf + security review guides
# Already installed at ~/.claude/skills/code-review-skill
# Trail of Bits — security analysis scoped to your changed files
# Already installed at ~/.claude/skills/trailofbits-differential-review
# Official Claude Code review — 4 parallel agents, diff-only
# Built-in: /code-review
npx claudepluginhub johwer/marketplace --plugin claude-toolkitGuides creation, editing, and verification of skills for AI coding agents using test-driven development with subagent scenarios. Use when authoring or debugging skills.