Repository navigation
Add recent PRs to project/repository pages - #1398
Conversation
Summary by CodeRabbit
WalkthroughThis change introduces the display of recent pull requests on both project and repository detail pages. It extends the backend GraphQL Changes
Assessment against linked issues
Possibly related PRs
Suggested labels
Suggested reviewers
📜 Recent review detailsConfiguration used: .coderabbit.yaml 📒 Files selected for processing (6)
🚧 Files skipped from review as they are similar to previous changes (6)
⏰ Context from checks skipped due to timeout of 90000ms (4)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
Documentation and Community
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
frontend/src/app/projects/[projectKey]/page.tsx (1)
24-24: Consider typing the recentPullRequests state variableThe state variable is initialized as null but would benefit from explicit typing for better type safety.
- const [recentPullRequests, setRecentPullRequests] = useState(null) + const [recentPullRequests, setRecentPullRequests] = useState<any[] | null>(null)backend/apps/github/graphql/queries/pull_request.py (1)
35-35: Fix typo in commentThere's a typo in the comment: "Filter pull reuest's by" should be "Filter pull requests by".
- repository (str, optional): Filter pull reuest's by a specific repository's login. + repository (str, optional): Filter pull requests by a specific repository's login.🧰 Tools
🪛 GitHub Actions: Run CI/CD
[error] 35-35: CSpell: Unknown word 'reuest's' detected. Spelling check failed.
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (12)
backend/apps/github/graphql/queries/pull_request.py(3 hunks)frontend/__tests__/e2e/pages/ProjectDetails.spec.ts(1 hunks)frontend/__tests__/e2e/pages/RepositoryDetails.spec.ts(1 hunks)frontend/__tests__/unit/data/mockProjectDetailsData.ts(1 hunks)frontend/__tests__/unit/data/mockRepositoryData.ts(1 hunks)frontend/__tests__/unit/pages/ProjectDetails.test.tsx(1 hunks)frontend/__tests__/unit/pages/RepositoryDetails.test.tsx(1 hunks)frontend/src/app/organizations/[organizationKey]/repositories/[repositoryKey]/page.tsx(2 hunks)frontend/src/app/projects/[projectKey]/page.tsx(3 hunks)frontend/src/components/CardDetailsPage.tsx(2 hunks)frontend/src/server/queries/projectQueries.ts(1 hunks)frontend/src/server/queries/repositoryQueries.ts(1 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (2)
frontend/src/app/organizations/[organizationKey]/repositories/[repositoryKey]/page.tsx (1)
frontend/src/server/queries/repositoryQueries.ts (1)
GET_REPOSITORY_DATA(3-68)
backend/apps/github/graphql/queries/pull_request.py (1)
backend/apps/github/models/pull_request.py (1)
PullRequest(11-125)
🪛 GitHub Actions: Run CI/CD
backend/apps/github/graphql/queries/pull_request.py
[error] 35-35: CSpell: Unknown word 'reuest's' detected. Spelling check failed.
frontend/__tests__/unit/pages/ProjectDetails.test.tsx
[error] 241-241: Unstaged changes detected. Run make check and use git add to address it.
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: CodeQL (javascript-typescript)
🔇 Additional comments (16)
frontend/__tests__/unit/pages/RepositoryDetails.test.tsx (1)
176-183: Test case follows pattern and validates pull requests section - LGTM!This test appropriately verifies that the repository details page correctly renders recent pull requests, which aligns with the PR objective of adding them to repository pages.
frontend/__tests__/e2e/pages/RepositoryDetails.spec.ts (1)
86-90: E2E test validates pull requests section visibility - LGTM!This test appropriately validates that the "Recent Pull Requests" section and expected pull request titles are visible in the UI, ensuring the feature works from an end-user perspective.
frontend/__tests__/e2e/pages/ProjectDetails.spec.ts (1)
91-95: E2E test for project details page pull requests section - LGTM!This test properly verifies that the PR section is visible on project details pages, maintaining consistency with the repository details implementation and fulfilling the PR objective.
frontend/src/app/projects/[projectKey]/page.tsx (2)
33-33: Update to include recentPullRequests data from query - LGTM!Correctly retrieves pull request data from the GraphQL query response.
96-96: Pass pull requests data to DetailsCard component - LGTM!Properly passes the pull requests data to the DetailsCard component as a prop, enabling the display of pull requests on the project details page.
frontend/__tests__/unit/data/mockRepositoryData.ts (1)
49-68: Mock data looks good for testing the recent PRs feature.The addition of
recentPullRequestsmock data properly models what would be returned from the API with author information and timestamps. This will support UI tests for the new pull requests section.frontend/__tests__/unit/pages/ProjectDetails.test.tsx (1)
219-226: Good addition of test for pull requests section.This test verifies that the recent pull requests are correctly rendered on the project details page, providing coverage for the new feature.
frontend/__tests__/unit/data/mockProjectDetailsData.ts (1)
80-99: Mock data structure matches repository pattern.The
recentPullRequestsmock data follows the same structure as in the repository mock data, providing consistency across the test suite. This will ensure UI testing works properly for the feature.frontend/src/server/queries/projectQueries.ts (1)
68-79: GraphQL query extension looks good.The addition of the
recentPullRequestsfield to the project data query follows the same pattern as other recent activity sections. The parameters (limit: 5 and repository: $key) will properly limit results and filter by the relevant repository.frontend/src/components/CardDetailsPage.tsx (2)
152-155: LGTM: Expanded conditional rendering for RecentPullRequests componentThe conditional rendering has been correctly expanded to include repository and project entity types, which aligns with the PR's objective of displaying recent pull requests on these pages.
166-169: LGTM: Consistent rendering of RecentReleases componentThe conditional rendering for RecentReleases component has been appropriately expanded to match the entity types supported for RecentPullRequests, ensuring a consistent user experience across different page types.
frontend/src/server/queries/repositoryQueries.ts (1)
55-66: LGTM: Added GraphQL query for recent pull requestsThe GraphQL query has been properly extended to fetch recent pull requests with all the necessary information: author details, timestamps, repository context, and content details. The approach of limiting to 5 items and filtering by repository key is appropriate for the feature requirements.
frontend/src/app/organizations/[organizationKey]/repositories/[repositoryKey]/page.tsx (3)
23-23: LGTM: Added state for recent pull requestsThe state variable for recent pull requests is correctly initialized and follows the established pattern in this component.
31-31: LGTM: Properly updating state from API responseThe recent pull requests data is correctly extracted from the API response using optional chaining, which safely handles potential undefined values in the response.
109-109: LGTM: Proper prop passing to DetailsCard componentThe recentPullRequests state is correctly passed as the pullRequests prop to the DetailsCard component, completing the data flow from API to UI.
backend/apps/github/graphql/queries/pull_request.py (1)
20-20: LGTM: Well-implemented repository filtering for pull requestsThe changes correctly implement repository filtering for the recent_pull_requests GraphQL query:
- Added the optional repository parameter
- Updated the resolver method signature
- Optimized related object fetching with select_related
- Added appropriate case-insensitive filtering on repository key
This implementation supports the frontend changes to display repository-specific pull requests.
Also applies to: 24-24, 43-43, 58-60
arkid15r
left a comment
arkid15r
left a comment
There was a problem hiding this comment.
Found this one after another round of review:
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (2)
frontend/__tests__/unit/data/mockProjectDetailsData.ts (2)
25-44: New recentPullRequests array added to support PR display feature.This addition successfully implements the core requirement of supporting recent pull requests display on project pages. The structure contains all necessary fields for rendering pull request cards.
However, there's an inconsistency in the timestamp format:
recentPullRequestsuses UNIX timestamp (e.g., 1727390000)- While
recentIssuesandrecentReleasesuse ISO string format (e.g., '2025-02-05T15:20:30Z')Consider using a consistent date format across all recent items to avoid potential rendering issues:
- createdAt: 1727390000, + createdAt: '2025-05-27T14:53:20Z',- createdAt: 1727380000, + createdAt: '2025-05-27T12:13:20Z',
86-98: Added additional project metadata properties.These properties enhance the completeness of the mock data, providing comprehensive project information for testing. The
topContributorsarray is particularly well-implemented with programmatic generation of 15 mock contributors.One small observation: The properties have been added at the end of the object rather than grouped with similar properties. While this doesn't affect functionality, it might slightly reduce readability.
Consider organizing related properties together (e.g., putting
repositoriesCountnear other count properties) for better code organization.
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (8)
backend/apps/github/graphql/queries/pull_request.py(3 hunks)backend/apps/owasp/graphql/nodes/project.py(3 hunks)backend/apps/owasp/models/project.py(2 hunks)backend/tests/apps/owasp/graphql/nodes/project_test.py(5 hunks)frontend/__tests__/unit/data/mockProjectDetailsData.ts(2 hunks)frontend/src/app/projects/[projectKey]/page.tsx(1 hunks)frontend/src/server/queries/projectQueries.ts(1 hunks)frontend/src/types/project.ts(2 hunks)
🚧 Files skipped from review as they are similar to previous changes (3)
- frontend/src/app/projects/[projectKey]/page.tsx
- frontend/src/server/queries/projectQueries.ts
- backend/apps/github/graphql/queries/pull_request.py
🧰 Additional context used
🧬 Code Graph Analysis (2)
backend/apps/owasp/models/project.py (1)
backend/apps/github/models/pull_request.py (1)
PullRequest(11-125)
backend/apps/owasp/graphql/nodes/project.py (2)
backend/apps/github/graphql/nodes/pull_request.py (1)
PullRequestNode(9-34)backend/apps/owasp/models/project.py (2)
Project(19-292)pull_requests(185-191)
⏰ Context from checks skipped due to timeout of 90000ms (4)
- GitHub Check: Run frontend e2e tests
- GitHub Check: Run backend tests
- GitHub Check: Run frontend unit tests
- GitHub Check: CodeQL (javascript-typescript)
🔇 Additional comments (15)
backend/apps/owasp/models/project.py (2)
12-12: Import added to support the new pull_requests propertyThe import for PullRequest from the GitHub app is properly added to support the new property method.
184-191: Well-implemented pull_requests propertyThis property is correctly implemented to:
- Filter pull requests by repositories associated with the project
- Use select_related("repository") to optimize database queries by reducing the number of SQL queries needed
The implementation follows the same pattern as existing properties like
issuesandpublished_releases, maintaining consistency in the codebase.backend/apps/owasp/graphql/nodes/project.py (4)
6-6: Import added to support the pull request GraphQL fieldThe PullRequestNode import is correctly added to support the new GraphQL field.
14-14: Consistent limit definitionThe constant RECENT_PULL_REQUESTS_LIMIT follows the same pattern as the existing constants for issues and releases, maintaining consistency.
25-25: GraphQL field added for recent pull requestsThe field is correctly defined to return a list of PullRequestNode objects, consistent with similar fields for issues and releases.
63-67: Well-implemented resolver for recent pull requestsThe resolver implementation:
- Uses the newly added pull_requests property from the Project model
- Follows the same pattern as the existing resolvers for issues and releases
- Correctly selects related author data to optimize queries
- Orders by creation date (newest first)
- Limits results using the defined constant
This implementation ensures efficient database queries and maintains code consistency.
frontend/src/types/project.ts (2)
81-81: Added recentPullRequests to ProjectTypeGraphqlThe recentPullRequests property is correctly added to the ProjectTypeGraphql interface, enabling TypeScript type checking for components that use this data.
18-30:Details
❓ Verification inconclusive
New interface for project pull requests
The ProjectPullRequestsType interface is well-structured and includes all necessary fields for pull request data. However, there's a small inconsistency in the data type for
createdAt:
- In ProjectPullRequestsType,
createdAtis defined as a string (line 25)- In ProjectIssuesType,
createdAtis defined as a number (line 11)This might be intentional based on the data format from the API, but worth checking to ensure consistency.
🏁 Script executed:
#!/bin/bash # Verify the actual GraphQL schema type for createdAt in pull requests grep -A 2 "createdAt" frontend/src/server/queries/projectQueries.ts | grep "pull"Length of output: 79
To locate the GraphQL definitions for both pull requests and issues and verify the
createdAttypes, let’s list and inspect your query files:
🏁 Script executed:
#!/bin/bash # 1. List all GraphQL/TS query files under server/queries find frontend/src/server/queries -type f # 2. Show all occurrences of `createdAt` in those files grep -R "createdAt" -n frontend/src/server/queries # 3. Find where `pullRequests` is queried grep -R "pullRequests" -n frontend/src/server/queries # 4. Find where `issues` is queried grep -R "issues" -n frontend/src/server/queriesLength of output: 1947
Manual verification required for
createdAttype in pull requestsI wasn’t able to find any GraphQL query for
pullRequestsinfrontend/src/server/queries/projectQueries.ts, so I couldn’t confirm whether the API actually returnscreatedAtas a string or a number for pull requests. Please verify the schema or API docs:
- Check your GraphQL schema (or API documentation) for the
createdAtfield on thePullRequesttype- Ensure
ProjectPullRequestsType.createdAtuses the same primitive (string or number) asProjectIssuesTypebackend/tests/apps/owasp/graphql/nodes/project_test.py (5)
10-11: Imports added to support new test casesThe necessary imports for PullRequestNode and RECENT_PULL_REQUESTS_LIMIT are correctly added.
Also applies to: 14-15
29-30: Mock fixture updated to support pull requests testingThe mock_project fixture is properly extended to mock the pull_requests property with appropriate chained mock objects for select_related, order_by, and slicing operations.
Also applies to: 36-41, 47-48
67-72: Test case for recent_pull_requests fieldThis test properly verifies that:
- The field exists on the ProjectNode
- It is of the correct type (List of PullRequestNode)
The test is thorough and consistent with similar tests for issues and releases.
95-110: Test case for resolve_recent_pull_requestsThis test thoroughly verifies the resolver functionality:
- Checks that select_related is called with "author"
- Verifies the correct ordering by "-created_at"
- Ensures the result is sliced to the correct limit
- Confirms the expected return value
The test is comprehensive and follows the same pattern as other resolver tests.
135-135: Updated custom_fields setThe custom_fields set is correctly updated to include "recent_pull_requests", ensuring all fields are properly accounted for in the test that verifies field existence.
frontend/__tests__/unit/data/mockProjectDetailsData.ts (2)
12-24: Updated recentIssues structure with consistent author and repository information.The structure for recentIssues has been updated with standardized author data including avatar URL, login, name, and URL. The addition of the
repositoryNamefield enhances the mock data to better represent a real-world API response for issues.
45-56: Restructured recentReleases array with consistent ordering.The recentReleases structure has been reorganized with author information positioned first, which creates a consistent pattern across all recent items collections.
|
* recent PRs in project and organization/repositories page * checks and spelling * fetching recent PR from all repos of project * filtering recent PR of project with graphql endpoint * Update code --------- Co-authored-by: Arkadii Yakovets <2201626+arkid15r@users.noreply.github.com> Co-authored-by: Arkadii Yakovets <arkadii.yakovets@owasp.org>
Resolves #1384