@dxos/plugin-automation 0.8.1 → 0.8.2-main.f081794

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

@@ -8,11 +8,42 @@ 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 { SPACE_PLUGIN } from '@dxos/plugin-space';
 
 import { meta } from '../meta';
 
 export default (context: PluginsContext) =>
   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',
+          },
+        },
+      ],
+    }),
+    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',
+          },
+        },
+      ],
+    }),
     createExtension({
       id: `${SCRIPT_PLUGIN}/script-companion`,
       filter: (node): node is Node<ScriptType> => isInstanceOf(ScriptType, node.data),

package/src/capabilities/index.ts

@@ -5,4 +5,5 @@
 import { lazy } from '@dxos/app-framework';
 
 export const AppGraphBuilder = lazy(() => import('./app-graph-builder'));
+export const IntentResolver = lazy(() => import('./intent-resolver'));
 export const ReactSurface = lazy(() => import('./react-surface'));

package/src/capabilities/intent-resolver.ts

@@ -0,0 +1,62 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { contributes, Capabilities, createResolver, type PluginsContext, createIntent } from '@dxos/app-framework';
+import { FunctionTrigger, FunctionType, ScriptType, TriggerKind } from '@dxos/functions';
+import { type DXN } from '@dxos/keys';
+import { live } from '@dxos/live-object';
+import { SpaceAction } from '@dxos/plugin-space/types';
+import { Filter } from '@dxos/react-client/echo';
+
+import { AutomationAction } from '../types';
+
+export default (context: PluginsContext) =>
+  contributes(Capabilities.IntentResolver, [
+    createResolver({
+      intent: AutomationAction.CreateTriggerFromTemplate,
+      resolve: async ({ space, template, enabled = false, scriptName, payload }) => {
+        const trigger = live(FunctionTrigger, { enabled });
+
+        // TODO(wittjosiah): Factor out function lookup by script name?
+        if (scriptName) {
+          const {
+            objects: [script],
+          } = await space.db.query(Filter.schema(ScriptType, { name: scriptName })).run();
+          if (script) {
+            const {
+              objects: [fn],
+            } = await space.db.query(Filter.schema(FunctionType, { source: script })).run();
+            if (fn) {
+              trigger.function = `dxn:worker:${fn.name}`;
+            }
+          }
+        }
+
+        if (payload) {
+          trigger.meta = payload;
+        }
+
+        switch (template.type) {
+          case 'timer': {
+            trigger.spec = { type: TriggerKind.Timer, cron: template.cron };
+            break;
+          }
+          case 'queue': {
+            trigger.spec = { type: TriggerKind.Queue, queue: (template.queueDXN as DXN).toString() };
+            break;
+          }
+          default: {
+            break;
+          }
+        }
+
+        return {
+          intents: [
+            createIntent(SpaceAction.AddObject, { object: trigger, target: space }),
+            createIntent(SpaceAction.OpenSettings, { space }),
+          ],
+        };
+      },
+    }),
+  ]);

package/src/capabilities/react-surface.tsx

@@ -4,22 +4,46 @@
 
 import React from 'react';
 
-import { Capabilities, contributes, createSurface } from '@dxos/app-framework';
+import { Capabilities, contributes, createSurface, useLayout } from '@dxos/app-framework';
 import { isInstanceOf } from '@dxos/echo-schema';
 import { ScriptType } from '@dxos/functions/types';
-import { getSpace, isSpace, type Space } from '@dxos/react-client/echo';
+import { getSpace, parseId, useSpace } from '@dxos/react-client/echo';
 import { StackItem } from '@dxos/react-ui-stack';
 
-import { AutomationPanel } from '../components';
+import { AutomationContainer, AutomationPanel, FunctionsContainer } from '../components';
 import { meta } from '../meta';
 
 export default () =>
   contributes(Capabilities.ReactSurface, [
     createSurface({
-      id: `${meta.id}/automation`,
-      role: 'space-settings--automation',
-      filter: (data): data is { subject: Space } => isSpace(data.subject),
-      component: ({ data }) => <AutomationPanel space={data.subject} />,
+      id: `${meta.id}/space-settings-automation`,
+      role: 'article',
+      filter: (data): data is { subject: string } => data.subject === `${meta.id}/space-settings-automation`,
+      component: () => {
+        const layout = useLayout();
+        const { spaceId } = parseId(layout.workspace);
+        const space = useSpace(spaceId);
+        if (!space || !spaceId) {
+          return null;
+        }
+
+        return <AutomationContainer space={space} />;
+      },
+    }),
+    createSurface({
+      id: `${meta.id}/space-settings-functions`,
+      role: 'article',
+      filter: (data): data is { subject: string } => data.subject === `${meta.id}/space-settings-functions`,
+      component: () => {
+        const layout = useLayout();
+        const { spaceId } = parseId(layout.workspace);
+        const space = useSpace(spaceId);
+        if (!space || !spaceId) {
+          return null;
+        }
+
+        return <FunctionsContainer space={space} />;
+      },
     }),
     createSurface({
       id: `${meta.id}/companion/automation`,

package/src/components/AutomationContainer.tsx

@@ -0,0 +1,31 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import React from 'react';
+
+import { type Space } from '@dxos/react-client/echo';
+import { useTranslation } from '@dxos/react-ui';
+import { ControlSection, ControlPage } from '@dxos/react-ui-form';
+import { StackItem } from '@dxos/react-ui-stack';
+
+import { AutomationPanel } from './AutomationPanel';
+import { AUTOMATION_PLUGIN } from '../meta';
+
+export const AutomationContainer = ({ space }: { space: Space }) => {
+  const { t } = useTranslation(AUTOMATION_PLUGIN);
+  return (
+    <StackItem.Content classNames='block overflow-y-auto'>
+      <ControlPage>
+        <ControlSection
+          title={t('automation verbose label', { ns: AUTOMATION_PLUGIN })}
+          description={t('automation description', { ns: AUTOMATION_PLUGIN })}
+        >
+          <AutomationPanel space={space} />
+        </ControlSection>
+      </ControlPage>
+    </StackItem.Content>
+  );
+};
+
+export default AutomationContainer;

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

@@ -8,7 +8,7 @@ import { type Meta } from '@storybook/react';
 import React from 'react';
 
 import { FunctionType, FunctionTrigger } from '@dxos/functions/types';
-import { create, useSpaces } from '@dxos/react-client/echo';
+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='flex w-[350px] border border-separator overflow-hidden'>
+    <div role='none' className='w-96'>
       <AutomationPanel space={space} />
     </div>
   );
@@ -38,11 +38,11 @@ const meta: Meta = {
       types: [FunctionType, FunctionTrigger],
       onSpaceCreated: ({ space }) => {
         for (const fn of functions) {
-          space.db.add(create(FunctionType, fn));
+          space.db.add(live(FunctionType, fn));
         }
       },
     }),
-    withLayout({ fullscreen: true, tooltips: true, classNames: 'flex justify-center m-2' }),
+    withLayout({ fullscreen: true, tooltips: true, classNames: 'flex juastify-center m-2' }),
     withTheme,
   ],
   parameters: {

package/src/components/AutomationPanel/AutomationPanel.tsx

@@ -14,11 +14,10 @@ import {
   ScriptType,
 } from '@dxos/functions/types';
 import { type Client, useClient } from '@dxos/react-client';
-import { create, Filter, useQuery, type Space, type ReactiveObject, getSpace } from '@dxos/react-client/echo';
+import { live, Filter, useQuery, type Space, type Live, getSpace } from '@dxos/react-client/echo';
 import { Clipboard, IconButton, Input, Separator, useTranslation } from '@dxos/react-ui';
 import { ControlItem, controlItemClasses } from '@dxos/react-ui-form';
 import { List } from '@dxos/react-ui-list';
-import { StackItem } from '@dxos/react-ui-stack';
 import { ghostHover, mx } from '@dxos/react-ui-theme';
 
 import { AUTOMATION_PLUGIN } from '../../meta';
@@ -28,18 +27,20 @@ const grid = 'grid grid-cols-[40px_1fr_32px] min-bs-[2.5rem]';
 
 export type AutomationPanelProps = {
   space: Space;
-  object?: ReactiveObject<any>;
+  object?: Live<any>;
+  initialTrigger?: FunctionTriggerType;
+  onDone?: () => void;
 };
 
 // TODO(burdon): Factor out common layout with ViewEditor.
-export const AutomationPanel = ({ space, object }: 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 [trigger, setTrigger] = useState<FunctionTriggerType>();
+  const [trigger, setTrigger] = useState<FunctionTriggerType | undefined>(initialTrigger);
   const [selected, setSelected] = useState<FunctionTrigger>();
 
   const handleSelect = (trigger: FunctionTrigger) => {
@@ -49,7 +50,7 @@ export const AutomationPanel = ({ space, object }: AutomationPanelProps) => {
   };
 
   const handleAdd = () => {
-    setTrigger(create(FunctionTriggerSchema, {}));
+    setTrigger(live(FunctionTriggerSchema, {}));
     setSelected(undefined);
   };
 
@@ -63,76 +64,74 @@ export const AutomationPanel = ({ space, object }: AutomationPanelProps) => {
     if (selected) {
       Object.assign(selected, trigger);
     } else {
-      space.db.add(create(FunctionTrigger, trigger));
+      space.db.add(live(FunctionTrigger, trigger));
     }
 
     setTrigger(undefined);
     setSelected(undefined);
+    onDone?.();
   };
 
   const handleCancel: TriggerEditorProps['onCancel'] = () => {
     setTrigger(undefined);
+    onDone?.();
   };
 
   return (
-    <Clipboard.Provider>
-      <StackItem.Content classNames='block overflow-y-auto'>
-        <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}>
-                {({ items: triggers }) => (
-                  <div role='list' className='flex flex-col w-full'>
-                    {triggers?.map((trigger) => {
-                      const copyAction = getCopyAction(client, trigger);
-                      return (
-                        <List.Item<FunctionTrigger>
-                          key={trigger.id}
-                          item={trigger}
-                          classNames={mx(grid, ghostHover, 'items-center', 'px-2')}
+    <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}>
+            {({ items: triggers }) => (
+              <div role='list' className='flex flex-col w-full'>
+                {triggers?.map((trigger) => {
+                  const copyAction = getCopyAction(client, trigger);
+                  return (
+                    <List.Item<FunctionTrigger>
+                      key={trigger.id}
+                      item={trigger}
+                      classNames={mx(grid, ghostHover, 'items-center', 'px-2')}
+                    >
+                      <Input.Root>
+                        <Input.Switch
+                          checked={trigger.enabled}
+                          onCheckedChange={(checked) => (trigger.enabled = checked)}
+                        />
+                      </Input.Root>
+
+                      <div className={'flex'}>
+                        <List.ItemTitle
+                          classNames='px-1 cursor-pointer w-0 shrink truncate'
+                          onClick={() => handleSelect(trigger)}
                         >
-                          <Input.Root>
-                            <Input.Switch
-                              checked={trigger.enabled}
-                              onCheckedChange={(checked) => (trigger.enabled = checked)}
-                            />
-                          </Input.Root>
-
-                          <div className={'flex'}>
-                            <List.ItemTitle
-                              classNames='px-1 cursor-pointer w-0 shrink truncate'
-                              onClick={() => handleSelect(trigger)}
-                            >
-                              {getFunctionName(scripts, functions, trigger) ?? '∅'}
-                            </List.ItemTitle>
-
-                            {/* TODO: a better way to expose copy action */}
-                            {copyAction && (
-                              <Clipboard.IconButton
-                                label={t(copyAction.translationKey)}
-                                value={copyAction.contentProvider()}
-                              />
-                            )}
-                          </div>
-
-                          <List.ItemDeleteButton onClick={() => handleDelete(trigger)} />
-                        </List.Item>
-                      );
-                    })}
-                  </div>
-                )}
-              </List.Root>
-              {triggers.length > 0 && <Separator classNames='mlb-4' />}
-              <IconButton icon='ph--plus--regular' label={t('new trigger label')} onClick={handleAdd} />
-            </div>
-          )}
+                          {getFunctionName(scripts, functions, trigger) ?? '∅'}
+                        </List.ItemTitle>
+
+                        {/* TODO: a better way to expose copy action */}
+                        {copyAction && (
+                          <Clipboard.IconButton
+                            label={t(copyAction.translationKey)}
+                            value={copyAction.contentProvider()}
+                          />
+                        )}
+                      </div>
+
+                      <List.ItemDeleteButton onClick={() => handleDelete(trigger)} />
+                    </List.Item>
+                  );
+                })}
+              </div>
+            )}
+          </List.Root>
+          {triggers.length > 0 && <Separator classNames='mlb-4' />}
+          <IconButton icon='ph--plus--regular' label={t('new trigger label')} onClick={handleAdd} />
         </div>
-      </StackItem.Content>
-    </Clipboard.Provider>
+      )}
+    </div>
   );
 };
 

