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

package/src/components/{BlueprintContainer.tsx → SequenceContainer.tsx}

@@ -8,21 +8,15 @@ import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 
 import { ToolRegistry } from '@dxos/ai';
 import { useCapability } from '@dxos/app-framework';
-import {
-  type Blueprint,
-  type BlueprintDefinition,
-  BlueprintMachine,
-  createLocalSearchTool,
-  createExaTool,
-  createGraphWriterTool,
-} from '@dxos/assistant';
+import { createLocalSearchTool, createExaTool, createGraphWriterTool } from '@dxos/assistant';
 import { getSpace } from '@dxos/client/echo';
+import { type Sequence, type SequenceDefinition, SequenceMachine } from '@dxos/conductor';
 import { DXN, Key } from '@dxos/echo';
 import { Toolbar, useTranslation } from '@dxos/react-ui';
 import { getSelectionSet, useSelectionManager } from '@dxos/react-ui-attention';
 import { StackItem, type StackItemContentProps } from '@dxos/react-ui-stack';
 
-import { BlueprintEditor } from './BlueprintEditor';
+import { SequenceEditor } from './SequenceEditor';
 import { AssistantCapabilities } from '../capabilities';
 import { meta } from '../meta';
 import { QueueLogger } from '../queue-logger';
@@ -31,7 +25,7 @@ import { QueueLogger } from '../queue-logger';
 export const EXA_API_KEY = '9c7e17ff-0c85-4cd5-827a-8b489f139e03';
 
 // TODO(burdon): Validate.
-const parseBlueprint = (text: string): BlueprintDefinition | undefined => {
+const parseSequence = (text: string): SequenceDefinition | undefined => {
   try {
     const json = JSON5.parse(text);
     const { steps } = json;
@@ -41,25 +35,22 @@ const parseBlueprint = (text: string): BlueprintDefinition | undefined => {
   }
 };
 
-export const BlueprintContainer = ({
-  role,
-  blueprint,
-}: Pick<StackItemContentProps, 'role'> & { blueprint: Blueprint }) => {
+export const SequenceContainer = ({ role, sequence }: Pick<StackItemContentProps, 'role'> & { sequence: Sequence }) => {
   const { t } = useTranslation(meta.id);
   const aiClient = useCapability(AssistantCapabilities.AiClient);
   const selectionManager = useSelectionManager();
-  const [definition, setDefinition] = useState<BlueprintDefinition>();
+  const [definition, setDefinition] = useState<SequenceDefinition>();
   useEffect(() => {
     setDefinition({
-      steps: blueprint.steps.map(({ instructions, tools }) => ({ instructions, tools })),
+      steps: sequence.steps.map(({ instructions, tools }) => ({ instructions, tools })),
     });
-  }, [blueprint]);
+  }, [sequence]);
 
   const editorRef = useRef<EditorView | undefined>(undefined);
 
   // TODO(burdon): Factor out.
   const toolRegistry = useMemo(() => {
-    const space = getSpace(blueprint);
+    const space = getSpace(sequence);
     if (!space) {
       return;
     }
@@ -73,16 +64,16 @@ export const BlueprintContainer = ({
       createGraphWriterTool({
         db: space.db,
         queue,
-        schema: [], // TODO(burdon): Get schema from client/blueprint?
+        schema: [], // TODO(burdon): Get schema from client/sequence?
         onDone: async (objects) => {
           await queue.append(objects);
         },
       }),
     ]);
-  }, [blueprint]);
+  }, [sequence]);
 
-  const formatAndSave = useCallback((): BlueprintDefinition | undefined => {
-    if (!blueprint) {
+  const formatAndSave = useCallback((): SequenceDefinition | undefined => {
+    if (!sequence) {
       return;
     }
 
@@ -91,7 +82,7 @@ export const BlueprintContainer = ({
       return;
     }
 
-    const definition = parseBlueprint(text);
+    const definition = parseSequence(text);
     if (!definition) {
       return;
     }
@@ -102,19 +93,19 @@ export const BlueprintContainer = ({
       changes: { from: 0, to: text.length, insert: formatted },
     });
 
-    blueprint.steps.length = 0;
+    sequence.steps.length = 0;
     for (const step of definition.steps) {
-      blueprint.steps.push({
+      sequence.steps.push({
         id: Key.ObjectId.random(),
         instructions: step.instructions,
         tools: step.tools,
       });
     }
 
-    return blueprint;
-  }, [blueprint]);
+    return sequence;
+  }, [sequence]);
 
-  // TODO(burdon): Save raw blueprint separately from parsed blueprint? (like Script).
+  // TODO(burdon): Save raw sequence separately from parsed sequence? (like Script).
   const handleSave = useCallback(() => formatAndSave(), [formatAndSave]);
 
   const handleRun = useCallback(async () => {
@@ -130,9 +121,9 @@ export const BlueprintContainer = ({
       return;
     }
 
-    const machine = new BlueprintMachine(toolRegistry, blueprint).setLogger(new QueueLogger(blueprint));
+    const machine = new SequenceMachine(toolRegistry, sequence).setLogger(new QueueLogger(sequence));
     await machine.runToCompletion({ aiClient: aiClient.value, input });
-  }, [aiClient.value, blueprint, formatAndSave, selectionManager, toolRegistry]);
+  }, [aiClient.value, sequence, formatAndSave, selectionManager, toolRegistry]);
 
   return (
     <StackItem.Content role={role} toolbar>
@@ -140,9 +131,9 @@ export const BlueprintContainer = ({
         <Toolbar.Button onClick={handleSave}>{t('button save')}</Toolbar.Button>
         <Toolbar.Button onClick={handleRun}>{t('button run')}</Toolbar.Button>
       </Toolbar.Root>
-      {definition && <BlueprintEditor ref={editorRef} blueprint={definition} />}
+      {definition && <SequenceEditor ref={editorRef} sequence={definition} />}
     </StackItem.Content>
   );
 };
 
-export default BlueprintContainer;
+export default SequenceContainer;

package/src/components/SequenceEditor/SequenceEditor.stories.tsx

@@ -0,0 +1,32 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import '@dxos-theme';
+
+import { type StoryObj, type Meta } from '@storybook/react-vite';
+
+import { withLayout, withTheme } from '@dxos/storybook-utils';
+
+import { SequenceEditor } from './SequenceEditor';
+import { RESEARCH_SEQUENCE_DEFINITION } from '../../testing';
+import { translations } from '../../translations';
+
+const meta: Meta<typeof SequenceEditor> = {
+  title: 'plugins/plugin-assistant/SequenceEditor',
+  component: SequenceEditor,
+  decorators: [withTheme, withLayout({ fullscreen: true, classNames: 'mli-auto max-is-[50rem] justify-center' })],
+  parameters: {
+    translations,
+  },
+};
+
+export default meta;
+
+type Story = StoryObj<typeof SequenceEditor>;
+
+export const Default: Story = {
+  args: {
+    sequence: RESEARCH_SEQUENCE_DEFINITION,
+  },
+};

package/src/components/{BlueprintEditor/BlueprintEditor.tsx → SequenceEditor/SequenceEditor.tsx}

@@ -4,7 +4,7 @@
 
 import React, { forwardRef, useImperativeHandle } from 'react';
 
-import { BlueprintDefinition } from '@dxos/assistant';
+import { SequenceDefinition } from '@dxos/conductor';
 import { Type } from '@dxos/echo';
 import { useThemeContext, type ThemedClassName } from '@dxos/react-ui';
 import {
@@ -16,16 +16,16 @@ import {
 } from '@dxos/react-ui-editor';
 import { mx } from '@dxos/react-ui-theme';
 
-export type BlueprintEditorProps = ThemedClassName<{
-  blueprint: BlueprintDefinition;
+export type SequenceEditorProps = ThemedClassName<{
+  sequence: SequenceDefinition;
 }>;
 
 // TODO(burdon): Factor out JsonEditor.
-export const BlueprintEditor = forwardRef<EditorView | undefined, BlueprintEditorProps>(
-  ({ classNames, blueprint }, forwardedRef) => {
+export const SequenceEditor = forwardRef<EditorView | undefined, SequenceEditorProps>(
+  ({ classNames, sequence }, forwardedRef) => {
     const { themeMode } = useThemeContext();
     const { parentRef, view } = useTextEditor({
-      initialValue: JSON.stringify(blueprint, null, 2),
+      initialValue: JSON.stringify(sequence, null, 2),
       extensions: [
         createBasicExtensions({
           lineNumbers: true,
@@ -38,7 +38,7 @@ export const BlueprintEditor = forwardRef<EditorView | undefined, BlueprintEdito
           syntaxHighlighting: true,
         }),
         createJsonExtensions({
-          schema: Type.toJsonSchema(BlueprintDefinition, { strict: true }),
+          schema: Type.toJsonSchema(SequenceDefinition, { strict: true }),
         }),
       ],
     });

package/src/components/SequenceEditor/index.ts

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

package/src/components/TemplateContainer.tsx

@@ -4,15 +4,17 @@
 
 import React from 'react';
 
-import { StackItem, type StackItemContentProps } from '@dxos/react-ui-stack';
+import { StackItem } from '@dxos/react-ui-stack';
 
 import { TemplateEditor } from './TemplateEditor';
 import { type TemplateType } from '../types';
 
-export const TemplateContainer = ({
-  role,
-  template,
-}: Pick<StackItemContentProps, 'role'> & { template: TemplateType }) => {
+export type TemplateContainerProps = {
+  role: string;
+  template: TemplateType;
+};
+
+export const TemplateContainer = ({ role, template }: TemplateContainerProps) => {
   return (
     <StackItem.Content role={role} classNames='container-max-width'>
       <TemplateEditor template={template} />

package/src/components/TemplateEditor/TemplateEditor.stories.tsx

@@ -4,7 +4,7 @@
 
 import '@dxos-theme';
 
-import { type Meta } from '@storybook/react';
+import { type Meta } from '@storybook/react-vite';
 import React, { useState } from 'react';
 
 import { createSystemPrompt } from '@dxos/artifact';
@@ -14,7 +14,7 @@ import { withClientProvider } from '@dxos/react-client/testing';
 import { withLayout, withTheme } from '@dxos/storybook-utils';
 
 import { TemplateEditor, type TemplateEditorProps } from './TemplateEditor';
-import translations from '../../translations';
+import { translations } from '../../translations';
 import { TemplateType } from '../../types';
 
 const TEMPLATE = [

package/src/components/TemplateEditor/TemplateEditor.tsx

@@ -17,7 +17,7 @@ import {
 } from '@dxos/react-ui-editor';
 import { mx } from '@dxos/react-ui-theme';
 
-import { ASSISTANT_PLUGIN } from '../../meta';
+import { meta } from '../../meta';
 import { type TemplateType } from '../../types';
 
 handlebarsLanguage.configure({
@@ -33,7 +33,7 @@ export type TemplateEditorProps = ThemedClassName<{
 }>;
 
 export const TemplateEditor = ({ classNames, template }: TemplateEditorProps) => {
-  const { t } = useTranslation(ASSISTANT_PLUGIN);
+  const { t } = useTranslation(meta.id);
   const { themeMode } = useThemeContext();
   const { parentRef } = useTextEditor(
     () => ({

package/src/components/TemplateEditor/TemplateForm.stories.tsx

@@ -4,7 +4,7 @@
 
 import '@dxos-theme';
 
-import { type Meta } from '@storybook/react';
+import { type Meta } from '@storybook/react-vite';
 import React, { useState } from 'react';
 
 import { Obj } from '@dxos/echo';
@@ -13,7 +13,7 @@ import { withClientProvider } from '@dxos/react-client/testing';
 import { withLayout, withTheme } from '@dxos/storybook-utils';
 
 import { TemplateForm } from './TemplateForm';
-import translations from '../../translations';
+import { translations } from '../../translations';
 import { TemplateType } from '../../types';
 
 const TEMPLATE = [

package/src/components/TemplateEditor/TemplateForm.tsx

@@ -10,7 +10,7 @@ import { attentionSurface, groupBorder, mx } from '@dxos/react-ui-theme';
 import { isNonNullable } from '@dxos/util';
 
 import { TemplateEditor } from './TemplateEditor';
-import { ASSISTANT_PLUGIN } from '../../meta';
+import { meta } from '../../meta';
 import { type TemplateInput, TemplateInputType, type TemplateType } from '../../types';
 
 export type TemplateFormProps = {
@@ -20,8 +20,7 @@ export type TemplateFormProps = {
 };
 
 export const TemplateForm = ({ template, commandEditable = true }: TemplateFormProps) => {
-  const { t } = useTranslation(ASSISTANT_PLUGIN);
-
+  const { t } = useTranslation(meta.id);
   usePromptInputs(template);
 
   return (

package/src/components/Toolbox/Toolbox.stories.tsx

@@ -4,7 +4,7 @@
 
 import '@dxos-theme';
 
-import { type Meta } from '@storybook/react';
+import { type Meta } from '@storybook/react-vite';
 import React from 'react';
 
 import { IntentPlugin, Capabilities, useCapabilities, SettingsPlugin } from '@dxos/app-framework';
@@ -15,10 +15,10 @@ import { ClientPlugin } from '@dxos/plugin-client';
 import { MapPlugin } from '@dxos/plugin-map';
 import { SpacePlugin } from '@dxos/plugin-space';
 import { TablePlugin } from '@dxos/plugin-table';
-import { withLayout, withSignals, withTheme } from '@dxos/storybook-utils';
+import { withLayout, withTheme } from '@dxos/storybook-utils';
 
 import { Toolbox, type ToolboxProps } from './Toolbox';
-import translations from '../../translations';
+import { translations } from '../../translations';
 
 const DefaultStory = (props: ToolboxProps) => {
   const artifactDefinitions = useCapabilities(Capabilities.ArtifactDefinition);
@@ -26,7 +26,7 @@ const DefaultStory = (props: ToolboxProps) => {
     <Toolbox
       {...props}
       artifacts={artifactDefinitions}
-      classNames='w-[30rem] h-[15rem] rounded-md border border-separator py-1'
+      classNames='w-[30rem] h-[15rem] rounded-sm border border-separator py-1'
     />
   );
 };
@@ -36,7 +36,6 @@ const meta: Meta<typeof Toolbox> = {
   component: Toolbox,
   render: DefaultStory,
   decorators: [
-    withSignals,
     withPluginManager({
       plugins: [
         ClientPlugin({

package/src/components/Toolbox/Toolbox.tsx

@@ -7,25 +7,64 @@ import React, { useState, useEffect, Fragment, type FC } from 'react';
 import { parseToolName, type Tool } from '@dxos/ai';
 import { Capabilities, useCapabilities } from '@dxos/app-framework';
 import { type ArtifactDefinition } from '@dxos/artifact';
+import { type Blueprint } from '@dxos/assistant';
+import { type Ref } from '@dxos/echo';
 import { FunctionType } from '@dxos/functions';
 import { log } from '@dxos/log';
 import { Filter, type Space, useQuery } from '@dxos/react-client/echo';
 import { type ThemedClassName } from '@dxos/react-ui';
+import { useTranslation } from '@dxos/react-ui';
 import { mx } from '@dxos/react-ui-theme';
 
+import { type ChatProcessor } from '../../hooks';
+import { meta } from '../../meta';
 import { createToolsFromService } from '../../tools';
 import { ServiceType } from '../../types';
 
 export type ToolboxProps = ThemedClassName<{
+  blueprints?: readonly Ref.Ref<Blueprint>[];
   artifacts?: ArtifactDefinition[];
   services?: { service: ServiceType; tools: Tool[] }[];
   functions?: FunctionType[];
+  activeBlueprints?: readonly Ref.Ref<Blueprint>[];
   striped?: boolean;
 }>;
 
-export const Toolbox = ({ classNames, artifacts, functions, services, striped }: ToolboxProps) => {
+export const Toolbox = ({
+  classNames,
+  artifacts,
+  functions,
+  services,
+  blueprints,
+  activeBlueprints,
+  striped,
+}: ToolboxProps) => {
+  const { t } = useTranslation(meta.id);
+
   return (
     <div className={mx('flex flex-col overflow-y-auto box-content', classNames)}>
+      {blueprints && blueprints.length > 0 && (
+        <Section
+          title='Blueprints'
+          items={blueprints.map(({ target }) => ({
+            name: target?.name ?? '',
+            description: target?.description ?? '',
+            subitems: target?.tools.map((toolId) => ({ name: `∙ ${parseToolName(toolId)}` })),
+          }))}
+        />
+      )}
+
+      {activeBlueprints && activeBlueprints.length > 0 && (
+        <Section
+          title='Blueprints'
+          items={activeBlueprints.map(({ target }) => ({
+            name: target?.name ?? '',
+            description: target?.description ?? '',
+            subitems: target?.tools.map((toolId) => ({ name: `∙ ${parseToolName(toolId)}` })),
+          }))}
+        />
+      )}
+
       {artifacts && artifacts.length > 0 && (
         <Section
           title='Artifacts'
@@ -51,6 +90,12 @@ export const Toolbox = ({ classNames, artifacts, functions, services, striped }:
       {functions && functions.length > 0 && (
         <Section title='Functions' items={functions.map(({ name, description }) => ({ name, description }))} />
       )}
+
+      {!blueprints?.length &&
+        !activeBlueprints?.length &&
+        !artifacts?.length &&
+        !services?.length &&
+        !functions?.length && <div>{t('no tools')}</div>}
     </div>
   );
 };
@@ -89,7 +134,9 @@ const Section: FC<{
   );
 };
 
-export const ToolboxContainer = ({ classNames, space }: ThemedClassName<{ space?: Space }>) => {
+export type ToolboxContainerProps = ThemedClassName<{ space?: Space; processor?: ChatProcessor }>;
+
+export const ToolboxContainer = ({ classNames, space, processor }: ToolboxContainerProps) => {
   // Plugin artifacts.
   const artifactDefinitions = useCapabilities(Capabilities.ArtifactDefinition);
 
@@ -111,6 +158,12 @@ export const ToolboxContainer = ({ classNames, space }: ThemedClassName<{ space?
   const functions = useQuery(space, Filter.type(FunctionType));
 
   return (
-    <Toolbox classNames={classNames} artifacts={artifactDefinitions} services={serviceTools} functions={functions} />
+    <Toolbox
+      classNames={classNames}
+      blueprints={processor?.context.blueprints.value}
+      artifacts={artifactDefinitions}
+      services={serviceTools}
+      functions={functions}
+    />
   );
 };

package/src/components/index.ts

@@ -4,18 +4,17 @@
 
 import { lazy } from 'react';
 
-export * from './AmbientDialog';
 export * from './AssistantSettings';
-export * from './Prompt';
+export * from './Chat';
 export * from './PromptSettings';
 export * from './TemplateEditor';
-export * from './Thread';
 export * from './Toolbox';
 
 // TODO(burdon): Lazy loading causes issues with Tabster.
 //  Repro: open assistant dialog then close.
 //  https://github.com/microsoft/fluentui/issues/34020
-export const AssistantDialog = lazy(() => import('./AssistantDialog'));
-export const BlueprintContainer = lazy(() => import('./BlueprintContainer'));
+
 export const ChatContainer = lazy(() => import('./ChatContainer'));
+export const ChatDialog = lazy(() => import('./ChatDialog'));
+export const SequenceContainer = lazy(() => import('./SequenceContainer'));
 export const TemplateContainer = lazy(() => import('./TemplateContainer'));

package/src/events.ts

@@ -4,8 +4,8 @@
 
 import { Events } from '@dxos/app-framework';
 
-import { ASSISTANT_PLUGIN } from './meta';
+import { meta } from './meta';
 
 export namespace AssistantEvents {
-  export const AiClientReady = Events.createStateEvent(`${ASSISTANT_PLUGIN}/ai-client-ready`);
+  export const AiClientReady = Events.createStateEvent(`${meta.id}/ai-client-ready`);
 }

package/src/hooks/{processor.test.ts → chat-processor.test.ts}

@@ -4,7 +4,7 @@
 
 import { describe, it } from 'vitest';
 
-import { ChatProcessor } from './processor';
+import { ChatProcessor } from './chat-processor';
 
 describe('ChatProcessor', () => {
   it('should be instantiable', ({ expect }) => {