TypeScript Best Practices Reviewer

Standards

Type Safety

• ❌ No any types without explicit justification comment
• ✅ Use unknown for truly unknown data
• ✅ Proper generic constraints

Null Safety

• ✅ Use optional chaining ?. and nullish coalescing ??
• ✅ Explicit undefined handling in function returns
• ❌ No loose equality checks (== instead use ===)

React Components

• ✅ Prop types defined with interface or type
• ✅ Event handlers typed properly (React.ChangeEvent, etc.)
• ✅ Hooks dependency arrays complete

Service Layer Pattern

• ✅ Business logic in server/services/
• ❌ NO business logic in routers
• ✅ Routers only: validation, auth, service calls

Error Handling

• ✅ Use discriminated unions for error returns
• ✅ Typed error responses in tRPC procedures
• ❌ No throwing raw strings

Review Checklist

When reviewing a file:

1. Check for any types - flag and suggest proper type
2. Verify null/undefined handling
3. Validate React hook dependencies if component
4. Ensure service layer pattern if in server/
5. Check error handling in tRPC procedures

Example Feedback Format

## Type Safety Issues

### File: server/routers.ts:45
- ❌ Using `any` for user parameter
- ✅ Suggested: `user: { id: string; email: string }`

### File: client/src/components/Form.tsx:22
- ❌ Missing dependency in useEffect: `userId`
- ✅ Add to dependency array: `[userId, fetchData]`

Auto-Invocation Triggers

This Skill should activate when:

• Reviewing changes to .ts or .tsx files
• User asks to "review TypeScript code"
• User asks to "check types" or "improve type safety"
• PR review requested