Skip to content

Inline GitHub PR Review Comments #501

@phodal

Description

@phodal

Feature Proposal: Inline GitHub PR Review Comments

Description

I propose implementing a feature to synchronize and display GitHub Pull Request review comments directly inside the IDE editor.

Instead of switching back and forth between the browser and the IDE to view code review feedback, developers should be able to see comments (from human reviewers or AI bots like CoderRabbit/Copilot) rendered inline, right next to the relevant code lines.

Motivation

Currently, addressing PR feedback involves a lot of context switching:

  1. Read comment on GitHub in the browser.
  2. Find the corresponding file and line in the IDE.
  3. Make the fix.
  4. Switch back to the browser to resolve the conversation.

This process breaks the flow state and increases cognitive load. By syncing comments to the IDE:

  • Improved DX: Developers can read feedback in the exact context where they need to make changes.
  • Efficiency: drastic reduction in time spent navigating files to find where a comment applies.
  • Accuracy: Reduces the risk of fixing the wrong line or missing a comment entirely.

Proposed Solution

The IDE client should fetch review data through our backend API, which acts as a middleware/aggregator for the Git provider (GitHub/GitLab).

Architecture Flow

  1. Trigger: When a user opens a file or activates "Review Mode," the IDE client sends a request to our backend service.
    • Endpoint Example: GET /api/v1/reviews?repo_id={id}&pr_number={num}&file_path={path}
  2. Backend Processing:
    • The backend service interacts with the GitHub API to fetch review threads.
    • It normalizes the data structure (abstracting away provider-specific differences).
    • It handles caching and rate limiting.
  3. Client Rendering:
    • The IDE receives a JSON payload containing comment content, author, line number, and diff context.
    • The editor renders these as Inline Widgets (Block Inlay Hints) at the specific lines.

Sequence Diagram (Mermaid)

sequenceDiagram
    participant User
    participant IDE as IDE Client
    participant API as Backend API Service
    participant GH as GitHub API

    User->>IDE: Opens File / Toggles Review Mode
    IDE->>API: GET /reviews (repo, pr, file)
    alt Cache Miss
        API->>GH: Fetch PR Comments
        GH-->>API: Return Raw Data
    end
    API-->>IDE: Return Normalized JSON
    IDE->>IDE: Match Line Numbers & Render Inline Widgets
    IDE-->>User: Display Comments in Editor
Loading

Data Synchronization Strategy

  • Polling: The IDE checks for updates every X minutes.
  • On-Demand: Refresh when the user explicitly clicks a "Sync" button.
  • (Optional) WebSocket: Real-time push if the backend supports it.

Alternatives Considered

  • Direct GitHub API Call from Client:
    • Reason for rejection: Putting API tokens and logic directly in the client is less secure and harder to manage updates. Using our own Backend API allows us to support multiple git providers (GitLab, Bitbucket) in the future without changing client code.

Related

https://github.com/JetBrains/intellij-community/blob/3efb28f85a66dbf058973a2290136ee488de161f/plugins/github/github-core/src/org/jetbrains/plugins/github/pullrequest/GHPRListViewModel.kt#L2

Image

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions