@dxos/plugin-thread 0.7.4-staging.f7e8224 → 0.7.5-labs.5f04cf6

package/src/components/CommentContainer.tsx

@@ -5,8 +5,7 @@
 import { CheckCircle, X } from '@phosphor-icons/react';
 import React, { useCallback, useMemo, useRef, useState } from 'react';
 
-import { create } from '@dxos/live-object';
-import { MessageType } from '@dxos/plugin-space/types';
+import { RefArray } from '@dxos/live-object';
 import { fullyQualifiedId, getSpace, useMembers } from '@dxos/react-client/echo';
 import { useIdentity } from '@dxos/react-client/halo';
 import { Button, Tag, Tooltip, useThemeContext, useTranslation } from '@dxos/react-ui';
@@ -56,7 +55,7 @@ const ToggleResolvedButton = ({
         </Button>
       </Tooltip.Trigger>
       <Tooltip.Portal>
-        <Tooltip.Content classNames={'z-[21]'}>
+        <Tooltip.Content>
           {label}
           <Tooltip.Arrow />
         </Tooltip.Content>
@@ -82,7 +81,7 @@ const DeleteThreadButton = ({ onDelete }: { onDelete: () => void }) => {
         </Button>
       </Tooltip.Trigger>
       <Tooltip.Portal>
-        <Tooltip.Content classNames='z-[21]'>
+        <Tooltip.Content classNames='z-30'>
           {label}
           <Tooltip.Arrow />
         </Tooltip.Content>
@@ -94,13 +93,12 @@ const DeleteThreadButton = ({ onDelete }: { onDelete: () => void }) => {
 export const CommentContainer = ({
   thread,
   detached,
-  context,
   current,
   onAttend,
-  onThreadDelete,
-  onMessageDelete,
-  onResolve,
   onComment,
+  onResolve,
+  onMessageDelete,
+  onThreadDelete,
 }: ThreadContainerProps) => {
   const identity = useIdentity()!;
   const space = getSpace(thread);
@@ -129,31 +127,26 @@ export const CommentContainer = ({
   const scrollToEnd = (behavior: ScrollBehavior) =>
     setTimeout(() => threadScrollRef.current?.scrollIntoView({ behavior, block: 'end' }), 10);
 
-  const handleCreate: MessageTextboxProps['onSend'] = useCallback(() => {
+  const handleAttend = useCallback(() => onAttend?.(thread), [onAttend, thread]);
+  const handleResolve = useCallback(() => onResolve?.(thread), [onResolve, thread]);
+  const handleMessageDelete = useCallback((id: string) => onMessageDelete?.(thread, id), [onMessageDelete, thread]);
+  const handleThreadDelete = useCallback(() => onThreadDelete?.(thread), [onThreadDelete, thread]);
+
+  const handleComment: MessageTextboxProps['onSend'] = useCallback(() => {
     if (!messageRef.current) {
       return false;
     }
 
-    thread.messages.push(
-      create(MessageType, {
-        sender: { identityKey: identity.identityKey.toHex() },
-        timestamp: new Date().toISOString(),
-        text: messageRef.current,
-        context,
-      }),
-    );
-    onComment?.(thread);
-
+    onComment?.(thread, messageRef.current);
     messageRef.current = '';
     scrollToEnd('instant');
     rerenderEditor();
 
-    // TODO(burdon): Scroll to bottom.
     return true;
   }, [thread, identity]);
 
   return (
-    <Thread onClickCapture={onAttend} onFocusCapture={onAttend} current={current} id={fullyQualifiedId(thread)}>
+    <Thread onClickCapture={handleAttend} onFocusCapture={handleAttend} current={current} id={fullyQualifiedId(thread)}>
       <div
         role='none'
         className={mx(
@@ -168,7 +161,7 @@ export const CommentContainer = ({
               <ThreadHeading detached>{thread.name}</ThreadHeading>
             </Tooltip.Trigger>
             <Tooltip.Portal>
-              <Tooltip.Content classNames='z-[21]' side='top'>
+              <Tooltip.Content classNames='z-30' side='top'>
                 {t('detached thread label')}
                 <Tooltip.Arrow />
               </Tooltip.Content>
@@ -180,18 +173,14 @@ export const CommentContainer = ({
         <div className='flex flex-row items-center pli-1'>
           {thread.status === 'staged' && <Tag palette='neutral'>{t('draft button')}</Tag>}
           {onResolve && !(thread?.status === 'staged') && (
-            <ToggleResolvedButton isResolved={thread?.status === 'resolved'} onResolve={onResolve} />
+            <ToggleResolvedButton isResolved={thread?.status === 'resolved'} onResolve={handleResolve} />
           )}
-          {onThreadDelete && <DeleteThreadButton onDelete={onThreadDelete} />}
+          {onThreadDelete && <DeleteThreadButton onDelete={handleThreadDelete} />}
         </div>
       </div>
-      {thread.messages.filter(nonNullable).map((message) => (
-        <MessageContainer
-          key={message.id}
-          message={message}
-          members={members}
-          onDelete={(id: string) => onMessageDelete?.(id)}
-        />
+      {/** TODO(dmaretskyi): How's `thread.messages` undefined? */}
+      {RefArray.allResolvedTargets(thread.messages?.filter(nonNullable) ?? []).map((message) => (
+        <MessageContainer key={message.id} message={message} members={members} onDelete={handleMessageDelete} />
       ))}
       {/*
         TODO(wittjosiah): Can't autofocus this generally.
@@ -199,7 +188,7 @@ export const CommentContainer = ({
           Also, it steals focus from documents when first rendered.
           Need to find a way to autofocus in one scenario only: when a new thread is created.
       */}
-      <MessageTextbox extensions={extensions} onSend={handleCreate} {...textboxMetadata} />
+      <MessageTextbox extensions={extensions} onSend={handleComment} {...textboxMetadata} />
       <ThreadFooter activity={activity}>{t('activity message')}</ThreadFooter>
       {/* NOTE(thure): This can’t also be the `overflow-anchor` because `ScrollArea` injects an interceding node that contains this necessary ref’d element. */}
       <div role='none' className='bs-px -mbs-px' ref={threadScrollRef} />

package/src/components/CommentsContainer.tsx

@@ -14,10 +14,7 @@ import { CommentContainer } from './CommentContainer';
 import { type ThreadContainerProps } from './types';
 import { THREAD_PLUGIN } from '../meta';
 
-export type ThreadsContainerProps = Omit<
-  ThreadContainerProps,
-  'thread' | 'detached' | 'onAttend' | 'onThreadDelete' | 'onMessageDelete' | 'current' | 'autoFocus'
-> & {
+export type ThreadsContainerProps = Omit<ThreadContainerProps, 'thread' | 'detached' | 'current' | 'autoFocus'> & {
   threads: ThreadType[];
   /**
    * Threads that are no longer anchored to a position in the object.
@@ -25,11 +22,6 @@ export type ThreadsContainerProps = Omit<
   detached?: string[];
   currentId?: string;
   showResolvedThreads?: boolean;
-  onThreadAttend?: (thread: ThreadType) => void;
-  onThreadDelete?: (thread: ThreadType) => void;
-  onMessageDelete?: (thread: ThreadType, messageId: string) => void;
-  onThreadToggleResolved?: (thread: ThreadType) => void;
-  onComment?: (thread: ThreadType) => void;
 };
 
 /**
@@ -40,10 +32,6 @@ export const CommentsContainer = ({
   detached = [],
   currentId,
   showResolvedThreads,
-  onThreadAttend,
-  onThreadDelete,
-  onMessageDelete,
-  onThreadToggleResolved,
   ...props
 }: ThreadsContainerProps) => {
   const { t } = useTranslation(THREAD_PLUGIN);
@@ -66,10 +54,6 @@ export const CommentsContainer = ({
               thread={thread}
               current={currentId === threadId}
               detached={detached.includes(threadId)}
-              {...(onThreadAttend && { onAttend: () => onThreadAttend(thread) })}
-              {...(onThreadDelete && { onThreadDelete: () => onThreadDelete(thread) })}
-              {...(onMessageDelete && { onMessageDelete: (messageId: string) => onMessageDelete(thread, messageId) })}
-              {...(onThreadToggleResolved && { onResolve: () => onThreadToggleResolved(thread) })}
               {...props}
             />
           );

package/src/components/MessageContainer.tsx

@@ -7,6 +7,7 @@ import { Check, PencilSimple, X } from '@phosphor-icons/react';
 import React, { forwardRef, useCallback, useEffect, useRef, useState } from 'react';
 
 import { Surface } from '@dxos/app-framework';
+import { RefArray } from '@dxos/live-object';
 import { type MessageType } from '@dxos/plugin-space/types';
 import { PublicKey } from '@dxos/react-client';
 import { type ReactiveEchoObject, type Expando, type SpaceMember } from '@dxos/react-client/echo';
@@ -22,7 +23,6 @@ import {
   mx,
 } from '@dxos/react-ui-theme';
 import { MessageHeading, MessageRoot } from '@dxos/react-ui-thread';
-import { nonNullable } from '@dxos/util';
 
 import { command } from './command-extension';
 import { useOnEditAnalytics } from '../hooks';
@@ -70,7 +70,7 @@ export const MessageContainer = ({
                 </Button>
               </Tooltip.Trigger>
               <Tooltip.Portal>
-                <Tooltip.Content classNames='z-[21]'>
+                <Tooltip.Content>
                   {editLabel}
                   <Tooltip.Arrow />
                 </Tooltip.Content>
@@ -91,7 +91,7 @@ export const MessageContainer = ({
                 </Button>
               </Tooltip.Trigger>
               <Tooltip.Portal>
-                <Tooltip.Content classNames='z-[21]'>
+                <Tooltip.Content>
                   {deleteLabel}
                   <Tooltip.Arrow />
                 </Tooltip.Content>
@@ -101,7 +101,9 @@ export const MessageContainer = ({
         </ButtonGroup>
       </MessageHeading>
       <TextboxBlock message={message} isAuthor={userIsAuthor} editing={editing} />
-      {message.parts?.filter(nonNullable).map((part, index) => <MessagePart key={index} part={part} />)}
+      {RefArray.allResolvedTargets(message.parts ?? []).map((part, index) => (
+        <MessagePart key={index} part={part} />
+      ))}
     </MessageRoot>
   );
 };
@@ -180,7 +182,7 @@ const MessageBlockObjectTile: MosaicTileComponent<ReactiveEchoObject<any>> = for
         <Surface
           role='card'
           limit={1}
-          data={{ content: item }}
+          data={{ subject: item }}
           draggableProps={draggableProps}
           fallback={title}
           {...props}

package/src/components/ThreadComplementary.tsx

@@ -2,47 +2,40 @@
 // Copyright 2024 DXOS.org
 //
 
-import React, { useEffect, useMemo } from 'react';
+import React, { useCallback, useEffect, useMemo } from 'react';
 
-import { LayoutAction, type Plugin, useIntentDispatcher, useResolvePlugins } from '@dxos/app-framework';
-import { type ThreadType } from '@dxos/plugin-space';
-import { fullyQualifiedId } from '@dxos/react-client/echo';
+import { createIntent, LayoutAction, useCapabilities, useCapability, useIntentDispatcher } from '@dxos/app-framework';
+import { ThreadCapabilities } from '@dxos/plugin-space';
+import { MessageType, type ThreadType } from '@dxos/plugin-space/types';
+import { create, fullyQualifiedId, makeRef, RefArray } from '@dxos/react-client/echo';
+import { useIdentity } from '@dxos/react-client/halo';
 import { useAttended } from '@dxos/react-ui-attention';
 import { nonNullable } from '@dxos/util';
 
+import { ThreadCapabilities as LocalThreadCapabilities } from '../capabilities';
 import { CommentsContainer } from '../components';
-import { THREAD_PLUGIN } from '../meta';
-import { ThreadAction, type ThreadProvides } from '../types';
-
-const providesThreadsConfig = (plugin: any): Plugin<ThreadProvides<any>> | undefined =>
-  'thread' in plugin.provides ? (plugin as Plugin<ThreadProvides<any>>) : undefined;
-
-export const ThreadComplementary = ({
-  role,
-  subject,
-  drafts,
-  current,
-  showResolvedThreads,
-}: {
-  role: string;
-  subject: any;
-  drafts: ThreadType[] | undefined;
-  current?: string;
-  showResolvedThreads?: boolean;
-}) => {
-  const dispatch = useIntentDispatcher();
-
-  const threadsIntegrators = useResolvePlugins(providesThreadsConfig);
-  const threadProvides = useMemo(() => threadsIntegrators.map((p) => p.provides.thread), [threadsIntegrators]);
+import { ThreadAction } from '../types';
+
+export const ThreadComplementary = ({ subject }: { subject: any }) => {
+  const { dispatchPromise: dispatch } = useIntentDispatcher();
+  const identity = useIdentity();
+
+  const { state, getViewState } = useCapability(LocalThreadCapabilities.MutableState);
+  const { showResolvedThreads } = getViewState(fullyQualifiedId(subject));
+  const drafts = state.drafts[fullyQualifiedId(subject)];
+
+  const threadsIntegrators = useCapabilities(ThreadCapabilities.Thread);
   const createSort = useMemo(
-    () => threadProvides.find((p) => p.predicate(subject))?.createSort,
-    [threadProvides, subject],
+    () => threadsIntegrators.find((p) => p.predicate(subject))?.createSort,
+    [threadsIntegrators, subject],
   );
   const sort = useMemo(() => createSort?.(subject), [createSort, subject]);
 
+  const threadObjects = RefArray.allResolvedTargets(subject.threads ?? []);
+
   const threads = useMemo(() => {
-    return subject.threads.concat(drafts ?? []).filter(nonNullable) as ThreadType[];
-  }, [JSON.stringify(subject.threads), JSON.stringify(drafts)]);
+    return threadObjects.concat(drafts ?? []).filter(nonNullable) as ThreadType[];
+  }, [JSON.stringify(threadObjects), JSON.stringify(drafts)]);
 
   const detachedIds = useMemo(() => {
     return threads.filter(({ anchor }) => !anchor).map((thread) => fullyQualifiedId(thread));
@@ -58,48 +51,75 @@ export const ThreadComplementary = ({
   const attended = useAttended();
   const qualifiedSubjectId = fullyQualifiedId(subject);
 
+  const handleAttend = useCallback(
+    (thread: ThreadType) => {
+      const threadId = fullyQualifiedId(thread);
+      if (state.current !== threadId) {
+        state.current = threadId;
+
+        // TODO(wittjosiah): Should this be a thread-specific intent?
+        //  The layout doesn't know about threads and this working depends on other plugins conditionally handling it.
+        //  This may be overloading this intent or highjacking its intended purpose.
+        void dispatch(
+          createIntent(LayoutAction.ScrollIntoView, {
+            id: fullyQualifiedId(subject),
+            cursor: thread.anchor,
+            ref: threadId,
+          }),
+        );
+      }
+    },
+    [state.current, dispatch, subject],
+  );
+
+  const handleComment = useCallback(
+    async (thread: ThreadType, message: string) => {
+      thread.messages.push(
+        makeRef(
+          create(MessageType, {
+            sender: { identityKey: identity?.identityKey.toHex() },
+            timestamp: new Date().toISOString(),
+            text: message,
+            // TODO(wittjosiah): Context based on attention.
+            // context: context ? makeRef(context) : undefined,
+          }),
+        ),
+      );
+
+      await dispatch(createIntent(ThreadAction.OnMessageAdd, { thread, subject }));
+
+      state.current = fullyQualifiedId(thread);
+    },
+    [dispatch, identity, subject],
+  );
+
+  const handleResolve = useCallback(
+    (thread: ThreadType) => dispatch(createIntent(ThreadAction.ToggleResolved, { thread })),
+    [dispatch],
+  );
+
+  const handleThreadDelete = useCallback(
+    (thread: ThreadType) => dispatch(createIntent(ThreadAction.Delete, { thread, subject })),
+    [dispatch, subject],
+  );
+
+  const handleMessageDelete = useCallback(
+    (thread: ThreadType, messageId: string) =>
+      dispatch(createIntent(ThreadAction.DeleteMessage, { thread, subject, messageId })),
+    [dispatch, subject],
+  );
+
   return (
     <CommentsContainer
       threads={threads}
       detached={detachedIds}
-      currentId={attended.includes(qualifiedSubjectId) ? current : undefined}
+      currentId={attended.includes(qualifiedSubjectId) ? state.current : undefined}
       showResolvedThreads={showResolvedThreads}
-      onThreadAttend={(thread) => {
-        const threadId = fullyQualifiedId(thread);
-        if (current !== threadId) {
-          current = threadId;
-
-          // TODO(wittjosiah): Should this be a thread-specific intent?
-          //  The layout doesn't know about threads and this working depends on other plugins conditionally handling it.
-          //  This may be overloading this intent or highjacking its intended purpose.
-          void dispatch?.([
-            {
-              action: LayoutAction.SCROLL_INTO_VIEW,
-              data: {
-                id: fullyQualifiedId(subject),
-                thread: threadId,
-                cursor: thread.anchor,
-              },
-            },
-          ]);
-        }
-      }}
-      onThreadDelete={(thread) => {
-        return dispatch({ plugin: THREAD_PLUGIN, action: ThreadAction.DELETE, data: { subject, thread } });
-      }}
-      onMessageDelete={(thread, messageId) =>
-        dispatch({
-          plugin: THREAD_PLUGIN,
-          action: ThreadAction.DELETE_MESSAGE,
-          data: { subject, thread, messageId },
-        })
-      }
-      onThreadToggleResolved={(thread) =>
-        dispatch({ plugin: THREAD_PLUGIN, action: ThreadAction.TOGGLE_RESOLVED, data: { thread } })
-      }
-      onComment={(thread) => {
-        void dispatch({ action: ThreadAction.ON_MESSAGE_ADD, data: { thread, subject } });
-      }}
+      onAttend={handleAttend}
+      onComment={handleComment}
+      onResolve={handleResolve}
+      onMessageDelete={handleMessageDelete}
+      onThreadDelete={handleThreadDelete}
     />
   );
 };

package/src/components/ThreadContainer.tsx

@@ -0,0 +1,22 @@
+//
+// Copyright 2024 DXOS.org
+//
+
+import React, { type ComponentProps } from 'react';
+
+import { StackItem } from '@dxos/react-ui-stack';
+
+import { ChatContainer } from './ChatContainer';
+
+const ThreadContainer = ({
+  role,
+  ...props
+}: Pick<ComponentProps<typeof ChatContainer>, 'thread' | 'context'> & { role: string }) => {
+  return (
+    <StackItem.Content toolbar={false}>
+      <ChatContainer {...props} />
+    </StackItem.Content>
+  );
+};
+
+export default ThreadContainer;

package/src/components/index.ts

@@ -4,8 +4,7 @@
 
 import { lazy } from 'react';
 
-export const ThreadMain = lazy(() => import('./ThreadMain'));
-export const ThreadArticle = lazy(() => import('./ThreadArticle'));
+export const ThreadContainer = lazy(() => import('./ThreadContainer'));
 
 // TODO(wittjosiah): Suspense boundary for sidebar?
 export * from './CommentContainer';

package/src/components/testing.ts

@@ -4,7 +4,7 @@
 
 import { Expando } from '@dxos/echo-schema';
 import { PublicKey } from '@dxos/keys';
-import { create } from '@dxos/live-object';
+import { create, makeRef } from '@dxos/live-object';
 import { MessageType, ThreadType } from '@dxos/plugin-space/types';
 import { faker } from '@dxos/random';
 import { type Identity } from '@dxos/react-client/halo';
@@ -12,20 +12,22 @@ import { type Identity } from '@dxos/react-client/halo';
 export const createChatThread = (identity: Identity) => {
   return create(ThreadType, {
     messages: Array.from({ length: 8 }).map(() =>
-      create(MessageType, {
-        sender: {
-          identityKey: faker.datatype.boolean() ? identity.identityKey.toHex() : PublicKey.random().toHex(),
-        },
-        timestamp: faker.date.recent().toISOString(),
-        text: faker.lorem.sentences(3),
-        parts: faker.helpers.multiple(
-          () =>
-            faker.datatype.boolean({ probability: 0.8 })
-              ? undefined
-              : create(Expando, { name: faker.lorem.sentence() }),
-          { count: { min: 1, max: 3 } },
-        ),
-      }),
+      makeRef(
+        create(MessageType, {
+          sender: {
+            identityKey: faker.datatype.boolean() ? identity.identityKey.toHex() : PublicKey.random().toHex(),
+          },
+          timestamp: faker.date.recent().toISOString(),
+          text: faker.lorem.sentences(3),
+          parts: faker.helpers.multiple(
+            () =>
+              faker.datatype.boolean({ probability: 0.8 })
+                ? undefined
+                : (makeRef(create(Expando, { name: faker.lorem.sentence() })) as any), // TODO(dmaretskyi): Fix types in schema.
+            { count: { min: 1, max: 3 } },
+          ),
+        }),
+      ),
     ),
   });
 };
@@ -34,13 +36,15 @@ export const createCommentThread = (identity: Identity) => {
   return create(ThreadType, {
     messages: faker.helpers.multiple(
       () =>
-        create(MessageType, {
-          sender: {
-            identityKey: faker.datatype.boolean() ? identity.identityKey.toHex() : PublicKey.random().toHex(),
-          },
-          timestamp: new Date().toISOString(),
-          text: faker.lorem.sentences(3),
-        }),
+        makeRef(
+          create(MessageType, {
+            sender: {
+              identityKey: faker.datatype.boolean() ? identity.identityKey.toHex() : PublicKey.random().toHex(),
+            },
+            timestamp: new Date().toISOString(),
+            text: faker.lorem.sentences(3),
+          }),
+        ),
       { count: { min: 2, max: 3 } },
     ),
   });

package/src/components/types.ts

@@ -24,9 +24,9 @@ export type ThreadContainerProps = {
   autoFocusTextbox?: boolean;
   onTextboxFocus?: () => void;
   detached?: boolean;
-  onAttend?: () => void;
-  onResolve?: () => void;
-  onThreadDelete?: () => void;
-  onMessageDelete?: (messageId: string) => void;
-  onComment?: (thread: ThreadType) => void;
+  onAttend?: (thread: ThreadType) => void;
+  onComment?: (thread: ThreadType, message: string) => void;
+  onResolve?: (thread: ThreadType) => void;
+  onMessageDelete?: (thread: ThreadType, messageId: string) => void;
+  onThreadDelete?: (thread: ThreadType) => void;
 } & Pick<ThreadProps, 'current'>;

package/src/extensions/threads.ts

@@ -6,12 +6,13 @@ import { type Extension } from '@codemirror/state';
 import { EditorView } from '@codemirror/view';
 import { computed, effect } from '@preact/signals-core';
 
-import { type IntentDispatcher } from '@dxos/app-framework';
+import { createIntent, type PromiseIntentDispatcher } from '@dxos/app-framework';
+import { Ref } from '@dxos/echo-schema';
+import { RefArray } from '@dxos/live-object';
 import { type DocumentType } from '@dxos/plugin-markdown/types';
 import { ThreadType } from '@dxos/plugin-space/types';
 import { getSpace, getTextInRange, createDocAccessor, fullyQualifiedId } from '@dxos/react-client/echo';
 import { comments, createExternalCommentSync } from '@dxos/react-ui-editor';
-import { nonNullable } from '@dxos/util';
 
 import { ThreadAction, type ThreadState } from '../types';
 
@@ -19,14 +20,14 @@ import { ThreadAction, type ThreadState } from '../types';
 const getName = (doc: DocumentType, anchor: string): string | undefined => {
   if (doc.content) {
     const [start, end] = anchor.split(':');
-    return getTextInRange(createDocAccessor(doc.content, ['content']), start, end);
+    return getTextInRange(createDocAccessor(doc.content.target!, ['content']), start, end);
   }
 };
 
 /**
  * Construct plugins.
  */
-export const threads = (state: ThreadState, doc?: DocumentType, dispatch?: IntentDispatcher): Extension => {
+export const threads = (state: ThreadState, doc?: DocumentType, dispatch?: PromiseIntentDispatcher): Extension => {
   const space = doc && getSpace(doc);
   if (!doc || !space || !dispatch) {
     // Include no-op comments extension here to ensure that the facets are always present when they are expected.
@@ -36,7 +37,7 @@ export const threads = (state: ThreadState, doc?: DocumentType, dispatch?: Inten
 
   // TODO(Zan): When we have the deepsignal specific equivalent of this we should use that instead.
   const threads = computed(() =>
-    [...doc.threads.filter(nonNullable), ...(state.drafts[fullyQualifiedId(doc)] ?? [])].filter(
+    [...RefArray.allResolvedTargets(doc.threads), ...(state.drafts[fullyQualifiedId(doc)] ?? [])].filter(
       (thread) => !(thread?.status === 'resolved'),
     ),
   );
@@ -44,8 +45,8 @@ export const threads = (state: ThreadState, doc?: DocumentType, dispatch?: Inten
   return [
     EditorView.updateListener.of((update) => {
       if (update.docChanged) {
-        doc.threads.forEach((thread) => {
-          if (thread?.anchor) {
+        RefArray.allResolvedTargets(doc.threads).forEach((thread) => {
+          if (thread.anchor) {
             // Only update if the name has changed, otherwise this will cause an infinite loop.
             // Skip if the name is empty; this means comment text was deleted, but thread name should remain.
             const name = getName(doc, thread.anchor);
@@ -70,14 +71,7 @@ export const threads = (state: ThreadState, doc?: DocumentType, dispatch?: Inten
       id: fullyQualifiedId(doc),
       onCreate: ({ cursor }) => {
         const name = getName(doc, cursor);
-        void dispatch({
-          action: ThreadAction.CREATE,
-          data: {
-            cursor,
-            name,
-            subject: doc,
-          },
-        });
+        void dispatch(createIntent(ThreadAction.Create, { cursor, name, subject: doc }));
       },
       onDelete: ({ id }) => {
         const draft = state.drafts[fullyQualifiedId(doc)];
@@ -88,7 +82,7 @@ export const threads = (state: ThreadState, doc?: DocumentType, dispatch?: Inten
           }
         }
 
-        const thread = doc.threads.find((thread) => thread?.id === id);
+        const thread = doc.threads.find(Ref.hasObjectId(id))?.target;
         if (thread) {
           thread.anchor = undefined;
         }
@@ -96,21 +90,18 @@ export const threads = (state: ThreadState, doc?: DocumentType, dispatch?: Inten
       onUpdate: ({ id, cursor }) => {
         const thread =
           state.drafts[fullyQualifiedId(doc)]?.find((thread) => fullyQualifiedId(thread) === id) ??
-          doc.threads.find((thread) => thread?.id === id);
+          doc.threads.find(Ref.hasObjectId(id))?.target;
 
         if (thread instanceof ThreadType && thread.anchor) {
           thread.name = getName(doc, thread.anchor);
           thread.anchor = cursor;
         }
       },
-      onSelect: ({ selection: { current, closest } }) => {
-        void dispatch({
-          action: ThreadAction.SELECT,
-          data: {
-            current: current ?? closest,
-            skipOpen: true,
-          },
-        });
+      onSelect: ({ selection }) => {
+        const current = selection.current ?? selection.closest;
+        if (current) {
+          void dispatch(createIntent(ThreadAction.Select, { current, skipOpen: true }));
+        }
       },
     }),
   ];

package/src/hooks/analytics.ts

@@ -4,24 +4,20 @@
 
 import { useCallback } from 'react';
 
-import { useIntentDispatcher } from '@dxos/app-framework';
+import { createIntent, useIntentDispatcher } from '@dxos/app-framework';
 import { type ReactiveObject } from '@dxos/live-object';
-import { ObservabilityAction } from '@dxos/plugin-observability/meta';
+import { ObservabilityAction } from '@dxos/plugin-observability/types';
 import { getSpace } from '@dxos/react-client/echo';
 import { useOnTransition } from '@dxos/react-ui';
 
 export const useAnalyticsCallback = (spaceId: string | undefined, name: string, meta?: any) => {
-  const dispatch = useIntentDispatcher();
+  const { dispatchPromise: dispatch } = useIntentDispatcher();
 
   return useCallback(
     (dynamicMeta?: any) => {
-      void dispatch({
-        action: ObservabilityAction.SEND_EVENT,
-        data: {
-          name,
-          properties: { ...meta, ...dynamicMeta, spaceId },
-        },
-      });
+      void dispatch(
+        createIntent(ObservabilityAction.SendEvent, { name, properties: { ...meta, ...dynamicMeta, spaceId } }),
+      );
     },
     [dispatch, name, meta, spaceId],
   );