feat(comments): desktop comment engine, artifact and activity UI by puemos · Pull Request #78690 · PostHog/posthog

puemos · 2026-08-06T06:23:45Z

Problem

Desktop reviewers cannot discuss a specific line, image region, or document in agent output. This layer adds anchored comment threads on artifacts and documents, mentions, and a merged task-and-comment Activity feed.

Layer 2 of 3, stacked on #78688. It consumes the generated types that layer ships.

Architecture

This PR is the desktop comment engine. It renders review surfaces, talks to the layer-1 Comment API, and is gated by the feature flag. Canvas rendering is layer 3 (#78691).

  Reviewer
     │  select text / region, or open a document
     ▼
  ╔═══════════════════════════════════════╗
  ║  Desktop comment UI      « THIS PR »   ║ ── flag: posthog-code-comments
  ║  anchors · composer · thread cards     ║
  ║  artifact + document surfaces          ║
  ║  comment navigation · Activity feed    ║
  ╚═══════════════════╤═══════════════════╝
                      ▼
              Generic Comment API  (L1 #78688)
                      ▼
              Tasks facade → access checks · Activity projection

Changes

Anchored comment primitives: text, region, and document anchors, with text reanchoring.
A comment composer, thread cards, and the artifact and document annotation surfaces.
A comment navigation store that opens a comment and moves to its target.
An Activity feed that merges task activity and comment activity into one stream.

Creating an anchored comment

sequenceDiagram
    actor Reviewer
    participant Surface as Artifact or document
    participant UI as Desktop comment UI
    participant API as Comment API (L1)
    Reviewer->>Surface: Select text or an image region
    Surface->>UI: Normalized anchor
    Reviewer->>UI: Write the comment
    UI->>API: Create root comment (anchor, taskId)
    API-->>UI: Saved thread
    UI-->>Reviewer: Highlight, pin, or document thread

Feature flag

posthog-code-comments (project 2, id 802532) gates every comment surface in this layer. It targets shy.a@posthog.com at 100% and is off for everyone else, so the flag — not the merge — controls when comments become visible.

Note

The desktop renders and fetches comment surfaces only when posthog-code-comments is enabled.

Required before ready-for-review:

Add COMMENTS_FLAG = "posthog-code-comments" to shared/src/flags.ts.
Gate ArtifactPreview, SelectionCommentOverlay, and the comment rows in ActivityView on the flag.
Guard reads of the new backend fields (latest_comment_id, latest_comment_scope, item_context.anchor) so a stale backend degrades instead of crashing.
Add a stale-backend test that renders the surfaces against a backend missing those fields.

How did you test this code?

Added flag-off regressions for artifact previews, selection overlays, and the Comments tab. Ran the focused Vitest suites and full desktop workspace typecheck locally.

Automatic notifications

Publish to changelog?

Docs update

None.

🤖 Agent context

Autonomy: Human-driven (agent-assisted). DRI: Shy Alter.

Layer 2 of a 3-layer stack split from #76407 by PostHog Code. The flag exists in project 2 and now gates the desktop comment surfaces and their data fetching. Skills invoked: /stacking-prs, /writing-pr-descriptions.

Created with PostHog Code

github-actions · 2026-08-06T06:25:23Z

React Doctor found 18 issues in 6 files · 18 warnings.

18 warnings

packages/ui/src/features/canvas/components/ActivityPanel.tsx

⚠️ packages/ui/src/features/canvas/components/ActivityPanel.tsx:68 Chained array iterations js-combine-iterations
⚠️ packages/ui/src/features/canvas/components/ActivityPanel.tsx:184 Ref initializer runs on every render rerender-lazy-ref-init
⚠️ packages/ui/src/features/canvas/components/ActivityPanel.tsx:199 State adjusted after a prop changes no-adjust-state-on-prop-change
⚠️ packages/ui/src/features/canvas/components/ActivityPanel.tsx:202 Effects chained together no-effect-chain

packages/ui/src/features/canvas/components/ActivityView.tsx

⚠️ packages/ui/src/features/canvas/components/ActivityView.tsx:87 Non-component export in component file only-export-components

packages/ui/src/features/canvas/components/TaskCommentsList.tsx

⚠️ packages/ui/src/features/canvas/components/TaskCommentsList.tsx:285 Large component is hard to read and change no-giant-component
⚠️ packages/ui/src/features/canvas/components/TaskCommentsList.tsx:326 State adjusted after a prop changes no-adjust-state-on-prop-change
⚠️ packages/ui/src/features/canvas/components/TaskCommentsList.tsx:327 State adjusted after a prop changes no-adjust-state-on-prop-change
⚠️ packages/ui/src/features/canvas/components/TaskCommentsList.tsx:560 Data passed to parent via effect no-pass-data-to-parent
⚠️ packages/ui/src/features/canvas/components/TaskCommentsList.tsx:560 Live state pushed to parent via effect no-pass-live-state-to-parent

packages/ui/src/features/canvas/hooks/useMarkTaskActivityRead.ts

⚠️ packages/ui/src/features/canvas/hooks/useMarkTaskActivityRead.ts:41 Chained array iterations js-combine-iterations

packages/ui/src/features/sessions/components/ArtifactTextAnnotations.tsx

⚠️ packages/ui/src/features/sessions/components/ArtifactTextAnnotations.tsx:34 Non-component export in component file only-export-components
⚠️ packages/ui/src/features/sessions/components/ArtifactTextAnnotations.tsx:47 Non-component export in component file only-export-components
⚠️ packages/ui/src/features/sessions/components/ArtifactTextAnnotations.tsx:60 Non-component export in component file only-export-components
⚠️ packages/ui/src/features/sessions/components/ArtifactTextAnnotations.tsx:215 State adjusted after a prop changes no-adjust-state-on-prop-change
⚠️ packages/ui/src/features/sessions/components/ArtifactTextAnnotations.tsx:231 Data passed to parent via effect no-pass-data-to-parent
⚠️ packages/ui/src/features/sessions/components/ArtifactTextAnnotations.tsx:354 Array index used as a key no-array-index-as-key

packages/ui/src/features/sessions/components/commentMentions.ts

⚠️ packages/ui/src/features/sessions/components/commentMentions.ts:12 Chained array iterations js-combine-iterations

_{Reviewed by React Doctor for commit f441934.}

trunk-io · 2026-08-06T06:46:24Z

_{View Full Report ↗︎ ⋅ Docs}

veria-ai · 2026-08-06T09:00:05Z

PR overview

All previously flagged issues have been addressed. No open security concerns remain on this pull request.

Security review

No open security issues remain on this pull request.

Fixed/addressed: 6 · PR risk: 0/10

trunk-io · 2026-08-06T13:47:12Z

😎 Stack merged successfully - details.

github-actions · 2026-08-06T14:07:02Z

🦔 Hogbox preview · ❌ build failed

The preview didn't come up for commit a1c12bc. See the build log for the failing step. It'll retry on the next push.

_{Previews are optional and never block merging. A failure here is often a hogland or tailnet hiccup rather than anything in your PR, so the check stays green and this comment is the status.}

github-actions · 2026-08-06T14:09:42Z

🤖 CI report

⚠️

Bundle size — 🔺 +1.7 KiB (+0.0%)

Uncompressed size of every built .js bundle, compared against the base branch.

Total: 65.60 MiB · 🔺 +1.7 KiB (+0.0%)

No file changed by more than 1000 B.

_{Posted automatically by build-bundle-size-report · uncompressed bytes from dist-report}

✅ Eager graph — within budget

How much code each root ships on the eager path — downloaded and parsed before the surface is interactive. Measured from the esbuild output chunks (post-tree-shake, static imports only); lazy import() / React.lazy chunks are not counted.

Root	Eager (shipped)	Δ vs base	Budget
entry (logged-out pages, app bootstrap) `src/index.tsx`	1.26 MiB · 22 files	no change	`███░░░░░░░` 27.9% of 4.51 MiB
authenticated shell (every logged-in page) `src/scenes/AuthenticatedShell.tsx`	8.17 MiB · 3,043 files	🔺 +82 B (+0.0%)	`████████░░` 84.1% of 9.71 MiB

🟢 node_modules/monaco-editor/ stays out of src/index.tsx
🟢 src/lib/components/ActivityLog/describers stays out of src/index.tsx
🟢 [object Object] stays out of src/index.tsx
🟢 [object Object] stays out of src/index.tsx
🟢 node_modules/monaco-editor/ stays out of src/scenes/AuthenticatedShell.tsx
🟢 src/lib/components/ActivityLog/describers stays out of src/scenes/AuthenticatedShell.tsx
🟢 [object Object] stays out of src/scenes/AuthenticatedShell.tsx
🟢 [object Object] stays out of src/scenes/AuthenticatedShell.tsx

Largest files eagerly shipped from src/index.tsx

Size	File
126.8 KiB	`../node_modules/.pnpm/react-dom@18.3.1_react@18.3.1/node_modules/react-dom/cjs/react-dom.production.min.js`
24.6 KiB	`../node_modules/.pnpm/buffer@6.0.3/node_modules/buffer/index.js`
6.3 KiB	`../node_modules/.pnpm/react@18.3.1/node_modules/react/cjs/react.production.min.js`
4.5 KiB	`../node_modules/.pnpm/@jspm+core@2.1.0/node_modules/@jspm/core/nodelibs/browser/process.js`
3.9 KiB	`../node_modules/.pnpm/scheduler@0.23.2/node_modules/scheduler/cjs/scheduler.production.min.js`
1.4 KiB	`../node_modules/.pnpm/base64-js@1.5.1/node_modules/base64-js/index.js`
1.3 KiB	`src/RootErrorBoundary.tsx`
912 B	`../node_modules/.pnpm/ieee754@1.2.1/node_modules/ieee754/index.js`
789 B	`src/scenes/ChunkLoadErrorBoundary.tsx`
762 B	`src/index.tsx`

Largest files eagerly shipped from src/scenes/AuthenticatedShell.tsx

Size	File
285.5 KiB	`../node_modules/.pnpm/posthog-js@1.410.1/node_modules/posthog-js/dist/rrweb.js`
267.7 KiB	`../node_modules/.pnpm/@posthog+icons@0.38.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@posthog/icons/dist/posthog-icons.es.js`
238.4 KiB	`src/taxonomy/core-filter-definitions-by-group.json`
231.5 KiB	`../node_modules/.pnpm/posthog-js@1.410.1/node_modules/posthog-js/dist/module.js`
154.3 KiB	`../node_modules/.pnpm/re2js@0.4.1/node_modules/re2js/build/index.esm.js`
126.8 KiB	`../node_modules/.pnpm/react-dom@18.3.1_react@18.3.1/node_modules/react-dom/cjs/react-dom.production.min.js`
105.0 KiB	`src/lib/api.ts`
94.7 KiB	`../packages/quill/packages/quill/dist/index.js`
93.3 KiB	`../node_modules/.pnpm/prosemirror-view@1.40.1/node_modules/prosemirror-view/dist/index.js`
90.6 KiB	`../node_modules/.pnpm/@tiptap+core@3.20.6_@tiptap+pm@3.20.6/node_modules/@tiptap/core/dist/index.js`

_{Posted automatically by check-eager-graph · sizes are eager output bytes (shipped, post-tree-shake) from the esbuild metafile · part of #32479}

✅ Toolbar bundle — eager 2.20 MiB within budget

What the toolbar ships to customer pages, measured from the esbuild output (minified, post-tree-shake). The eager set is the entry plus everything statically imported from it — fetched before any feature runs; deferred chunks load lazily. The eager guardrail is 5.72 MiB. Each output file must also stay below 10 MB, where CloudFront stops compressing it. The module boundary is enforced separately by check-toolbar-graph.

Metric	Size	Δ vs base	Budget
Eager (shipped) entry + static imports	2.20 MiB · 17 files	no change	`████░░░░░░` 38.4% of 5.72 MiB
Deferred (lazy)	2.08 MiB · 33 files	no change	n/a — loads on demand
Loader `dist/toolbar.js`	1.1 KiB	no change	`█░░░░░░░░░` 5.8% of 19.5 KiB

Largest eagerly-shipped chunks

Size	File
722.4 KiB	`dist/toolbar/toolbar-app-VYTTEIGJ.css`
552.3 KiB	`dist/toolbar/chunk-chunk-TNZFCHO3.js`
484.6 KiB	`dist/toolbar/chunk-chunk-IXNBAQRU.js`
133.6 KiB	`dist/toolbar/chunk-chunk-LVF5S3UA.js`
131.8 KiB	`dist/toolbar/chunk-chunk-T5KY5WYR.js`
71.0 KiB	`dist/toolbar/toolbar-app-YTW7YKWT.js`
69.0 KiB	`dist/toolbar/chunk-chunk-27JL52RE.js`
35.6 KiB	`dist/toolbar/chunk-chunk-JTD4UEVT.js`
20.9 KiB	`dist/toolbar/chunk-chunk-Q62FYBJM.js`
12.2 KiB	`dist/toolbar/chunk-chunk-PIK3PADE.js`

_{Posted automatically by check-toolbar-size · sizes are toolbar output bytes (shipped, post-tree-shake) from the esbuild metafile}

✅ Dist folder size — 🔺 +13.7 KiB (+0.0%)

Total size of the built frontend/dist folder (all assets), compared against the base branch.

Total: 1394.11 MiB · 🔺 +13.7 KiB (+0.0%)

ℹ️ MCP UI apps size — 32 app(s), 17074.3 KB JS

Built size of each MCP UI app (main.js + styles.css).

App	JS	CSS
debug	599.6 KB	187.7 KB
action	457.8 KB	187.7 KB
action-list	564.4 KB	187.7 KB
cohort	456.8 KB	187.7 KB
cohort-list	563.4 KB	187.7 KB
email-template	456.6 KB	187.7 KB
error-details	472.4 KB	187.7 KB
error-issue	457.5 KB	187.7 KB
error-issue-list	564.3 KB	187.7 KB
experiment	561.5 KB	187.7 KB
experiment-list	565.2 KB	187.7 KB
experiment-results	563.2 KB	187.7 KB
feature-flag	567.2 KB	187.7 KB
feature-flag-list	570.9 KB	187.7 KB
feature-flag-testing	461.0 KB	187.7 KB
insight-actors	562.2 KB	187.7 KB
invite-email-preview	456.0 KB	187.7 KB
llm-costs	559.5 KB	187.7 KB
session-recording	458.6 KB	187.7 KB
session-summary	463.9 KB	187.7 KB
survey	458.4 KB	187.7 KB
survey-global-stats	562.2 KB	187.7 KB
survey-list	565.1 KB	187.7 KB
survey-stats	562.2 KB	187.7 KB
trace-span	457.2 KB	187.7 KB
trace-span-list	564.3 KB	187.7 KB
workflow	457.1 KB	187.7 KB
workflow-list	563.7 KB	187.7 KB
loops-review	461.4 KB	187.7 KB
query-results	749.3 KB	187.7 KB
render-ui	830.0 KB	187.7 KB
visual-review-snapshots	461.6 KB	187.7 KB

posthog · 2026-08-06T22:45:04Z

🦔 ReviewHog reviewed this pull request

Found 4 must fix, 12 should fix, 11 consider.

Published 27 findings (view the review).

posthog · 2026-08-07T00:41:40Z

ReviewHog Alpha 🦔 If you find any issues helpful - please reply "valid", "invalid", etc., for evaluation purposes 🙏

posthog

ReviewHog Report

Data model

Issues: 1 issue

Files (5)

products/desktop/packages/core/src/comments/anchors.ts
products/desktop/packages/api-client/src/posthog-client.ts
products/desktop/packages/api-client/src/generated.ts
products/desktop/packages/core/src/sessions/sessionService.ts
products/desktop/packages/shared/src/flags.ts

What were the main changes

New comment anchor primitives (text/region/document) with zod schemas, quote-based text reanchoring, and thread-resolved-state derivation
New CommentScope/ResourceComment/CreateResourceCommentRequest types plus getResourceComments and createResourceComment on the API client
SessionService wraps the client with getResourceComments, a bounded-concurrency getResourceCommentsForTargets fan-out, and createResourceComment
Adds the posthog-code-comments feature flag (COMMENTS_FLAG) gating every comment surface
Regenerates API types for the updated Comment schema (nullable created_by, task_id query param, item_context widened)

Feature

Issues: 6 issues

Files (9)

products/desktop/packages/core/src/canvas/taskActivity.ts
products/desktop/packages/shared/src/domain-types.ts
products/desktop/packages/ui/src/features/canvas/hooks/useMarkTaskActivityRead.ts
products/desktop/packages/ui/src/features/canvas/hooks/useTaskActivity.ts
products/desktop/packages/ui/src/features/canvas/components/activityFeed.ts
products/desktop/packages/ui/src/features/canvas/components/ActivityView.tsx
products/desktop/packages/ui/src/features/canvas/components/ActivityHoverCard.tsx
products/desktop/packages/ui/src/features/canvas/components/ActivityPanel.tsx
products/desktop/packages/ui/src/features/canvas/stores/canvasChatPanelStore.ts

What were the main changes

TaskActivityItem gains commentId/commentTarget mapped from new backend latest_comment_* fields; new thread_reply and owned_item_comment activity kinds
ActivityView renders and filters comment-related rows behind commentsEnabled, and routes selecting a comment row to the navigation store
ActivityPanel adds a feature-flagged Comments tab that switches in response to comment-focus requests
useMarkTaskActivityRead distinguishes per-activity (comment) read state from per-task lifecycle read state
canvasChatPanelStore gains a comments tab and an openComments() action used from Activity navigation

Business logic

Issues: 5 issues

Files (9)

products/desktop/packages/ui/src/features/canvas/components/taskArtifactRows.ts
products/desktop/packages/ui/src/features/canvas/components/taskCommentThreads.ts
products/desktop/packages/ui/src/features/canvas/components/TaskArtifactsList.tsx
products/desktop/packages/ui/src/features/pr-review/usePrCommentsForUrls.ts
products/desktop/packages/ui/src/features/pr-review/usePrReviewThreadsForUrls.ts
products/desktop/packages/ui/src/features/git-interaction/usePrDetails.ts
products/desktop/packages/shared/src/git-domain.ts
products/desktop/packages/workspace-server/src/services/git/schemas.ts
products/desktop/packages/workspace-server/src/services/git/service.ts

What were the main changes

taskArtifactRows.ts extracted from TaskArtifactsList with new commentSources/commentTargets keyed by stable resource ids (never names)
taskCommentThreads.ts builds unified threads from PostHog resource comments and GitHub PR review/conversation comments, filtering out bot authors
TaskArtifactsList shows open-comment-count badges per artifact/canvas from one batched comments query instead of per-row fetches
New usePrCommentsForUrls/usePrReviewThreadsForUrls/usePrTitles hooks batch GitHub data across several PR urls
Backend GraphQL/REST responses now mark comment authors as bots (isBot) so bot comments are excluded from threads

Frontend

Issues: 3 issues

Files (5)

products/desktop/packages/ui/src/features/sessions/components/CommentComposer.tsx
products/desktop/packages/ui/src/features/sessions/components/CommentThreadCard.tsx
products/desktop/packages/ui/src/features/editor/components/githubMarkdownPlugins.ts
products/desktop/packages/ui/src/features/code-review/components/PrCommentThread.tsx
products/desktop/packages/ui/src/features/canvas/components/MentionComposer.tsx

What were the main changes

New CommentComposer: mention-aware composer with submit/cancel and disabled-mentions messaging
New CommentThreadCard: renders root + replies, reply/resolve controls, and GitHub vs PostHog authorship differences
Extracted githubRehypePlugins and restricted GitHub comment images to an explicit allowlist of GitHub-owned hosts (security fix for arbitrary remote image requests)
MentionComposer gains autoFocus for composers opened programmatically

Frontend

Issues: 1 issue

Files (4)

products/desktop/packages/ui/src/features/sessions/components/artifactHtmlCommentBridge.ts
products/desktop/packages/ui/src/features/sessions/components/artifactPreviewDocument.ts
products/desktop/packages/ui/src/features/mcp-apps/utils/mcp-app-csp.ts
products/desktop/packages/ui/src/features/sessions/components/AnnotatedArtifactHtml.tsx

What were the main changes

New artifactHtmlCommentBridge: nonce-scoped script injected into the sandboxed artifact iframe to surface selection/highlight/resolution over postMessage
mcp-app-csp.ts CSP builder now supports a script nonce or script-src 'none', replacing blanket unsafe-inline for artifact previews
artifactPreviewDocument strips before applying the CSP (fixes a declarative-navigation CSP bypass) and wires the bridge nonce
AnnotatedArtifactHtml renders the sandboxed HTML iframe and only enables the trusted comment bridge when commentsEnabled

Frontend

Issues: 4 issues

Files (3)

products/desktop/packages/ui/src/features/sessions/components/ArtifactTextAnnotations.tsx
products/desktop/packages/ui/src/features/sessions/components/AnnotatedArtifactImage.tsx
products/desktop/packages/ui/src/primitives/SafeImagePreview.tsx

What were the main changes

New ArtifactTextAnnotations overlay: computes highlight rects from resolved text anchors, tracks selection to open the composer, and reports resolution status
New AnnotatedArtifactImage overlay for pinned region comments with click-to-place and marker rendering
SafeImagePreview's ZoomableImage gains a scale-aware overlay slot so pins keep their on-screen size while zoomed

Frontend

Issues: 3 issues

Files (4)

products/desktop/packages/ui/src/features/sessions/components/ArtifactPreview.tsx
products/desktop/packages/ui/src/features/sessions/components/ArtifactDocumentCommentAction.tsx
products/desktop/packages/ui/src/features/code-editor/components/SelectionCommentOverlay.tsx
products/desktop/packages/ui/src/features/code-editor/components/DocumentPreviewHeader.tsx

What were the main changes

ArtifactPreview wires comment threads/anchors into markdown, HTML, image, and generic previews, all gated behind useCommentsEnabled
New ArtifactDocumentCommentAction popover for whole-document (non-anchored) comments
SelectionCommentOverlay extended to host an inline CommentComposer with mentions, viewport-aware positioning, and outside-click dismissal
DocumentPreviewHeader refactored from radix Flex/IconButton to quill Button/Tooltip and gains an actions slot for the comment action

Feature

Issues: 4 issues

Files (1)

products/desktop/packages/ui/src/features/canvas/components/TaskCommentsList.tsx

What were the main changes

New TaskCommentsList: the task's unified Comments tab merging task, artifact, canvas, and GitHub PR threads with source/state filters, focus-and-scroll navigation, and a composer
Caps PR sources fan-out (MAX_PR_COMMENT_SOURCES = 20) before starting comment/review/title queries, addressing unbounded GitHub request fan-out feedback

Generated-By: PostHog Code Task-Id: f0ed2ac4-cacd-44a9-b6a5-ab46f42f4c49

adamleithp

If you need it

puemos · 2026-08-07T06:38:36Z

/trunk merge

deployment-status-posthog · 2026-08-07T07:29:33Z

Deploy status

Environment	Status	Deployed At	Workflow
dev	✅ Deployed	2026-08-07 07:29 UTC	Run
prod-us	✅ Deployed	2026-08-07 07:43 UTC	Run
prod-eu	✅ Deployed	2026-08-07 07:45 UTC	Run

puemos mentioned this pull request Aug 6, 2026

feat(comments): canvas commenting and historical version replay #78691

Merged

1 task

pr-assigner-resolver-posthog Bot assigned puemos Aug 6, 2026

puemos force-pushed the posthog-code/comments-desktop-core branch from 741d487 to cdfe7f3 Compare August 6, 2026 08:18

puemos marked this pull request as ready for review August 6, 2026 08:53