Code Review Lewisperez999 V0 Lewis Perez P

Code Review

Perform code reviews following project standards.

Description

Review code changes for quality, security, performance, and adherence to project conventions.

Checklist

TypeScript

• No any types without justification
• Interfaces defined for all props and data shapes
• Proper error handling with typed errors
• Exports include types alongside functions

React/Next.js

• Server Components used by default
• 'use client' only where necessary
• Proper use of Suspense for loading states
• No unnecessary re-renders
• Accessible (semantic HTML, ARIA)

Security

• No hardcoded secrets or API keys
• Input validated with Zod
• SQL queries are parameterized
• Auth checks on protected endpoints
• XSS prevention (no dangerouslySetInnerHTML with user content)

Performance

• Images optimized (next/image)
• Lazy loading for heavy components
• Database queries are indexed
• No N+1 query problems
• Appropriate caching

Code Style

• Consistent naming conventions
• Files named correctly (PascalCase for components, kebab-case for utils)
• Imports use @/ aliases
• No commented-out code
• Clear, descriptive variable names

API Routes

• Proper HTTP status codes
• Error responses are consistent
• Rate limiting for public endpoints
• Request/response typed
• Logging for errors

Database

• Migrations are reversible
• Indexes on frequently queried columns
• Foreign key constraints where appropriate
• No raw SQL concatenation

Review Template

## Code Review: [PR/Change Title]

### Summary
Brief description of the changes.

### Checklist
- [x] TypeScript types are correct
- [x] Security considerations addressed
- [ ] Performance optimized
- [x] Tests added/updated

### Issues Found

#### Critical
- None

#### Major
- [ ] Issue description - file:line

#### Minor
- [ ] Suggestion - file:line

### Suggestions
- Consider using X instead of Y
- Could extract into reusable function

### Approved: Yes/No

Common Issues

TypeScript

// ❌ Bad: Using any
const data: any = await fetchData();

// ✅ Good: Typed response
interface ApiResponse {
  id: string;
  name: string;
}
const data: ApiResponse = await fetchData();

Security

// ❌ Bad: SQL injection risk
const result = await query(`SELECT * FROM users WHERE id = ${userId}`);

// ✅ Good: Parameterized query
const result = await query('SELECT * FROM users WHERE id = $1', [userId]);

React

// ❌ Bad: Unnecessary client component
'use client';
export function StaticContent() {
  return <div>Just static content</div>;
}

// ✅ Good: Server component (no directive needed)
export function StaticContent() {
  return <div>Just static content</div>;
}

Performance

// ❌ Bad: Fetching in loop
for (const id of ids) {
  const item = await query('SELECT * FROM items WHERE id = $1', [id]);
}

// ✅ Good: Batch query
const items = await query('SELECT * FROM items WHERE id = ANY($1)', [ids]);