Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 14 additions & 14 deletions .github/workflows/claude-code-review.yml
Original file line number Diff line number Diff line change
Expand Up @@ -56,10 +56,10 @@ jobs:
track_progress: true
prompt: |
You are reviewing code changes for a React component library with git diffs included in the prompt. Focus on ensuring the changes are sound, clean, intentional, and void of regressions.

REPO: ${{ github.repository }}
PR NUMBER: ${{ github.event.pull_request.number }}

Context:
- This is a frontend React component library published to npm as @zenml-io/react-component-library
- Uses TypeScript, Tailwind CSS, Radix UI primitives, Vitest for testing, and Storybook for documentation
Expand All @@ -68,52 +68,52 @@ jobs:
- gh pr view ${{ github.event.pull_request.number }} --json title,body,author,headRefName,baseRefName,commits
- gh pr diff ${{ github.event.pull_request.number }} --name-only
- Use the repository's CLAUDE.md (if present) and existing code patterns for conventions.

Primary Review Goals:

1) Verify Change Correctness
- Confirm the changes achieve their intended purpose
- Check for unintended side effects or regressions in component behavior
- Validate edge cases are handled properly (empty states, loading states, error states)
- Ensure error paths are covered
- Verify prop validation and TypeScript types are correct

2) Code Quality & Cleanliness
- Is the code readable and self-documenting?
- Are the changes minimal and focused?
- Do they follow existing patterns in the codebase?
- Are there any code smells or anti-patterns?
- Is the component structure logical and maintainable?

3) Frontend-Specific Concerns
- **Accessibility (a11y)**: ARIA attributes, keyboard navigation, focus management, semantic HTML
- **TypeScript**: Proper typing, no `any` types, exported types are correctly defined
- **Bundle Size**: Unnecessary dependencies, code bloat, tree-shaking considerations
- **Performance**: Unnecessary re-renders, proper memoization, efficient event handlers
- **Styling**: Tailwind classes used correctly, no inline styles, responsive design
- **Browser Compatibility**: Works across target browsers

4) Component API Design
- Are component props intuitive and consistent with existing components?
- Are breaking changes to component APIs clearly justified?
- Is the component composable and flexible?
- Are default prop values sensible?
- Is the component API backward compatible?

5) Potential Issues to Flag
- Accessibility violations (missing labels, improper ARIA, keyboard traps)
- Performance degradations (unnecessary re-renders, memory leaks)
- Security vulnerabilities (XSS risks, unsafe HTML rendering)
- Breaking changes to public component APIs
- TypeScript type errors or unsafe type assertions
- Missing error boundaries or error handling

6) Constructive Suggestions
- Alternative approaches that might be cleaner
- Opportunities to reduce complexity
- Missing test coverage for critical component behavior
- Opportunities to improve accessibility

Documentation & Storybook Review:
- Determine if component behavior, props, or APIs have changed.
- Heuristics (run): gh pr diff ${{ github.event.pull_request.number }} --name-only
Expand All @@ -123,18 +123,18 @@ jobs:
- Check that JSDoc comments are present for complex props or components.
- If breaking changes are introduced to component APIs, recommend adding migration notes in the PR description or changelog.
- If documentation is needed, explicitly call it out in the review with concrete file/section suggestions.

Review Format:
- Start with a summary of what the changes accomplish.
- List any critical issues that must be addressed.
- Note minor improvements that would enhance quality.
- Acknowledge what's done particularly well.
- End with specific, actionable next steps if needed.

Output Instructions:
- Provide detailed feedback using inline-style code references in your comment for specific issues (quote file paths and line ranges when possible).
- Use top-level comments for general observations or praise.
- Use `gh pr comment` to post your review comment to the PR.

Be constructive and helpful in your feedback.
claude_args: --max-turns 5 --allowed-tools "mcp__github_inline_comment__create_inline_comment,Bash(gh issue view:*),Bash(gh search:*),Bash(gh issue list:*),Bash(gh pr comment:*),Bash(gh pr diff:*),Bash(gh pr view:*),Bash(gh pr list:*)"
claude_args: --allowed-tools "mcp__github_inline_comment__create_inline_comment,Bash(gh issue view:*),Bash(gh search:*),Bash(gh issue list:*),Bash(gh pr comment:*),Bash(gh pr diff:*),Bash(gh pr view:*),Bash(gh pr list:*)"
8 changes: 4 additions & 4 deletions .github/workflows/claude.yml
Original file line number Diff line number Diff line change
Expand Up @@ -65,15 +65,15 @@ jobs:
with:
anthropic_api_key: ${{ secrets.ANTHROPIC_API_KEY }}
track_progress: true

# This is an optional setting that allows Claude to read CI results on PRs
additional_permissions: |
actions: read

# Optional: Give a custom prompt to Claude. If this is not specified, Claude will perform the instructions specified in the comment that tagged it.
# prompt: 'Update the pull request description to include a summary of changes.'

# Optional: Add claude_args to customize behavior and configuration
# See https://github.com/anthropics/claude-code-action/blob/main/docs/usage.md
# or https://docs.claude.com/en/docs/claude-code/cli-reference for available options
claude_args: --max-turns 5 --allowed-tools "mcp__github_inline_comment__create_inline_comment,Bash(gh issue view:*),Bash(gh search:*),Bash(gh issue list:*),Bash(gh pr comment:*),Bash(gh pr diff:*),Bash(gh pr view:*),Bash(gh pr list:*)"
claude_args: --allowed-tools "mcp__github_inline_comment__create_inline_comment,Bash(gh issue view:*),Bash(gh search:*),Bash(gh issue list:*),Bash(gh pr comment:*),Bash(gh pr diff:*),Bash(gh pr view:*),Bash(gh pr list:*)"