Skip to content

fix: align inline note rendering#137

Merged
benvinegar merged 1 commit intomainfrom
pi/fix-inline-note-rendering
Mar 30, 2026
Merged

fix: align inline note rendering#137
benvinegar merged 1 commit intomainfrom
pi/fix-inline-note-rendering

Conversation

@benvinegar
Copy link
Copy Markdown
Member

Summary

  • remove the extra split-note connector row that was leaving a blank spacer band under inline AI notes
  • keep note-guide rendering aligned with the diff rows so annotated rows no longer shift by one column
  • add regression coverage for the blank-row removal and the split-row alignment handoff

Testing

  • bun run typecheck
  • bun test
  • bun run test:tty-smoke

This PR description was generated by Pi using OpenAI GPT-5

@greptile-apps
Copy link
Copy Markdown

greptile-apps bot commented Mar 30, 2026

Greptile Summary

This PR fixes two visual alignment bugs in the inline AI note rendering: it removes the extraneous blank spacer row that was appended below split-layout note cards, and it corrects column alignment by moving the note guide from a separate sibling <box> element into an inline <span> within the row's text content.

Key changes:

  • AgentInlineNote: height formula simplified from 3 + lines.length + (anchorSide && layout === \"split\" ? 1 : 0) to 3 + lines.length, and the corresponding JSX connector block removed
  • renderRows.tsx: guide rendering refactored — guideOnNewSide appends a span after rightRenderWidth (narrowed by 1 to preserve total width), while guideOnOldSide replaces the leftPrefix.text with (no width change, since it replaces marker() which is the same 1-char width). Both non-wrapped and wrapped paths for split-line and stack-line rows are updated consistently
  • The old sibling-box approach subtracted the guide column from a shared contentWidth, shrinking both left and right cells equally; the new approach only narrows the side that actually hosts the guide, which also improves measureRenderedRowHeight accuracy for the left cell
  • Two new/updated tests cover the blank-row removal and verify that the + rail marker is column-aligned between annotated and non-annotated rows in split layout

Confidence Score: 5/5

Safe to merge — the fix is logically consistent across all rendering paths and is well-covered by regression tests.

All three changed files are correct: the height formula and JSX removal in AgentInlineNote are exact inverses of the old spacer logic; the column-budget arithmetic in renderRows is self-consistent (left swap is width-neutral, right reduction matches the appended span); and the tests assert both the blank-row removal and the column-alignment property directly. No P0/P1 findings identified.

No files require special attention.

Important Files Changed

Filename Overview
src/ui/components/panes/AgentInlineNote.tsx Removes the extra split-note connector row appended after the bottom border in split layout, reducing measured height from 3 + lines.length + 1 to 3 + lines.length and deleting the corresponding JSX block — clean and correct.
src/ui/diff/renderRows.tsx Replaces the old outer-guide-box sibling approach with inline spans embedded in the row's text content, fixing column alignment. For guideOnNewSide, rightRenderWidth is reduced by 1 to preserve total row width; for guideOnOldSide, the leftPrefix.text is swapped to (same width as marker()), requiring no width adjustment. Applied consistently to both non-wrapped and wrapped paths for split-line and stack-line rows.
test/ui-components.test.tsx Existing note-height test updated from 6→5 rows and blank-connector assertion removed; new regression test added verifying the bottom border of a split inline note is immediately followed by the anchored diff row and that the + rail character is column-aligned across both annotated and non-annotated rows.

Sequence Diagram

sequenceDiagram
    participant RRP as reviewRenderPlan
    participant PIV as PierreDiffView
    participant AIN as AgentInlineNote
    participant DRV as DiffRowView / renderRow

    RRP->>PIV: PlannedReviewRow[] (inline-note, diff-row w/ noteGuideSide, note-guide-cap)
    PIV->>AIN: kind="inline-note" → renders note card (height = 3 + lines.length)
    Note over AIN: No trailing blank connector row (removed)
    PIV->>DRV: kind="diff-row", noteGuideSide="new"|"old"
    alt guideOnNewSide
        DRV->>DRV: rightRenderWidth = rightWidth - 1
        DRV->>DRV: append │ span at column width-1
    else guideOnOldSide
        DRV->>DRV: leftPrefix.text = "│" (replaces marker, same width)
    end
    PIV->>PIV: kind="note-guide-cap" → AgentInlineNoteGuideCap (╵ at col 0 or width-1)
Loading

Reviews (1): Last reviewed commit: "fix: align inline note rendering" | Re-trigger Greptile

@benvinegar benvinegar merged commit 640678c into main Mar 30, 2026
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant