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

package/src/capabilities/integration-provider.ts

@@ -0,0 +1,86 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+import * as Effect from 'effect/Effect';
+import * as Schema from 'effect/Schema';
+
+import { Capability } from '@dxos/app-framework';
+import { Obj, Ref } from '@dxos/echo';
+import {
+  type CredentialForm,
+  Integration,
+  IntegrationProvider as IntegrationProviderCapability,
+} from '@dxos/plugin-integration';
+import { AccessToken } from '@dxos/types';
+
+import { ANTHROPIC_PROVIDER_ID, ANTHROPIC_SOURCE } from '../constants';
+
+/** API-key form for the Anthropic BYOK provider; key is best-effort validated against `/v1/models`. */
+const AnthropicTokenForm = Schema.Struct({
+  token: Schema.String.annotations({
+    title: 'API key',
+    description: 'Your Anthropic API key — find it at https://console.anthropic.com/settings/keys.',
+  }),
+});
+
+/**
+ * Best-effort validation: 401/403 from Anthropic blocks the save; CORS/network failures
+ * are tolerated so the form still works in environments where the direct browser call is blocked.
+ */
+const validateAnthropicKey = (apiKey: string): Effect.Effect<void, Error> =>
+  Effect.tryPromise({
+    try: () =>
+      fetch('https://api.anthropic.com/v1/models', {
+        headers: {
+          'x-api-key': apiKey,
+          'anthropic-version': '2023-06-01',
+          'anthropic-dangerous-direct-browser-access': 'true',
+        },
+      }),
+    catch: (cause) => cause,
+  }).pipe(
+    Effect.matchEffect({
+      onSuccess: (response) =>
+        response.status === 401 || response.status === 403
+          ? Effect.fail(
+              new Error('Invalid Anthropic API key. Check it at https://console.anthropic.com/settings/keys.'),
+            )
+          : Effect.void,
+      onFailure: () => Effect.void,
+    }),
+  );
+
+const credentialForm: CredentialForm<Schema.Schema.Type<typeof AnthropicTokenForm>> = {
+  schema: AnthropicTokenForm,
+  defaultValues: { token: '' },
+  // Validates before the dialog closes so 401/403 errors are shown inline.
+  onValidate: ({ values }) => validateAnthropicKey(values.token.trim()),
+  onSubmit: ({ values, provider }) =>
+    Effect.sync(() => {
+      const accessToken = Obj.make(AccessToken.AccessToken, {
+        source: ANTHROPIC_SOURCE,
+        token: values.token.trim(),
+      });
+      const integration = Obj.make(Integration.Integration, {
+        name: provider.label ?? 'Anthropic',
+        providerId: provider.id,
+        accessToken: Ref.make(accessToken),
+        targets: [],
+      });
+      return { kind: 'complete' as const, accessToken, integration };
+    }),
+};
+
+export default Capability.makeModule(
+  Effect.fnUntraced(function* () {
+    return Capability.contributes(IntegrationProviderCapability, [
+      {
+        id: ANTHROPIC_PROVIDER_ID,
+        source: ANTHROPIC_SOURCE,
+        label: 'Anthropic',
+        credentialForm,
+      },
+    ]);
+  }),
+);

package/src/capabilities/{markdown.ts → markdown-extension.ts}

@@ -6,9 +6,9 @@ import * as Effect from 'effect/Effect';
 
 import { Capabilities, Capability } from '@dxos/app-framework';
 import { Obj } from '@dxos/echo';
-import { MarkdownCapabilities } from '@dxos/plugin-markdown';
+import { MarkdownCapabilities } from '@dxos/plugin-markdown/types';
 
-import { AssistantOperation } from '#operations';
+import { AssistantOperation } from '#types';
 
 import { promptRunExtension } from '../extensions';
 
