@dxos/plugin-thread 0.6.11-staging.e6894a4 → 0.6.12-main.5cc132e

package/dist/lib/node/index.cjs

@@ -28,16 +28,16 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var node_exports = {};
 __export(node_exports, {
-  ThreadAction: () => import_chunk_D5GOVXHS.ThreadAction,
+  ThreadAction: () => import_chunk_4B2ARV7L.ThreadAction,
   ThreadPlugin: () => ThreadPlugin,
   default: () => src_default,
-  useAnalyticsCallback: () => import_chunk_5PZNPPQF.useAnalyticsCallback,
-  useOnEditAnalytics: () => import_chunk_5PZNPPQF.useOnEditAnalytics,
-  useStatus: () => import_chunk_5PZNPPQF.useStatus
+  useAnalyticsCallback: () => import_chunk_T7TXCNHL.useAnalyticsCallback,
+  useOnEditAnalytics: () => import_chunk_T7TXCNHL.useOnEditAnalytics,
+  useStatus: () => import_chunk_T7TXCNHL.useStatus
 });
 module.exports = __toCommonJS(node_exports);
-var import_chunk_D5GOVXHS = require("./chunk-D5GOVXHS.cjs");
-var import_chunk_5PZNPPQF = require("./chunk-5PZNPPQF.cjs");
+var import_chunk_4B2ARV7L = require("./chunk-4B2ARV7L.cjs");
+var import_chunk_T7TXCNHL = require("./chunk-T7TXCNHL.cjs");
 var import_chunk_BWBONZGU = require("./chunk-BWBONZGU.cjs");
 var import_react = require("@phosphor-icons/react");
 var import_signals_core = require("@preact/signals-core");
@@ -46,55 +46,60 @@ var import_app_framework = require("@dxos/app-framework");
 var import_echo_schema = require("@dxos/echo-schema");
 var import_echo_schema2 = require("@dxos/echo-schema");
 var import_local_storage = require("@dxos/local-storage");
+var import_log = require("@dxos/log");
 var import_plugin_attention = require("@dxos/plugin-attention");
 var import_plugin_client = require("@dxos/plugin-client");
 var import_plugin_graph = require("@dxos/plugin-graph");
-var import_types = require("@dxos/plugin-markdown/types");
 var import_meta = require("@dxos/plugin-observability/meta");
 var import_plugin_space = require("@dxos/plugin-space");
-var import_types2 = require("@dxos/plugin-space/types");
+var import_types = require("@dxos/plugin-space/types");
 var import_echo = require("@dxos/react-client/echo");
-var import_react_ui = require("@dxos/react-ui");
-var import_react_ui_attention = require("@dxos/react-ui-attention");
 var import_react_ui_editor = require("@dxos/react-ui-editor");
 var import_react_ui_thread = require("@dxos/react-ui-thread");
 var import_util = require("@dxos/util");
 var import_react3 = __toESM(require("react"));
 var import_react4 = __toESM(require("react"));
 var import_plugin_settings = require("@dxos/plugin-settings");
-var import_react_ui2 = require("@dxos/react-ui");
+var import_react_ui = require("@dxos/react-ui");
 var import_react5 = require("@phosphor-icons/react");
 var import_react6 = __toESM(require("react"));
 var import_echo_schema3 = require("@dxos/echo-schema");
-var import_types3 = require("@dxos/plugin-space/types");
+var import_types2 = require("@dxos/plugin-space/types");
 var import_echo2 = require("@dxos/react-client/echo");
 var import_halo = require("@dxos/react-client/halo");
-var import_react_ui3 = require("@dxos/react-ui");
+var import_react_ui2 = require("@dxos/react-ui");
 var import_react_ui_editor2 = require("@dxos/react-ui-editor");
 var import_react_ui_theme = require("@dxos/react-ui-theme");
 var import_react_ui_thread2 = require("@dxos/react-ui-thread");
 var import_util2 = require("@dxos/util");
 var import_react7 = require("@phosphor-icons/react");
 var import_react8 = __toESM(require("react"));
-var import_react_ui4 = require("@dxos/react-ui");
+var import_echo3 = require("@dxos/react-client/echo");
+var import_react_ui3 = require("@dxos/react-ui");
 var import_react_ui_deck = require("@dxos/react-ui-deck");
 var import_react_ui_theme2 = require("@dxos/react-ui-theme");
