@dxos/plugin-assistant 0.8.4-main.fd6878d → 0.8.4-staging.60fe92afc8

package/src/containers/ChatArticle/ChatArticle.stories.tsx

@@ -0,0 +1,78 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+import { type Meta, type StoryObj } from '@storybook/react-vite';
+import * as Effect from 'effect/Effect';
+import React from 'react';
+
+import { SERVICES_CONFIG } from '@dxos/ai/testing';
+import { withPluginManager } from '@dxos/app-framework/testing';
+import { AppActivationEvents } from '@dxos/app-toolkit';
+import { Chat } from '@dxos/assistant-toolkit';
+import { capabilities } from '@dxos/assistant-toolkit/testing';
+import { Feed, Filter, Ref } from '@dxos/echo';
+import { AutomationPlugin } from '@dxos/plugin-automation/testing';
+import { initializeIdentity, ClientPlugin } from '@dxos/plugin-client/testing';
+import { PreviewPlugin } from '@dxos/plugin-preview/testing';
+import { StorybookPlugin, corePlugins } from '@dxos/plugin-testing';
+import { Config } from '@dxos/react-client';
+import { useQuery, useSpaces } from '@dxos/react-client/echo';
+import { Loading, withTheme } from '@dxos/react-ui/testing';
+
+import { translations } from '#translations';
+
+import { AssistantPlugin } from '../../AssistantPlugin';
+import { ChatArticle } from './ChatArticle';
+
+const DefaultStory = () => {
+  const [space] = useSpaces();
+  const [chat] = useQuery(space?.db, Filter.type(Chat.Chat));
+  if (!chat) {
+    return <Loading />;
+  }
+
+  return <ChatArticle role='article' subject={chat} attendableId='story' />;
+};
+
+const meta = {
+  title: 'plugins/plugin-assistant/containers/ChatArticle',
+  render: DefaultStory,
+  decorators: [
+    withTheme(),
+    withPluginManager({
+      setupEvents: [AppActivationEvents.SetupSettings],
+      plugins: [
+        ...corePlugins(),
+        ClientPlugin({
+          types: [Chat.Chat, Feed.Feed],
+          config: new Config({ runtime: { services: SERVICES_CONFIG.REMOTE } }),
+          onClientInitialized: ({ client }) =>
+            Effect.gen(function* () {
+              yield* initializeIdentity(client);
+              const [space] = client.spaces.get();
+              yield* Effect.promise(() => space.waitUntilReady());
+              const feed = space.db.add(Feed.make());
+              space.db.add(Chat.make({ name: 'Test', feed: Ref.make(feed) }));
+              yield* Effect.promise(() => space.db.flush({ indexes: true }));
+            }),
+        }),
+        AutomationPlugin(),
+        AssistantPlugin(),
+        PreviewPlugin(),
+        StorybookPlugin({}),
+      ],
+      capabilities,
+    }),
+  ],
+  parameters: {
+    layout: 'fullscreen',
+    translations,
+  },
+} satisfies Meta<typeof DefaultStory>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {};

package/src/containers/ChatArticle/ChatArticle.tsx

