@dxos/plugin-automation 0.8.4-main.d05673bc65 → 0.8.4-main.dfabb4ec29

package/src/{cli/commands → commands}/trigger/update/queue.ts

@@ -12,8 +12,8 @@ import * as Option from 'effect/Option';
 import { CommandConfig } from '@dxos/cli-util';
 import { flushAndSync, print, spaceLayer, withTypes } from '@dxos/cli-util';
 import { Common } from '@dxos/cli-util';
+import { Operation, Trigger } from '@dxos/compute';
 import { DXN, Database, Filter, JsonSchema, Obj, Ref } from '@dxos/echo';
-import { Function, Trigger } from '@dxos/functions';
 
 import { Enabled, Input, Queue, TriggerId } from '../options';
 import { printTrigger, promptForSchemaInput, selectFunction, selectQueue, selectTrigger } from '../util';
@@ -31,7 +31,6 @@ export const queue = Command.make(
   (options) =>
     Effect.gen(function* () {
       const { json } = yield* CommandConfig;
-
       const triggerId = yield* Option.match(options.id, {
         onNone: () => selectTrigger('queue'),
         onSome: (id) => Effect.succeed(id),
@@ -58,7 +57,7 @@ export const queue = Command.make(
 ).pipe(
   Command.withDescription('Update a queue trigger.'),
   Command.provide(({ spaceId }) => spaceLayer(spaceId, true)),
-  Command.provideEffectDiscard(() => withTypes(Function.Function, Trigger.Trigger)),
+  Command.provideEffectDiscard(() => withTypes(Operation.PersistentOperation, Trigger.Trigger)),
 );
 
 /**
@@ -67,10 +66,10 @@ export const queue = Command.make(
  * @returns The current function (either original or newly assigned)
  */
 const updateFunction = Effect.fn(function* (trigger: Trigger.Trigger, functionIdOption: Option.Option<string>) {
-  let currentFn: Function.Function | undefined = trigger.function
+  let currentFn: Operation.PersistentOperation | undefined = trigger.function
     ? yield* Database.load(trigger.function) as any
     : undefined;
-  if (currentFn && !Obj.instanceOf(Function.Function, currentFn)) {
+  if (currentFn && !Obj.instanceOf(Operation.PersistentOperation, currentFn)) {
     currentFn = undefined;
   }
   const currentFunctionName = currentFn ? (currentFn.name ?? currentFn.id) : undefined;
@@ -87,13 +86,13 @@ const updateFunction = Effect.fn(function* (trigger: Trigger.Trigger, functionId
       onNone: () => selectFunction(),
       onSome: (id) => Effect.succeed(id),
     });
-    const functions = yield* Database.runQuery(Filter.type(Function.Function));
+    const functions = yield* Database.runQuery(Filter.type(Operation.PersistentOperation));
     const foundFn = functions.find((fn) => fn.id === functionId);
-    if (!foundFn || !Obj.instanceOf(Function.Function, foundFn)) {
+    if (!foundFn || !Obj.instanceOf(Operation.PersistentOperation, foundFn)) {
       return yield* Effect.fail(new Error(`Function not found: ${functionId}`));
     }
-    Obj.change(trigger, (mutableTrigger) => {
-      mutableTrigger.function = Ref.make(foundFn);
+    Obj.update(trigger, (trigger) => {
+      trigger.function = Ref.make(foundFn);
     });
     currentFn = foundFn;
   }
@@ -130,9 +129,9 @@ const updateQueue = Effect.fn(function* (trigger: Trigger.Trigger, queueOption:
       onNone: () => selectQueue(),
       onSome: (dxn) => Effect.succeed(dxn.toString()),
     });
-    Obj.change(trigger, (mutableTrigger) => {
-      if (mutableTrigger.spec?.kind === 'queue') {
-        mutableTrigger.spec.queue = queueDxn;
+    Obj.update(trigger, (trigger) => {
+      if (trigger.spec?.kind === 'queue') {
+        trigger.spec.queue = queueDxn;
       }
     });
   }
@@ -144,7 +143,7 @@ const updateQueue = Effect.fn(function* (trigger: Trigger.Trigger, queueOption:
  */
 const updateInput = Effect.fn(function* (
   trigger: Trigger.Trigger,
-  fn: Function.Function,
+  fn: Operation.PersistentOperation,
   inputOption: Option.Option<Record<string, any>>,
 ) {
   const currentInput = trigger.input as Record<string, any> | undefined;
@@ -166,8 +165,8 @@ const updateInput = Effect.fn(function* (
         promptForSchemaInput(fn.inputSchema ? JsonSchema.toEffectSchema(fn.inputSchema) : undefined, currentInput),
       onSome: (value) => Effect.succeed(value as Record<string, any>),
     });
-    Obj.change(trigger, (mutableTrigger) => {
-      mutableTrigger.input = inputObj;
+    Obj.update(trigger, (trigger) => {
+      trigger.input = inputObj;
     });
   }
 });
@@ -189,7 +188,7 @@ const updateEnabled = Effect.fn(function* (
       }).pipe(Prompt.run),
     onSome: () => Effect.succeed(enabled),
   });
-  Obj.change(trigger, (mutableTrigger) => {
-    mutableTrigger.enabled = enabledValue;
+  Obj.update(trigger, (trigger) => {
+    trigger.enabled = enabledValue;
   });
 });

package/src/{cli/commands → commands}/trigger/update/subscription.ts

@@ -13,8 +13,8 @@ import * as Option from 'effect/Option';
 import { CommandConfig } from '@dxos/cli-util';
 import { flushAndSync, print, spaceLayer, withTypes } from '@dxos/cli-util';
 import { Common } from '@dxos/cli-util';
+import { Operation, Trigger } from '@dxos/compute';
 import { DXN, Database, Filter, JsonSchema, Obj, Query, Ref } from '@dxos/echo';
-import { Function, Trigger } from '@dxos/functions';
 
 import { Deep, Delay, Enabled, Input, TriggerId, Typename } from '../options';
 import { printTrigger, promptForSchemaInput, selectFunction, selectTrigger } from '../util';
@@ -61,7 +61,7 @@ export const subscription = Command.make(
 ).pipe(
   Command.withDescription('Update a subscription trigger.'),
   Command.provide(({ spaceId }) => spaceLayer(spaceId, true)),
-  Command.provideEffectDiscard(() => withTypes(Function.Function, Trigger.Trigger)),
+  Command.provideEffectDiscard(() => withTypes(Operation.PersistentOperation, Trigger.Trigger)),
 );
 
 /**
@@ -95,10 +95,10 @@ const extractCurrentTypename = (spec: Trigger.SubscriptionSpec | undefined): Opt
  * @returns The current function (either original or newly assigned)
  */
 const updateFunction = Effect.fn(function* (trigger: Trigger.Trigger, functionIdOption: Option.Option<string>) {
-  let currentFn: Function.Function | undefined = trigger.function
+  let currentFn: Operation.PersistentOperation | undefined = trigger.function
     ? yield* Database.load(trigger.function) as any
     : undefined;
-  if (currentFn && !Obj.instanceOf(Function.Function, currentFn)) {
+  if (currentFn && !Obj.instanceOf(Operation.PersistentOperation, currentFn)) {
     currentFn = undefined;
   }
   const currentFunctionName = currentFn ? (currentFn.name ?? currentFn.id) : undefined;
@@ -115,13 +115,13 @@ const updateFunction = Effect.fn(function* (trigger: Trigger.Trigger, functionId
       onNone: () => selectFunction(),
       onSome: (id) => Effect.succeed(id),
     });
-    const functions = yield* Database.runQuery(Filter.type(Function.Function));
+    const functions = yield* Database.runQuery(Filter.type(Operation.PersistentOperation));
     const foundFn = functions.find((fn) => fn.id === functionId);
-    if (!foundFn || !Obj.instanceOf(Function.Function, foundFn)) {
+    if (!foundFn || !Obj.instanceOf(Operation.PersistentOperation, foundFn)) {
       return yield* Effect.fail(new Error(`Function not found: ${functionId}`));
     }
-    Obj.change(trigger, (mutableTrigger) => {
-      mutableTrigger.function = Ref.make(foundFn);
+    Obj.update(trigger, (trigger) => {
+      trigger.function = Ref.make(foundFn);
     });
     currentFn = foundFn;
   }
@@ -210,8 +210,8 @@ const updateSpec = Effect.fn(function* (
       subscriptionOptions.delay = delayOptionValue.value;
     }
 
-    Obj.change(trigger, (mutableTrigger) => {
-      const spec = mutableTrigger.spec;
+    Obj.update(trigger, (trigger) => {
+      const spec = trigger.spec;
       if (spec?.kind === 'subscription') {
         // Cast needed because QueryAST types are deeply readonly but spec.query expects mutable.
         spec.query = { ast: queryAst } as NonNullable<typeof spec.query>;
@@ -227,7 +227,7 @@ const updateSpec = Effect.fn(function* (
  */
 const updateInput = Effect.fn(function* (
   trigger: Trigger.Trigger,
-  fn: Function.Function,
+  fn: Operation.PersistentOperation,
   inputOption: Option.Option<Record<string, any>>,
 ) {
   const currentInput = trigger.input as Record<string, any> | undefined;
@@ -249,8 +249,8 @@ const updateInput = Effect.fn(function* (
         promptForSchemaInput(fn.inputSchema ? JsonSchema.toEffectSchema(fn.inputSchema) : undefined, currentInput),
       onSome: (value) => Effect.succeed(value as Record<string, any>),
     });
-    Obj.change(trigger, (mutableTrigger) => {
-      mutableTrigger.input = inputObj;
+    Obj.update(trigger, (trigger) => {
+      trigger.input = inputObj;
     });
   }
 });
@@ -272,7 +272,7 @@ const updateEnabled = Effect.fn(function* (
       }).pipe(Prompt.run),
     onSome: () => Effect.succeed(enabled),
   });
-  Obj.change(trigger, (mutableTrigger) => {
-    mutableTrigger.enabled = enabledValue;
+  Obj.update(trigger, (trigger) => {
+    trigger.enabled = enabledValue;
   });
 });

package/src/{cli/commands → commands}/trigger/update/timer.ts

@@ -12,8 +12,8 @@ import * as Option from 'effect/Option';
 import { CommandConfig } from '@dxos/cli-util';
 import { flushAndSync, print, spaceLayer, withTypes } from '@dxos/cli-util';
 import { Common } from '@dxos/cli-util';
+import { Operation, Trigger } from '@dxos/compute';
 import { DXN, Database, Filter, JsonSchema, Obj, Ref } from '@dxos/echo';
-import { Function, Trigger } from '@dxos/functions';
 
 import { Cron, Enabled, Input, TriggerId } from '../options';
 import { printTrigger, promptForSchemaInput, selectFunction, selectTrigger } from '../util';
@@ -58,7 +58,7 @@ export const timer = Command.make(
 ).pipe(
   Command.withDescription('Update a timer trigger.'),
   Command.provide(({ spaceId }) => spaceLayer(spaceId, true)),
-  Command.provideEffectDiscard(() => withTypes(Function.Function, Trigger.Trigger)),
+  Command.provideEffectDiscard(() => withTypes(Operation.PersistentOperation, Trigger.Trigger)),
 );
 
 /**
@@ -67,10 +67,10 @@ export const timer = Command.make(
  * @returns The current function (either original or newly assigned)
  */
 const updateFunction = Effect.fn(function* (trigger: Trigger.Trigger, functionIdOption: Option.Option<string>) {
-  let currentFn: Function.Function | undefined = trigger.function
+  let currentFn: Operation.PersistentOperation | undefined = trigger.function
     ? yield* Database.load(trigger.function) as any
     : undefined;
-  if (currentFn && !Obj.instanceOf(Function.Function, currentFn)) {
+  if (currentFn && !Obj.instanceOf(Operation.PersistentOperation, currentFn)) {
     currentFn = undefined;
   }
   const currentFunctionName = currentFn ? (currentFn.name ?? currentFn.id) : undefined;
@@ -87,13 +87,13 @@ const updateFunction = Effect.fn(function* (trigger: Trigger.Trigger, functionId
       onNone: () => selectFunction(),
       onSome: (id) => Effect.succeed(id),
     });
-    const functions = yield* Database.runQuery(Filter.type(Function.Function));
+    const functions = yield* Database.runQuery(Filter.type(Operation.PersistentOperation));
     const foundFn = functions.find((fn) => fn.id === functionId);
-    if (!foundFn || !Obj.instanceOf(Function.Function, foundFn)) {
+    if (!foundFn || !Obj.instanceOf(Operation.PersistentOperation, foundFn)) {
       return yield* Effect.fail(new Error(`Function not found: ${functionId}`));
     }
-    Obj.change(trigger, (mutableTrigger) => {
-      mutableTrigger.function = Ref.make(foundFn);
+    Obj.update(trigger, (trigger) => {
+      trigger.function = Ref.make(foundFn);
     });
     currentFn = foundFn;
   }
@@ -128,9 +128,9 @@ const updateCron = Effect.fn(function* (trigger: Trigger.Trigger, cronOption: Op
         }).pipe(Prompt.run),
       onSome: (value) => Effect.succeed(value),
     });
-    Obj.change(trigger, (mutableTrigger) => {
-      if (mutableTrigger.spec?.kind === 'timer') {
-        mutableTrigger.spec.cron = cron;
+    Obj.update(trigger, (trigger) => {
+      if (trigger.spec?.kind === 'timer') {
+        trigger.spec.cron = cron;
       }
     });
   }
@@ -142,7 +142,7 @@ const updateCron = Effect.fn(function* (trigger: Trigger.Trigger, cronOption: Op
  */
 const updateInput = Effect.fn(function* (
   trigger: Trigger.Trigger,
-  fn: Function.Function,
+  fn: Operation.PersistentOperation,
   inputOption: Option.Option<Record<string, any>>,
 ) {
   const currentInput = trigger.input as Record<string, any> | undefined;
@@ -164,8 +164,8 @@ const updateInput = Effect.fn(function* (
         promptForSchemaInput(fn.inputSchema ? JsonSchema.toEffectSchema(fn.inputSchema) : undefined, currentInput),
       onSome: (value) => Effect.succeed(value as Record<string, any>),
     });
-    Obj.change(trigger, (mutableTrigger) => {
-      mutableTrigger.input = inputObj;
+    Obj.update(trigger, (trigger) => {
+      trigger.input = inputObj;
     });
   }
 });
@@ -187,7 +187,7 @@ const updateEnabled = Effect.fn(function* (
       }).pipe(Prompt.run),
     onSome: () => Effect.succeed(enabled),
   });
-  Obj.change(trigger, (mutableTrigger) => {
-    mutableTrigger.enabled = enabledValue;
+  Obj.update(trigger, (trigger) => {
+    trigger.enabled = enabledValue;
   });
 });

package/src/{cli/commands → commands}/trigger/util.ts

@@ -12,9 +12,9 @@ import type * as Schema from 'effect/Schema';
 import * as SchemaAST from 'effect/SchemaAST';
 
 import { FormBuilder } from '@dxos/cli-util';
-import { Annotation, Database, Entity, Feed, Filter, Obj, Ref, Type } from '@dxos/echo';
+import { Operation, Trigger } from '@dxos/compute';
+import { Annotation, Database, Entity, Feed, Filter, Obj, Query, Ref, Type } from '@dxos/echo';
 import { getProperties } from '@dxos/effect';
-import { Function, Trigger } from '@dxos/functions';
 import { FeedAnnotation } from '@dxos/schema';
 
 export type TriggerRemoteStatus = 'available' | 'not available' | 'n/a';
@@ -60,7 +60,10 @@ export const printTrigger = Effect.fn(function* (trigger: Trigger.Trigger, remot
       fn,
       FormBuilder.nest(
         'function',
-        FormBuilder.make().pipe(FormBuilder.set('key', fn!.key), FormBuilder.set('dxn', fn!.dxn?.toString())),
+        FormBuilder.make().pipe(
+          FormBuilder.set('key', (fn as Operation.PersistentOperation).key),
+          FormBuilder.set('dxn', Obj.getDXN(fn as Obj.Unknown).toString()),
+        ),
       ),
     ),
     FormBuilder.nestedOption('spec', Option.fromNullable(trigger.spec).pipe(Option.map(printSpec))),
@@ -272,7 +275,7 @@ export const promptForSchemaInput = Effect.fn(function* (
  * Queries the database for functions and prompts the user to select one.
  */
 export const selectFunction = Effect.fn(function* () {
-  const functions = yield* Database.runQuery(Filter.type(Function.Function));
+  const functions = yield* Database.runQuery(Filter.type(Operation.PersistentOperation));
 
   if (functions.length === 0) {
     return yield* Effect.fail(new Error('No functions available'));
@@ -280,7 +283,7 @@ export const selectFunction = Effect.fn(function* () {
 
   const selected = yield* Prompt.select({
     message: 'Select a function:',
-    choices: functions.map((fn: Function.Function) => ({
+    choices: functions.map((fn: Operation.PersistentOperation) => ({
       title: fn.name ?? fn.id,
       value: fn.id,
       description: fn.description,
@@ -296,7 +299,9 @@ export const selectFunction = Effect.fn(function* () {
  * Queries the database for triggers and prompts the user to select one.
  */
 export const selectTrigger = Effect.fn(function* (kind?: Trigger.Kind) {
-  const triggers = yield* Database.runQuery(Filter.type(Trigger.Trigger));
+  const triggers = yield* Database.runQuery(
+    Query.select(Filter.type(Trigger.Trigger)).debugLabel('cli.trigger.selectTrigger'),
+  );
   const filteredTriggers = kind ? triggers.filter((trigger) => trigger.spec?.kind === kind) : triggers;
 
   if (filteredTriggers.length === 0) {
@@ -307,7 +312,8 @@ export const selectTrigger = Effect.fn(function* (kind?: Trigger.Kind) {
     filteredTriggers.map((trigger) =>
       Effect.gen(function* () {
         const fn = trigger.function ? yield* Database.load(trigger.function) : undefined;
-        const functionName = fn && Obj.instanceOf(Function.Function, fn) ? (fn.name ?? fn.key ?? fn.id) : undefined;
+        const functionName =
+          fn && Obj.instanceOf(Operation.PersistentOperation, fn) ? (fn.name ?? fn.key ?? fn.id) : undefined;
         const title = functionName ?? trigger.id;
         const description = `${trigger.enabled ? 'enabled' : 'disabled'} - ${trigger.spec?.kind ?? 'unknown'}`;
 

package/src/components/AutomationPanel/AutomationPanel.stories.tsx

@@ -5,13 +5,14 @@
 import { type Meta, type StoryObj } from '@storybook/react-vite';
 import React from 'react';
 
-import { Function, Trigger } from '@dxos/functions';
+import { Operation, Trigger } from '@dxos/compute';
+import { Obj } from '@dxos/echo';
 import { useSpaces } from '@dxos/react-client/echo';
 import { withClientProvider } from '@dxos/react-client/testing';
 import { withTheme } from '@dxos/react-ui/testing';
 
-import { functions } from '../../testing';
-import { translations } from '../../translations';
+import { functions } from '#testing';
+import { translations } from '#translations';
 
 import { AutomationPanel } from './AutomationPanel';
 
@@ -35,10 +36,10 @@ const meta = {
     withClientProvider({
       createIdentity: true,
       createSpace: true,
-      types: [Function.Function, Trigger.Trigger],
+      types: [Operation.PersistentOperation, Trigger.Trigger],
       onCreateSpace: ({ space }) => {
         for (const fn of functions) {
-          space.db.add(Function.make(fn));
+          space.db.add(Obj.make(Operation.PersistentOperation, { ...fn, version: fn.version ?? '0.1.0' }));
         }
       },
     }),

package/src/components/AutomationPanel/AutomationPanel.tsx

@@ -8,11 +8,13 @@ import * as Match from 'effect/Match';
 import * as Schema from 'effect/Schema';
 import React, { useCallback, useMemo, useState } from 'react';
 
-import { Filter, Obj, Tag } from '@dxos/echo';
-import { Function, Script, Trigger } from '@dxos/functions';
+import { useTypeOptions } from '@dxos/app-toolkit/ui';
+import { Script, Trigger } from '@dxos/compute';
+import { Operation } from '@dxos/compute';
+import { Context } from '@dxos/context';
+import { Filter, Obj, Query, Tag } from '@dxos/echo';
 import { KEY_QUEUE_CURSOR } from '@dxos/functions-runtime';
 import { FunctionsServiceClient } from '@dxos/functions-runtime/edge';
-import { useTypeOptions } from '@dxos/plugin-space';
 import { type Client, useClient } from '@dxos/react-client';
 import { type Space, useObject, useQuery } from '@dxos/react-client/echo';
 import { Clipboard, IconButton, type IconButtonProps, Input, Separator, useTranslation } from '@dxos/react-ui';
@@ -22,7 +24,8 @@ import { Pipeline } from '@dxos/types';
 import { ghostHover, mx } from '@dxos/ui-theme';
 import { isNonNullable } from '@dxos/util';
 
-import { meta } from '../../meta';
+import { meta } from '#meta';
+
 import { TriggerEditor, type TriggerEditorProps } from '../TriggerEditor';
 
 const grid = 'grid grid-cols-[40px_1fr_32px_32px] min-h-[2.5rem]';
@@ -39,8 +42,11 @@ export const AutomationPanel = ({ space, object, initialTrigger, onDone }: Autom
   const { t } = useTranslation(meta.id);
   const client = useClient();
   const functionsServiceClient = useMemo(() => FunctionsServiceClient.fromClient(client), [client]);
-  const functions = useQuery(space.db, Filter.type(Function.Function));
-  const triggers = useQuery(space.db, Filter.type(Trigger.Trigger));
+  const functions = useQuery(space.db, Filter.type(Operation.PersistentOperation));
+  const triggers = useQuery(
+    space.db,
+    Query.select(Filter.type(Trigger.Trigger)).debugLabel('plugin-automation.AutomationPanel'),
+  );
   const filteredTriggers = useMemo(() => {
     return object ? triggers.filter(triggerMatch(object)) : triggers;
   }, [object, triggers]);
@@ -74,8 +80,8 @@ export const AutomationPanel = ({ space, object, initialTrigger, onDone }: Autom
 
   const handleSave: TriggerEditorProps['onSave'] = (trigger) => {
     if (selected) {
-      Obj.change(selected, (mutable) => {
-        Object.assign(mutable, trigger);
+      Obj.update(selected, (selected) => {
+        Object.assign(selected, trigger);
       });
     } else {
       space.db.add(Trigger.make(trigger));
@@ -92,19 +98,19 @@ export const AutomationPanel = ({ space, object, initialTrigger, onDone }: Autom
   };
 
   const handleForceRunTrigger = async (trigger: Trigger.Trigger) => {
-    await functionsServiceClient.forceRunCronTrigger(space.id, trigger.id);
+    await functionsServiceClient.forceRunCronTrigger(Context.default(), space.id, trigger.id);
   };
 
   const handleResetCursor = async (trigger: Trigger.Trigger) => {
-    Obj.change(trigger, (t) => {
-      Obj.deleteKeys(t, KEY_QUEUE_CURSOR);
+    Obj.update(trigger, (trigger) => {
+      Obj.deleteKeys(trigger, KEY_QUEUE_CURSOR);
     });
     await space.db.flush({ indexes: true });
   };
 
   if (trigger) {
     return (
-      <Settings.Item title={t('trigger editor title')} description={t('trigger editor description')}>
+      <Settings.Item title={t('trigger-editor.title')} description={t('trigger-editor.description')}>
         <TriggerEditor
           db={space.db}
           trigger={trigger}
@@ -119,34 +125,36 @@ export const AutomationPanel = ({ space, object, initialTrigger, onDone }: Autom
   }
 
   return (
-    <Settings.Container>
-      {filteredTriggers.length > 0 && (
-        <List.Root<Trigger.Trigger>
-          items={filteredTriggers}
-          isItem={Schema.is(Trigger.Trigger)}
-          getId={(field) => field.id}
-        >
-          {({ items: filteredTriggers }) => (
-            <div role='list' className='flex flex-col w-full'>
-              {filteredTriggers?.map((trigger) => (
-                <TriggerListItem
-                  key={trigger.id}
-                  trigger={trigger}
-                  functions={functions}
-                  onSelect={handleSelect}
-                  onDelete={handleDelete}
-                  onResetCursor={handleResetCursor}
-                  onForceRun={handleForceRunTrigger}
-                />
-              ))}
-            </div>
-          )}
-        </List.Root>
-      )}
-
-      {filteredTriggers.length > 0 && <Separator classNames='my-4' />}
-      <IconButton icon='ph--plus--regular' label={t('new trigger label')} onClick={handleAdd} />
-    </Settings.Container>
+    <Settings.Panel>
+      <Clipboard.Provider>
+        {filteredTriggers.length > 0 && (
+          <List.Root<Trigger.Trigger>
+            items={filteredTriggers}
+            isItem={Schema.is(Trigger.Trigger)}
+            getId={(field) => field.id}
+          >
+            {({ items: filteredTriggers }) => (
+              <div role='list' className='flex flex-col w-full'>
+                {filteredTriggers?.map((trigger) => (
+                  <TriggerListItem
+                    key={trigger.id}
+                    trigger={trigger}
+                    functions={functions}
+                    onSelect={handleSelect}
+                    onDelete={handleDelete}
+                    onResetCursor={handleResetCursor}
+                    onForceRun={handleForceRunTrigger}
+                  />
+                ))}
+              </div>
+            )}
+          </List.Root>
+        )}
+
+        {filteredTriggers.length > 0 && <Separator classNames='my-4' />}
+        <IconButton icon='ph--plus--regular' label={t('new-trigger.label')} onClick={handleAdd} />
+      </Clipboard.Provider>
+    </Settings.Panel>
   );
 };
 
@@ -159,7 +167,7 @@ const TriggerListItem = ({
   onForceRun,
 }: {
   trigger: Trigger.Trigger;
-  functions: Function.Function[];
+  functions: Operation.PersistentOperation[];
   onSelect?: (trigger: Trigger.Trigger) => void;
   onDelete?: (trigger: Trigger.Trigger) => void;
   onResetCursor?: (trigger: Trigger.Trigger) => void;
@@ -268,7 +276,7 @@ const getWebhookUrl = (client: Client, trigger: Trigger.Trigger) => {
   return new URL(`/webhook/${spaceId}:${trigger.id}`, edgeUrl).toString();
 };
 
-const getFunctionName = (functions: Function.Function[], trigger: Trigger.Trigger) => {
+const getFunctionName = (functions: Operation.PersistentOperation[], trigger: Trigger.Trigger) => {
   // TODO(wittjosiah): Truncation should be done in the UI.
   //   Warning that the List component is currently a can of worms.
   const shortId = trigger.function && `${trigger.function.dxn.toString().slice(0, 16)}…`;
@@ -278,7 +286,7 @@ const getFunctionName = (functions: Function.Function[], trigger: Trigger.Trigge
 
 const scriptMatch = (script: Script.Script) => (trigger: Trigger.Trigger) => {
   const fn = trigger.function?.target;
-  if (!Obj.instanceOf(Function.Function, fn)) {
+  if (!Obj.instanceOf(Operation.PersistentOperation, fn)) {
     return false;
   }
 

package/src/components/FunctionsPanel/FunctionsPanel.tsx

@@ -7,16 +7,15 @@ import React, { useCallback, useMemo } from 'react';
 
 import { useOperationInvoker } from '@dxos/app-framework/ui';
 import { LayoutOperation, getObjectPathFromObject } from '@dxos/app-toolkit';
-import { Obj } from '@dxos/echo';
-import { Function, Script } from '@dxos/functions';
-import { SpaceOperation } from '@dxos/plugin-space/types';
+import { Operation, Script } from '@dxos/compute';
+import { SpaceOperation } from '@dxos/plugin-space';
 import { Filter, type Space, useQuery } from '@dxos/react-client/echo';
-import { Button, IconButton, useTranslation } from '@dxos/react-ui';
+import { IconButton, useTranslation } from '@dxos/react-ui';
 import { Settings } from '@dxos/react-ui-form';
 import { List } from '@dxos/react-ui-list';
 import { ghostHover, mx } from '@dxos/ui-theme';
 
-import { meta } from '../../meta';
+import { meta } from '#meta';
 
 export type FunctionsPanelProps = {
   space: Space;
@@ -24,7 +23,7 @@ export type FunctionsPanelProps = {
 
 export const FunctionsPanel = ({ space }: FunctionsPanelProps) => {
   const { t } = useTranslation(meta.id);
-  const functions = useQuery(space.db, Filter.type(Function.Function));
+  const functions = useQuery(space.db, Filter.type(Operation.PersistentOperation));
   const scripts = useQuery(space.db, Filter.type(Script.Script));
   const { invokePromise } = useOperationInvoker();
 
@@ -47,7 +46,7 @@ export const FunctionsPanel = ({ space }: FunctionsPanelProps) => {
   );
 
   const getScriptName = useCallback(
-    (func: Function.Function) => {
+    (func: Operation.PersistentOperation) => {
       const script = functionToScriptMap[func.id];
       return script?.name;
     },
@@ -55,7 +54,7 @@ export const FunctionsPanel = ({ space }: FunctionsPanelProps) => {
   );
 
   const handleGoToScript = useCallback(
-    (func: Function.Function) => {
+    (func: Operation.PersistentOperation) => {
       const script = functionToScriptMap[func.id];
       if (script) {
         void invokePromise(LayoutOperation.Open, { subject: [getObjectPathFromObject(script)] });
@@ -65,35 +64,45 @@ export const FunctionsPanel = ({ space }: FunctionsPanelProps) => {
   );
 
   const handleDelete = useCallback(
-    (func: Function.Function) => invokePromise(SpaceOperation.RemoveObjects, { objects: [func] }),
+    (func: Operation.PersistentOperation) => invokePromise(SpaceOperation.RemoveObjects, { objects: [func] }),
     [invokePromise],
   );
 
   return (
-    <Settings.Container>
+    <Settings.Panel>
       {functions.length > 0 && (
-        <List.Root<Function.Function> items={functions} isItem={Schema.is(Function.Function)} getId={(func) => func.id}>
+        <List.Root<Operation.PersistentOperation>
+          items={functions}
+          isItem={Schema.is(Operation.PersistentOperation)}
+          getId={(func) => func.id}
+        >
           {({ items }) => (
             <div role='list' className='flex flex-col w-full'>
               {items?.map((func) => (
-                <List.Item<Function.Function>
+                <List.Item<Operation.PersistentOperation>
                   key={func.id}
                   item={func}
-                  classNames={mx('grid grid-cols-[1fr_auto] min-h-[2.5rem] min-h-[3rem] px-2 items-center', ghostHover)}
+                  classNames={mx(
+                    'grid grid-cols-[1fr_min-content_auto] min-h-[2.5rem] min-h-[3rem] px-2 items-center',
+                    ghostHover,
+                  )}
                 >
                   <div className='flex flex-col truncate'>
                     <List.ItemTitle classNames='truncate'>{func.name}</List.ItemTitle>
-                    {getScriptName(func) && (
-                      <div className='text-xs text-description truncate'>{getScriptName(func)}</div>
-                    )}
+                    {getScriptName(func) && <p className='text-xs text-description truncate'>{getScriptName(func)}</p>}
                   </div>
-                  {functionToScriptMap[func.id] && (
-                    <Button onClick={() => handleGoToScript(func)}>{t('go to function source button label')}</Button>
-                  )}
+                  {(functionToScriptMap[func.id] && (
+                    <IconButton
+                      icon='ph--arrow-square-out--regular'
+                      iconOnly
+                      label={t('show-source-button.label')}
+                      onClick={() => handleGoToScript(func)}
+                    />
+                  )) || <div />}
                   <IconButton
-                    iconOnly
                     icon='ph--trash--regular'
-                    label={t('delete function button label')}
+                    iconOnly
+                    label={t('delete-function-button.label')}
                     onClick={() => handleDelete(func)}
                   />
                 </List.Item>
@@ -102,8 +111,6 @@ export const FunctionsPanel = ({ space }: FunctionsPanelProps) => {
           )}
         </List.Root>
       )}
-
-      {functions.length === 0 && <div className='text-center py-4 text-description'>{t('no functions found')}</div>}
-    </Settings.Container>
+    </Settings.Panel>
   );
 };