+var import_react9 = __toESM(require("react"));
+var import_app_framework2 = require("@dxos/app-framework");
+var import_echo4 = require("@dxos/react-client/echo");
+var import_react_ui4 = require("@dxos/react-ui");
+var import_react_ui_attention = require("@dxos/react-ui-attention");
+var import_util3 = require("@dxos/util");
 var ThreadSettings = ({ settings }) => {
-  const { t } = (0, import_react_ui2.useTranslation)(import_chunk_BWBONZGU.THREAD_PLUGIN);
+  const { t } = (0, import_react_ui.useTranslation)(import_chunk_BWBONZGU.THREAD_PLUGIN);
   return /* @__PURE__ */ import_react4.default.createElement(import_react4.default.Fragment, null, /* @__PURE__ */ import_react4.default.createElement(import_plugin_settings.SettingsValue, {
     label: t("settings standalone label")
-  }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Input.Switch, {
+  }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui.Input.Switch, {
     checked: settings.standalone,
     onCheckedChange: (checked) => settings.standalone = !!checked
   })));
 };
 var sizeClass = (0, import_react_ui_theme.getSize)(4);
 var ToggleResolvedButton = ({ isResolved, onResolve }) => {
-  const { t } = (0, import_react_ui3.useTranslation)(import_chunk_BWBONZGU.THREAD_PLUGIN);
+  const { t } = (0, import_react_ui2.useTranslation)(import_chunk_BWBONZGU.THREAD_PLUGIN);
   const label = t(isResolved ? "mark as unresolved label" : "mark as resolved label");
-  return /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Root, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Trigger, {
+  return /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Root, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Trigger, {
     asChild: true
-  }, /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Button, {
+  }, /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Button, {
     variant: "ghost",
     "data-testid": "thread.toggle-resolved",
     onClick: onResolve,
@@ -109,16 +114,16 @@ var ToggleResolvedButton = ({ isResolved, onResolve }) => {
     weight: "fill"
   }) : /* @__PURE__ */ import_react6.default.createElement(import_react5.CheckCircle, {
     className: sizeClass
-  }))), /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Portal, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Content, {
+  }))), /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Portal, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Content, {
     classNames: "z-[21]"
-  }, label, /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Arrow, null))));
+  }, label, /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Arrow, null))));
 };
 var DeleteThreadButton = ({ onDelete }) => {
-  const { t } = (0, import_react_ui3.useTranslation)(import_chunk_BWBONZGU.THREAD_PLUGIN);
+  const { t } = (0, import_react_ui2.useTranslation)(import_chunk_BWBONZGU.THREAD_PLUGIN);
   const label = t("delete thread label");
-  return /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Root, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Trigger, {
+  return /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Root, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Trigger, {
     asChild: true
-  }, /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Button, {
+  }, /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Button, {
     variant: "ghost",
     "data-testid": "thread.delete",
     onClick: onDelete,
@@ -130,20 +135,20 @@ var DeleteThreadButton = ({ onDelete }) => {
     className: "sr-only"
   }, label), /* @__PURE__ */ import_react6.default.createElement(import_react5.X, {
     className: sizeClass
-  }))), /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Portal, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Content, {
+  }))), /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Portal, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Content, {
     classNames: "z-[21]"
-  }, label, /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Arrow, null))));
+  }, label, /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Arrow, null))));
 };
 var CommentContainer = ({ thread, detached, context, current, autoFocusTextbox, onAttend, onThreadDelete, onMessageDelete, onResolve, onComment }) => {
   const identity = (0, import_halo.useIdentity)();
   const space = (0, import_echo2.getSpace)(thread);
   const members = (0, import_echo2.useMembers)(space?.key);
-  const activity = (0, import_chunk_5PZNPPQF.useStatus)(space, thread.id);
-  const { t } = (0, import_react_ui3.useTranslation)(import_chunk_BWBONZGU.THREAD_PLUGIN);
+  const activity = (0, import_chunk_T7TXCNHL.useStatus)(space, (0, import_echo2.fullyQualifiedId)(thread));
+  const { t } = (0, import_react_ui2.useTranslation)(import_chunk_BWBONZGU.THREAD_PLUGIN);
   const threadScrollRef = (0, import_react6.useRef)(null);
   const [autoFocus, setAutoFocus] = (0, import_react6.useState)(!!autoFocusTextbox);
-  const { themeMode } = (0, import_react_ui3.useThemeContext)();
-  const textboxMetadata = (0, import_chunk_5PZNPPQF.getMessageMetadata)(thread.id, identity);
+  const { themeMode } = (0, import_react_ui2.useThemeContext)();
+  const textboxMetadata = (0, import_chunk_T7TXCNHL.getMessageMetadata)((0, import_echo2.fullyQualifiedId)(thread), identity);
   const [_count, _setCount] = (0, import_react6.useState)(0);
   const rerenderEditor = () => _setCount((count) => count + 1);
   const messageRef = (0, import_react6.useRef)("");
@@ -157,7 +162,7 @@ var CommentContainer = ({ thread, detached, context, current, autoFocusTextbox,
     (0, import_react_ui_editor2.listener)({
       onChange: (text) => messageRef.current = text
     }),
-    import_chunk_5PZNPPQF.command
+    import_chunk_T7TXCNHL.command
   ], [
     _count
   ]);
@@ -174,7 +179,7 @@ var CommentContainer = ({ thread, detached, context, current, autoFocusTextbox,
     if (!messageRef.current) {
       return false;
     }
-    thread.messages.push((0, import_echo_schema3.create)(import_types3.MessageType, {
+    thread.messages.push((0, import_echo_schema3.create)(import_types2.MessageType, {
       sender: {
         identityKey: identity.identityKey.toHex()
       },
@@ -192,36 +197,35 @@ var CommentContainer = ({ thread, detached, context, current, autoFocusTextbox,
     thread,
     identity
   ]);
-  const handleDeleteMessage = (id) => onMessageDelete?.(id);
   return /* @__PURE__ */ import_react6.default.createElement(import_react_ui_thread2.Thread, {
     onClickCapture: onAttend,
     onFocusCapture: onAttend,
     current,
-    id: thread.id
+    id: (0, import_echo2.fullyQualifiedId)(thread)
   }, /* @__PURE__ */ import_react6.default.createElement("div", {
     role: "none",
     className: (0, import_react_ui_theme.mx)("col-span-2 grid grid-cols-[var(--rail-size)_1fr_min-content]", import_react_ui_theme.hoverableControls, import_react_ui_theme.hoverableFocusedWithinControls)
-  }, detached ? /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Root, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Trigger, {
+  }, detached ? /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Root, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Trigger, {
     asChild: true
   }, /* @__PURE__ */ import_react6.default.createElement(import_react_ui_thread2.ThreadHeading, {
     detached: true
-  }, thread.name ?? t("thread title placeholder"))), /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Portal, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Content, {
+  }, thread.name ?? t("thread title placeholder"))), /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Portal, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Content, {
     classNames: "z-[21]",
     side: "top"
-  }, t("detached thread label"), /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tooltip.Arrow, null)))) : /* @__PURE__ */ import_react6.default.createElement(import_react_ui_thread2.ThreadHeading, null, thread.name ?? t("thread title placeholder")), /* @__PURE__ */ import_react6.default.createElement("div", {
+  }, t("detached thread label"), /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tooltip.Arrow, null)))) : /* @__PURE__ */ import_react6.default.createElement(import_react_ui_thread2.ThreadHeading, null, thread.name ?? t("thread title placeholder")), /* @__PURE__ */ import_react6.default.createElement("div", {
     className: "flex flex-row items-center pli-1"
-  }, thread.status === "staged" && /* @__PURE__ */ import_react6.default.createElement(import_react_ui3.Tag, {
+  }, thread.status === "staged" && /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Tag, {
     palette: "neutral"
   }, t("draft button")), onResolve && !(thread?.status === "staged") && /* @__PURE__ */ import_react6.default.createElement(ToggleResolvedButton, {
     isResolved: thread?.status === "resolved",
     onResolve
   }), onThreadDelete && /* @__PURE__ */ import_react6.default.createElement(DeleteThreadButton, {
     onDelete: onThreadDelete
-  }))), thread.messages.filter(import_util2.nonNullable).map((message) => /* @__PURE__ */ import_react6.default.createElement(import_chunk_5PZNPPQF.MessageContainer, {
+  }))), thread.messages.filter(import_util2.nonNullable).map((message) => /* @__PURE__ */ import_react6.default.createElement(import_chunk_T7TXCNHL.MessageContainer, {
     key: message.id,
     message,
     members,
-    onDelete: handleDeleteMessage
+    onDelete: (id) => onMessageDelete?.(id)
   })), /* @__PURE__ */ import_react6.default.createElement(import_react_ui_thread2.MessageTextbox, {
     extensions,
     autoFocus,
@@ -236,7 +240,7 @@ var CommentContainer = ({ thread, detached, context, current, autoFocusTextbox,
   }));
 };
 var CommentsHeading = ({ attendableId }) => {
-  const { t } = (0, import_react_ui4.useTranslation)(import_chunk_BWBONZGU.THREAD_PLUGIN);
+  const { t } = (0, import_react_ui3.useTranslation)(import_chunk_BWBONZGU.THREAD_PLUGIN);
   return /* @__PURE__ */ import_react8.default.createElement("div", {
     role: "none",
     className: "flex items-center"
@@ -247,7 +251,7 @@ var CommentsHeading = ({ attendableId }) => {
   }, t("comments heading")));
 };
 var CommentsContainer = ({ threads, detached = [], currentId, autoFocusCurrentTextbox, showResolvedThreads, onThreadAttend, onThreadDelete, onMessageDelete, onThreadToggleResolved, ...props }) => {
-  const { t } = (0, import_react_ui4.useTranslation)(import_chunk_BWBONZGU.THREAD_PLUGIN);
+  const { t } = (0, import_react_ui3.useTranslation)(import_chunk_BWBONZGU.THREAD_PLUGIN);
   const filteredThreads = showResolvedThreads ? threads : threads.filter((thread) => !(thread?.status === "resolved"));
   (0, import_react8.useEffect)(() => {
     if (currentId) {
@@ -259,31 +263,34 @@ var CommentsContainer = ({ threads, detached = [], currentId, autoFocusCurrentTe
   }, [
     currentId
   ]);
-  return /* @__PURE__ */ import_react8.default.createElement(import_react8.default.Fragment, null, filteredThreads.length > 0 ? filteredThreads.map((thread) => /* @__PURE__ */ import_react8.default.createElement(CommentContainer, {
-    key: thread.id,
-    thread,
-    current: currentId === thread.id,
-    detached: detached.includes(thread.id),
-    autoFocusTextbox: autoFocusCurrentTextbox && currentId === thread.id,
-    ...onThreadAttend && {
-      onAttend: () => onThreadAttend(thread)
-    },
-    ...onThreadDelete && {
-      onThreadDelete: () => onThreadDelete(thread)
-    },
-    ...onMessageDelete && {
-      onMessageDelete: (messageId) => onMessageDelete(thread, messageId)
-    },
-    ...onThreadToggleResolved && {
-      onResolve: () => onThreadToggleResolved(thread)
-    },
-    ...props
-  })) : /* @__PURE__ */ import_react8.default.createElement("div", {
+  return /* @__PURE__ */ import_react8.default.createElement(import_react8.default.Fragment, null, filteredThreads.length > 0 ? filteredThreads.map((thread) => {
+    const threadId = (0, import_echo3.fullyQualifiedId)(thread);
+    return /* @__PURE__ */ import_react8.default.createElement(CommentContainer, {
+      key: threadId,
+      thread,
+      current: currentId === threadId,
+      detached: detached.includes(threadId),
+      autoFocusTextbox: autoFocusCurrentTextbox && currentId === threadId,
+      ...onThreadAttend && {
+        onAttend: () => onThreadAttend(thread)
+      },
+      ...onThreadDelete && {
+        onThreadDelete: () => onThreadDelete(thread)
+      },
+      ...onMessageDelete && {
+        onMessageDelete: (messageId) => onMessageDelete(thread, messageId)
+      },
+      ...onThreadToggleResolved && {
+        onResolve: () => onThreadToggleResolved(thread)
+      },
+      ...props
+    });
+  }) : /* @__PURE__ */ import_react8.default.createElement("div", {
     role: "alert",
     className: (0, import_react_ui_theme2.mx)(import_react_ui_theme2.descriptionText, "place-self-center border border-dashed border-neutral-400/50 rounded-lg text-center p-4 m-4")
   }, /* @__PURE__ */ import_react8.default.createElement("h2", {
     className: "mbe-2 font-medium text-baseText"
-  }, t("no comments title")), /* @__PURE__ */ import_react8.default.createElement("p", null, /* @__PURE__ */ import_react8.default.createElement(import_react_ui4.Trans, {
+  }, t("no comments title")), /* @__PURE__ */ import_react8.default.createElement("p", null, /* @__PURE__ */ import_react8.default.createElement(import_react_ui3.Trans, {
     t,
     i18nKey: "no comments message",
     components: {
@@ -293,8 +300,116 @@ var CommentsContainer = ({ threads, detached = [], currentId, autoFocusCurrentTe
     }
   }))));
 };
-var ThreadMain = import_react3.default.lazy(() => import("./ThreadMain-XJX75GHG.cjs"));
-var ThreadArticle = import_react3.default.lazy(() => import("./ThreadArticle-DO56JXBU.cjs"));
+var ThreadMain = import_react3.default.lazy(() => import("./ThreadMain-XSRB6NKJ.cjs"));
+var ThreadArticle = import_react3.default.lazy(() => import("./ThreadArticle-7BWXVIJ4.cjs"));
+var providesThreadsConfig = (plugin) => "thread" in plugin.provides ? plugin : void 0;
+var ThreadComplementary = ({ role, subject, stagedThreads, current, focus, showResolvedThreads }) => {
+  const dispatch = (0, import_app_framework2.useIntentDispatcher)();
+  const threadsIntegrators = (0, import_app_framework2.useResolvePlugins)(providesThreadsConfig);
+  const threadProvides = (0, import_react9.useMemo)(() => threadsIntegrators.map((p) => p.provides.thread), [
+    threadsIntegrators
+  ]);
+  const createSort = (0, import_react9.useMemo)(() => threadProvides.find((p) => p.predicate(subject))?.createSort, [
+    threadProvides,
+    subject
+  ]);
+  const sort = (0, import_react9.useMemo)(() => createSort?.(subject), [
+    createSort,
+    subject
+  ]);
+  const threads = (0, import_react9.useMemo)(() => {
+    return subject.threads.concat(stagedThreads ?? []).filter(import_util3.nonNullable);
+  }, [
+    JSON.stringify(subject.threads),
+    JSON.stringify(stagedThreads)
+  ]);
+  const detachedIds = (0, import_react9.useMemo)(() => {
+    return threads.filter(({ anchor }) => !anchor).map((thread) => (0, import_echo4.fullyQualifiedId)(thread));
+  }, [
+    threads
+  ]);
+  (0, import_react9.useEffect)(() => {
+    if (!sort) {
+      return;
+    }
+    threads.sort((a, b) => sort(a?.anchor, b?.anchor));
+  }, [
+    sort,
+    threads
+  ]);
+  const { attended } = (0, import_react_ui_attention.useAttentionContext)("Thread Complementary");
+  const qualifiedSubjectId = (0, import_echo4.fullyQualifiedId)(subject);
+  const attendableAttrs = (0, import_react_ui_attention.createAttendableAttributes)(qualifiedSubjectId);
+  return /* @__PURE__ */ import_react9.default.createElement("div", {
+    role: "none",
+    className: "contents group/attention",
+    ...attendableAttrs
+  }, role === "complementary" && /* @__PURE__ */ import_react9.default.createElement(CommentsHeading, {
+    attendableId: qualifiedSubjectId
+  }), /* @__PURE__ */ import_react9.default.createElement(import_react_ui4.ScrollArea.Root, {
+    classNames: "row-span-2"
+  }, /* @__PURE__ */ import_react9.default.createElement(import_react_ui4.ScrollArea.Viewport, null, /* @__PURE__ */ import_react9.default.createElement(CommentsContainer, {
+    threads,
+    detached: detachedIds,
+    currentId: attended.has(qualifiedSubjectId) ? current : void 0,
+    autoFocusCurrentTextbox: focus,
+    showResolvedThreads,
+    onThreadAttend: (thread) => {
+      const threadId = (0, import_echo4.fullyQualifiedId)(thread);
+      if (current !== threadId) {
+        current = threadId;
+        void dispatch?.([
+          {
+            action: import_app_framework2.LayoutAction.SCROLL_INTO_VIEW,
+            data: {
+              id: (0, import_echo4.fullyQualifiedId)(subject),
+              thread: threadId,
+              cursor: thread.anchor
+            }
+          }
+        ]);
+      }
+    },
+    onThreadDelete: (thread) => {
+      return dispatch({
+        plugin: import_chunk_BWBONZGU.THREAD_PLUGIN,
+        action: import_chunk_4B2ARV7L.ThreadAction.DELETE,
+        data: {
+          subject,
+          thread
+        }
+      });
+    },
+    onMessageDelete: (thread, messageId) => dispatch({
+      plugin: import_chunk_BWBONZGU.THREAD_PLUGIN,
+      action: import_chunk_4B2ARV7L.ThreadAction.DELETE_MESSAGE,
+      data: {
+        subject,
+        thread,
+        messageId
+      }
+    }),
+    onThreadToggleResolved: (thread) => dispatch({
+      plugin: import_chunk_BWBONZGU.THREAD_PLUGIN,
+      action: import_chunk_4B2ARV7L.ThreadAction.TOGGLE_RESOLVED,
+      data: {
+        thread
+      }
+    }),
+    onComment: (thread) => {
+      void dispatch({
+        action: import_chunk_4B2ARV7L.ThreadAction.ON_MESSAGE_ADD,
+        data: {
+          thread,
+          subject
+        }
+      });
+    }
+  }), /* @__PURE__ */ import_react9.default.createElement("div", {
+    role: "none",
+    className: "bs-10"
+  }), /* @__PURE__ */ import_react9.default.createElement(import_react_ui4.ScrollArea.Scrollbar, null, /* @__PURE__ */ import_react9.default.createElement(import_react_ui4.ScrollArea.Thumb, null)))));
+};
 var translations_default = [
   {
     "en-US": {
@@ -329,6 +444,7 @@ var translations_default = [
     }
   }
 ];
+var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-thread/src/ThreadPlugin.tsx";
 var initialViewState = {
   showResolvedThreads: false
 };
@@ -349,7 +465,6 @@ var ThreadPlugin = () => {
   let attentionPlugin;
   let navigationPlugin;
   let intentPlugin;
-  let dispatch;
   const unsubscribeCallbacks = [];
   return {
     meta: import_chunk_BWBONZGU.meta_default,
@@ -363,20 +478,22 @@ var ThreadPlugin = () => {
       attentionPlugin = (0, import_app_framework.resolvePlugin)(plugins, import_plugin_attention.parseAttentionPlugin);
       navigationPlugin = (0, import_app_framework.resolvePlugin)(plugins, import_app_framework.parseNavigationPlugin);
       intentPlugin = (0, import_app_framework.resolvePlugin)(plugins, import_app_framework.parseIntentPlugin);
-      dispatch = intentPlugin?.provides.intent.dispatch;
       const graphPlugin = (0, import_app_framework.resolvePlugin)(plugins, import_app_framework.parseGraphPlugin);
       const client = (0, import_app_framework.resolvePlugin)(plugins, import_plugin_client.parseClientPlugin)?.provides.client;
       if (!client) {
         return;
       }
-      const channelsQuery = client.spaces.query(import_echo.Filter.schema(import_types2.ChannelType));
+      const channelsQuery = client.spaces.query(import_echo.Filter.schema(import_types.ChannelType));
       const queryUnsubscribe = channelsQuery.subscribe();
       const unsubscribe = (0, import_signals_core.effect)(() => {
         const attention = attentionPlugin?.provides.attention;
         if (!attention?.attended) {
           return;
         }
-        const firstAttendedNodeWithComments = Array.from(attention.attended).map((id) => graphPlugin?.provides.graph.findNode(id)).find((node) => node?.data instanceof import_types.DocumentType && (node.data.threads?.length ?? 0) > 0);
+        const firstAttendedNodeWithComments = Array.from(attention.attended).map((id) => graphPlugin?.provides.graph.findNode(id)).find((node) => {
+          const data = node?.data;
+          return Array.isArray(data?.threads) && data.threads.length > 0;
+        });
         if (firstAttendedNodeWithComments) {
           void intentPlugin?.provides.intent.dispatch({
             action: import_app_framework.NavigationAction.OPEN,
@@ -398,7 +515,7 @@ var ThreadPlugin = () => {
       settings: settings.values,
       metadata: {
         records: {
-          [import_types2.ChannelType.typename]: {
+          [import_types.ChannelType.typename]: {
             placeholder: [
               "channel title placeholder",
               {
@@ -410,11 +527,11 @@ var ThreadPlugin = () => {
             // TODO(wittjosiah): Move out of metadata.
             loadReferences: (channel) => (0, import_echo.loadObjectReferences)(channel, (channel2) => channel2.threads)
           },
-          [import_types2.ThreadType.typename]: {
+          [import_types.ThreadType.typename]: {
             // TODO(wittjosiah): Move out of metadata.
             loadReferences: (thread) => (0, import_echo.loadObjectReferences)(thread, (thread2) => thread2.messages)
           },
-          [import_types2.MessageType.typename]: {
+          [import_types.MessageType.typename]: {
             // TODO(wittjosiah): Move out of metadata.
             loadReferences: (message) => []
           },
@@ -445,17 +562,17 @@ var ThreadPlugin = () => {
       ],
       echo: {
         schema: [
-          import_types2.ChannelType,
-          import_types2.ThreadType,
-          import_types2.MessageType
+          import_types.ChannelType,
+          import_types.ThreadType,
+          import_types.MessageType
         ]
       },
       graph: {
         builder: (plugins) => {
           const client = (0, import_app_framework.resolvePlugin)(plugins, import_plugin_client.parseClientPlugin)?.provides.client;
-          const dispatch2 = (0, import_app_framework.resolvePlugin)(plugins, import_app_framework.parseIntentPlugin)?.provides.intent.dispatch;
+          const dispatch = (0, import_app_framework.resolvePlugin)(plugins, import_app_framework.parseIntentPlugin)?.provides.intent.dispatch;
           const metadataResolver = (0, import_app_framework.resolvePlugin)(plugins, import_app_framework.parseMetadataResolverPlugin)?.provides.metadata.resolver;
-          if (!client || !dispatch2 || !metadataResolver) {
+          if (!client || !dispatch || !metadataResolver) {
             return [];
           }
           return [
@@ -501,7 +618,7 @@ var ThreadPlugin = () => {
                 const toggle = () => {
                   const newToggleState = !viewState.showResolvedThreads;
                   viewState.showResolvedThreads = newToggleState;
-                  void dispatch2({
+                  void dispatch({
                     action: import_meta.ObservabilityAction.SEND_EVENT,
                     data: {
                       name: "threads.toggle-show-resolved",
@@ -526,14 +643,15 @@ var ThreadPlugin = () => {
                       ],
                       menuItemType: "toggle",
                       isChecked: viewState.showResolvedThreads,
-                      testId: "threadPlugin.toggleShowResolved"
+                      testId: "threadPlugin.toggleShowResolved",
+                      iconSymbol: viewState.showResolvedThreads ? "ph--eye-slash--regular" : "ph--eye--regular"
                     }
                   }
                 ];
               }
             }),
             (0, import_plugin_graph.createExtension)({
-              id: import_chunk_D5GOVXHS.ThreadAction.CREATE,
+              id: import_chunk_4B2ARV7L.ThreadAction.CREATE,
               filter: (node) => !!settings.values.standalone && (0, import_plugin_graph.isActionGroup)(node) && node.id.startsWith(import_plugin_space.SpaceAction.ADD_OBJECT),
               actions: ({ node }) => {
                 const id = node.id.split("/").at(-1);
@@ -548,10 +666,10 @@ var ThreadPlugin = () => {
                   {
                     id: `${import_chunk_BWBONZGU.THREAD_PLUGIN}/create/${node.id}`,
                     data: async () => {
-                      await dispatch2([
+                      await dispatch([
                         {
                           plugin: import_chunk_BWBONZGU.THREAD_PLUGIN,
-                          action: import_chunk_D5GOVXHS.ThreadAction.CREATE
+                          action: import_chunk_4B2ARV7L.ThreadAction.CREATE
                         },
                         {
                           action: import_plugin_space.SpaceAction.ADD_OBJECT,
@@ -586,7 +704,7 @@ var ThreadPlugin = () => {
         component: ({ data, role }) => {
           switch (role) {
             case "main": {
-              return data.active instanceof import_types2.ChannelType && data.active.threads[0] ? /* @__PURE__ */ import_react2.default.createElement(ThreadMain, {
+              return data.active instanceof import_types.ChannelType && data.active.threads[0] ? /* @__PURE__ */ import_react2.default.createElement(ThreadMain, {
                 thread: data.active.threads[0]
               }) : null;
             }
@@ -598,13 +716,7 @@ var ThreadPlugin = () => {
             case "article":
             case "complementary": {
               const location = navigationPlugin?.provides.location;
-              const providesThreadsConfig = (0, import_react2.useCallback)((plugin) => (
-                // TODO(Zan): More robust runtime check.
-                "thread" in plugin.provides ? plugin : void 0
-              ), []);
-              const threadsIntegrators = (0, import_app_framework.useResolvePlugins)(providesThreadsConfig);
-              const threadProvides = threadsIntegrators.map((p) => p.provides.thread);
-              if (data.object instanceof import_types2.ChannelType && data.object.threads[0]) {
+              if (data.object instanceof import_types.ChannelType && data.object.threads[0]) {
                 const channel = data.object;
                 if ((0, import_app_framework.isLayoutParts)(location?.active) && location.active.main) {
                   const layoutEntries = location.active.main;
@@ -622,91 +734,23 @@ var ThreadPlugin = () => {
                   thread: data.object.threads[0]
                 });
               }
-              if (data.subject instanceof import_types2.ThreadType) {
-                return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement(import_chunk_5PZNPPQF.ChatHeading, {
+              if (data.subject instanceof import_types.ThreadType) {
+                return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement(import_chunk_T7TXCNHL.ChatHeading, {
                   attendableId: data.subject.id
-                }), /* @__PURE__ */ import_react2.default.createElement(import_chunk_5PZNPPQF.ChatContainer, {
+                }), /* @__PURE__ */ import_react2.default.createElement(import_chunk_T7TXCNHL.ChatContainer, {
                   thread: data.subject
                 }));
               }
               if (data.subject && typeof data.subject === "object" && "threads" in data.subject && Array.isArray(data.subject.threads)) {
-                const threads = data.subject.threads.concat(state.staging[(0, import_echo.fullyQualifiedId)(data.subject)]).filter(import_util.nonNullable);
-                const createSort = threadProvides.find((p) => p.predicate(data.subject))?.createSort;
-                if (createSort) {
-                  const sort = createSort(data.subject);
-                  threads.sort((a, b) => sort(a.anchor, b.anchor));
-                }
-                const detached = data.subject.threads.filter(import_util.nonNullable).filter(({ anchor }) => !anchor).map((thread) => thread.id);
-                const qualifiedSubjectId = (0, import_echo.fullyQualifiedId)(data.subject);
-                const attention = attentionPlugin?.provides.attention?.attended ?? /* @__PURE__ */ new Set([
-                  qualifiedSubjectId
-                ]);
-                const attendableAttrs = (0, import_react_ui_attention.createAttendableAttributes)(qualifiedSubjectId);
-                const { showResolvedThreads } = getViewState(qualifiedSubjectId);
-                return /* @__PURE__ */ import_react2.default.createElement("div", {
-                  role: "none",
-                  className: "contents group/attention",
-                  ...attendableAttrs
-                }, role === "complementary" && /* @__PURE__ */ import_react2.default.createElement(CommentsHeading, {
-                  attendableId: qualifiedSubjectId
-                }), /* @__PURE__ */ import_react2.default.createElement(import_react_ui.ScrollArea.Root, {
-                  classNames: "row-span-2"
-                }, /* @__PURE__ */ import_react2.default.createElement(import_react_ui.ScrollArea.Viewport, null, /* @__PURE__ */ import_react2.default.createElement(CommentsContainer, {
-                  threads,
-                  detached,
-                  currentId: attention.has(qualifiedSubjectId) ? state.current : void 0,
-                  autoFocusCurrentTextbox: state.focus,
-                  showResolvedThreads,
-                  onThreadAttend: (thread) => {
-                    if (state.current !== thread.id) {
-                      state.current = thread.id;
-                      void dispatch?.({
-                        action: import_app_framework.LayoutAction.SCROLL_INTO_VIEW,
-                        data: {
-                          id: (0, import_echo.fullyQualifiedId)(data.subject),
-                          thread: (0, import_echo.fullyQualifiedId)(thread),
-                          cursor: thread.anchor
-                        }
-                      });
-                    }
-                  },
-                  onThreadDelete: (thread) => dispatch?.({
-                    plugin: import_chunk_BWBONZGU.THREAD_PLUGIN,
-                    action: import_chunk_D5GOVXHS.ThreadAction.DELETE,
-                    data: {
-                      subject: data.subject,
-                      thread
-                    }
-                  }),
-                  onMessageDelete: (thread, messageId) => dispatch?.({
-                    plugin: import_chunk_BWBONZGU.THREAD_PLUGIN,
-                    action: import_chunk_D5GOVXHS.ThreadAction.DELETE_MESSAGE,
-                    data: {
-                      subject: data.subject,
-                      thread,
-                      messageId
-                    }
-                  }),
-                  onThreadToggleResolved: (thread) => dispatch?.({
-                    plugin: import_chunk_BWBONZGU.THREAD_PLUGIN,
-                    action: import_chunk_D5GOVXHS.ThreadAction.TOGGLE_RESOLVED,
-                    data: {
-                      thread
-                    }
-                  }),
-                  onComment: (thread) => {
-                    void intentPlugin?.provides.intent.dispatch({
-                      action: import_chunk_D5GOVXHS.ThreadAction.ON_MESSAGE_ADD,
-                      data: {
-                        thread,
-                        subject: data.subject
-                      }
-                    });
-                  }
-                }), /* @__PURE__ */ import_react2.default.createElement("div", {
-                  role: "none",
-                  className: "bs-10"
-                }), /* @__PURE__ */ import_react2.default.createElement(import_react_ui.ScrollArea.Scrollbar, null, /* @__PURE__ */ import_react2.default.createElement(import_react_ui.ScrollArea.Thumb, null)))));
+                const { showResolvedThreads } = getViewState((0, import_echo.fullyQualifiedId)(data.subject));
+                return /* @__PURE__ */ import_react2.default.createElement(ThreadComplementary, {
+                  role,
+                  subject: data.subject,
+                  stagedThreads: state.staging[(0, import_echo.fullyQualifiedId)(data.subject)],
+                  current: state.current,
+                  focus: true,
+                  showResolvedThreads
+                });
               }
             }
           }
@@ -716,11 +760,24 @@ var ThreadPlugin = () => {
       intent: {
         resolver: async (intent) => {
           switch (intent.action) {
-            case import_chunk_D5GOVXHS.ThreadAction.CREATE: {
+            case import_chunk_4B2ARV7L.ThreadAction.CREATE: {
               if (intent.data && intent.data.cursor !== void 0) {
                 const { cursor, name, subject } = intent.data;
+                if (subject?.threads === void 0) {
+                  try {
+                    subject.threads = [];
+                  } catch (e) {
+                    import_log.log.error("Subject does not support threads array", subject?.typename, {
+                      F: __dxlog_file,
+                      L: 369,
+                      S: void 0,
+                      C: (f, a) => f(...a)
+                    });
+                    return;
+                  }
+                }
                 const subjectId = (0, import_echo.fullyQualifiedId)(subject);
-                const thread = (0, import_echo_schema2.create)(import_types2.ThreadType, {
+                const thread = (0, import_echo_schema2.create)(import_types.ThreadType, {
                   name,
                   anchor: cursor,
                   messages: [],
@@ -747,9 +804,9 @@ var ThreadPlugin = () => {
                         }
                       },
                       {
-                        action: import_chunk_D5GOVXHS.ThreadAction.SELECT,
+                        action: import_chunk_4B2ARV7L.ThreadAction.SELECT,
                         data: {
-                          current: thread.id,
+                          current: (0, import_echo.fullyQualifiedId)(thread),
                           focus: true
                         }
                       },
@@ -766,9 +823,9 @@ var ThreadPlugin = () => {
                 };
               } else {
                 return {
-                  data: (0, import_echo_schema2.create)(import_types2.ChannelType, {
+                  data: (0, import_echo_schema2.create)(import_types.ChannelType, {
                     threads: [
-                      (0, import_echo_schema2.create)(import_types2.ThreadType, {
+                      (0, import_echo_schema2.create)(import_types.ThreadType, {
                         messages: []
                       })
                     ]
@@ -776,16 +833,16 @@ var ThreadPlugin = () => {
                 };
               }
             }
-            case import_chunk_D5GOVXHS.ThreadAction.SELECT: {
+            case import_chunk_4B2ARV7L.ThreadAction.SELECT: {
               state.focus = intent.data?.current === state.current ? state.focus : intent.data?.focus;
               state.current = intent.data?.current;
               return {
                 data: true
               };
             }
-            case import_chunk_D5GOVXHS.ThreadAction.TOGGLE_RESOLVED: {
+            case import_chunk_4B2ARV7L.ThreadAction.TOGGLE_RESOLVED: {
               const { thread } = intent.data ?? {};
-              if (!(thread instanceof import_types2.ThreadType)) {
+              if (!(thread instanceof import_types.ThreadType)) {
                 return;
               }
               if (thread.status === "active" || thread.status === void 0) {
@@ -812,9 +869,9 @@ var ThreadPlugin = () => {
                 ]
               };
             }
-            case import_chunk_D5GOVXHS.ThreadAction.DELETE: {
+            case import_chunk_4B2ARV7L.ThreadAction.DELETE: {
               const { subject, thread } = intent.data ?? {};
-              if (!(subject instanceof import_types.DocumentType) || !(thread instanceof import_types2.ThreadType)) {
+              if (!(thread instanceof import_types.ThreadType) || !(subject && typeof subject === "object" && "threads" in subject)) {
                 return;
               }
               const subjectId = (0, import_echo.fullyQualifiedId)(subject);
@@ -823,7 +880,9 @@ var ThreadPlugin = () => {
                 const index = stagingArea.findIndex((t) => t.id === thread.id);
                 if (index !== -1) {
                   stagingArea.splice(index, 1);
-                  return;
+                  return {
+                    data: true
+                  };
                 }
               }
               const space = (0, import_echo.getSpace)(thread);
@@ -882,9 +941,9 @@ var ThreadPlugin = () => {
               }
               break;
             }
-            case import_chunk_D5GOVXHS.ThreadAction.ON_MESSAGE_ADD: {
+            case import_chunk_4B2ARV7L.ThreadAction.ON_MESSAGE_ADD: {
               const { thread, subject } = intent.data ?? {};
-              if (!(thread instanceof import_types2.ThreadType) || !(subject && typeof subject === "object" && "threads" in subject)) {
+              if (!(thread instanceof import_types.ThreadType) || !(subject && typeof subject === "object" && "threads" in subject && Array.isArray(subject.threads))) {
                 return;
               }
               const subjectId = (0, import_echo.fullyQualifiedId)(subject);
@@ -925,10 +984,10 @@ var ThreadPlugin = () => {
                 ]
               };
             }
-            case import_chunk_D5GOVXHS.ThreadAction.DELETE_MESSAGE: {
+            case import_chunk_4B2ARV7L.ThreadAction.DELETE_MESSAGE: {
               const { subject, thread, messageId } = intent.data ?? {};
               const space = (0, import_echo.getSpace)(subject);
-              if (!(subject instanceof import_types.DocumentType) || !(thread instanceof import_types2.ThreadType) || !space) {
+              if (!(thread instanceof import_types.ThreadType) || !(subject && typeof subject === "object" && "threads" in subject)) {
                 return;
               }
               if (!intent.undo) {
@@ -942,7 +1001,7 @@ var ThreadPlugin = () => {
                     intents: [
                       [
                         {
-                          action: import_chunk_D5GOVXHS.ThreadAction.DELETE,
+                          action: import_chunk_4B2ARV7L.ThreadAction.DELETE,
                           data: {
                             subject,
                             thread
@@ -970,7 +1029,7 @@ var ThreadPlugin = () => {
                           name: "threads.message.delete",
                           properties: {
                             threadId: thread.id,
-                            spaceId: space.id
+                            spaceId: space?.id
                           }
                         }
                       }
@@ -980,7 +1039,7 @@ var ThreadPlugin = () => {
               } else if (intent.undo) {
                 const message = intent.data?.message;
                 const messageIndex = intent.data?.messageIndex;
-                if (!(message instanceof import_types2.MessageType) || !(typeof messageIndex === "number")) {
+                if (!(message instanceof import_types.MessageType) || !(typeof messageIndex === "number")) {
                   return;
                 }
                 thread.messages.splice(messageIndex, 0, message);
@@ -994,7 +1053,7 @@ var ThreadPlugin = () => {
                           name: "threads.message.undo-delete",
                           properties: {
                             threadId: thread.id,
-                            spaceId: space.id
+                            spaceId: space?.id
                           }
                         }
                       }
@@ -1036,7 +1095,7 @@ var ThreadPlugin = () => {
               }
             }),
             (0, import_react_ui_editor.createExternalCommentSync)(doc.id, (sink) => (0, import_signals_core.effect)(() => sink()), () => threads.value.filter((thread) => thread?.anchor).map((thread) => ({
-              id: thread.id,
+              id: (0, import_echo.fullyQualifiedId)(thread),
               cursor: thread.anchor
             }))),
             (0, import_react_ui_editor.comments)({
@@ -1047,7 +1106,7 @@ var ThreadPlugin = () => {
                   "content"
                 ]), start, end);
                 void intentPlugin?.provides.intent.dispatch({
-                  action: import_chunk_D5GOVXHS.ThreadAction.CREATE,
+                  action: import_chunk_4B2ARV7L.ThreadAction.CREATE,
                   data: {
                     cursor,
                     name,
@@ -1058,7 +1117,7 @@ var ThreadPlugin = () => {
               onDelete: ({ id }) => {
                 const stagingArea = state.staging[(0, import_echo.fullyQualifiedId)(doc)];
                 if (stagingArea) {
-                  const index = stagingArea.findIndex((thread2) => thread2.id === id);
+                  const index = stagingArea.findIndex((thread2) => (0, import_echo.fullyQualifiedId)(thread2) === id);
                   if (index !== -1) {
                     stagingArea.splice(index, 1);
                   }
@@ -1069,8 +1128,8 @@ var ThreadPlugin = () => {
                 }
               },
               onUpdate: ({ id, cursor }) => {
-                const thread = state.staging[(0, import_echo.fullyQualifiedId)(doc)]?.find((thread2) => thread2.id === id) ?? doc.threads.find((thread2) => thread2?.id === id);
-                if (thread instanceof import_types2.ThreadType && thread.anchor) {
+                const thread = state.staging[(0, import_echo.fullyQualifiedId)(doc)]?.find((thread2) => (0, import_echo.fullyQualifiedId)(thread2) === id) ?? doc.threads.find((thread2) => thread2?.id === id);
+                if (thread instanceof import_types.ThreadType && thread.anchor) {
                   const [start, end] = thread.anchor.split(":");
                   thread.name = doc.content && (0, import_echo.getTextInRange)((0, import_echo.createDocAccessor)(doc.content, [
                     "content"
@@ -1079,11 +1138,11 @@ var ThreadPlugin = () => {
                 }
               },
               onSelect: ({ selection: { current, closest } }) => {
-                const dispatch2 = intentPlugin?.provides.intent.dispatch;
-                if (dispatch2) {
-                  void dispatch2([
+                const dispatch = intentPlugin?.provides.intent.dispatch;
+                if (dispatch) {
+                  void dispatch([
                     {
-                      action: import_chunk_D5GOVXHS.ThreadAction.SELECT,
+                      action: import_chunk_4B2ARV7L.ThreadAction.SELECT,
                       data: {
                         current: current ?? closest
                       }