package/src/components/AutomationPanel/index.ts

@@ -4,4 +4,6 @@
 
 import { AutomationPanel } from './AutomationPanel';
 
+export * from './AutomationPanel';
+
 export default AutomationPanel;

package/src/components/FunctionsContainer.tsx

@@ -0,0 +1,31 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import React from 'react';
+
+import { type Space } from '@dxos/react-client/echo';
+import { useTranslation } from '@dxos/react-ui';
+import { ControlPage, ControlSection } from '@dxos/react-ui-form';
+import { StackItem } from '@dxos/react-ui-stack';
+
+import { FunctionsPanel } from './FunctionsPanel';
+import { AUTOMATION_PLUGIN } from '../meta';
+
+export const FunctionsContainer = ({ space }: { space: Space }) => {
+  const { t } = useTranslation(AUTOMATION_PLUGIN);
+  return (
+    <StackItem.Content classNames='block overflow-y-auto'>
+      <ControlPage>
+        <ControlSection
+          title={t('functions verbose label', { ns: AUTOMATION_PLUGIN })}
+          description={t('functions description', { ns: AUTOMATION_PLUGIN })}
+        >
+          <FunctionsPanel space={space} />
+        </ControlSection>
+      </ControlPage>
+    </StackItem.Content>
+  );
+};
+
+export default FunctionsContainer;

