feat: add comments to task artifacts

[puemos]

Migrated from #3970 — this is the artifact-comments work recreated on a posthog-code/ branch and squashed into one signed commit for the PostHog Code workflow. The original branch was 46 commits behind main; this is rebased onto current main. Original PR: #3970.

Summary

Adds Google Docs/Figma-style commenting to task artifact tabs:

• inline text comments on Markdown and HTML
• yellow circular comment pins on images
• document-level comments for every artifact
• sidebar threads with replies, mentions, Open/Resolved filtering, resolve/reopen, and anchor navigation
• comment counts in artifact rows

Resolved threads remain available under the Resolved filter but are not rendered on the artifact: no text highlight, click target, or image pin.

Architecture

• Reuses PostHog's generic Django Comment API with scope=task_artifact; no new persistence model.
• Reuses the generated OpenAPI client for paginated reads and writes.
• Reuses Thread's MentionComposer/MentionText and the API's existing mentions field.
• Reuses Quill for cards, controls, filters, badges, empty states, avatars, and comment inputs.
• Uses one small Zod-validated anchor union: text quote+position, normalized image region, or document.
• Stores only { anchor, threadState? } in item_context; artifact identity remains the existing item_id.
• Groups roots/replies and calculates resolved state once, shared by the sidebar and renderers.
• Uses PAT-compatible thread-state replies for resolve/reopen because the generic /complete action rejects PAT access.

HTML artifacts

Inspired by Peek's open-source annotation bridge:

• render original authored HTML in an opaque-origin iframe
• inject a small selection/highlight bridge
• exchange validated anchors over postMessage
• preserve authored CSS/resources while keeping allow-same-origin disabled

Images

The existing ZoomableImage primitive now accepts an optional overlay. Pins and placement transform with the image automatically, without geometry polling or format-specific zoom logic.

Validation

• API, core, and UI typechecks
• 36 focused tests
• Biome
• host-boundary check
• React Doctor: zero errors

---

Created with PostHog Code

[trunk-io]

Merging to main in this repository is managed by Trunk.

• To merge this pull request, check the box to the left or comment /trunk merge below.

After your PR is submitted to the merge queue, this comment will be automatically updated with its status. If the PR fails, failure details will also be posted here

[github-actions]

React Doctor found 9 issues in 2 files · 9 warnings.

9 warnings

src/features/canvas/components/TaskCommentsList.tsx

• ⚠️ src/features/canvas/components/TaskCommentsList.tsx:156 JSX element passed as a prop jsx-no-jsx-as-prop
• ⚠️ src/features/canvas/components/TaskCommentsList.tsx:205 JSX element passed as a prop jsx-no-jsx-as-prop
• ⚠️ src/features/canvas/components/TaskCommentsList.tsx:235 Large component is hard to read and change no-giant-component
• ⚠️ src/features/canvas/components/TaskCommentsList.tsx:340 Derived value copied into state no-derived-state
• ⚠️ src/features/canvas/components/TaskCommentsList.tsx:361 Multiple setState calls in one effect no-cascading-set-state
• ⚠️ src/features/canvas/components/TaskCommentsList.tsx:367 Derived value copied into state no-derived-state
• ⚠️ src/features/canvas/components/TaskCommentsList.tsx:368 Derived value copied into state no-derived-state
• ⚠️ src/features/canvas/components/TaskCommentsList.tsx:373 Derived value copied into state no-derived-state

src/features/sessions/components/ArtifactPreview.tsx

• ⚠️ src/features/sessions/components/ArtifactPreview.tsx:173 Derived value copied into state no-derived-state

_{Reviewed by React Doctor for commit cfdf89b.}