@@ -0,0 +1,112 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import React, { forwardRef, useEffect, useRef } from 'react';
+
+import { Capabilities } from '@dxos/app-framework';
+import { useAtomCapability, useCapability } from '@dxos/app-framework/ui';
+import { type AppSurface } from '@dxos/app-toolkit/ui';
+import { getSpace } from '@dxos/client/echo';
+import { type Obj } from '@dxos/echo';
+import { useRegistry } from '@dxos/react-client/echo';
+import { Panel } from '@dxos/react-ui';
+
+import { Chat as ChatComponent, type ChatRootProps } from '#components';
+import { useChatProcessor, useChatServices, useOnline, usePresets } from '#hooks';
+import { type Assistant, AssistantCapabilities, type ChatType } from '#types';
+
+export type ChatArticleProps = AppSurface.ObjectSectionProps<ChatType.Chat> & {
+  companionTo?: Obj.Unknown;
+} & Pick<ChatRootProps, 'onEvent' | 'onSubmit'>;
+
+export const ChatArticle = forwardRef<HTMLDivElement, ChatArticleProps>(
+  ({ role, attendableId, subject: chat, companionTo, onEvent, onSubmit }, forwardedRef) => {
+    const registry = useRegistry();
+    const settings = useAtomCapability(AssistantCapabilities.Settings);
+    const atomRegistry = useCapability(Capabilities.AtomRegistry);
+    const stateAtom = useCapability(AssistantCapabilities.State);
+    // Transient (pre-submit) chats have no database; fall back to the companion's space.
+    const space = getSpace(chat) ?? getSpace(companionTo);
+    const runtime = useChatServices({ id: space?.id });
+
+    const [online, setOnline] = useOnline();
+    const { preset, ...chatProps } = usePresets(online);
+    const processor = useChatProcessor({ space, chat, preset, runtime, registry, settings });
+    const pendingSubmitted = useRef(false);
+
+    // Reset the one-shot guard when the target conversation changes, so a pending prompt for a new
+    // `attendableId` is still auto-submitted within the same mount.
+    useEffect(() => {
+      pendingSubmitted.current = false;
+    }, [attendableId]);
+
+    useEffect(() => {
+      if (!processor || !attendableId || pendingSubmitted.current) {
+        return;
+      }
+
+      const state = atomRegistry.get(stateAtom);
+      const pendingPrompt = state.pendingPrompts[attendableId];
+      if (pendingPrompt) {
+        pendingSubmitted.current = true;
+        atomRegistry.update(stateAtom, (current) => {
+          const { [attendableId]: _, ...rest } = current.pendingPrompts;
+          return { ...current, pendingPrompts: rest };
+        });
+
+        void processor.request({ message: pendingPrompt });
+      }
+    }, [processor, attendableId, atomRegistry, stateAtom]);
+
+    const feedTarget = chat?.feed.target;
+    const view = (chat?.view as Assistant.ChatView | undefined) ?? settings.chatView;
+
+    if (!processor) {
+      return null;
+    }
+
+    return (
+      <ChatComponent.Root
+        chat={chat}
+        feed={feedTarget}
+        db={space?.db}
+        processor={processor}
+        onEvent={onEvent}
+        onSubmit={onSubmit}
+      >
+        <Panel.Root role={role} ref={forwardedRef}>
+          <Panel.Toolbar className='bg-toolbar-surface'>
+            <ChatComponent.Toolbar classNames='dx-document' attendableId={attendableId} companionTo={companionTo} />
+          </Panel.Toolbar>
+          <Panel.Content>
+            <ChatComponent.Content>
+              <div className='dx-container relative'>
+                <ChatComponent.Thread viewType={view} />
+                {view !== 'summary' && (
+                  <div className='absolute bottom-2 left-0 right-0'>
+                    <div className='dx-document px-4'>
+                      <ChatComponent.Status classNames='px-3 rounded-sm bg-group-surface' />
+                    </div>
+                  </div>
+                )}
+              </div>
+              <div className='dx-document px-4 pb-4'>
+                <div className='flex flex-col items-center py-2 overflow-hidden'>
+                  <ChatComponent.TaskList classNames='max-h-[120px] border border-separator rounded-sm text-description' />
+                </div>
+                <ChatComponent.Prompt
+                  {...chatProps}
+                  outline
+                  preset={preset?.id}
+                  online={online}
+                  onOnlineChange={setOnline}
+                />
+              </div>
+            </ChatComponent.Content>
+          </Panel.Content>
+        </Panel.Root>
+      </ChatComponent.Root>
+    );
+  },
+);

package/src/containers/ChatArticle/index.ts

