@dxos/plugin-automation 0.8.2-main.f11618f → 0.8.2-staging.42af850

package/src/AutomationPlugin.tsx

@@ -3,7 +3,7 @@
 //
 
 import { Capabilities, contributes, defineModule, definePlugin, Events } from '@dxos/app-framework';
-import { FunctionType, FunctionTrigger } from '@dxos/functions/types';
+import { FunctionType, FunctionTrigger } from '@dxos/functions';
 import { ClientCapabilities, ClientEvents } from '@dxos/plugin-client';
 
 import { AppGraphBuilder, IntentResolver, ReactSurface } from './capabilities';

package/src/capabilities/app-graph-builder.ts

@@ -2,61 +2,85 @@
 // Copyright 2025 DXOS.org
 //
 
-import { Capabilities, contributes, type PluginsContext } from '@dxos/app-framework';
+import { Rx } from '@effect-rx/rx-react';
+import { Option, pipe } from 'effect';
+
+import { Capabilities, contributes, type PluginContext } from '@dxos/app-framework';
 import { isInstanceOf } from '@dxos/echo-schema';
 import { ScriptType } from '@dxos/functions';
 import { PLANK_COMPANION_TYPE, ATTENDABLE_PATH_SEPARATOR } from '@dxos/plugin-deck/types';
-import { createExtension, type Node } from '@dxos/plugin-graph';
-import { SCRIPT_PLUGIN } from '@dxos/plugin-script/types';
+import { createExtension } from '@dxos/plugin-graph';
 import { SPACE_PLUGIN } from '@dxos/plugin-space';
 
 import { meta } from '../meta';
 
-export default (context: PluginsContext) =>
+export default (context: PluginContext) =>
   contributes(Capabilities.AppGraphBuilder, [
     createExtension({
       id: `${meta.id}/space-settings-automation`,
-      filter: (node): node is Node<null> => node.type === `${SPACE_PLUGIN}/settings`,
-      connector: ({ node }) => [
-        {
-          id: `automation-${node.id}`,
-          type: `${meta.id}/space-settings-automation`,
-          data: `${meta.id}/space-settings-automation`,
-          properties: {
-            label: ['automation panel label', { ns: meta.id }],
-            icon: 'ph--lightning--regular',
-          },
-        },
-      ],
+      connector: (node) =>
+        Rx.make((get) =>
+          pipe(
+            get(node),
+            Option.flatMap((node) => (node.type === `${SPACE_PLUGIN}/settings` ? Option.some(node) : Option.none())),
+            Option.map((node) => [
+              {
+                id: `automation-${node.id}`,
+                type: `${meta.id}/space-settings-automation`,
+                data: `${meta.id}/space-settings-automation`,
+                properties: {
+                  label: ['automation panel label', { ns: meta.id }],
+                  icon: 'ph--lightning--regular',
+                },
+              },
+            ]),
+            Option.getOrElse(() => []),
+          ),
+        ),
     }),
     createExtension({
       id: `${meta.id}/space-settings-functions`,
-      filter: (node): node is Node<null> => node.type === `${SPACE_PLUGIN}/settings`,
-      connector: ({ node }) => [
-        {
-          id: `functions-${node.id}`,
-          type: `${meta.id}/space-settings-functions`,
-          data: `${meta.id}/space-settings-functions`,
-          properties: {
-            label: ['functions panel label', { ns: meta.id }],
-            icon: 'ph--function--regular',
-          },
-        },
-      ],
+      connector: (node) =>
+        Rx.make((get) =>
+          pipe(
+            get(node),
+            Option.flatMap((node) => (node.type === `${SPACE_PLUGIN}/settings` ? Option.some(node) : Option.none())),
+            Option.map((node) => [
+              {
+                id: `functions-${node.id}`,
+                type: `${meta.id}/space-settings-functions`,
+                data: `${meta.id}/space-settings-functions`,
+                properties: {
+                  label: ['functions panel label', { ns: meta.id }],
+                  icon: 'ph--function--regular',
+                },
+              },
+            ]),
+            Option.getOrElse(() => []),
+          ),
+        ),
     }),
     createExtension({
-      id: `${SCRIPT_PLUGIN}/script-companion`,
-      filter: (node): node is Node<ScriptType> => isInstanceOf(ScriptType, node.data),
-      connector: ({ node }) => [
-        {
-          id: [node.id, 'automation'].join(ATTENDABLE_PATH_SEPARATOR),
-          type: PLANK_COMPANION_TYPE,
-          data: 'automation',
-          properties: {
-            label: ['script automation label', { ns: meta.id }],
-            icon: 'ph--lightning--regular',
-          },
-        },
-      ],
+      id: `${meta.id}/script-companion`,
+      connector: (node) =>
+        Rx.make((get) =>
+          pipe(
+            get(node),
+            Option.flatMap((node) => (isInstanceOf(ScriptType, node.data) ? Option.some(node) : Option.none())),
+            Option.map((node) => [
+              {
+                id: [node.id, 'automation'].join(ATTENDABLE_PATH_SEPARATOR),
+                type: PLANK_COMPANION_TYPE,
+                data: 'automation',
+                properties: {
+                  label: ['script automation label', { ns: meta.id }],
+                  icon: 'ph--lightning--regular',
+                  disposition: 'hidden',
+                },
+              },
+            ]),
+            Option.getOrElse(() => []),
+          ),
+        ),
     }),
   ]);