@@ -16,7 +16,7 @@ export default Capability.makeModule(
   Effect.fnUntraced(function* () {
     const capabilities = yield* Capability.Service;
 
-    return Capability.contributes(MarkdownCapabilities.Extensions, [
+    return Capability.contributes(MarkdownCapabilities.ExtensionProvider, [
       ({ document: doc }) => {
         if (!doc) {
           return undefined;

package/src/capabilities/migrations.ts

@@ -5,27 +5,20 @@
 import * as Effect from 'effect/Effect';
 
 import { Capability } from '@dxos/app-framework';
-import { Chat, ResearchGraph } from '@dxos/assistant-toolkit';
-import { defineObjectMigration } from '@dxos/client/echo';
-import { ClientCapabilities } from '@dxos/plugin-client/types';
+import { Chat } from '@dxos/assistant-toolkit';
+import { Migration } from '@dxos/echo';
+import { ClientCapabilities } from '@dxos/plugin-client';
 
 const identityTransform = async (from: any) => ({ ...from });
 const noopCallback = async () => {};
 
 const migrations = [
-  defineObjectMigration({
+  Migration.define({
     from: Chat.LegacyCompanionTo,
     to: Chat.CompanionTo,
     transform: identityTransform,
     onMigration: noopCallback,
   }),
-  defineObjectMigration({
-    from: ResearchGraph.LegacyResearchGraph,
-    to: ResearchGraph.ResearchGraphV1,
-    transform: identityTransform,
-    onMigration: noopCallback,
-  }),
-  ...ResearchGraph.migrations,
 ];
 
 export default Capability.makeModule(

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 { AssistantOperationHandlerSet } from '#operations';
 

package/src/capabilities/react-surface.tsx

@@ -3,29 +3,31 @@
 //
 
 import * as Effect from 'effect/Effect';
-import React, { type ComponentProps } from 'react';
+import React, { type ComponentProps, useEffect } from 'react';
 
 import { Capabilities, Capability } from '@dxos/app-framework';
 import { Surface, useSettingsState } from '@dxos/app-framework/ui';
 import { AppSurface, useActiveSpace } from '@dxos/app-toolkit/ui';
-import { Chat, Agent } from '@dxos/assistant-toolkit';
-import { Blueprint, Prompt } from '@dxos/blueprints';
+import { Chat, Agent, Plan } from '@dxos/assistant-toolkit';
 import { getSpace } from '@dxos/client/echo';
+import { Blueprint, Routine } from '@dxos/compute';
 import { Sequence } from '@dxos/conductor';
 import { InvocationTraceContainer } from '@dxos/devtools';
 import { Feed, Obj } from '@dxos/echo';
+import { log } from '@dxos/log';
 import { Panel } from '@dxos/react-ui';
 
 import { AssistantSettings } from '#components';
 import {
   BlueprintArticle,
   ChatCompanion,
-  ChatContainer,
+  ChatArticle,
   ChatDialog,
   AgentArticle,
   AgentProperties,
-  PromptArticle,
-  PromptList,
+  PlanArticle,
+  RoutineArticle,
+  RoutineList,
   TracePanel,
   TriggerStatus,
 } from '#containers';
@@ -36,7 +38,7 @@ export default Capability.makeModule(() =>
   Effect.succeed(
     Capability.contributes(Capabilities.ReactSurface, [
       Surface.create({
-        id: 'plugin-settings',
+        id: 'pluginSettings',
         filter: AppSurface.settings(AppSurface.Article, meta.id),
         component: ({ data: { subject } }) => {
           const { settings, updateSettings } = useSettingsState<Assistant.Settings>(subject.atom);
@@ -51,7 +53,7 @@ export default Capability.makeModule(() =>
           Obj.instanceOf(Chat.Chat, data.subject) &&
           data.variant !== ASSISTANT_COMPANION_VARIANT,
         component: ({ data, role, ref }) => {
-          return <ChatContainer role={role} subject={data.subject} attendableId={data.attendableId} ref={ref} />;
+          return <ChatArticle role={role} subject={data.subject} attendableId={data.attendableId} ref={ref} />;
         },
       }),
       Surface.create({
@@ -62,12 +64,12 @@ export default Capability.makeModule(() =>
         ),
       }),
       Surface.create({
-        id: 'agent-properties',
+        id: 'agentProperties',
         filter: AppSurface.object(AppSurface.ObjectProperties, Agent.Agent),
         component: ({ data }) => <AgentProperties subject={data.subject} />,
       }),
       Surface.create({
-        id: 'companion-chat',
+        id: 'companionChat',
         role: 'article',
         filter: (data): data is { subject: Chat.Chat | null; attendableId: string; companionTo: Obj.Unknown } =>
           typeof data.attendableId === 'string' &&
@@ -84,22 +86,22 @@ export default Capability.makeModule(() =>
         ),
       }),
       Surface.create({
-        id: 'companion-invocations',
+        id: 'companionInvocations',
         role: 'article',
-        filter: (data): data is { companionTo: Sequence } =>
-          (Obj.instanceOf(Sequence, data.companionTo) || Obj.instanceOf(Prompt.Prompt, data.companionTo)) &&
+        filter: (data): data is { companionTo: Sequence.Sequence } =>
+          (Obj.instanceOf(Sequence.Sequence, data.companionTo) || Obj.instanceOf(Routine.Routine, data.companionTo)) &&
           data.subject === 'invocations',
         component: ({ data, role }) => {
           const space = getSpace(data.companionTo);
           const feed = space?.properties.invocationTraceFeed?.target;
-          const queueDxn = feed ? Feed.getQueueDxn(feed) : undefined;
+          const feedDXN = feed ? Feed.getQueueUri(feed) : undefined;
           // TODO(wittjosiah): Support invocation filtering for prompts.
-          const target = Obj.instanceOf(Prompt.Prompt, data.companionTo) ? undefined : data.companionTo;
+          const target = Obj.instanceOf(Routine.Routine, data.companionTo) ? undefined : data.companionTo;
 
           return (
             <Panel.Root role={role} className='dx-document'>
               <Panel.Content asChild>
-                <InvocationTraceContainer db={space?.db} queueDxn={queueDxn} target={target} detailAxis='block' />
+                <InvocationTraceContainer db={space?.db} feedDXN={feedDXN} target={target} detailAxis='block' />
               </Panel.Content>
             </Panel.Root>
           );
@@ -114,9 +116,16 @@ export default Capability.makeModule(() =>
       }),
       Surface.create({
         id: 'prompt',
-        filter: AppSurface.object(AppSurface.Article, Prompt.Prompt),
+        filter: AppSurface.object(AppSurface.Article, Routine.Routine),
         component: ({ data, role }) => (
-          <PromptArticle role={role} subject={data.subject} attendableId={data.attendableId} />
+          <RoutineArticle role={role} subject={data.subject} attendableId={data.attendableId} />
+        ),
+      }),
+      Surface.create({
+        id: 'plan',
+        filter: AppSurface.object(AppSurface.Article, Plan.Plan),
+        component: ({ data, role }) => (
+          <PlanArticle role={role} subject={data.subject} attendableId={data.attendableId} />
         ),
       }),
       Surface.create({
@@ -129,6 +138,10 @@ export default Capability.makeModule(() =>
         filter: AppSurface.literal(Surface.makeType<{ subject: string }>('deck-companion--trace'), 'trace'),
         component: () => {
           const space = useActiveSpace();
+          useEffect(() => {
+            log('trace panel surface', { hasSpace: Boolean(space), spaceId: space?.id });
+          }, [space?.id]);
+
           if (!space) {
             return null;
           }
@@ -137,9 +150,16 @@ export default Capability.makeModule(() =>
         },
       }),
       Surface.create({
-        id: 'status',
+        id: 'triggerStatus',
         role: 'status-indicator',
-        component: () => <TriggerStatus />,
+        component: () => {
+          const space = useActiveSpace();
+          if (!space) {
+            return null;
+          }
+
+          return <TriggerStatus role='status-indicator' space={space} />;
+        },
       }),
       Surface.create({
         id: 'prompts',
@@ -147,7 +167,7 @@ export default Capability.makeModule(() =>
           Surface.makeType<{ subject: Obj.Any; attendableId: string }>('prompts'),
           Obj.isObject,
         ),
-        component: ({ data }) => <PromptList subject={data.subject} />,
+        component: ({ data }) => <RoutineList subject={data.subject} />,
       }),
     ]),
   ),

package/src/components/AgentProperties/AgentProperties.stories.tsx

@@ -0,0 +1,74 @@
+//
+// Copyright 2026 DXOS.org
+//
+
+import { type Meta, type StoryObj } from '@storybook/react-vite';
+import React from 'react';
+
+import { Plan, Agent } from '@dxos/assistant-toolkit';
+import { Filter, Obj, Ref } from '@dxos/echo';
+import { useQuery } from '@dxos/react-client/echo';
+import { useClientStory, withClientProvider } from '@dxos/react-client/testing';
+import { ObjectProperties } from '@dxos/react-ui-form';
+import { Loading, withLayout, withTheme } from '@dxos/react-ui/testing';
+import { Text } from '@dxos/schema';
+import { Organization } from '@dxos/types';
+
+import { translations } from '#translations';
+
+import { AgentProperties } from './AgentProperties';
+
+const DefaultStory = () => {
+  const { space } = useClientStory();
+  const [agent] = useQuery(space?.db, Filter.type(Agent.Agent));
+  if (!agent) {
+    return <Loading />;
+  }
+
+  return (
+    <ObjectProperties object={agent}>
+      <AgentProperties agent={agent} />
+    </ObjectProperties>
+  );
+};
+
+const meta = {
+  title: 'plugins/plugin-assistant/components/AgentProperties',
+  render: DefaultStory,
+  decorators: [
+    withTheme(),
+    withLayout({ layout: 'column' }),
+    withClientProvider({
+      createIdentity: true,
+      createSpace: true,
+      types: [Agent.Agent, Plan.Plan, Text.Text, Organization.Organization],
+      onCreateSpace: async ({ space }) => {
+        const organization = space.db.add(
+          Obj.make(Organization.Organization, {
+            name: 'Acme Corp',
+            description: 'Sample organization for the story.',
+          }),
+        );
+
+        space.db.add(
+          Obj.make(Agent.Agent, {
+            instructions: Ref.make(Text.make()),
+            plan: Ref.make(Plan.makePlan({ tasks: [] })),
+            artifacts: [{ name: 'Organization', data: Ref.make(organization) }],
+            subscriptions: [],
+          }),
+        );
+      },
+    }),
+  ],
+  parameters: {
+    layout: 'fullscreen',
+    translations,
+  },
+} satisfies Meta<typeof DefaultStory>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+export const Default: Story = {};

package/src/components/AgentProperties/AgentProperties.tsx

@@ -0,0 +1,103 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { Atom } from '@effect-atom/atom';
+import { useAtomValue } from '@effect-atom/atom-react';
+import * as Option from 'effect/Option';
+import React, { useCallback, useMemo } from 'react';
+
+import { type Agent } from '@dxos/assistant-toolkit';
+import { Filter, Obj, Ref, Type } from '@dxos/echo';
+import { useQuery } from '@dxos/react-client/echo';
+import { Input, useTranslation } from '@dxos/react-ui';
+import { Form } from '@dxos/react-ui-form';
+import { FeedAnnotation } from '@dxos/schema';
+
+import { meta } from '#meta';
+
+export type AgentPropertiesProps = {
+  agent: Agent.Agent;
+};
+
+export const AgentProperties = ({ agent }: AgentPropertiesProps) => {
+  const { t } = useTranslation(meta.id);
+  const db = Obj.getDatabase(agent);
+
+  // Build a filter matching objects of any schema annotated as a feed.
+  const feedFilter = useMemo(() => {
+    if (!db) {
+      return Filter.nothing();
+    }
+
+    const schemas = db.graph.registry.list().filter(Type.isType);
+    const feedSchemas = schemas.filter((type) => {
+      const annotation = FeedAnnotation.get(Type.getSchema(type));
+      return Option.isSome(annotation) && annotation.value === true;
+    });
+
+    return feedSchemas.length === 0
+      ? Filter.nothing()
+      : Filter.or(...feedSchemas.map((schema: Type.AnyEntity) => Filter.type(schema)));
+  }, [db]);
+
+  const subscribedObjects = useQuery(db, feedFilter);
+
+  // Query all existing subscriptions (e.g., mail, calendar, etc.)
+  const existingSubscriptions = useAtomValue(
+    useMemo(
+      () =>
+        Obj.atom(agent).pipe((_) =>
+          Atom.make((get) => {
+            const agentObj = get(_);
+            const selectedSubscriptions: Obj.Unknown[] = subscribedObjects.filter((object) =>
+              agentObj.subscriptions.some((subscription) => subscription.uri === Obj.getURI(object)),
+            );
+
+            return selectedSubscriptions;
+          }),
+        ),
+      [agent, subscribedObjects],
+    ),
+  );
+
+  // Create/remove agent subscription.
+  const handleSubscriptionChange = useCallback(
+    (object: Obj.Unknown, checked: boolean) => {
+      Obj.update(agent, (agent) => {
+        if (checked) {
+          agent.subscriptions.push(Ref.fromURI(Obj.getURI(object)));
+        } else {
+          agent.subscriptions = agent.subscriptions.filter((subscription) => subscription.uri !== Obj.getURI(object));
+        }
+      });
+    },
+    [agent],
+  );
+
+  if (subscribedObjects.length === 0) {
+    return null;
+  }
+
+  return (
+    <Form.Section>
+      <Input.Root>
+        <Input.Label classNames='mt-form-gap'>{t('subscriptions.label')}</Input.Label>
+      </Input.Root>
+
+      {subscribedObjects.map((object) => (
+        <Input.Root key={object.id}>
+          <div className='flex items-center gap-2'>
+            <Input.Checkbox
+              checked={existingSubscriptions.includes(object)}
+              onCheckedChange={(checked) => {
+                handleSubscriptionChange(object, checked === true);
+              }}
+            />
+            <Input.Label>{Obj.getLabel(object) ?? object.id}</Input.Label>
+          </div>
+        </Input.Root>
+      ))}
+    </Form.Section>
+  );
+};

package/src/components/AgentProperties/index.ts

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

package/src/components/AssistantSettings/AssistantSettings.stories.tsx

@@ -6,7 +6,8 @@ import { type Meta, type StoryObj } from '@storybook/react-vite';
 
 import { withLayout, withTheme } from '@dxos/react-ui/testing';
 
-import { translations } from '../../translations';
+import { translations } from '#translations';
+
 import { AssistantSettings } from './AssistantSettings';
 
 const meta = {
@@ -28,7 +29,7 @@ export const Default: Story = {
   args: {
     settings: {
       customPrompts: false,
-      llmProvider: 'edge',
+      modelProvider: 'edge',
     },
   },
 };

package/src/components/AssistantSettings/AssistantSettings.tsx

@@ -2,130 +2,41 @@
 // Copyright 2023 DXOS.org
 //
 
-import React from 'react';
+import React, { useMemo } from 'react';
 
-import { DEFAULT_EDGE_MODELS, DEFAULT_OLLAMA_MODELS } from '@dxos/ai';
+import { DEFAULT_EDGE_MODELS, DEFAULT_LMSTUDIO_MODELS, DEFAULT_OLLAMA_MODELS } from '@dxos/ai';
 import { type AppSurface } from '@dxos/app-toolkit/ui';
-import { Input, Select, useTranslation } from '@dxos/react-ui';
-import { Settings as SettingsForm } from '@dxos/react-ui-form';
+import { useTranslation } from '@dxos/react-ui';
+import { Settings as SettingsForm, createSelectField } from '@dxos/react-ui-form';
 
 import { meta } from '#meta';
-import { type Assistant, LLM_PROVIDERS } from '#types';
-
-// TODO(burdon): Factor out default Selector.
-const DEFAULT_VALUE = '__default';
-
-const LLM_PROVIDER_LABELS = {
-  edge: 'DXOS',
-  ollama: 'Ollama',
-  lmstudio: 'LM Studio',
-} as const;
+import { Assistant } from '#types';
 
 export type AssistantSettingsProps = AppSurface.SettingsArticleProps<Assistant.Settings>;
 
 export const AssistantSettings = ({ settings, onSettingsChange }: AssistantSettingsProps) => {
   const { t } = useTranslation(meta.id);
+  const fieldMap = useMemo(
+    () => ({
+      modelDefaults: {
+        edge: createSelectField({ options: DEFAULT_EDGE_MODELS }),
+        ollama: createSelectField({ options: DEFAULT_OLLAMA_MODELS }),
+        lmstudio: createSelectField({ options: DEFAULT_LMSTUDIO_MODELS }),
+      },
+    }),
+    [],
+  );
 
   return (
     <SettingsForm.Viewport>
       <SettingsForm.Section title={t('settings.title', { ns: meta.id })}>
-        <SettingsForm.Item
-          title={t('settings.custom-prompts.label')}
-          description={t('settings.custom-prompts.description')}
-        >
-          <Input.Switch
-            disabled={!onSettingsChange}
-            checked={!!settings.customPrompts}
-            onCheckedChange={(checked) => onSettingsChange?.((s) => ({ ...s, customPrompts: checked }))}
-          />
-        </SettingsForm.Item>
-
-        <SettingsForm.Item
-          title={t('settings.llm-provider.label')}
-          description={t('settings.llm-provider.description')}
-        >
-          <Select.Root
-            disabled={!onSettingsChange}
-            value={settings.llmProvider ?? 'edge'}
-            onValueChange={(value) => {
-              onSettingsChange?.((s) => ({
-                ...s,
-                llmProvider: value === DEFAULT_VALUE ? undefined : (value as any),
-              }));
-            }}
-          >
-            <Select.TriggerButton disabled={!onSettingsChange} placeholder={t('settings.llm-provider.label')} />
-            <Select.Portal>
-              <Select.Content>
-                <Select.Viewport>
-                  <Select.Option value={DEFAULT_VALUE}>{t('settings.default.label')}</Select.Option>
-                  {LLM_PROVIDERS.map((model) => (
-                    <Select.Option key={model} value={model}>
-                      {LLM_PROVIDER_LABELS[model]}
-                    </Select.Option>
-                  ))}
-                </Select.Viewport>
-                <Select.Arrow />
-              </Select.Content>
-            </Select.Portal>
-          </Select.Root>
-        </SettingsForm.Item>
-
-        <SettingsForm.Item
-          title={t('settings.edge-llm-model.label')}
-          description={t('settings.edge-llm-model.description')}
-        >
-          <Select.Root
-            disabled={!onSettingsChange}
-            value={settings.edgeModel ?? DEFAULT_VALUE}
-            onValueChange={(value) => {
-              onSettingsChange?.((s) => ({ ...s, edgeModel: value === DEFAULT_VALUE ? undefined : value }));
-            }}
-          >
-            <Select.TriggerButton disabled={!onSettingsChange} placeholder={t('settings.default-llm-model.label')} />
-            <Select.Portal>
-              <Select.Content>
-                <Select.Viewport>
-                  <Select.Option value={DEFAULT_VALUE}>{t('settings.default.label')}</Select.Option>
-                  {DEFAULT_EDGE_MODELS.map((model) => (
-                    <Select.Option key={model} value={model}>
-                      {model}
-                    </Select.Option>
-                  ))}
-                </Select.Viewport>
-                <Select.Arrow />
-              </Select.Content>
-            </Select.Portal>
-          </Select.Root>
-        </SettingsForm.Item>
-
-        <SettingsForm.Item
-          title={t('settings.ollama-llm-model.label')}
-          description={t('settings.ollama-llm-model.description')}
-        >
-          <Select.Root
-            disabled={!onSettingsChange}
-            value={settings.ollamaModel ?? DEFAULT_VALUE}
-            onValueChange={(value) => {
-              onSettingsChange?.((s) => ({ ...s, ollamaModel: value === DEFAULT_VALUE ? undefined : value }));
-            }}
-          >
-            <Select.TriggerButton disabled={!onSettingsChange} placeholder={t('settings.default-llm-model.label')} />
-            <Select.Portal>
-              <Select.Content>
-                <Select.Viewport>
-                  <Select.Option value={DEFAULT_VALUE}>{t('settings.default.label')}</Select.Option>
-                  {DEFAULT_OLLAMA_MODELS.map((model) => (
-                    <Select.Option key={model} value={model}>
-                      {model}
-                    </Select.Option>
-                  ))}
-                </Select.Viewport>
-                <Select.Arrow />
-              </Select.Content>
-            </Select.Portal>
-          </Select.Root>
-        </SettingsForm.Item>
+        <SettingsForm.FieldSet<Assistant.Settings>
+          readonly={!onSettingsChange}
+          schema={Assistant.Settings}
+          fieldMap={fieldMap}
+          values={settings}
+          onValuesChanged={(values) => onSettingsChange?.(() => values)}
+        />
       </SettingsForm.Section>
     </SettingsForm.Viewport>
   );