@dxos/plugin-automation 0.7.5-main.9d2a38b → 0.7.5-main.e94eead

package/src/capabilities/react-surface.tsx

@@ -7,16 +7,11 @@ import React from 'react';
 import { Capabilities, contributes, createSurface } from '@dxos/app-framework';
 import { getSpace, isEchoObject, type ReactiveEchoObject } from '@dxos/react-client/echo';
 
-import { AssistantPanel, AutomationPanel } from '../components';
+import { AutomationPanel } from '../components';
 import { AUTOMATION_PLUGIN } from '../meta';
 
 export default () =>
   contributes(Capabilities.ReactSurface, [
-    createSurface({
-      id: `${AUTOMATION_PLUGIN}/assistant`,
-      role: 'complementary--assistant',
-      component: ({ data }) => <AssistantPanel subject={data.subject} />,
-    }),
     createSurface({
       id: `${AUTOMATION_PLUGIN}/automation`,
       role: 'complementary--automation',

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

@@ -15,7 +15,6 @@ import { withLayout, withTheme } from '@dxos/storybook-utils';
 import { AutomationPanel } from './AutomationPanel';
 import { functions } from '../../testing';
 import translations from '../../translations';
-import { ChainPromptType } from '../../types';
 
 const DefaultStory = () => {
   const spaces = useSpaces();
@@ -36,7 +35,7 @@ const meta: Meta = {
     withClientProvider({
       createIdentity: true,
       createSpace: true,
-      types: [FunctionType, FunctionTrigger, ChainPromptType],
+      types: [FunctionType, FunctionTrigger],
       onSpaceCreated: ({ space }) => {
         for (const fn of functions) {
           space.db.add(create(FunctionType, fn));

package/src/components/AutomationPanel/AutomationPanel.tsx

@@ -15,7 +15,7 @@ import {
 } from '@dxos/functions';
 import { type Client, useClient } from '@dxos/react-client';
 import { create, Filter, useQuery, type Space, type ReactiveObject, getSpace } from '@dxos/react-client/echo';
-import { IconButton, Input, useTranslation, Button } from '@dxos/react-ui';
+import { Clipboard, IconButton, Input, useTranslation } from '@dxos/react-ui';
 import { List } from '@dxos/react-ui-list';
 import { ghostHover, mx } from '@dxos/react-ui-theme';
 
@@ -73,57 +73,62 @@ export const AutomationPanel = ({ space, object }: AutomationPanelProps) => {
   };
 
   return (
-    <div className='flex flex-col w-full divide-y divide-separator overflow-y-auto'>
-      <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)}
+    <Clipboard.Provider>
+      <div className='flex flex-col w-full'>
+        {!trigger && (
+          <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')}
                     >
-                      {getFunctionName(scripts, functions, trigger) ?? '∅'}
-                    </List.ItemTitle>
-
-                    {/* TODO: a better way to expose copy action */}
-                    {copyAction && (
-                      <Button onClick={() => navigator.clipboard.writeText(copyAction.contentProvider())}>
-                        {t(copyAction.translationKey)}
-                      </Button>
-                    )}
-                  </div>
-
-                  <List.ItemDeleteButton onClick={() => handleDelete(trigger)} />
-                </List.Item>
-              );
-            })}
-          </div>
+                      <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>
         )}
-      </List.Root>
 
-      {trigger && <TriggerEditor space={space} trigger={trigger} onSave={handleSave} onCancel={handleCancel} />}
+        {trigger && <TriggerEditor space={space} trigger={trigger} onSave={handleSave} onCancel={handleCancel} />}
 
-      {!trigger && (
-        <div className='flex p-2 justify-center'>
-          <IconButton icon='ph--plus--regular' label={t('new trigger')} onClick={handleAdd} />
-        </div>
-      )}
-    </div>
+        {!trigger && (
+          <div className='flex p-2 justify-center'>
+            <IconButton icon='ph--plus--regular' label={t('new trigger label')} onClick={handleAdd} />
+          </div>
+        )}
+      </div>
+    </Clipboard.Provider>
   );
 };
 
@@ -148,8 +153,10 @@ 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) => fn.name === trigger.function);
+  const functionObject = functions.find((fn) => `dxn:worker:${fn.name}` === trigger.function);
   if (!functionObject) {
     return shortId;
   }

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

@@ -16,7 +16,6 @@ import { withLayout, withTheme } from '@dxos/storybook-utils';
 import { TriggerEditor } from './TriggerEditor';
 import { functions } from '../../testing';
 import translations from '../../translations';
-import { ChainPromptType } from '../../types';
 
 const DefaultStory = () => {
   const spaces = useSpaces();
@@ -50,7 +49,7 @@ const meta: Meta = {
     withClientProvider({
       createIdentity: true,
       createSpace: true,
-      types: [FunctionType, FunctionTrigger, ChainPromptType],
+      types: [FunctionType, FunctionTrigger],
       onSpaceCreated: ({ space }) => {
         for (const fn of functions) {
           space.db.add(create(FunctionType, fn));

package/src/components/TriggerEditor/TriggerEditor.tsx

@@ -2,8 +2,9 @@
 // Copyright 2024 DXOS.org
 //
 
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 
+import { ComputeGraph } from '@dxos/conductor';
 import {
   FunctionType,
   FunctionTriggerSchema,
@@ -29,6 +30,7 @@ export const TriggerEditor = ({ space, trigger, onSave, onCancel }: TriggerEdito
   const { t } = useTranslation(AUTOMATION_PLUGIN);
 
   const functions = useQuery(space, Filter.schema(FunctionType));
+  const workflows = useQuery(space, Filter.schema(ComputeGraph));
   const scripts = useQuery(space, Filter.schema(ScriptType));
 
   const handleSave = (values: FunctionTriggerType) => {
@@ -43,16 +45,13 @@ export const TriggerEditor = ({ space, trigger, onSave, onCancel }: TriggerEdito
       onCancel={onCancel}
       Custom={{
         ['function' satisfies keyof FunctionTriggerType]: (props) => (
-          <SelectInput<FunctionTriggerType>
+          <SelectInput
             {...props}
-            options={functions.map((fn) => ({
-              value: fn.name,
-              label: getFunctionName(scripts, fn),
-            }))}
+            options={getWorkflowOptions(workflows).concat(getFunctionOptions(scripts, functions))}
           />
         ),
         ['spec.type' as const]: (props) => (
-          <SelectInput<FunctionTriggerType>
+          <SelectInput
             {...props}
             options={Object.values(TriggerKind).map((kind) => ({
               value: kind,
@@ -61,12 +60,10 @@ export const TriggerEditor = ({ space, trigger, onSave, onCancel }: TriggerEdito
           />
         ),
         ['meta' as const]: (props) => {
-          const meta = props.getValue('meta')!;
-
+          const meta = props.getValue()!;
+          useEffect(() => props.onValueChange('object', { ...meta }), []);
           const [newMetaFieldName, setNewMetaFieldName] = useState('');
 
-          React.useEffect(() => props.onValueChange('meta', 'object', { ...meta }), []);
-
           return (
             <>
               <div>{props.label}</div>
@@ -75,7 +72,12 @@ export const TriggerEditor = ({ space, trigger, onSave, onCancel }: TriggerEdito
                 return (
                   <div key={compositeKey} role='none' className='flex items-center mt-2 gap-1'>
                     <div role='none' className='flex-1'>
-                      <TextInput {...props} property={compositeKey} type={'string'} label={key} />
+                      <TextInput
+                        {...props}
+                        getValue={() => (props.getValue() as any)[key]}
+                        type={'string'}
+                        label={key}
+                      />
                     </div>
                     <IconButton
                       icon='ph--trash--regular'
@@ -83,9 +85,9 @@ export const TriggerEditor = ({ space, trigger, onSave, onCancel }: TriggerEdito
                       classNames={'mt-6'}
                       label={t('trigger meta remove')}
                       onClick={() => {
-                        const newValues: any = { ...props.getValue('meta') };
+                        const newValues: any = { ...props.getValue() };
                         delete newValues[key];
-                        props.onValueChange('meta', 'object', newValues);
+                        props.onValueChange('object', newValues);
                       }}
                     />
                   </div>
@@ -107,10 +109,10 @@ export const TriggerEditor = ({ space, trigger, onSave, onCancel }: TriggerEdito
                   label={t('trigger meta add')}
                   onClick={() => {
                     if (newMetaFieldName.length) {
-                      const meta = props.getValue('meta') ?? {};
+                      const meta = props.getValue() ?? {};
                       const metaWithNewProp = { ...meta, [newMetaFieldName]: '' };
                       setNewMetaFieldName('');
-                      props.onValueChange('meta', 'object', metaWithNewProp);
+                      props.onValueChange('object', metaWithNewProp);
                     }
                   }}
                 />
@@ -123,6 +125,11 @@ export const TriggerEditor = ({ space, trigger, onSave, onCancel }: TriggerEdito
   );
 };
 
-const getFunctionName = (scripts: ScriptType[], fn: FunctionType) => {
-  return scripts.find((s) => fn.source?.target?.id === s.id)?.name ?? fn.name;
+const getWorkflowOptions = (graphs: ComputeGraph[]) => {
+  return graphs.map((graph) => ({ label: `compute-${graph.id}`, value: `dxn:echo:@:${graph.id}` }));
+};
+
+const getFunctionOptions = (scripts: ScriptType[], functions: FunctionType[]) => {
+  const getLabel = (fn: FunctionType) => scripts.find((s) => fn.source?.target?.id === s.id)?.name ?? fn.name;
+  return functions.map((fn) => ({ label: getLabel(fn), value: `dxn:worker:${fn.name}` }));
 };

package/src/components/index.ts

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

package/src/index.ts

@@ -2,8 +2,7 @@
 // Copyright 2023 DXOS.org
 //
 
-export * from './AutomationPlugin';
 export * from './components';
 export * from './meta';
-export * from './presets';
-export * from './types';
+
+export * from './AutomationPlugin';

package/src/meta.ts

@@ -9,8 +9,8 @@ export const AUTOMATION_PLUGIN = 'dxos.org/plugin/automation';
 export const meta = {
   id: AUTOMATION_PLUGIN,
   name: 'Automation',
-  description: 'Automation workflows.',
-  icon: 'ph--magic-wand--regular',
+  description:
+    'The Automation tab allows you to trigger pre-defined workflows related to the element you are interacting with inside of Composer.',
+  icon: 'ph--robot--regular',
   source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/experimental/plugin-automation',
-  tags: ['experimental'],
 } satisfies PluginMeta;

package/src/testing/index.ts

@@ -2,4 +2,4 @@
 // Copyright 2024 DXOS.org
 //
 
-export * from './testing';
+export * from './test-functions';

package/src/testing/{testing.ts → test-functions.ts}

@@ -7,7 +7,7 @@ import { AST, S, toJsonSchema } from '@dxos/echo-schema';
 export const functions = [
   {
     name: 'example.com/function/chess',
-    version: '0.0.1',
+    version: '0.1.0',
     inputSchema: toJsonSchema(
       S.Struct({
         level: S.Number.annotations({
@@ -18,7 +18,7 @@ export const functions = [
   },
   {
     name: 'example.com/function/forex',
-    version: '0.0.1',
+    version: '0.1.0',
     binding: 'FOREX',
     inputSchema: toJsonSchema(
       S.Struct({

package/src/translations.ts

@@ -9,33 +9,15 @@ export default [
     'en-US': {
       [AUTOMATION_PLUGIN]: {
         'plugin name': 'Automation',
-        'object placeholder': 'New prompt',
-        'create object label': 'Create prompt',
-        'create trigger label': 'Create trigger',
-        'create stack section label': 'Create prompt',
-        'command placeholder': 'Enter slash command...',
-        'template placeholder': 'Enter template...',
-        'value placeholder': 'Enter value...',
-        'select preset template placeholder': 'Select preset',
-        'open automation panel label': 'Show Automations',
         'automation panel label': 'Automations',
 
-        'function select label': 'Function',
-        'function select placeholder': 'Select function',
-        'function enabled': 'Enabled',
-        'trigger select label': 'Trigger',
-        'trigger select placeholder': 'Trigger type',
-
+        'new trigger label': 'New Trigger',
         'trigger type timer': 'Timer',
         'trigger type webhook': 'Webhook',
         'trigger type websocket': 'Websocket',
         'trigger type subscription': 'Subscription',
         'trigger type email': 'Email',
-
-        'trigger filter': 'Filter',
-        'trigger cron': 'Cron',
-        'trigger method': 'Method',
-        'trigger endpoint': 'Endpoint',
+        'trigger type queue': 'Queue',
 
         'trigger copy url': 'Copy URL',
         'trigger copy email': 'Copy Email',
@@ -43,9 +25,6 @@ export default [
         'trigger meta add': 'Add',
         'trigger meta remove': 'Remove',
         'trigger meta prop name placeholder': 'New meta property name',
-
-        'open assistant panel label': 'Show Assistant',
-        'assistant panel label': 'Assistant',
       },
     },
   },