@@ -0,0 +1,5 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+export { ChatArticle as default } from './ChatArticle';

package/src/containers/ChatCompanion/ChatCompanion.tsx

@@ -0,0 +1,127 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import * as Option from 'effect/Option';
+import React, { forwardRef, useCallback, useMemo } from 'react';
+
+import { useOperationInvoker } from '@dxos/app-framework/ui';
+import { BlueprintsAnnotation } from '@dxos/app-toolkit';
+import { type AppSurface } from '@dxos/app-toolkit/ui';
+import { Chat } from '@dxos/assistant-toolkit';
+import { getSpace } from '@dxos/client/echo';
+import { Blueprint } from '@dxos/compute';
+import { Entity, Filter, Obj, Ref, Type } from '@dxos/echo';
+import { SpaceOperation } from '@dxos/plugin-space';
+import { useQuery, useRegistry } from '@dxos/react-client/echo';
+import { useAsyncEffect } from '@dxos/react-ui';
+
+import { useContextBinder } from '#hooks';
+import { AssistantOperation } from '#types';
+
+import ChatArticle from '../ChatArticle';
+
+export type ChatCompanionProps = AppSurface.ArticleProps<Chat.Chat, {}, Obj.Unknown>;
+
+export const ChatCompanion = forwardRef<HTMLDivElement, ChatCompanionProps>(
+  ({ role = 'article', subject: chat, companionTo, attendableId }, forwardedRef) => {
+    const { invokePromise } = useOperationInvoker();
+    const space = getSpace(companionTo);
+    useBlueprints({ subject: chat, companionTo });
+
+    // Persist (and flush) a transient chat before the first request so the agent can resolve
+    // the now-durable conversation feed; subsequent submits are a no-op once persisted.
+    const handleSubmit = useCallback(async () => {
+      if (!space || !chat || Obj.getDatabase(chat)) {
+        return;
+      }
+
+      await invokePromise(SpaceOperation.AddObject, {
+        object: chat,
+        target: space.db,
+        hidden: true,
+      });
+      await invokePromise(SpaceOperation.AddRelation, {
+        db: space.db,
+        schema: Chat.CompanionTo,
+        source: chat,
+        target: companionTo,
+      });
+      await invokePromise(AssistantOperation.SetCurrentChat, {
+        companionTo,
+        chat,
+      });
+      await space.db.flush();
+    }, [space, chat, companionTo, invokePromise]);
+
+    return (
+      <ChatArticle
+        role={role}
+        subject={chat}
+        attendableId={attendableId}
+        companionTo={companionTo}
+        onSubmit={handleSubmit}
+        ref={forwardedRef}
+      />
+    );
+  },
+);
+
+/**
+ * Bind blueprints to the context.
+ */
+// TODO(burdon): Why is this only in the companion?
+const useBlueprints = ({ subject: chat, companionTo }: Pick<ChatCompanionProps, 'subject' | 'companionTo'>) => {
+  const registry = useRegistry();
+  const space = getSpace(companionTo);
+  const feedTarget = chat?.feed.target;
+  const binder = useContextBinder(space, feedTarget);
+
+  const blueprintKeys = useMemo(() => {
+    const schema = companionTo ? Obj.getType(companionTo) : undefined;
+    if (!schema) {
+      return [] as string[];
+    }
+
+    return Option.getOrElse(() => [] as string[])(BlueprintsAnnotation.get(Type.getSchema(schema)));
+  }, [companionTo]);
+
+  const existingBlueprints = useQuery(space?.db, Filter.type(Blueprint.Blueprint));
+  const pluginBlueprints = useMemo(
+    () =>
+      existingBlueprints.filter((blueprint) => {
+        const key = Obj.getMeta(blueprint).key;
+        return key !== undefined && blueprintKeys.includes(key);
+      }),
+    [existingBlueprints, blueprintKeys],
+  );
+
+  useAsyncEffect(async () => {
+    if (!binder?.isOpen) {
+      return;
+    }
+
+    // Bind annotated blueprints: use key URI for registry blueprints (no DB clone needed).
+    if (blueprintKeys.length > 0) {
+      const registryKeys = blueprintKeys.filter((key) => {
+        const candidate = registry.list().find((e) => Entity.getMeta(e)?.key === key);
+        return candidate != null && Obj.instanceOf(Blueprint.Blueprint, candidate);
+      });
+
+      // DB-forked blueprints (in space but not in registry).
+      const dbForks = pluginBlueprints.filter((bp) => !registryKeys.includes(Obj.getMeta(bp).key ?? ''));
+      if (registryKeys.length > 0) {
+        await binder.bind({ blueprints: registryKeys.map((key) => Ref.fromURI(Blueprint.registryURI(key))) });
+      }
+      if (dbForks.length > 0) {
+        await binder.bind({ blueprints: dbForks.map((blueprint) => Ref.make(blueprint)) });
+      }
+    }
+
+    if (Obj.instanceOf(Blueprint.Blueprint, companionTo)) {
+      await binder.bind({ blueprints: [Ref.make(companionTo)] });
+    } else {
+      await binder.bind({ objects: [Ref.make(companionTo)] });
+    }
+  }, [binder, blueprintKeys, pluginBlueprints, companionTo]);
+};

