@dxos/plugin-thread 0.8.4-main.fcfe5033a5 → 0.8.4-staging.60fe92afc8

package/src/capabilities/app-graph-builder.ts

@@ -2,189 +2,47 @@
 // Copyright 2025 DXOS.org
 //
 
-import { Atom } from '@effect-atom/atom-react';
 import * as Effect from 'effect/Effect';
 import * as Option from 'effect/Option';
 
 import { Capability } from '@dxos/app-framework';
-import { AppCapabilities, AppNode } from '@dxos/app-toolkit';
-import { Obj } from '@dxos/echo';
-import { Operation } from '@dxos/operation';
-import { AttentionCapabilities } from '@dxos/plugin-attention/types';
-import { GraphBuilder, NodeMatcher } from '@dxos/plugin-graph';
-import { linkedSegment } from '@dxos/react-ui-attention';
-import { type SelectionManager, type SelectionMode, defaultSelection } from '@dxos/react-ui-attention';
+import { AppCapabilities, createTypeSectionExtension } from '@dxos/app-toolkit';
+import { isSpace } from '@dxos/client/echo';
+import { Operation } from '@dxos/compute';
+import { Type } from '@dxos/echo';
+import { GraphBuilder, Node } from '@dxos/plugin-graph';
+import { SpaceOperation } from '@dxos/plugin-space';
+import { Channel } from '@dxos/types';
 
-import { meta } from '#meta';
-import { ThreadOperation } from '#operations';
-import { Channel, ThreadCapabilities, type ThreadState } from '#types';
+const channelTypename = Type.getTypename(Channel.Channel);
 
