@dxos/plugin-assistant 0.8.3 → 0.8.4-main.f9ba587

package/src/capabilities/react-surface.tsx

@@ -6,47 +6,47 @@ import { Effect } from 'effect';
 import React, { useEffect, useMemo } from 'react';
 
 import { Capabilities, contributes, createIntent, createSurface, useIntentDispatcher } from '@dxos/app-framework';
-import { Blueprint } from '@dxos/assistant';
+import { fullyQualifiedId, getSpace, getTypename } from '@dxos/client/echo';
+import { Sequence } from '@dxos/conductor';
 import { InvocationTraceContainer } from '@dxos/devtools';
 import { Filter, type Key, Obj, Query } from '@dxos/echo';
 import { SettingsStore } from '@dxos/local-storage';
 import { SpaceAction } from '@dxos/plugin-space/types';
-import { fullyQualifiedId, getSpace, getTypename } from '@dxos/react-client/echo';
 import { StackItem } from '@dxos/react-ui-stack';
 
 import {
-  AssistantDialog,
   AssistantSettings,
-  BlueprintContainer,
   ChatContainer,
+  ChatDialog,
   PromptSettings,
+  SequenceContainer,
   TemplateContainer,
 } from '../components';
-import { ASSISTANT_PLUGIN, ASSISTANT_DIALOG } from '../meta';
-import { AIChatType, AssistantAction, type AssistantSettingsProps, CompanionTo, TemplateType } from '../types';
+import { meta, ASSISTANT_DIALOG } from '../meta';
+import { Assistant, TemplateType } from '../types';
 
 export default () =>
   contributes(Capabilities.ReactSurface, [
     createSurface({
-      id: `${ASSISTANT_PLUGIN}/plugin-settings`,
+      id: `${meta.id}/plugin-settings`,
       role: 'article',
-      filter: (data): data is { subject: SettingsStore<AssistantSettingsProps> } =>
-        data.subject instanceof SettingsStore && data.subject.prefix === ASSISTANT_PLUGIN,
+      filter: (data): data is { subject: SettingsStore<Assistant.Settings> } =>
+        data.subject instanceof SettingsStore && data.subject.prefix === meta.id,
       component: ({ data: { subject } }) => <AssistantSettings settings={subject.value} />,
     }),
     createSurface({
-      id: `${ASSISTANT_PLUGIN}/chat`,
+      id: `${meta.id}/chat`,
       role: 'article',
-      filter: (data): data is { subject: AIChatType; variant: undefined } =>
-        Obj.instanceOf(AIChatType, data.subject) && data.variant !== 'assistant-chat',
+      filter: (data): data is { subject: Assistant.Chat; variant: undefined } =>
+        Obj.instanceOf(Assistant.Chat, data.subject) && data.variant !== 'assistant-chat',
       component: ({ data, role }) => <ChatContainer role={role} chat={data.subject} />,
     }),
     createSurface({
-      id: `${ASSISTANT_PLUGIN}/object-chat`,
+      id: `${meta.id}/object-chat`,
       role: 'article',
-      filter: (data): data is { companionTo: Obj.Any; subject: AIChatType | 'assistant-chat' } =>
+      filter: (data): data is { companionTo: Obj.Any; subject: Assistant.Chat | 'assistant-chat' } =>
         Obj.isObject(data.companionTo) &&
-        (Obj.instanceOf(AIChatType, data.subject) || data.subject === 'assistant-chat'),
+        (Obj.instanceOf(Assistant.Chat, data.subject) || data.subject === 'assistant-chat'),
       component: ({ data, role }) => {
         const { dispatch } = useIntentDispatcher();
         const associatedArtifact = useMemo(
@@ -64,19 +64,19 @@ export default () =>
             const space = getSpace(data.companionTo);
             if (space && data.subject === 'assistant-chat') {
               const result = await space.db
-                .query(Query.select(Filter.ids(data.companionTo.id)).targetOf(CompanionTo).source())
+                .query(Query.select(Filter.ids(data.companionTo.id)).targetOf(Assistant.CompanionTo).source())
                 .run();
               if (result.objects.length > 0) {
                 return;
               }
 
               const program = Effect.gen(function* () {
-                const { object } = yield* dispatch(createIntent(AssistantAction.CreateChat, { space }));
+                const { object } = yield* dispatch(createIntent(Assistant.CreateChat, { space }));
                 yield* dispatch(createIntent(SpaceAction.AddObject, { object, target: space, hidden: true }));
                 yield* dispatch(
                   createIntent(SpaceAction.AddRelation, {
                     space,
-                    schema: CompanionTo,
+                    schema: Assistant.CompanionTo,
                     source: object,
                     target: data.companionTo,
                   }),
@@ -93,20 +93,20 @@ export default () =>
           return null;
         }
 
-        return <ChatContainer role={role} chat={data.subject} associatedArtifact={associatedArtifact} />;
+        return <ChatContainer role={role} chat={data.subject} artifact={associatedArtifact} />;
       },
     }),
     createSurface({
-      id: `${ASSISTANT_PLUGIN}/blueprint`,
+      id: `${meta.id}/sequence`,
       role: 'article',
-      filter: (data): data is { subject: Blueprint } => Obj.instanceOf(Blueprint, data.subject),
-      component: ({ data, role }) => <BlueprintContainer role={role} blueprint={data.subject} />,
+      filter: (data): data is { subject: Sequence } => Obj.instanceOf(Sequence, data.subject),
+      component: ({ data, role }) => <SequenceContainer role={role} sequence={data.subject} />,
     }),
     createSurface({
-      id: `${ASSISTANT_PLUGIN}/companion/logs`,
+      id: `${meta.id}/companion/logs`,
       role: 'article',
-      filter: (data): data is { companionTo: Blueprint } =>
-        Obj.instanceOf(Blueprint, data.companionTo) && data.subject === 'logs',
+      filter: (data): data is { companionTo: Sequence } =>
+        Obj.instanceOf(Sequence, data.companionTo) && data.subject === 'logs',
       component: ({ data, role }) => {
         const space = getSpace(data.companionTo);
         return (
@@ -117,7 +117,7 @@ export default () =>
       },
     }),
     createSurface({
-      id: `${ASSISTANT_PLUGIN}/template`,
+      id: `${meta.id}/template`,
       role: 'article',
       filter: (data): data is { subject: TemplateType } => Obj.instanceOf(TemplateType, data.subject),
       component: ({ data, role }) => <TemplateContainer role={role} template={data.subject} />,
@@ -125,11 +125,11 @@ export default () =>
     createSurface({
       id: ASSISTANT_DIALOG,
       role: 'dialog',
-      filter: (data): data is { props: { chat: AIChatType } } => data.component === ASSISTANT_DIALOG,
-      component: ({ data }) => <AssistantDialog {...data.props} />,
+      filter: (data): data is { props: { chat: Assistant.Chat } } => data.component === ASSISTANT_DIALOG,
+      component: ({ data }) => <ChatDialog {...data.props} />,
     }),
     createSurface({
-      id: `${ASSISTANT_PLUGIN}/prompt-settings`,
+      id: `${meta.id}/prompt-settings`,
       role: 'object-settings',
       filter: (data): data is { subject: TemplateType } => Obj.instanceOf(TemplateType, data.subject),
       component: ({ data }) => <PromptSettings template={data.subject} />,

package/src/capabilities/settings.ts

@@ -6,14 +6,14 @@ import { Capabilities, contributes } from '@dxos/app-framework';
 import { live } from '@dxos/live-object';
 
 import { meta } from '../meta';
-import { type AssistantSettingsProps, AssistantSettingsSchema } from '../types';
+import { Assistant } from '../types';
 
 export default () => {
-  const settings = live<AssistantSettingsProps>({});
+  const settings = live<Assistant.Settings>({});
 
   return contributes(Capabilities.Settings, {
     prefix: meta.id,
-    schema: AssistantSettingsSchema,
+    schema: Assistant.Settings,
     value: settings,
   });
 };

package/src/components/AssistantSettings/AssistantSettings.tsx

@@ -8,8 +8,8 @@ import { DEFAULT_EDGE_MODELS, DEFAULT_OLLAMA_MODELS } from '@dxos/ai';
 import { Input, Select, useTranslation } from '@dxos/react-ui';
 import { DeprecatedFormContainer, DeprecatedFormInput } from '@dxos/react-ui-form';
 
-import { ASSISTANT_PLUGIN } from '../../meta';
-import { LLM_PROVIDERS, type AssistantSettingsProps } from '../../types';
+import { meta } from '../../meta';
+import { LLM_PROVIDERS, type Assistant } from '../../types';
 
 // TODO(burdon): Factor out default Selector.
 const DEFAULT_VALUE = '__default';
@@ -20,8 +20,8 @@ const LLM_PROVIDER_LABELS = {
   lmstudio: 'LM Studio',
 } as const;
 
-export const AssistantSettings = ({ settings }: { settings: AssistantSettingsProps }) => {
-  const { t } = useTranslation(ASSISTANT_PLUGIN);
+export const AssistantSettings = ({ settings }: { settings: Assistant.Settings }) => {
+  const { t } = useTranslation(meta.id);
 
   return (
     <DeprecatedFormContainer>

package/src/components/Chat/Chat.tsx

@@ -0,0 +1,348 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { type Extension, Prec } from '@codemirror/state';
+import { keymap } from '@codemirror/view';
+import { createContext } from '@radix-ui/react-context';
+import { dedupeWith } from 'effect/Array';
+import React, { type PropsWithChildren, useCallback, useEffect, useMemo, useRef, useState } from 'react';
+
+import { Message } from '@dxos/ai';
+import { CollaborationActions, createIntent, useIntentDispatcher } from '@dxos/app-framework';
+import { Event } from '@dxos/async';
+import { DXN, Obj, Ref } from '@dxos/echo';
+import { log } from '@dxos/log';
+import { useVoiceInput } from '@dxos/plugin-transcription';
+import { type Expando, getSpace, useQueue, type Space } from '@dxos/react-client/echo';
+import { useIdentity } from '@dxos/react-client/halo';
+import { useTranslation, type ThemedClassName } from '@dxos/react-ui';
+import { ChatEditor, type ChatEditorController, type ChatEditorProps, references } from '@dxos/react-ui-chat';
+import { type ScrollController } from '@dxos/react-ui-components';
+import { mx } from '@dxos/react-ui-theme';
+import { isNotFalsy } from '@dxos/util';
+
+import { type ChatProcessor, useContextProvider, useBlueprints } from '../../hooks';
+import { meta } from '../../meta';
+import { type Assistant } from '../../types';
+import {
+  ChatActions,
+  type ChatActionsProps,
+  type ChatEvent,
+  ChatOptionsMenu,
+  ChatReferences,
+  type ChatReferencesProps,
+  ChatStatusIndicator,
+} from '../ChatPrompt';
+import { ChatThread as NativeChatThread, type ChatThreadProps as NativeChatThreadProps } from '../ChatThread';
+
+// TODO(burdon): Factor out.
+const Endcap = ({ children }: PropsWithChildren) => {
+  return (
+    <div className='grid w-[var(--rail-action)] h-[var(--rail-action)] items-center justify-center'>{children}</div>
+  );
+};
+
+//
+// Context
+// NOTE: The context should not be exported. It is only used internally.
+// Components outside of this Radix-style group shuld define their own APIs.
+//
+
+// TODO(burdon): Inject via effect layer.
+type ChatContextValue = {
+  event: Event<ChatEvent>;
+  space: Space;
+  chat: Assistant.Chat;
+  processor: ChatProcessor;
+  messages: Message[];
+
+  /** @deprecated Remove and replace with context. */
+  artifact?: Expando;
+};
+
+// NOTE: Do not export.
+const [ChatContextProvider, useChatContext] = createContext<ChatContextValue>('Chat');
+
+//
+// Root
+//
+
+type ChatRootProps = ThemedClassName<
+  PropsWithChildren<
+    Pick<ChatContextValue, 'chat' | 'processor' | 'artifact'> & {
+      onEvent?: (event: ChatEvent) => void;
+    }
+  >
+>;
+
+const ChatRoot = ({ classNames, children, chat, processor, artifact, onEvent, ...props }: ChatRootProps) => {
+  const space = getSpace(chat);
+
+  // Messages.
+  const queue = useQueue<Message>(chat?.queue.dxn);
+  const messages = useMemo(
+    () =>
+      dedupeWith(
+        [...(queue?.objects?.filter(Obj.instanceOf(Message)) ?? []), ...(processor?.messages.value ?? [])],
+        (a, b) => a.id === b.id,
+      ),
+    [queue?.objects, processor?.messages.value],
+  );
+
+  // TODO(burdon): Replace with tool.
+  const { dispatchPromise: dispatch } = useIntentDispatcher();
+  useEffect(() => {
+    if (!processor?.streaming.value && queue?.objects && artifact) {
+      const message = queue.objects[queue.objects.length - 1];
+      if (dispatch && space && chat && message) {
+        void dispatch(
+          createIntent(CollaborationActions.InsertContent, {
+            target: artifact,
+            object: Ref.fromDXN(new DXN(DXN.kind.QUEUE, [...chat.queue.dxn.parts, message.id])),
+            label: 'View proposal',
+          }),
+        );
+      }
+    }
+  }, [queue, processor?.streaming.value]);
+
+  // Events.
+  const event = useMemo(() => new Event<ChatEvent>(), []);
+  useEffect(() => {
+    return event.on((event) => {
+      switch (event.type) {
+        case 'submit': {
+          if (!processor.streaming.value) {
+            void processor.request(event.text);
+          }
+          break;
+        }
+
+        case 'cancel': {
+          void processor.cancel();
+          break;
+        }
+      }
+
+      onEvent?.(event);
+    });
+  }, [event, onEvent]);
+
+  if (!space) {
+    return null;
+  }
+
+  return (
+    <ChatContextProvider event={event} chat={chat} space={space} processor={processor} messages={messages} {...props}>
+      <div role='none' className={mx('flex flex-col grow', classNames)}>
+        {children}
+      </div>
+    </ChatContextProvider>
+  );
+};
+
+ChatRoot.displayName = 'Chat.Root';
+
+//
+// Thread
+//
+
+type ChatThreadProps = Omit<NativeChatThreadProps, 'identity' | 'space' | 'messages' | 'tools' | 'onPrompt'>;
+
+const ChatThread = (props: ChatThreadProps) => {
+  const { event, space, processor, messages } = useChatContext(ChatThread.displayName);
+  const identity = useIdentity();
+
+  const scrollerRef = useRef<ScrollController>(null);
+  useEffect(() => {
+    return event.on((event) => {
+      switch (event.type) {
+        case 'submit':
+        case 'scroll-to-bottom':
+          scrollerRef.current?.scrollToBottom('smooth');
+          break;
+      }
+    });
+  }, [event]);
+
+  const handlePrompt = useCallback<NonNullable<NativeChatThreadProps['onPrompt']>>(
+    (text) => {
+      if (!processor.streaming.value) {
+        event.emit({ type: 'submit', text });
+        return true;
+      }
+    },
+    [processor, event],
+  );
+
+  if (!identity) {
+    return null;
+  }
+
+  return (
+    <NativeChatThread
+      {...props}
+      ref={scrollerRef}
+      identity={identity}
+      space={space}
+      messages={messages}
+      tools={processor?.tools}
+      onPrompt={handlePrompt}
+    />
+  );
+};
+
+ChatThread.displayName = 'Chat.Thread';
+
+//
+// Prompt
+//
+
+type ChatPromptProps = ThemedClassName<Pick<ChatEditorProps, 'placeholder'> & { expandable?: boolean }>;
+
+const ChatPrompt = ({ classNames, placeholder, expandable }: ChatPromptProps) => {
+  const { t } = useTranslation(meta.id);
+  const { space, event, processor } = useChatContext(ChatPrompt.displayName);
+
+  const [active, setActive] = useState(false);
+  useEffect(() => {
+    return event.on((event) => {
+      switch (event.type) {
+        case 'record-start':
+          setActive(true);
+          break;
+        case 'record-stop':
+          setActive(false);
+          break;
+      }
+    });
+  }, [event]);
+
+  const editorRef = useRef<ChatEditorController>(null);
+
+  // TODO(burdon): Configure capability in TranscriptionPlugin.
+  const { recording } = useVoiceInput({
+    active,
+    onUpdate: (text) => {
+      editorRef.current?.setText(text);
+      editorRef.current?.focus();
+    },
+  });
+
+  const [blueprints, handleUpdateBlueprints] = useBlueprints(processor.context);
+
+  // TODO(burdon): Reconcile with object tags.
+  const contextProvider = useContextProvider(space);
+  const extensions = useMemo<Extension[]>(() => {
+    return [
+      contextProvider &&
+        references({
+          provider: {
+            getReferences: async ({ query }) => contextProvider.query({ query }),
+            resolveReference: async ({ uri }) => contextProvider.resolveMetadata({ uri }),
+          },
+        }),
+      expandable &&
+        Prec.highest(
+          keymap.of([
+            {
+              key: 'cmd-ArrowUp',
+              preventDefault: true,
+              run: () => {
+                event.emit({ type: 'thread-open' });
+                return true;
+              },
+            },
+            {
+              key: 'cmd-ArrowDown',
+              preventDefault: true,
+              run: () => {
+                event.emit({ type: 'thread-close' });
+                return true;
+              },
+            },
+          ]),
+        ),
+    ].filter(isNotFalsy);
+  }, [event, expandable, contextProvider]);
+
+  const handleSubmit = useCallback<NonNullable<ChatEditorProps['onSubmit']>>(
+    (text) => {
+      if (!processor.streaming.value) {
+        event.emit({ type: 'submit', text });
+        return true;
+      }
+    },
+    [processor, event],
+  );
+
+  const handleEvent = useCallback<NonNullable<ChatActionsProps['onEvent']>>(
+    (ev) => {
+      event.emit(ev);
+    },
+    [event],
+  );
+
+  // TODO(burdon): Update context.
+  const handleUpdateReferences = useCallback<NonNullable<ChatReferencesProps['onUpdate']>>((ids) => {
+    log.info('update', { ids });
+  }, []);
+
+  return (
+    <div
+      className={mx(
+        'is-full grid grid-cols-[var(--rail-action)_1fr_min-content] grid-rows-[min-content_var(--rail-action)]',
+        classNames,
+      )}
+    >
+      <Endcap>
+        <ChatStatusIndicator error={processor.error.value} processing={processor.streaming.value} />
+      </Endcap>
+
+      <ChatEditor
+        ref={editorRef}
+        autoFocus
+        lineWrapping
+        classNames='col-span-2 pis-1 pbs-2'
+        placeholder={placeholder ?? t('prompt placeholder')}
+        extensions={extensions}
+        onSubmit={handleSubmit}
+      />
+
+      <ChatOptionsMenu
+        blueprintRegistry={processor.blueprintRegistry}
+        blueprints={blueprints}
+        onChange={handleUpdateBlueprints}
+      />
+
+      <ChatReferences
+        classNames='flex pis-1 items-center'
+        space={space}
+        context={processor.context}
+        onUpdate={handleUpdateReferences}
+      />
+
+      <ChatActions
+        microphone={true}
+        recording={recording}
+        processing={processor.streaming.value}
+        onEvent={handleEvent}
+      />
+    </div>
+  );
+};
+
+ChatPrompt.displayName = 'Chat.Prompt';
+
+//
+// Chat
+//
+
+export const Chat = {
+  Root: ChatRoot,
+  Thread: ChatThread,
+  Prompt: ChatPrompt,
+};
+
+export type { ChatRootProps, ChatThreadProps, ChatPromptProps, ChatEvent };

package/src/{experimental/transcription → components/Chat}/index.ts

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

package/src/components/ChatContainer.tsx

@@ -2,36 +2,42 @@
 // Copyright 2025 DXOS.org
 //
 
-import React, { type FC } from 'react';
+import React from 'react';
 
-import { Capabilities, useCapabilities, useCapability } from '@dxos/app-framework';
+import { Capabilities, useCapability } from '@dxos/app-framework';
 import { type AssociatedArtifact } from '@dxos/artifact';
-import { TranscriptionCapabilities } from '@dxos/plugin-transcription';
+import { getSpace } from '@dxos/client/echo';
 import { StackItem } from '@dxos/react-ui-stack';
 
-import { ThreadContainer } from './Thread';
-import { ASSISTANT_PLUGIN } from '../meta';
-import { type AssistantSettingsProps, type AIChatType } from '../types';
+import { Chat } from './Chat';
+import { useChatProcessor, useServiceContainer } from '../hooks';
+import { meta } from '../meta';
+import { type Assistant } from '../types';
 
 export type ChatContainerProps = {
   role: string;
-  chat: AIChatType;
-  associatedArtifact?: AssociatedArtifact;
+  chat: Assistant.Chat;
+  artifact?: AssociatedArtifact;
 };
 
-// TODO(burdon): Attention.
-export const ChatContainer: FC<ChatContainerProps> = ({ role, chat, associatedArtifact }) => {
-  const transcription = useCapabilities(TranscriptionCapabilities.Transcriber).length > 0;
-  const settings = useCapability(Capabilities.SettingsStore).getStore<AssistantSettingsProps>(ASSISTANT_PLUGIN)?.value;
+export const ChatContainer = ({ role, chat, artifact }: ChatContainerProps) => {
+  const space = getSpace(chat);
+  const settings = useCapability(Capabilities.SettingsStore).getStore<Assistant.Settings>(meta.id)?.value;
+  const serviceContainer = useServiceContainer({ space });
+  const processor = useChatProcessor({ part: 'deck', chat, serviceContainer, settings });
+  if (!processor) {
+    return null;
+  }
 
+  // TODO(burdon): Add attention attributes.
   return (
     <StackItem.Content role={role} classNames='container-max-width'>
-      <ThreadContainer
-        chat={chat}
-        settings={settings}
-        transcription={transcription}
-        associatedArtifact={associatedArtifact}
-      />
+      <Chat.Root chat={chat} processor={processor} artifact={artifact}>
+        <Chat.Thread />
+        <div className='pbe-4 pis-2 pie-2'>
+          <Chat.Prompt classNames='border border-subduedSeparator rounded-md' />
+        </div>
+      </Chat.Root>
     </StackItem.Content>
   );
 };

package/src/components/ChatDialog.tsx

@@ -0,0 +1,65 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import React, { useCallback, useState } from 'react';
+
+import { useCapability, Capabilities } from '@dxos/app-framework';
+import { getSpace } from '@dxos/client/echo';
+import { useTranslation } from '@dxos/react-ui';
+import { ChatDialog as NativeChatDialog } from '@dxos/react-ui-chat';
+
+import { Chat, type ChatRootProps } from './Chat';
+import { useChatProcessor, useServiceContainer } from '../hooks';
+import { meta } from '../meta';
+import { type Assistant } from '../types';
+
+export type ChatDialogProps = {
+  chat?: Assistant.Chat;
+};
+
+export const ChatDialog = ({ chat }: ChatDialogProps) => {
+  const { t } = useTranslation(meta.id);
+
+  const space = getSpace(chat);
+  const settings = useCapability(Capabilities.SettingsStore).getStore<Assistant.Settings>(meta.id)?.value;
+  const serviceContainer = useServiceContainer({ space });
+  const processor = useChatProcessor({ part: 'dialog', chat, serviceContainer, settings });
+
+  // TODO(burdon): Refocus when open.
+  const [open, setOpen] = useState(true);
+  const [expanded, setExpanded] = useState(false);
+  const handleEvent = useCallback<NonNullable<ChatRootProps['onEvent']>>((event) => {
+    switch (event.type) {
+      case 'submit':
+      case 'thread-open':
+        setOpen(true);
+        setExpanded(true);
+        break;
+
+      case 'thread-close':
+        setOpen(false);
+        break;
+    }
+  }, []);
+
+  if (!chat || !processor) {
+    return null;
+  }
+
+  return (
+    <Chat.Root chat={chat} processor={processor} onEvent={handleEvent}>
+      <NativeChatDialog.Root open={open} expanded={expanded} onOpenChange={setOpen}>
+        <NativeChatDialog.Header title={t('assistant dialog title')} />
+        <NativeChatDialog.Content>
+          <Chat.Thread />
+        </NativeChatDialog.Content>
+        <NativeChatDialog.Footer>
+          <Chat.Prompt expandable />
+        </NativeChatDialog.Footer>
+      </NativeChatDialog.Root>
+    </Chat.Root>
+  );
+};
+
+export default ChatDialog;