package/src/containers/ChatCompanion/index.ts

@@ -0,0 +1,5 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+export { ChatCompanion as default } from './ChatCompanion';

package/src/containers/ChatDialog/ChatDialog.tsx

@@ -0,0 +1,67 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import React, { useCallback, useState } from 'react';
+
+import { useAtomCapability } from '@dxos/app-framework/ui';
+import { type Chat as ChatTypes } from '@dxos/assistant-toolkit';
+import { Obj } from '@dxos/echo';
+import { useRegistry } from '@dxos/react-client/echo';
+import { useTranslation } from '@dxos/react-ui';
+import { ChatDialog as NaturalChatDialog } from '@dxos/react-ui-chat';
+
+import { Chat, type ChatRootProps } from '#components';
+import { useChatProcessor, useChatServices, useOnline, usePresets } from '#hooks';
+import { meta } from '#meta';
+import { type Assistant, AssistantCapabilities } from '#types';
+
+export type ChatDialogProps = {
+  chat?: ChatTypes.Chat;
+};
+
+export const ChatDialog = ({ chat }: ChatDialogProps) => {
+  const { t } = useTranslation(meta.id);
+
+  const db = chat && Obj.getDatabase(chat);
+  const settings = useAtomCapability(AssistantCapabilities.Settings);
+  const runtime = useChatServices({ id: db?.spaceId });
+  const [online, setOnline] = useOnline();
+  const { preset, ...chatProps } = usePresets(online);
+  const registry = useRegistry();
+  const processor = useChatProcessor({ chat, preset, runtime, registry, 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}>
+      <NaturalChatDialog.Root open={open} expanded={expanded} onOpenChange={setOpen}>
+        <NaturalChatDialog.Header title={t('assistant-dialog.title')} />
+        <NaturalChatDialog.Content>
+          <Chat.Thread viewType={(chat.view as Assistant.ChatView | undefined) ?? settings.chatView} />
+        </NaturalChatDialog.Content>
+        <NaturalChatDialog.Footer classNames='p-1.5'>
+          <Chat.Prompt {...chatProps} preset={preset?.id} online={online} onOnlineChange={setOnline} expandable />
+        </NaturalChatDialog.Footer>
+      </NaturalChatDialog.Root>
+    </Chat.Root>
+  );
+};

package/src/containers/ChatDialog/index.ts

@@ -0,0 +1,5 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+export { ChatDialog as default } from './ChatDialog';

package/src/containers/PlanArticle/PlanArticle.tsx

