fix(diff): wrap multiline review comments

[forketyfork]

Closes #285

Solution

The diff overlay was treating comment text as a single rendered line and then squeezing that texture into the available width. This change moves diff comments to a wrapped multiline layout and uses that same layout data for rendering, cursor placement, scroll math, hit testing, button placement, and submit animations, so the editor and saved comments stay in sync. It also adds a regression test for wrapped comment height expansion and updates the README to reflect the multiline comment behavior.

Automated checks:

• zig build
• just lint
• zig build test still reports an existing unrelated failure in src/ui/components/scrollbar.zig

Test plan

• Open Cmd+D in a repo with changes
• Start a long inline diff comment and verify the editor wraps onto multiple lines instead of shrinking the glyphs
• Save the comment and verify it renders as a multiline block in the diff
• Edit an existing long comment and verify the cursor, buttons, and scrolling still line up correctly

[Copilot]

Pull request overview

Updates the diff overlay’s inline review comments to render and edit as wrapped multiline text, keeping layout-dependent behavior (rendering, cursor placement, scrolling math, hit testing, button placement, and submit animations) aligned with the wrapped layout. This addresses issue #285 where long comments were previously rendered as a single squashed line.

Changes:

• Introduces wrapped-line iteration and multiline layout/height calculation for saved and editing diff comments.
• Reworks rendering, cursor positioning, hit testing, and animation sizing to use wrapped comment metrics.
• Adds a regression test for height expansion and updates README copy to mention multiline wrapping.

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated no comments.

File	Description
src/ui/components/diff_overlay.zig	Implements wrapped comment layout/rendering + height math and adds a regression test for multiline height expansion.
src/main.zig	Imports the diff overlay module in the test build so its new test is included.
README.md	Updates the “Diff review comments” feature description to note multiline wrapping.

Comments suppressed due to low confidence (2)

src/ui/components/diff_overlay.zig:1112

• renderWrappedCommentText creates and destroys an SDL texture for every wrapped line on every frame (makeTextTexture inside the per-line callback). With multiline wrapping and the removal of the previous 200/500-char render truncation, a large pasted comment can trigger many allocations/texture creations per frame and noticeably degrade UI performance. Consider caching rendered line textures per comment until the text or wrap_cols changes, or enforcing a reasonable maximum render length/line count for the interactive overlay to keep frame time bounded.

        const clamped = @max(@as(i64, 0), elapsed);
        const t = @min(1.0, @as(f32, @floatFromInt(clamped)) / @as(f32, @floatFromInt(duration)));
        return switch (anim) {
            .editor_opening => easing.easeOutCubic(t),
            .editor_closing => easing.easeInOutCubic(t),

src/ui/components/diff_overlay.zig:2676

• totalCommentPixelHeight hard-codes FullscreenOverlay.overlayRect(host) when computing wrapped comment heights, but comment height now depends on available text width (savedCommentTextWidth/editingCommentTextWidth). In renderFn, the viewport uses animatedOverlayRect, so during open/close animations (or any future width animation) scroll metrics/max_scroll can desync from the actual rendered layout. Consider threading the same rect used for rendering into totalCommentPixelHeight (and callers like syncScrollMetrics) so scroll math stays consistent with wrapped layout.

        var agent_cmd: ?[]const u8 = null;
        if (agent_name) |name| {
            agent_cmd = std.fmt.allocPrint(self.allocator, "{s}\n", .{name}) catch {
                self.allocator.free(comments_text);
                return;

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.