-import { getAnchor } from '../util';
-
-type CommentDisabledParams = {
-  stateAtom: Atom.Atom<Atom.Writable<ThreadState>[]>;
-  selectionManager: SelectionManager;
-  objectId: string;
-  commentsType: string;
-  selectionMode: SelectionMode | undefined;
-};
-
-/**
- * Atom family to derive whether the comment button should be disabled.
- * Uses a composite key to ensure proper caching.
- */
-const commentDisabledFamily = Atom.family(
-  ({ stateAtom, selectionManager, objectId, commentsType, selectionMode }: CommentDisabledParams) =>
-    Atom.make((get) => {
-      const stateAtoms = get(stateAtom);
-      const state = stateAtoms[0] ? get(stateAtoms[0]) : undefined;
-      const toolbar = state?.toolbar ?? {};
-      const selectionState = get(selectionManager.state);
-      const selection =
-        selectionState.selections[objectId] ?? (selectionMode ? defaultSelection(selectionMode) : undefined);
-      const anchor = getAnchor(selection);
-      const invalidSelection = !anchor;
-      const overlappingComment = toolbar[objectId];
-      return (commentsType === 'anchored' && invalidSelection) || overlappingComment;
-    }),
-);
-
-/** Match ECHO objects that are NOT Channels (i.e. objects that can have comments). */
-const whenCommentableObject = NodeMatcher.whenAll(
-  NodeMatcher.whenEchoObjectMatches,
-  NodeMatcher.whenNot(NodeMatcher.whenEchoTypeMatches(Channel.Channel)),
-);
-
-// TODO(wittjosiah): Highlight active calls in L1.
-//  Track active meetings by subscribing to meetings query and polling the swarms of recent meetings in the space.
 export default Capability.makeModule(
   Effect.fnUntraced(function* () {
-    const capabilities = yield* Capability.Service;
-
-    const resolve = (typename: string) =>
-      capabilities.getAll(AppCapabilities.Metadata).find(({ id }: { id: string }) => id === typename)?.metadata ?? {};
-
     const extensions = yield* Effect.all([
-      GraphBuilder.createExtension({
-        id: 'active-call',
-        match: NodeMatcher.whenRoot,
-        connector: (node, get) => {
-          const callManagerAtom = capabilities.atom(ThreadCapabilities.CallManager);
-          const [call] = get(callManagerAtom);
-          if (!call) {
-            return Effect.succeed([]);
-          }
-          // Use derived joinedAtom for efficient subscription.
-          const joined = get(call.joinedAtom);
-          return Effect.succeed(
-            joined
-              ? [
-                  AppNode.makeDeckCompanion({
-                    id: 'active-call',
-                    label: ['call-panel.label', { ns: meta.id }],
-                    icon: 'ph--video-conference--regular',
-                    data: null,
-                    position: 'hoist',
-                  }),
-                ]
-              : [],
-          );
-        },
-      }),
-      GraphBuilder.createTypeExtension({
-        id: 'channel-chat-companion',
-        type: Channel.Channel,
-        connector: (channel, get) => {
-          const callManager = capabilities.get(ThreadCapabilities.CallManager);
-          // Use derived atoms for efficient subscription.
-          const joined = get(callManager.joinedAtom);
-          const roomId = get(callManager.roomIdAtom);
-          const isActive = joined && roomId === Obj.getDXN(channel).toString();
-          if (!isActive) {
-            return Effect.succeed([]);
-          }
+      createTypeSectionExtension(Channel.Channel),
 
-          return Effect.succeed([
-            AppNode.makeCompanion({
-              id: 'chat',
-              label: ['channel-companion.label', { ns: meta.id }],
-              icon: 'ph--hash--regular',
-              data: 'chat',
-              position: 'hoist',
-            }),
-          ]);
-        },
-      }),
       GraphBuilder.createExtension({
-        id: 'comments-companion',
+        id: 'channelsSectionActions',
         match: (node) => {
-          if (!Obj.isObject(node.data) || Option.isNone(whenCommentableObject(node))) {
-            return Option.none();
-          }
-          const metadata = resolve(Obj.getTypename(node.data)!);
-          return typeof metadata.comments === 'string' ? Option.some(node) : Option.none();
+          const space = isSpace(node.properties.space) ? node.properties.space : undefined;
+          return node.type === channelTypename && space ? Option.some(space) : Option.none();
         },
-        connector: () =>
+        actions: (space) =>
           Effect.succeed([
-            AppNode.makeCompanion({
-              id: linkedSegment('comments'),
-              label: ['comments.label', { ns: meta.id }],
-              icon: 'ph--chat-text--regular',
-              data: 'comments',
-              position: 'hoist',
-            }),
-          ]),
-      }),
-      GraphBuilder.createExtension({
-        id: 'comment-toolbar',
-        match: (node) => {
-          if (!Obj.isObject(node.data) || Option.isNone(whenCommentableObject(node))) {
-            return Option.none();
-          }
-          const metadata = resolve(Obj.getTypename(node.data)!);
-          return typeof metadata.comments === 'string' ? Option.some(node) : Option.none();
-        },
-        actions: (matched, get) => {
-          const object = matched.data;
-          const objectDxn = Obj.getDXN(object).toString();
-          const stateAtom = capabilities.atom(ThreadCapabilities.State);
-          const selectionManager = capabilities.get(AttentionCapabilities.Selection);
-          const metadata = resolve(Obj.getTypename(object)!);
-
-          const disabled = get(
-            commentDisabledFamily({
-              stateAtom,
-              selectionManager,
-              objectId: objectDxn,
-              commentsType: metadata.comments as string,
-              selectionMode: metadata.selectionMode,
-            }),
-          );
-
-          return Effect.succeed([
-            {
-              id: 'comment',
-              data: Effect.fnUntraced(function* () {
-                const metadata = resolve(Obj.getTypename(object)!);
-                const selection = selectionManager.getSelection(objectDxn);
-                const anchor = metadata.comments === 'anchored' ? getAnchor(selection) : Date.now().toString();
-                const name = metadata.getAnchorLabel?.(object, anchor);
-                yield* Operation.invoke(ThreadOperation.Create, {
-                  anchor,
-                  name,
-                  subject: object,
-                });
-              }),
+            Node.makeAction({
+              id: 'create-channel',
+              data: () =>
+                Operation.invoke(SpaceOperation.OpenCreateObject, {
+                  target: space.db,
+                  typename: channelTypename,
+                }),
               properties: {
-                label: ['add-comment.label', { ns: meta.id }],
-                icon: 'ph--chat-text--regular',
-                disposition: 'toolbar',
-                disabled,
-                testId: 'thread.comment.add',
+                label: ['add-object.label', { ns: channelTypename }],
+                icon: 'ph--plus--regular',
+                disposition: 'list-item-primary',
               },
-            },
-          ]);
-        },
+            }),
+          ]),
       }),
     ]);
 

package/src/capabilities/channel-backend-feed.ts

@@ -0,0 +1,60 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+import * as Effect from 'effect/Effect';
+import * as Schema from 'effect/Schema';
+
+import { Capability } from '@dxos/app-framework';
+import { Feed, Filter, Obj, Query } from '@dxos/echo';
+import { createFeedServiceLayer } from '@dxos/echo-client';
+import { invariant } from '@dxos/invariant';
+import { ClientCapabilities } from '@dxos/plugin-client';
+import { Channel, Message } from '@dxos/types';
+
+import { ThreadCapabilities } from '../types';
+
+/**
+ * Default local ECHO-feed-backed channel provider. Stores messages in a `Feed`
+ * (`makeConfig` → `Feed.make()`), reads them via a reactive database query, and
+ * writes via `Feed.append`. This is the backend `Channel.make()` defaults to.
+ */
+export const feedChannelBackend: ThreadCapabilities.ChannelBackendProvider = {
+  kind: Channel.FeedBackendKind,
+  label: 'Feed',
+  icon: 'ph--rows--regular',
+  createFields: Schema.Struct({}),
+  makeConfig: () => Feed.make(),
+  subscribe: (channel, onMessages) => {
+    const feed = Channel.getFeed(channel);
+    const db = Obj.getDatabase(channel);
+    if (!feed || !db) {
+      onMessages([]);
+      return () => {};
+    }
+
+    const result = db.query(Query.select(Filter.type(Message.Message)).from(feed));
+    return result.subscribe(() => onMessages(result.results), { fire: true });
+  },
+  send: (channel, message) =>
+    Effect.gen(function* () {
+      const db = Obj.getDatabase(channel);
+      invariant(db, 'Database not found');
+      const client = yield* Capability.get(ClientCapabilities.Client);
+      const space = client.spaces.get(db.spaceId);
+      invariant(space, 'Space not found');
+      const feed = Channel.getFeed(channel);
+      invariant(feed, 'Channel is not feed-backed');
+      yield* Feed.append(feed, [message]).pipe(Effect.provide(createFeedServiceLayer(space.queues)));
+    }),
+  readOnly: (channel) => Obj.getMeta(channel).keys.length > 0,
+};
+
+/** Contributes the default feed-backed channel provider. */
+export const ChannelBackendFeed = Capability.makeModule(
+  Effect.fnUntraced(function* () {
+    return Capability.contributes(ThreadCapabilities.ChannelBackend, feedChannelBackend);
+  }),
+);
+
+export default ChannelBackendFeed;

package/src/capabilities/create-object.ts

@@ -0,0 +1,46 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+import * as Effect from 'effect/Effect';
+
+import { Capability } from '@dxos/app-framework';
+import { Operation } from '@dxos/compute';
+import { Type } from '@dxos/echo';
+import { SpaceCapabilities, SpaceOperation } from '@dxos/plugin-space';
+import { Channel } from '@dxos/types';
+
+// Lazily loaded (via the #containers barrel) so the react-ui-form dependency
+// graph isn't pulled into this capability module's evaluation.
+import { ChannelCreatePanel } from '#containers';
+
+import { getChannelsPath } from '../paths';
+import { ThreadCapabilities, resolveProvider } from '../types';
+
+type CreateOptions = Parameters<SpaceCapabilities.CreateObjectEntry['createObject']>[1];
+
+export default Capability.makeModule(
+  Effect.fnUntraced(function* () {
+    return Capability.contributes(SpaceCapabilities.CreateObjectEntry, {
+      id: Type.getTypename(Channel.Channel),
+      customPanel: ChannelCreatePanel,
+      createObject: (
+        { name, kind, options }: { name?: string; kind?: string; options?: Record<string, unknown> },
+        opts: CreateOptions,
+      ) =>
+        Effect.gen(function* () {
+          const providers = yield* Capability.getAll(ThreadCapabilities.ChannelBackend);
+          const provider = kind ? resolveProvider(providers, kind) : undefined;
+          const object = provider
+            ? Channel.make({ name, backend: { kind: provider.kind, config: provider.makeConfig(options ?? {}) } })
+            : Channel.make({ name });
+          return yield* Operation.invoke(SpaceOperation.AddObject, {
+            object,
+            target: opts.target,
+            hidden: true,
+            targetNodeId: opts.targetNodeId ?? getChannelsPath(opts.db.spaceId),
+          });
+        }),
+    });
+  }),
+);

package/src/capabilities/index.ts

@@ -3,18 +3,14 @@
 //
 
 import { Capability } from '@dxos/app-framework';
-import { OperationHandlerSet } from '@dxos/operation';
+import type { OperationHandlerSet } from '@dxos/compute';
 
 export const AppGraphBuilder = Capability.lazy('AppGraphBuilder', () => import('./app-graph-builder'));
-export const BlueprintDefinition = Capability.lazy('BlueprintDefinition', () => import('./blueprint-definition'));
-export const CallManager = Capability.lazy('CallManager', () => import('./call-manager'));
-export const Markdown = Capability.lazy('Markdown', () => import('./markdown'));
+export const NavigationResolver = Capability.lazy('NavigationResolver', () => import('./navigation-resolver'));
+export const ChannelBackendFeed = Capability.lazy('ChannelBackendFeed', () => import('./channel-backend-feed'));
+export const CreateObject = Capability.lazy('CreateObject', () => import('./create-object'));
 export const OperationHandler = Capability.lazy<OperationHandlerSet.OperationHandlerSet>(
   'OperationHandler',
   () => import('./operation-handler'),
 );
-export const ReactRoot = Capability.lazy('ReactRoot', () => import('./react-root'));
 export const ReactSurface = Capability.lazy('ReactSurface', () => import('./react-surface'));
-export const ThreadSettings = Capability.lazy('ThreadSettings', () => import('./settings'));
-export const ThreadState = Capability.lazy('ThreadState', () => import('./state'));
-export const UndoMappings = Capability.lazy('UndoMappings', () => import('./undo-mappings'));

package/src/capabilities/navigation-resolver.ts

@@ -0,0 +1,18 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import * as Effect from 'effect/Effect';
+
+import { Capability } from '@dxos/app-framework';
+import { AppCapabilities, createTypeSectionPathResolver } from '@dxos/app-toolkit';
+import { Channel } from '@dxos/types';
+
+export default Capability.makeModule(
+  Effect.fnUntraced(function* () {
+    return Capability.contributes(
+      AppCapabilities.NavigationPathResolver,
+      createTypeSectionPathResolver(Channel.Channel),
+    );
+  }),
+);

package/src/capabilities/operation-handler.ts

@@ -5,7 +5,7 @@
 import * as Effect from 'effect/Effect';
 
 import { Capabilities, Capability } from '@dxos/app-framework';
-import type { OperationHandlerSet } from '@dxos/operation';
+import type { OperationHandlerSet } from '@dxos/compute';
 
 import { ThreadOperationHandlerSet } from '#operations';
 

package/src/capabilities/react-surface.tsx

@@ -2,20 +2,16 @@
 // Copyright 2025 DXOS.org
 //
 
-import { useAtomValue } from '@effect-atom/atom-react';
 import * as Effect from 'effect/Effect';
 import React from 'react';
 
 import { Capabilities, Capability } from '@dxos/app-framework';
-import { Surface, useCapability, useSettingsState } from '@dxos/app-framework/ui';
+import { Surface } from '@dxos/app-framework/ui';
 import { AppSurface } from '@dxos/app-toolkit/ui';
 import { getSpace } from '@dxos/react-client/echo';
-import { Thread } from '@dxos/types';
+import { Channel, Thread } from '@dxos/types';
 
-import { ThreadSettings } from '#components';
-import { CallDebugPanel, CallSidebar, ChannelContainer, ChatContainer, ThreadCompanion } from '#containers';
-import { meta } from '#meta';
-import { Channel, ThreadCapabilities, type Settings } from '#types';
+import { ChannelArticle, ThreadArticle } from '#containers';
 
 export default Capability.makeModule(() =>
   Effect.succeed(
@@ -24,25 +20,18 @@ export default Capability.makeModule(() =>
         id: 'channel',
         filter: AppSurface.object(AppSurface.Article, Channel.Channel),
         component: ({ data: { subject, attendableId }, role }) => (
-          <ChannelContainer role={role} subject={subject} attendableId={attendableId} />
+          <ChannelArticle role={role} subject={subject} attendableId={attendableId} />
         ),
       }),
       Surface.create({
-        id: 'chat-companion',
+        id: 'chatCompanion',
         filter: AppSurface.allOf(
           AppSurface.literal(AppSurface.Article, 'chat'),
           AppSurface.companion(AppSurface.Article, Channel.Channel),
         ),
-        component: ({ data: { companionTo: channel } }) => {
-          const space = getSpace(channel);
-          const thread = channel.defaultThread.target;
-          if (!space || !thread) {
-            return null;
-          }
-
-          return <ChatContainer thread={thread} space={space} />;
-        },
+        component: ({ data: { companionTo: channel } }) => <ChannelArticle subject={channel} />,
       }),
+      // TODO(burdon): Disambiguate with Channel.
       Surface.create({
         id: 'thread',
         filter: AppSurface.object(AppSurface.Article, Thread.Thread),
@@ -52,38 +41,7 @@ export default Capability.makeModule(() =>
             return null;
           }
 
-          return <ChatContainer thread={subject} space={space} />;
-        },
-      }),
-      Surface.create({
-        id: 'comments',
-        filter: AppSurface.allOf(
-          AppSurface.literal(AppSurface.Article, 'comments'),
-          AppSurface.companion(AppSurface.Article),
-        ),
-        // TODO(wittjosiah): This isn't scrolling properly in a plank.
-        component: ({ data }) => <ThreadCompanion attendableId={data.attendableId} subject={data.companionTo} />,
-      }),
-      Surface.create({
-        id: 'plugin-settings',
-        filter: AppSurface.settings(AppSurface.Article, meta.id),
-        component: ({ data: { subject } }) => {
-          const { settings, updateSettings } = useSettingsState<Settings.Settings>(subject.atom);
-          return <ThreadSettings settings={settings} onSettingsChange={updateSettings} />;
-        },
-      }),
-      Surface.create({
-        id: 'assistant',
-        role: 'deck-companion--active-call',
-        component: () => <CallSidebar />,
-      }),
-      Surface.create({
-        id: 'devtools-overview',
-        role: 'devtools-overview',
-        component: () => {
-          const call = useCapability(ThreadCapabilities.CallManager);
-          const state = useAtomValue(call.stateAtom);
-          return <CallDebugPanel state={state} />;
+          return <ThreadArticle space={space} thread={subject} />;
         },
       }),
     ]),