package/src/components/FunctionsPanel/FunctionsPanel.tsx

@@ -0,0 +1,95 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+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 { Filter, fullyQualifiedId, useQuery, type Space } from '@dxos/react-client/echo';
+import { Button, useTranslation } from '@dxos/react-ui';
+import { controlItemClasses } from '@dxos/react-ui-form';
+import { List } from '@dxos/react-ui-list';
+import { ghostHover, mx } from '@dxos/react-ui-theme';
+
+import { AUTOMATION_PLUGIN } from '../../meta';
+
+const grid = 'grid grid-cols-[1fr_auto] min-bs-[2.5rem]';
+
+export type FunctionsPanelProps = {
+  space: Space;
+};
+
+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 { dispatchPromise: dispatch } = useIntentDispatcher();
+
+  const functionToScriptMap = useMemo(
+    () =>
+      functions.reduce(
+        (map, func) => {
+          const scriptId = func.source?.target?.id;
+          if (scriptId) {
+            const script = scripts.find((s) => s.id === scriptId);
+            if (script) {
+              map[func.id] = script;
+            }
+          }
+          return map;
+        },
+        {} as Record<string, ScriptType>,
+      ),
+    [functions, scripts],
+  );
+
+  const getScriptName = useCallback(
+    (func: FunctionType) => {
+      const script = functionToScriptMap[func.id];
+      return script?.name;
+    },
+    [functionToScriptMap],
+  );
+
+  const handleGoToScript = useCallback(
+    (func: FunctionType) => {
+      const script = functionToScriptMap[func.id];
+      if (script) {
+        void dispatch(createIntent(LayoutAction.Open, { part: 'main', subject: [fullyQualifiedId(script)] }));
+      }
+    },
+    [functionToScriptMap, dispatch],
+  );
+
+  return (
+    <div role='none' className={mx(controlItemClasses)}>
+      <List.Root<FunctionType> items={functions} isItem={S.is(FunctionType)} getId={(func) => func.id}>
+        {({ items }) => (
+          <div role='list' className='flex flex-col w-full'>
+            {items?.map((func) => (
+              <List.Item<FunctionType>
+                key={func.id}
+                item={func}
+                classNames={mx(grid, ghostHover, 'items-center', 'pli-2', 'min-bs-[3rem]')}
+              >
+                <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>
+                  )}
+                </div>
+                {functionToScriptMap[func.id] && (
+                  <Button onClick={() => handleGoToScript(func)}>{t('go to function source button label')}</Button>
+                )}
+              </List.Item>
+            ))}
+          </div>
+        )}
+      </List.Root>
+
+      {functions.length === 0 && <div className='text-center plb-4 text-gray-500'>{t('no functions found')}</div>}
+    </div>
+  );
+};

