feat(comments): introduce inline commenting (#5606)

* feat(comments): add inline comments

Co-Authored-By: Per-Kristian Nordnes <per.kristian.nordnes@gmail.com>

* feat(comments): enhance optimistic updates by tracking the transaction ID

Co-Authored-By: Per-Kristian Nordnes <per.kristian.nordnes@gmail.com>

* fix(comments): clean up, remove unused code

* fix(comments): remove unneccesary memoization, fix broken query

* fix(comments): enable check

* fix(comments): disable comments for ai assist and when in upsell mode

* feat(comments): use DMP to track commented ranges across edits

* test(comments): update test and workshop

* feat(comments): add optional throttle option to update operation

* fix(comments): boundary element for inline commenting popovers

* fix(comments): only patch comment document when range decorators are moved by local changes

* fix(comments): throttled updates

* fix(comments): recalculate ranges when `rangeDecorationMove` is triggered but only proceed with updating the comment document if the current user made changes

* feat(comments): add `contentSnapshot`

fix(comments): type

* feat(comments): inline decorator color

* feat(comments): omit inline comments without referenced value (#5760)

* feat(comments): re-calculate range decoration for individual changed comment

Co-Authored-By: Per-Kristian Nordnes <per.kristian.nordnes@gmail.com>

* fix(comments): clean up throttle id map in update operation

* refactor(comments): add selection type, correct variable names

* refactor(comments): disable logic that omit inline comments without any referenced value

* feat(comments): store document revision id + add design when inline comment do not have a referenced value

* dev(test-studio): add `commentsCI` document type

* test(comments): add test ids

* test(comments): add e2e test for inline comment creation

* test(comments): add missing property in range decoration test

fix

fix

* test(comments): update inline comment creation e2e

* feat(comments): include optimistic update in throttled function

* feat(comments): add `CommentDisabledIcon`

* feat(comments): improve perf when editing content with comments

* feat(comments): implement UI when inline comment creation is disabled

* dev(comments): add `CommentsListItemLayout` story

* dev(comments): update `CommentsListItemReferencedValue` story

* feat(comments): add UI when inline comment is referencing a deleted value

* fix(comments): fix some issues with the range tracking algo

* Fixes an issue where adding text inside single word ranges didn't expand correctly
* Fixes an issue where bolding partially inside a range expanded the range incorrectly
* Replaces child and comment range start/end indicators with unused utf-8 chars to avoid conflicts with user content

* test(comments): break apart inline comment range tests

Have each test in it's own file to make them easier to write and read.
Ditch snapshot testing and test against hard coded values that makes
it easier to undstand what is going on.

* test(comments): temporarily only run tests in Chromium due to flakiness

* refactor(comments): refactor buildRangeDecorationSelectionsFromComments

Improve invalidation of range decorations when text is edited

* refactor(comments): refactor CommentsPortableTextInput

Improve how we move and update range decorations when content is edited

* test(comments): update workshop story for CommentInlineHighlightDebug

* test(comments): add new tests (skipped for now)

* fix(comments): check if selection overlaps with added comments

* fix(comments): referenced value UI

* feat(comments): update referenced value design

* test(comments): use test over it

* feat(comments): localize strings

* feat(comments): preserve local dirty flags when receiving comments from the server

* fix(comments): improve performance on finding text ranges in side panel

* feat(comments): show comment button on mouse up

* chore(comments): temporarily disable inline comments

* fix(comments): remove `console.log` in `CommentsPortableTextInput`

---------

Co-authored-by: Per-Kristian Nordnes <per.kristian.nordnes@gmail.com>

Author: hermanwikner

dev/test-studio/schema/ci/comments.ts

@@ -0,0 +1,36 @@
+import {defineField, type PortableTextBlock} from 'sanity'
+
+const INITIAL_VALUE: PortableTextBlock[] = [
+  {
+    _key: 'ROOT_KEY',
+    children: [
+      {
+        _type: 'span',
+        marks: [],
+        text: 'This is some text in the body field',
+        _key: 'CHILD_KEY',
+      },
+    ],
+    markDefs: [],
+    _type: 'block',
+    style: 'normal',
+  },
+]
+
+export const commentsCI = defineField({
+  type: 'document',
+  name: 'commentsCI',
+  title: 'Comments CI',
+  fields: [
+    {
+      name: 'body',
+      type: 'array',
+      initialValue: INITIAL_VALUE,
+      of: [
+        {
+          type: 'block',
+        },
+      ],
+    },
+  ],
+})

dev/test-studio/schema/debug/comments.ts

@@ -12,6 +12,11 @@ export const commentsDebug = defineType({
       type: 'string',
       title: 'String title',
     },
+    {
+      type: 'array',
+      name: 'body',
+      of: [{type: 'block'}],
+    },
     {
       name: 'hideFields',
       type: 'boolean',