@@ -0,0 +1,33 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+import React from 'react';
+
+import { type AppSurface } from '@dxos/app-toolkit/ui';
+import { type Plan } from '@dxos/assistant-toolkit';
+import { Panel, ScrollArea, Toolbar } from '@dxos/react-ui';
+import { useAttention } from '@dxos/react-ui-attention';
+
+import { TaskList } from '#components';
+
+export type PlanArticleProps = AppSurface.ObjectArticleProps<Plan.Plan>;
+
+export const PlanArticle = ({ role, attendableId, subject }: PlanArticleProps) => {
+  const { hasAttention } = useAttention(attendableId);
+
+  return (
+    <Panel.Root role={role} classNames='dx-document'>
+      <Panel.Toolbar asChild>
+        <Toolbar.Root disabled={!hasAttention} />
+      </Panel.Toolbar>
+      <Panel.Content asChild>
+        <ScrollArea.Root orientation='vertical'>
+          <ScrollArea.Viewport>
+            <TaskList plan={subject} />
+          </ScrollArea.Viewport>
+        </ScrollArea.Root>
+      </Panel.Content>
+    </Panel.Root>
+  );
+};

package/src/containers/PlanArticle/index.ts

@@ -0,0 +1,5 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+export { PlanArticle as default } from './PlanArticle';

package/src/containers/RoutineArticle/RoutineArticle.stories.tsx

@@ -0,0 +1,75 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+import { type Meta, type StoryObj } from '@storybook/react-vite';
+import * as Effect from 'effect/Effect';
+import React from 'react';
+
+import { withPluginManager } from '@dxos/app-framework/testing';
+import { Routine } from '@dxos/compute';
+import { Filter } from '@dxos/echo';
+import { AutomationPlugin } from '@dxos/plugin-automation/testing';
+import { ClientPlugin } from '@dxos/plugin-client/testing';
+import { initializeIdentity } from '@dxos/plugin-client/testing';
+import { corePlugins } from '@dxos/plugin-testing';
+import { useQuery, useSpaces } from '@dxos/react-client/echo';
+import { Loading, withLayout, withTheme } from '@dxos/react-ui/testing';
+
+import { translations } from '#translations';
+
+import { AssistantPlugin } from '../../AssistantPlugin';
+import { RoutineArticle } from './RoutineArticle';
+
+const DefaultStory = () => {
+  const [space] = useSpaces();
+  const [routine] = useQuery(space?.db, Filter.type(Routine.Routine));
+  if (!routine) {
+    return <Loading />;
+  }
+
+  return <RoutineArticle role='article' subject={routine} attendableId='story' />;
+};
+
+const meta = {
+  title: 'plugins/plugin-assistant/containers/RoutineArticle',
+  render: DefaultStory,
+  decorators: [
+    withTheme(),
+    withLayout({ layout: 'column' }),
+    withPluginManager({
+      plugins: [
+        ...corePlugins(),
+        ClientPlugin({
+          types: [Routine.Routine],
+          onClientInitialized: ({ client }) =>
+            Effect.gen(function* () {
+              yield* initializeIdentity(client);
+              const [space] = client.spaces.get();
+              yield* Effect.promise(() => space.waitUntilReady());
+
+              space.db.add(
+                Routine.make({
+                  name: 'Summarize',
+                  description: 'Summarize the selected object.',
+                  instructions: 'Create a new markdown document that is a summary of the selected object.',
+                }),
+              );
+            }),
+        }),
+        AutomationPlugin(),
+        AssistantPlugin(),
+      ],
+    }),
+  ],
+  parameters: {
+    layout: 'fullscreen',
+    translations,
+  },
+} satisfies Meta<typeof DefaultStory>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {};

package/src/containers/RoutineArticle/RoutineArticle.tsx