package/src/components/FunctionsPanel/index.ts

@@ -0,0 +1,8 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { FunctionsPanel } from './FunctionsPanel';
+
+export * from './FunctionsPanel';
+export default FunctionsPanel;

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

@@ -8,7 +8,7 @@ import { type Meta } from '@storybook/react';
 import React, { useEffect, useState } from 'react';
 
 import { FunctionType, FunctionTrigger, TriggerKind } from '@dxos/functions/types';
-import { create } from '@dxos/live-object';
+import { live } from '@dxos/live-object';
 import { useSpaces } from '@dxos/react-client/echo';
 import { withClientProvider } from '@dxos/react-client/testing';
 import { withLayout, withTheme } from '@dxos/storybook-utils';
@@ -26,7 +26,7 @@ const DefaultStory = () => {
       return;
     }
 
-    const trigger = space.db.add(create(FunctionTrigger, { spec: { type: TriggerKind.Timer, cron: '' } }));
+    const trigger = space.db.add(live(FunctionTrigger, { spec: { type: TriggerKind.Timer, cron: '' } }));
     setTrigger(trigger);
   }, [space]);
 
@@ -52,7 +52,7 @@ const meta: Meta = {
       types: [FunctionType, FunctionTrigger],
       onSpaceCreated: ({ space }) => {
         for (const fn of functions) {
-          space.db.add(create(FunctionType, fn));
+          space.db.add(live(FunctionType, fn));
         }
       },
     }),

