| name | code-review |
| description | This skill should be used when the user asks to "review code",
"check code quality", "find improvements", "refactor code",
"fix code issues", "perform code review", "check for bugs",
"improve code", "analyze code", "review PR", "review pull request",
"コードレビュー", "コードをチェック", "改善点を探す",
"リファクタリング", "コード品質を確認", "バグを探す",
"コードを改善", "PR をレビュー", "プルリクエストをレビュー",
or needs guidance on code review best practices for Swift and TypeScript.
|
| version | 1.0.0 |
Code Review
Comprehensive code review skill using codex-cli for analysis, with Claude Code applying fixes automatically.
Overview
Review Engine: codex-cli (via Bash)
Fix Engine: Claude Code (Edit tool)
Supported Languages:
- Swift 5.9+ (iOS 17+, SwiftUI, SwiftData)
- TypeScript 5.x+ (Next.js 14+, React 18+)
Core Capabilities:
- Use codex-cli to identify code quality issues
- Parse codex-cli output for structured feedback
- Claude Code automatically applies fixes
Default Behavior (No Arguments)
When /code-review is invoked without specifying a file or directory:
- Get changed files from
git diff master...HEAD --name-only
- Filter to only
.swift, .ts, .tsx files
- Run codex-cli to review each changed file
- Parse output and present issues
- Apply fixes with Claude Code's Edit tool
git diff master...HEAD --name-only | grep -E '\.(swift|ts|tsx)$'
Usage Examples
/code-review # Review all changes vs master
/code-review path/to/file.swift # Review specific file
/code-review handheld/Sources/ # Review directory
Codex-CLI Integration
Step 1: Prepare Review Prompt
Create a structured prompt for codex-cli:
codex -q "Review this code for issues. Output in JSON format with fields: file, line, severity (Critical/High/Medium/Low), category, description, current_code, suggested_fix. File: <filename>
$(cat path/to/file.swift)"
Step 2: Run Codex-CLI
Execute codex-cli via Bash tool:
codex -q "You are a Swift code reviewer. Review for:
- Memory leaks (retain cycles in closures)
- Missing @MainActor for UI updates
- Force unwrap without safety
- Performance issues
- SwiftUI best practices
Output JSON array of issues. Each issue: {file, line, severity, category, description, current_code, suggested_fix}
$(cat handheld/Sources/path/to/File.swift)"
codex -q "You are a TypeScript code reviewer. Review for:
- any type usage
- Missing useEffect dependencies
- Unnecessary re-renders
- Type safety issues
- Next.js/React best practices
Output JSON array of issues. Each issue: {file, line, severity, category, description, current_code, suggested_fix}
$(cat web/src/path/to/file.tsx)"
Step 3: Parse and Present Issues
Parse the JSON output from codex-cli and present to user:
## Issue #1: [Description]
- **File**: path/to/file.swift:42
- **Severity**: Critical | High | Medium | Low
- **Category**: Memory | Type Safety | Performance | Style
- **Current Code**: (from codex output)
- **Suggested Fix**: (from codex output)
Step 4: Apply Fixes (Claude Code)
After user confirmation ("Fix All" or specific issue numbers):
- Use Edit tool to apply each fix from codex-cli's suggestions
- Run linter/tests to verify
Step 5: Verify
cd handheld && make test
cd web && npm run lint && npm run type-check
Quick Reference
Codex-CLI Commands
codex -q "Review this Swift code: $(cat file.swift)"
codex -q "Check for memory leaks in: $(cat file.swift)"
for f in $(git diff master --name-only | grep '\.swift$'); do
echo "=== $f ==="
codex -q "Review: $(cat $f)"
done
Expected JSON Output Format
[
{
"file": "ViewModel.swift",
"line": 42,
"severity": "High",
"category": "Concurrency",
"description": "Missing @MainActor for class with @Observable",
"current_code": "@Observable\nclass ViewModel {",
"suggested_fix": "@Observable\n@MainActor\nclass ViewModel {"
}
]
Swift Code Review
Critical Checks
| Category | Check | Severity |
|---|
| Memory | No retain cycles in closures | Critical |
| Concurrency | @MainActor for UI updates | Critical |
| Safety | No force unwrapping without safety | High |
| Performance | Avoid unnecessary @State changes | Medium |
| Style | Consistent naming conventions | Low |
Common Issues and Fixes
1. Force Unwrap Without Safety
let user = users.first!
guard let user = users.first else {
return
}
2. Missing @MainActor for UI Updates
@Observable
class ViewModel {
var items: [Item] = []
func loadItems() async {
items = try await api.fetchItems()
}
}
@Observable
@MainActor
class ViewModel {
var items: [Item] = []
func loadItems() async {
items = try await api.fetchItems()
}
}
3. Retain Cycle in Closure
class ViewModel {
var onComplete: (() -> Void)?
func setup() {
onComplete = {
self.doSomething()
}
}
}
class ViewModel {
var onComplete: (() -> Void)?
func setup() {
onComplete = { [weak self] in
self?.doSomething()
}
}
}
For more Swift patterns, see references/swift-checklist.md.
TypeScript Code Review
Critical Checks
| Category | Check | Severity |
|---|
| Type Safety | No any types without justification | High |
| Null Safety | Proper optional chaining | High |
| React | No missing dependencies in useEffect | Critical |
| Performance | Memoization where needed | Medium |
| Next.js | Correct use of 'use client' | High |
Common Issues and Fixes
1. Using any Type
const data: any = await fetchData();
console.log(data.user.name);
interface User {
id: string;
name: string;
}
interface ApiResponse {
user: User;
}
const data: ApiResponse = await fetchData();
console.log(data.user.name);
2. Missing useEffect Dependencies
function Component({ userId }: { userId: string }) {
const [user, setUser] = useState<User | null>(null);
useEffect(() => {
fetchUser(userId).then(setUser);
}, []);
return <div>{user?.name}</div>;
}
function Component({ userId }: { userId: string }) {
const [user, setUser] = useState<User | null>(null);
useEffect(() => {
fetchUser(userId).then(setUser);
}, [userId]);
return <div>{user?.name}</div>;
}
3. Unnecessary Re-renders
function Component() {
const options = { size: 'large', color: 'blue' };
return <Child options={options} />;
}
const OPTIONS = { size: 'large', color: 'blue' } as const;
function Component() {
return <Child options={OPTIONS} />;
}
function Component({ color }: { color: string }) {
const options = useMemo(() => ({ size: 'large', color }), [color]);
return <Child options={options} />;
}
For more TypeScript patterns, see references/typescript-checklist.md.
Running Linters
Swift
cd handheld && swiftlint
swiftlint --fix
make test
TypeScript
cd web
npm run lint
npm run type-check
npm run lint -- --fix
npm run lint && npm run type-check && npm run build
Severity Levels
| Level | Description | Action |
|---|
| Critical | Crashes, data loss, security issues | Must fix immediately |
| High | Bugs, type errors, memory leaks | Should fix before merge |
| Medium | Performance, maintainability | Consider fixing |
| Low | Style, minor improvements | Optional |
CI/CD Integration
iOS (GitHub Actions)
The project runs make test which includes:
- Build verification
- Unit tests execution
Web (GitHub Actions)
The project runs:
npm run lint (ESLint)
npm run type-check (TypeScript)
npm run build (Production build)
Additional Resources
References
Examples