package/src/capabilities/intent-resolver.ts

@@ -6,10 +6,11 @@ import {
   contributes,
   Capabilities,
   createResolver,
-  type PluginsContext,
+  type PluginContext,
   createIntent,
   LayoutAction,
 } from '@dxos/app-framework';
+import { Ref } from '@dxos/echo';
 import { FunctionTrigger, FunctionType, ScriptType, TriggerKind } from '@dxos/functions';
 import { type DXN } from '@dxos/keys';
 import { live } from '@dxos/live-object';
@@ -19,39 +20,35 @@ import { Filter } from '@dxos/react-client/echo';
 
 import { AutomationAction } from '../types';
 
-export default (context: PluginsContext) =>
+export default (context: PluginContext) =>
   contributes(Capabilities.IntentResolver, [
     createResolver({
       intent: AutomationAction.CreateTriggerFromTemplate,
-      resolve: async ({ space, template, enabled = false, scriptName, payload }) => {
-        const trigger = live(FunctionTrigger, { enabled });
+      resolve: async ({ space, template, enabled = false, scriptName, input }) => {
+        const trigger = live(FunctionTrigger, { enabled, input });
 
         // TODO(wittjosiah): Factor out function lookup by script name?
         if (scriptName) {
           const {
             objects: [script],
-          } = await space.db.query(Filter.schema(ScriptType, { name: scriptName })).run();
+          } = await space.db.query(Filter.type(ScriptType, { name: scriptName })).run();
           if (script) {
             const {
               objects: [fn],
-            } = await space.db.query(Filter.schema(FunctionType, { source: script })).run();
+            } = await space.db.query(Filter.type(FunctionType, { source: Ref.make(script) })).run();
             if (fn) {
-              trigger.function = `dxn:worker:${fn.name}`;
+              trigger.function = Ref.make(fn);
             }
           }
         }
 
-        if (payload) {
-          trigger.meta = payload;
-        }
-
         switch (template.type) {
           case 'timer': {
-            trigger.spec = { type: TriggerKind.Timer, cron: template.cron };
+            trigger.spec = { kind: TriggerKind.Timer, cron: template.cron };
             break;
           }
           case 'queue': {
-            trigger.spec = { type: TriggerKind.Queue, queue: (template.queueDXN as DXN).toString() };
+            trigger.spec = { kind: TriggerKind.Queue, queue: (template.queueDXN as DXN).toString() };
             break;
           }
           default: {

package/src/capabilities/react-surface.tsx

@@ -6,7 +6,7 @@ import React from 'react';
 
 import { Capabilities, contributes, createSurface, useLayout } from '@dxos/app-framework';
 import { isInstanceOf } from '@dxos/echo-schema';
-import { ScriptType } from '@dxos/functions/types';
+import { ScriptType } from '@dxos/functions';
 import { getSpace, parseId, useSpace } from '@dxos/react-client/echo';
 import { StackItem } from '@dxos/react-ui-stack';
 

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

@@ -7,7 +7,7 @@ import '@dxos-theme';
 import { type Meta } from '@storybook/react';
 import React from 'react';
 
-import { FunctionType, FunctionTrigger } from '@dxos/functions/types';
+import { FunctionType, FunctionTrigger } from '@dxos/functions';
 import { live, useSpaces } from '@dxos/react-client/echo';
 import { withClientProvider } from '@dxos/react-client/testing';
 import { withLayout, withTheme } from '@dxos/storybook-utils';
@@ -21,7 +21,7 @@ const DefaultStory = () => {
   const space = spaces[1];
 
   return (
-    <div role='none' className='w-96'>
+    <div className='w-96'>
       <AutomationPanel space={space} />
     </div>
   );
@@ -42,10 +42,11 @@ const meta: Meta = {
         }
       },
     }),
-    withLayout({ fullscreen: true, tooltips: true, classNames: 'flex juastify-center m-2' }),
+    withLayout(),
     withTheme,
   ],
   parameters: {
+    layout: 'centered',
     translations,
   },
 };

package/src/components/AutomationPanel/AutomationPanel.tsx

@@ -2,9 +2,9 @@
 // Copyright 2024 DXOS.org
 //
 
+import { Schema } from 'effect';
 import React, { useState } from 'react';
 
-import { S } from '@dxos/echo-schema';
 import {
   FunctionType,
   FunctionTrigger,
@@ -12,7 +12,7 @@ import {
   TriggerKind,
   type FunctionTriggerType,
   ScriptType,
-} from '@dxos/functions/types';
+} from '@dxos/functions';
 import { type Client, useClient } from '@dxos/react-client';
 import { live, Filter, useQuery, type Space, type Live, getSpace } from '@dxos/react-client/echo';
 import { Clipboard, IconButton, Input, Separator, useTranslation } from '@dxos/react-ui';
@@ -36,9 +36,9 @@ export type AutomationPanelProps = {
 export const AutomationPanel = ({ space, object, initialTrigger, onDone }: AutomationPanelProps) => {
   const { t } = useTranslation(AUTOMATION_PLUGIN);
   const client = useClient();
-  const triggers = useQuery(space, Filter.schema(FunctionTrigger));
-  const functions = useQuery(space, Filter.schema(FunctionType));
-  const scripts = useQuery(space, Filter.schema(ScriptType));
+  const triggers = useQuery(space, Filter.type(FunctionTrigger));
+  const functions = useQuery(space, Filter.type(FunctionType));
+  const scripts = useQuery(space, Filter.type(ScriptType));
 
   const [trigger, setTrigger] = useState<FunctionTriggerType | undefined>(initialTrigger);
   const [selected, setSelected] = useState<FunctionTrigger>();
@@ -77,15 +77,19 @@ export const AutomationPanel = ({ space, object, initialTrigger, onDone }: Autom
     onDone?.();
   };
 
+  if (trigger) {
+    return (
+      <ControlItem title={t('trigger editor title')}>
+        <TriggerEditor space={space} trigger={trigger} onSave={handleSave} onCancel={handleCancel} />
+      </ControlItem>
+    );
+  }
+
   return (
     <div className='flex flex-col w-full'>
-      {trigger ? (
-        <ControlItem title={t('trigger editor title')}>
-          <TriggerEditor space={space} trigger={trigger} onSave={handleSave} onCancel={handleCancel} />
-        </ControlItem>
-      ) : (
-        <div role='none' className={controlItemClasses}>
-          <List.Root<FunctionTrigger> items={triggers} isItem={S.is(FunctionTrigger)} getId={(field) => field.id}>
+      <div role='none' className={controlItemClasses}>
+        {triggers.length > 0 && (
+          <List.Root<FunctionTrigger> items={triggers} isItem={Schema.is(FunctionTrigger)} getId={(field) => field.id}>
             {({ items: triggers }) => (
               <div role='list' className='flex flex-col w-full'>
                 {triggers?.map((trigger) => {
@@ -127,20 +131,20 @@ export const AutomationPanel = ({ space, object, initialTrigger, onDone }: Autom
               </div>
             )}
           </List.Root>
-          {triggers.length > 0 && <Separator classNames='mlb-4' />}
-          <IconButton icon='ph--plus--regular' label={t('new trigger label')} onClick={handleAdd} />
-        </div>
-      )}
+        )}
+        {triggers.length > 0 && <Separator classNames='mlb-4' />}
+        <IconButton icon='ph--plus--regular' label={t('new trigger label')} onClick={handleAdd} />
+      </div>
     </div>
   );
 };
 
 const getCopyAction = (client: Client, trigger: FunctionTrigger | undefined) => {
-  if (trigger?.spec?.type === TriggerKind.Email) {
+  if (trigger?.spec?.kind === TriggerKind.Email) {
     return { translationKey: 'trigger copy email', contentProvider: () => `${getSpace(trigger)!.id}@dxos.network` };
   }
 
-  if (trigger?.spec?.type === TriggerKind.Webhook) {
+  if (trigger?.spec?.kind === TriggerKind.Webhook) {
     return { translationKey: 'trigger copy url', contentProvider: () => getWebhookUrl(client, trigger) };
   }
 
@@ -158,10 +162,11 @@ const getWebhookUrl = (client: Client, trigger: FunctionTrigger) => {
 const getFunctionName = (scripts: ScriptType[], functions: FunctionType[], trigger: FunctionTriggerType) => {
   // 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?.slice(0, 16)}…`;
-  const functionObject = functions.find((fn) => `dxn:worker:${fn.name}` === trigger.function);
+  const shortId = trigger.function && `${trigger.function.dxn.toString().slice(0, 16)}…`;
+  const functionObject = functions.find((fn) => fn === trigger.function?.target);
   if (!functionObject) {
     return shortId;
   }
+
   return scripts.find((s) => functionObject.source?.target?.id === s.id)?.name ?? shortId;
 };

package/src/components/FunctionsPanel/FunctionsPanel.tsx

@@ -2,11 +2,11 @@
 // Copyright 2025 DXOS.org
 //
 
+import { Schema } from 'effect';
 import React, { useCallback, useMemo } from 'react';
 
 import { createIntent, LayoutAction, useIntentDispatcher } from '@dxos/app-framework';
-import { S } from '@dxos/echo-schema';
-import { FunctionType, ScriptType } from '@dxos/functions/types';
+import { FunctionType, ScriptType } from '@dxos/functions';
 import { Filter, fullyQualifiedId, useQuery, type Space } from '@dxos/react-client/echo';
 import { Button, useTranslation } from '@dxos/react-ui';
 import { controlItemClasses } from '@dxos/react-ui-form';
@@ -23,8 +23,8 @@ export type FunctionsPanelProps = {
 
 export const FunctionsPanel = ({ space }: FunctionsPanelProps) => {
   const { t } = useTranslation(AUTOMATION_PLUGIN);
-  const functions = useQuery(space, Filter.schema(FunctionType));
-  const scripts = useQuery(space, Filter.schema(ScriptType));
+  const functions = useQuery(space, Filter.type(FunctionType));
+  const scripts = useQuery(space, Filter.type(ScriptType));
   const { dispatchPromise: dispatch } = useIntentDispatcher();
 
   const functionToScriptMap = useMemo(
@@ -65,7 +65,7 @@ export const FunctionsPanel = ({ space }: FunctionsPanelProps) => {
 
   return (
     <div role='none' className={mx(controlItemClasses)}>
-      <List.Root<FunctionType> items={functions} isItem={S.is(FunctionType)} getId={(func) => func.id}>
+      <List.Root<FunctionType> items={functions} isItem={Schema.is(FunctionType)} getId={(func) => func.id}>
         {({ items }) => (
           <div role='list' className='flex flex-col w-full'>
             {items?.map((func) => (

package/src/components/TriggerEditor/FunctionInputEditor.tsx

@@ -0,0 +1,77 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import React, { useCallback, useMemo } from 'react';
+
+import { type JsonPath, RefImpl, toEffectSchema } from '@dxos/echo-schema';
+import { type FunctionType } from '@dxos/functions';
+import { useOnTransition } from '@dxos/react-ui';
+import { Form, type FormInputStateProps, type QueryRefOptions, useFormValues } from '@dxos/react-ui-form';
+
+export type FunctionInputEditorProps = {
+  functions: FunctionType[];
+  onQueryRefOptions: QueryRefOptions;
+} & FormInputStateProps;
+
+/**
+ * Editor component for function input parameters.
+ */
+export const FunctionInputEditor = ({
+  functions,
+  getValue,
+  onValueChange,
+  onQueryRefOptions,
+}: FunctionInputEditorProps) => {
+  const selectedFunctionValue = useFormValues(['function' as JsonPath]);
+  const selectedFunctionId = useMemo(() => {
+    if (selectedFunctionValue instanceof RefImpl) {
+      return selectedFunctionValue.dxn.toString().split('dxn:echo:@:').at(1);
+    }
+  }, [selectedFunctionValue]);
+
+  const selectedFunction = useMemo(
+    () => functions.find((f) => f.id === selectedFunctionId),
+    [functions, selectedFunctionId],
+  );
+
+  useOnTransition(
+    // Clear function parameter input when the function changes.
+    selectedFunctionValue,
+    (prevValue) => prevValue !== undefined && prevValue !== selectedFunctionValue,
+    (currValue) => currValue !== undefined,
+    () => onValueChange('object', {}),
+  );
+
+  const inputSchema = useMemo(() => selectedFunction?.inputSchema, [selectedFunction]);
+  const effectSchema = useMemo(() => (inputSchema ? toEffectSchema(inputSchema) : undefined), [inputSchema]);
+  const propertyCount = inputSchema?.properties ? Object.keys(inputSchema.properties).length : 0;
+
+  const values = useMemo(() => getValue() ?? {}, [getValue]);
+
+  const handleValuesChanged = useCallback(
+    (values: any) => {
+      onValueChange('object', values);
+    },
+    [onValueChange],
+  );
+
+  if (selectedFunction === undefined || effectSchema === undefined || propertyCount === 0) {
+    return null;
+  }
+
+  return (
+    <>
+      <h3 className='text-md'>Function parameters</h3>
+      {/* TODO(ZaymonFC): Try using <FormFields /> internal component for this nesting.
+                          This would allow errors to flow up to the root context. */}
+      <Form
+        schema={effectSchema}
+        values={values}
+        classNames='p-0'
+        onValuesChanged={handleValuesChanged}
+        onQueryRefOptions={onQueryRefOptions}
+      />
+    </>
+  );
+};

package/src/components/TriggerEditor/SpecSelector.tsx

@@ -0,0 +1,59 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import React, { useCallback, useMemo } from 'react';
+
+import { type FunctionTriggerType, TriggerKind, type TriggerType } from '@dxos/functions';
+import { useTranslation } from '@dxos/react-ui';
+import { SelectInput, type InputProps, useInputProps } from '@dxos/react-ui-form';
+
+import { AUTOMATION_PLUGIN } from '../../meta';
+
+export type SpecSelectorProps = InputProps;
+
+export const SpecSelector = (props: SpecSelectorProps) => {
+  const { t } = useTranslation(AUTOMATION_PLUGIN);
+  const specProps = useInputProps(['spec' satisfies keyof FunctionTriggerType]);
+
+  const handleTypeChange = useCallback(
+    (_type: any, value: string): TriggerType | undefined => {
+      const getDefaultTriggerSpec = (kind: string) => {
+        switch (kind) {
+          case TriggerKind.Timer:
+            return { kind: TriggerKind.Timer, cron: '' };
+          case TriggerKind.Subscription:
+            return { kind: TriggerKind.Subscription, filter: {} };
+          case TriggerKind.Queue:
+            return { kind: TriggerKind.Queue, queue: '' };
+          case TriggerKind.Email:
+            return { kind: TriggerKind.Email };
+          case TriggerKind.Webhook:
+            return { kind: TriggerKind.Webhook };
+          default:
+            return undefined;
+        }
+      };
+
+      const defaultSpec = getDefaultTriggerSpec(value);
+      if (!defaultSpec) {
+        return;
+      }
+
+      // Update the entire spec object, not just the `spec.kind`.
+      specProps.onValueChange('object', defaultSpec);
+    },
+    [specProps],
+  );
+
+  const options = useMemo(
+    () =>
+      Object.values(TriggerKind).map((kind) => ({
+        value: kind,
+        label: t(`trigger type ${kind}`),
+      })),
+    [t],
+  );
+
+  return <SelectInput {...props} options={options} onValueChange={handleTypeChange} />;
+};

package/src/components/TriggerEditor/TriggerEditor.stories.tsx

@@ -1,5 +1,5 @@
 //
-// Copyright 2024 DXOS.org
+// Copyright 2025 DXOS.org
 //
 
 import '@dxos-theme';
@@ -7,10 +7,11 @@ import '@dxos-theme';
 import { type Meta } from '@storybook/react';
 import React, { useEffect, useState } from 'react';
 
-import { FunctionType, FunctionTrigger, TriggerKind } from '@dxos/functions/types';
+import { FunctionType, FunctionTrigger, TriggerKind } from '@dxos/functions';
 import { live } from '@dxos/live-object';
+import { faker } from '@dxos/random';
 import { useSpaces } from '@dxos/react-client/echo';
-import { withClientProvider } from '@dxos/react-client/testing';
+import { ContactType, withClientProvider } from '@dxos/react-client/testing';
 import { withLayout, withTheme } from '@dxos/storybook-utils';
 
 import { TriggerEditor } from './TriggerEditor';
@@ -26,7 +27,7 @@ const DefaultStory = () => {
       return;
     }
 
-    const trigger = space.db.add(live(FunctionTrigger, { spec: { type: TriggerKind.Timer, cron: '' } }));
+    const trigger = space.db.add(live(FunctionTrigger, { spec: { kind: TriggerKind.Timer, cron: '' } }));
     setTrigger(trigger);
   }, [space]);
 
@@ -35,8 +36,8 @@ const DefaultStory = () => {
   }
 
   return (
-    <div role='none' className='flex w-[350px] border border-separator overflow-hidden'>
-      <TriggerEditor space={space} trigger={trigger} />
+    <div role='none' className='w-[32rem] bs-fit border border-separator rounded-sm'>
+      <TriggerEditor space={space} trigger={trigger} onSave={(values) => console.log('on save', values)} />
     </div>
   );
 };
@@ -49,14 +50,22 @@ const meta: Meta = {
     withClientProvider({
       createIdentity: true,
       createSpace: true,
-      types: [FunctionType, FunctionTrigger],
+      types: [FunctionType, FunctionTrigger, ContactType],
       onSpaceCreated: ({ space }) => {
         for (const fn of functions) {
           space.db.add(live(FunctionType, fn));
         }
+        Array.from({ length: 10 }).map(() => {
+          return space.db.add(
+            live(ContactType, {
+              name: faker.person.fullName(),
+              identifiers: [],
+            }),
+          );
+        });
       },
     }),
-    withLayout({ fullscreen: true, tooltips: true, classNames: 'flex justify-center m-2' }),
+    withLayout({ fullscreen: true, classNames: 'flex justify-center m-2' }),
     withTheme,
   ],
   parameters: {