package/src/components/index.ts

@@ -6,4 +6,7 @@ import { lazy } from 'react';
 
 export * from './TriggerEditor';
 
+export const AutomationContainer = lazy(() => import('./AutomationContainer'));
 export const AutomationPanel = lazy(() => import('./AutomationPanel'));
+export const FunctionsContainer = lazy(() => import('./FunctionsContainer'));
+export const FunctionsPanel = lazy(() => import('./FunctionsPanel'));

package/src/translations.ts

@@ -11,8 +11,17 @@ export default [
         'plugin name': 'Automation',
         'automation panel label': 'Automations',
         'script automation label': 'Automation',
+        'automation verbose label': 'Manage automations',
+        'automation description': 'You can manage all the triggers which automate your space here.',
 
-        'trigger editor title': 'New Trigger',
+        'functions panel label': 'Functions',
+        'functions verbose label': 'Manage deployed functions',
+        'functions description': 'You can manage all the functions deployed from your space on EDGE here.',
+        'function copy id': 'Copy Function ID',
+        'no functions found': 'No functions found',
+        'go to function source button label': 'Show function source',
+
+        'trigger editor title': 'Configure Trigger',
         'new trigger label': 'Add Trigger',
         'trigger type timer': 'Timer',
         'trigger type webhook': 'Webhook',

package/src/types.ts

@@ -0,0 +1,32 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { S } from '@dxos/echo-schema';
+import { SpaceSchema } from '@dxos/react-client/echo';
+
+import { AUTOMATION_PLUGIN } from './meta';
+
+const TriggerTemplate = S.Union(
+  S.Struct({ type: S.Literal('timer'), cron: S.String }),
+  S.Struct({ type: S.Literal('queue'), queueDXN: S.Any }),
+);
+
+export namespace AutomationAction {
+  const AUTOMATION_ACTION = `${AUTOMATION_PLUGIN}/action`;
+
+  export class CreateTriggerFromTemplate extends S.TaggedClass<CreateTriggerFromTemplate>()(
+    `${AUTOMATION_ACTION}/create-trigger-from-template`,
+    {
+      input: S.Struct({
+        space: SpaceSchema,
+        template: TriggerTemplate,
+        enabled: S.optional(S.Boolean),
+        // TODO(wittjosiah): Improve how this lookup is done.
+        scriptName: S.optional(S.String),
+        payload: S.optional(S.Record({ key: S.String, value: S.Any })),
+      }),
+      output: S.Void,
+    },
+  ) {}
+}