@@ -0,0 +1,109 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+
+import { useSpaceCallback } from '@dxos/app-framework/ui';
+import { type AppSurface } from '@dxos/app-toolkit/ui';
+import { AgentPrompt } from '@dxos/assistant-toolkit';
+import { Operation, type Routine } from '@dxos/compute';
+import { Database, Feed, Obj } from '@dxos/echo';
+import { invariant } from '@dxos/invariant';
+import { Panel, Toolbar, useTranslation } from '@dxos/react-ui';
+import { useAttention } from '@dxos/react-ui-attention';
+import { JsonHighlighter } from '@dxos/react-ui-syntax-highlighter';
+
+import { TemplateEditor } from '#components';
+import { meta } from '#meta';
+
+export type RoutineArticleProps = AppSurface.ObjectArticleProps<Routine.Routine>;
+
+type RunState =
+  | { status: 'idle' }
+  | { status: 'running' }
+  | { status: 'success'; result: unknown }
+  | { status: 'error'; error: Error };
+
+// TODO(burdon): Trigger editor.
+export const RoutineArticle = ({ role, attendableId, subject }: RoutineArticleProps) => {
+  const { t } = useTranslation(meta.id);
+  const { hasAttention } = useAttention(attendableId);
+  const invoke = usePromptHandler(subject);
+  const [state, setState] = useState<RunState>({ status: 'idle' });
+  const mountedRef = useRef(true);
+  useEffect(() => {
+    return () => {
+      mountedRef.current = false;
+    };
+  }, []);
+
+  const handleRun = useCallback(async () => {
+    setState({ status: 'running' });
+    try {
+      const result = await invoke();
+      if (mountedRef.current) {
+        setState({ status: 'success', result });
+      }
+    } catch (err) {
+      if (mountedRef.current) {
+        setState({ status: 'error', error: err instanceof Error ? err : new Error(String(err)) });
+      }
+    }
+  }, [invoke]);
+
+  return (
+    <Panel.Root role={role} className='dx-document'>
+      <Panel.Toolbar asChild>
+        <Toolbar.Root disabled={!hasAttention || state.status === 'running'}>
+          <Toolbar.IconButton
+            iconOnly
+            icon={state.status === 'running' ? 'ph--spinner-gap--regular' : 'ph--play--regular'}
+            label={t('run-prompt.label')}
+            onClick={handleRun}
+          />
+        </Toolbar.Root>
+      </Panel.Toolbar>
+      <Panel.Content classNames='flex flex-col gap-2'>
+        <TemplateEditor id={subject.id} source={subject.instructions} />
+        <RoutineResult state={state} />
+      </Panel.Content>
+    </Panel.Root>
+  );
+};
+
+const RoutineResult = ({ state }: { state: RunState }) => {
+  const { t } = useTranslation(meta.id);
+  switch (state.status) {
+    case 'idle':
+      return null;
+    case 'running':
+      return <div className='p-2 text-sm text-subdued'>{t('routine-running.label')}</div>;
+    case 'error':
+      return <div className='p-2 text-sm text-error'>{state.error.message}</div>;
+    case 'success':
+      return <JsonHighlighter classNames='p-2! text-sm' data={state.result} />;
+  }
+};
+
+const usePromptHandler = (routine: Routine.Routine) => {
+  const db = Obj.getDatabase(routine);
+  const data = useMemo<Operation.Definition.Input<typeof AgentPrompt> | undefined>(() => {
+    if (db && routine) {
+      return {
+        prompt: db.makeRef(Obj.getURI(routine)),
+        input: {},
+      };
+    }
+  }, [routine, db]);
+
+  return useSpaceCallback(
+    db?.spaceId,
+    [Database.Service, Feed.FeedService] as const,
+    () => {
+      invariant(data);
+      return Operation.invoke(AgentPrompt, data);
+    },
+    [data],
+  );
+};

package/src/containers/RoutineArticle/index.ts

@@ -0,0 +1,5 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+export { RoutineArticle as default } from './RoutineArticle';