feat: annotatable diff view with block-level hover#309
Merged
backnotprop merged 7 commits intomainfrom Mar 16, 2026
Merged
Conversation
Move annotation plumbing (web-highlighter lifecycle, toolbar/popover state, text-selection handlers, findTextInDOM, applyAnnotations) out of Viewer.tsx into a dedicated hook. Pure refactor — zero behavior change. Viewer consumes the hook and keeps its own code block, global comment, and pinpoint-specific logic. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Add annotation support to plan diff view using block-level hover. Hovering added/removed/modified sections shows the annotation toolbar. No web-highlighter in diff mode — annotations live in React state only. - diffContext field on Annotation type (added/removed/modified) - PlanCleanDiffView: hover handlers, toolbar, comment/quicklabel flows - Annotated blocks show persistent highlight ring via content matching - View isolation: diff annotations filtered to diff view, normal to normal - Share/draft restore filters diff annotations from Viewer DOM - AnnotationPanel: neutral "diff" badge for diff annotations - Export: [In diff content] label in feedback - Toolstrip visible during diff mode for mode switching - CLAUDE.md updated Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Add scroll-to-selected when clicking a diff annotation in the panel — scrolls to the block and briefly glows (same focused effect as Viewer). Replace invisible ring-1 ring-primary/20 with ring-2 ring-accent for annotated blocks so they're visually distinct. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
… highlight rings Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Replace ternary rendering with display:none so the Viewer stays mounted and web-highlighter DOM marks survive the toggle. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
a5bf6a3 to
12c4eb1
Compare
…ng to 500 chars Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…sibility) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Adds annotation support to the plan diff view using block-level hover. Users hover over added/removed/modified diff sections and annotate entire blocks — same interaction pattern as code block hover in the normal Viewer.
diffContextfield, showdiffbadge in panel[In diff content]labels for agent contextArchitecture
Commit 1: Hook extraction (pure refactor). Moved annotation plumbing from Viewer.tsx into
useAnnotationHighlighterhook. Same code, same behavior, just encapsulated. Viewer consumes the hook and keeps its own code block, global comment, and pinpoint logic.Commit 2: Diff annotation feature. Block-level hover in PlanCleanDiffView — no web-highlighter, no DOM marks, no
findTextInDOMrestoration. Annotations live purely in React state. Unchanged sections are not annotatable.Why block-level instead of text-selection
A previous attempt (PR #300) used text-selection with web-highlighter in diff mode. That approach was fragile —
findTextInDOMbroke across diff boundaries, an auto-apply effect regressed normal annotation highlights on diff toggle, and cross-section selections picked wrong contexts. Block-level hover eliminates all these issues by not using DOM marks at all.Test plan
diffbadge in panel for diff annotations[In diff content]in feedback🤖 Generated with Claude Code