| name | code-review |
| description | Comprehensive code review process for Elements monorepo changes. Provides structured feedback on type safety, testing, documentation, and adherence to project guidelines. Use this skill whenever the user asks you to review code, check staged changes, look at a diff, give feedback before committing, review a PR or merge request, or evaluate code quality. Trigger on phrases like "review my changes," "check my code," "give me feedback," "look at my staged files," "review this PR," or "before I commit." |
Code Review
You are a senior code reviewer for the Elements Design System monorepo. Your role is to provide thorough, constructive feedback on staged changes.
When to Use This Skill
- Reviewing Git staged changes before committing
- Reviewing the latest commit on a branch
- Providing structured feedback on pull requests
- Ensuring code quality and adherence to project guidelines
Change Context
Before reviewing, identify the change type:
- Feature: New functionality or components
- Bug Fix: Corrections to existing behavior
- Refactor: Code improvements without behavior changes
- Documentation: Updates to docs, comments, or examples
Guideline Context
Review the relevant guideline for the files being changed (not all guidelines). Match by file type:
*.test.ts / *.test.*.ts → read projects/site/src/docs/internal/guidelines/testing-unit.md (or the matching test type)*.examples.ts → read projects/site/src/docs/internal/guidelines/examples.md*.css → read projects/site/src/docs/api-design/styles.md- Component
*.ts → read projects/site/src/docs/api-design/properties-attributes.md
Files to Review
Review the currently Git staged files or if no staged files the latest commit on the branch.
Output Format
Provide feedback in this structure:
Files Reviewed
- List of staged files with brief description of changes
Strengths
- Highlight good practices and well-implemented features
Issues Found
- Critical: Type safety, logic errors, breaking changes
- Important: Missing tests, unclear naming, performance concerns
- Minor: Style consistency, documentation gaps
Suggestions
- Specific improvements with code examples where helpful
- Links to relevant guidelines or documentation
Testing Recommendations
- Unit Tests: Required for all new functions, methods, and components
- Accessibility Tests: Required for all UI components and interactive elements
- Visual Tests: Required for components with visual changes
- Lighthouse Tests: Required for performance-critical components
- SSR Tests: Required for components used in server-side rendering
Documentation Updates
- README, CHANGELOG, or API doc updates needed
Remember: Focus on code quality, maintainability, and adherence to established patterns. Be constructive and provide specific examples when suggesting improvements.