package/src/components/Chat/Chat.tsx

@@ -0,0 +1,119 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+import React, { useCallback, useMemo } from 'react';
+
+import { Surface } from '@dxos/app-framework/ui';
+import { AppSurface } from '@dxos/app-toolkit/ui';
+import { PublicKey } from '@dxos/react-client';
+import { type SpaceMember } from '@dxos/react-client/echo';
+import { type Identity } from '@dxos/react-client/halo';
+import { composable, Card, type ThemedClassName, useTranslation } from '@dxos/react-ui';
+import { type ObjectTileComponent, Thread } from '@dxos/react-ui-thread';
+import { type Message } from '@dxos/types';
+import { hoverableControls, hoverableFocusedWithinControls, mx } from '@dxos/ui-theme';
+
+import { meta } from '#meta';
+
+import { getMessageMetadata } from '../../util';
+
+export type ChatProps = ThemedClassName<{
+  /** Stable id used for the underlying thread root and message metadata. */
+  id: string;
+  /** Identity used to attribute outgoing messages in the textbox metadata. */
+  identity?: Identity;
+  /** Space members for rendering sender names/avatars on incoming messages. */
+  members: SpaceMember[];
+  /** Messages to render in order. */
+  messages: readonly Message.Message[];
+  /** Activity indicator (e.g. processing) shown beneath the textbox. */
+  activity?: boolean;
+  /** Autofocus textbox */
+  autoFocus?: boolean;
+  /** Marks the thread as the current/attended one. */
+  current?: boolean | string;
+  /**
+   * When true, hide the composer textbox and activity indicator. Used for
+   * channels whose source-of-truth lives elsewhere (e.g. externally-synced
+   * Slack/Discord channels keyed by a foreign id) — sending isn't meaningful
+   * because there is no local-write path back to the source.
+   */
+  readOnly?: boolean;
+  /**
+   * Called with the user's textbox content when they press send.
+   * Returning `true` signals the message was accepted; the textbox is then cleared.
+   */
+  onSend: (text: string) => boolean;
+}>;
+
+/**
+ * Pure chat UI: message list + composer textbox + activity indicator, built on
+ * the `@dxos/react-ui-thread` primitives. Does not load data or invoke
+ * operations — the caller passes messages and an `onSend` callback. Used by
+ * `ChannelArticle` and `ThreadArticle`.
+ */
+export const Chat = composable<HTMLDivElement, ChatProps>(
+  ({ id, identity, members, messages, activity, onSend, autoFocus, current, readOnly }, forwardedRef) => {
+    const { t } = useTranslation(meta.id);
+
+    const components = useMemo(() => ({ Object: ObjectTile }), []);
+
+    const textboxMetadata = useMemo(() => getMessageMetadata(id, identity), [id, identity]);
+
+    const getMetadata = useCallback(
+      (message: Message.Message) => {
+        // TODO(burdon): Factor out.
+        const sender = members.find(
+          (member) =>
+            (message.sender.identityDid && member.identity.did === message.sender.identityDid) ||
+            (message.sender.identityKey && PublicKey.equals(member.identity.identityKey, message.sender.identityKey)),
+        );
+
+        // Pass `message.sender` as the fallback so externally-synced messages
+        // (Slack, etc.) display the source-side sender name instead of "Anonymous"
+        // when no DXOS identity matches.
+        return getMessageMetadata(message.id, sender?.identity, message.sender);
+      },
+      [members],
+    );
+
+    return (
+      <Thread.Root getMetadata={getMetadata} components={components} identityDid={identity?.did} editable={false}>
+        <Thread.Content id={id} current={current} classNames='dx-container' ref={forwardedRef}>
+          <Thread.Messages messages={messages} />
+          {!readOnly && (
+            <>
+              <Thread.Textbox
+                {...textboxMetadata}
+                autoFocus={autoFocus}
+                placeholder={t('message.placeholder')}
+                onSend={onSend}
+              />
+              <Thread.Status activity={activity}>{t('activity.message')}</Thread.Status>
+            </>
+          )}
+        </Thread.Content>
+      </Thread.Root>
+    );
+  },
+);
+
+/**
+ * Object/reference message-block tile, injected into `Thread.Root` so that
+ * `@dxos/react-ui-thread` stays free of `@dxos/app-framework`. Renders the
+ * referenced subject via an app-framework `Surface` (the card role).
+ */
+const ObjectTile: ObjectTileComponent = ({ subject }) => {
+  const Fallback = useCallback(() => <span className='p-1 text-sm text-description'>{subject.id}</span>, [subject]);
+  return (
+    <Card.Root className={mx('grid col-span-3 py-1 pr-4', hoverableControls, hoverableFocusedWithinControls)}>
+      <Surface.Surface
+        type={AppSurface.Card}
+        limit={1}
+        data={{ subject } satisfies AppSurface.ObjectCardData}
+        fallback={Fallback}
+      />
+    </Card.Root>
+  );
+};

package/src/components/Chat/index.ts

@@ -0,0 +1,5 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+export * from './Chat';

package/src/components/index.ts

@@ -2,10 +2,4 @@
 // Copyright 2023 DXOS.org
 //
 
-import { type ComponentType, lazy } from 'react';
-
-export * from './Call';
-export * from './CommentsPanel';
-export * from './MessagePanel';
-
-export const ThreadSettings: ComponentType<any> = lazy(() => import('./ThreadSettings'));
+export * from './Chat';