@dxos/plugin-script 0.8.2-staging.7ac8446 → 0.8.3-main.672df60

package/src/hooks/deploy.ts

@@ -2,13 +2,13 @@
 // Copyright 2025 DXOS.org
 //
 
-import { useCallback, useEffect, useMemo } from 'react';
+import { useEffect, useMemo } from 'react';
 
 import { FunctionType, type ScriptType, getUserFunctionUrlInMetadata } from '@dxos/functions';
 import { log } from '@dxos/log';
-import { useClient } from '@dxos/react-client';
-import { Filter, getMeta, getSpace, useQuery } from '@dxos/react-client/echo';
-import { useTranslation } from '@dxos/react-ui';
+import { type Client, useClient } from '@dxos/react-client';
+import { getMeta, getSpace, Query, Ref, type Space, useQuery } from '@dxos/react-client/echo';
+import { type TFunction } from '@dxos/react-ui';
 import { createMenuAction } from '@dxos/react-ui-menu';
 import { errorMessageColors } from '@dxos/react-ui-theme';
 
@@ -24,28 +24,68 @@ export type DeployState = {
   error: string;
 };
 
-export const createDeploy = (state: Partial<DeployState>) => {
-  const errorItem = createMenuAction('error', {
+export type CreateDeployOptions = {
+  state: Partial<DeployState>;
+  script: ScriptType;
+  fn: FunctionType;
+  space?: Space;
+  existingFunctionUrl?: string;
+  client: Client;
+  t: TFunction;
+};
+
+export const createDeploy = ({ state, script, space, fn, client, existingFunctionUrl, t }: CreateDeployOptions) => {
+  // TODO(wittjosiah): Should this be an action?
+  const errorItem = createMenuAction('error', () => {}, {
     label: state.error ?? ['no error label', { ns: SCRIPT_PLUGIN }],
     icon: 'ph--warning-circle--regular',
     hidden: !state.error,
     classNames: state.error && errorMessageColors,
   });
 
-  const deployAction = createMenuAction<DeployActionProperties>('deploy', {
-    type: 'deploy',
-    label: [state.deploying ? 'pending label' : 'deploy label', { ns: SCRIPT_PLUGIN }],
-    icon: state.deploying ? 'ph--spinner-gap--regular' : 'ph--cloud-arrow-up--regular',
-    disabled: state.deploying,
-    classNames: state.deploying ? '[&_svg]:animate-spin' : '',
-  });
-
-  const copyAction = createMenuAction<DeployActionProperties>('copy', {
-    type: 'copy',
-    label: ['copy link label', { ns: SCRIPT_PLUGIN }],
-    icon: 'ph--link--regular',
-    disabled: !state.functionUrl,
-  });
+  const deployAction = createMenuAction<DeployActionProperties>(
+    'deploy',
+    async () => {
+      if (!script.source || !space) {
+        return;
+      }
+
+      state.error = undefined;
+      state.deploying = true;
+
+      const result = await deployScript({ script, client, space, fn, existingFunctionUrl });
+
+      if (!result.success) {
+        log.catch(result.error);
+        state.error = t('upload failed label');
+      }
+
+      state.deploying = false;
+    },
+    {
+      type: 'deploy',
+      label: [state.deploying ? 'pending label' : 'deploy label', { ns: SCRIPT_PLUGIN }],
+      icon: state.deploying ? 'ph--spinner-gap--regular' : 'ph--cloud-arrow-up--regular',
+      disabled: state.deploying,
+      classNames: state.deploying ? '[&_svg]:animate-spin' : '',
+    },
+  );
+
+  const copyAction = createMenuAction<DeployActionProperties>(
+    'copy',
+    async () => {
+      if (!state.functionUrl) {
+        return;
+      }
+      await navigator.clipboard.writeText(state.functionUrl);
+    },
+    {
+      type: 'copy',
+      label: ['copy link label', { ns: SCRIPT_PLUGIN }],
+      icon: 'ph--link--regular',
+      disabled: !state.functionUrl,
+    },
+  );
 
   return {
     nodes: [errorItem, deployAction, copyAction],
@@ -78,42 +118,8 @@ export const useDeployState = ({ state, script }: { state: Partial<DeployState>;
 
 export const useDeployDeps = ({ script }: { script: ScriptType }) => {
   const space = getSpace(script);
-  const [fn] = useQuery(space, Filter.schema(FunctionType, { source: script }));
+  const [fn] = useQuery(space, Query.type(FunctionType, { source: Ref.make(script) }));
   const client = useClient();
   const existingFunctionUrl = useMemo(() => fn && getUserFunctionUrlInMetadata(getMeta(fn)), [fn]);
   return { space, fn, client, existingFunctionUrl };
 };
-
-/**
- * Manage EDGE function deployment.
- */
-export const useDeployHandler = ({ state, script }: { state: Partial<DeployState>; script: ScriptType }) => {
-  const { space, fn, client, existingFunctionUrl } = useDeployDeps({ script });
-  const { t } = useTranslation(SCRIPT_PLUGIN);
-
-  return useCallback(async () => {
-    if (!script.source || !space) {
-      return;
-    }
-
-    state.error = undefined;
-    state.deploying = true;
-
-    const result = await deployScript({ script, client, space, fn, existingFunctionUrl });
-
-    if (!result.success) {
-      log.catch(result.error);
-      state.error = t('upload failed label');
-    }
-
-    state.deploying = false;
-  }, [fn, client, t, existingFunctionUrl, script, space]);
-};
-
-export const useCopyHandler = ({ state }: { state: Partial<DeployState> }) =>
-  useCallback(async () => {
-    if (!state.functionUrl) {
-      return;
-    }
-    await navigator.clipboard.writeText(state.functionUrl);
-  }, [state.functionUrl]);

package/src/hooks/format.ts

@@ -5,9 +5,8 @@
 import { format } from 'prettier';
 import prettierPluginEstree from 'prettier/plugins/estree';
 import prettierPluginTypescript from 'prettier/plugins/typescript';
-import { useCallback } from 'react';
 
-import { type ScriptType } from '@dxos/functions/types';
+import { type ScriptType } from '@dxos/functions';
 import { log } from '@dxos/log';
 import { createMenuAction } from '@dxos/react-ui-menu';
 
@@ -15,33 +14,34 @@ import { SCRIPT_PLUGIN } from '../meta';
 
 export type FormatActionProperties = { type: 'format' };
 
-export const createFormat = () => {
-  const formatAction = createMenuAction('format', {
-    label: ['format label', { ns: SCRIPT_PLUGIN }],
-    icon: 'ph--magic-wand--regular',
-  });
+export const createFormat = (script: ScriptType) => {
+  const formatAction = createMenuAction(
+    'format',
+    async () => {
+      if (!script.source) {
+        return;
+      }
+
+      try {
+        script.source.target!.content = await format(script.source.target!.content, {
+          parser: 'typescript',
+          plugins: [prettierPluginEstree, prettierPluginTypescript],
+          semi: true,
+          singleQuote: true,
+        });
+      } catch (err: any) {
+        // TODO(wittjosiah): Show error in UI.
+        log.catch(err);
+      }
+    },
+    {
+      label: ['format label', { ns: SCRIPT_PLUGIN }],
+      icon: 'ph--magic-wand--regular',
+    },
+  );
 
   return {
     nodes: [formatAction],
     edges: [{ source: 'root', target: 'format' }],
   };
 };
-
-export const useFormatHandler = ({ script }: { script: ScriptType }) =>
-  useCallback(async () => {
-    if (!script.source) {
-      return;
-    }
-
-    try {
-      script.source.target!.content = await format(script.source.target!.content, {
-        parser: 'typescript',
-        plugins: [prettierPluginEstree, prettierPluginTypescript],
-        semi: true,
-        singleQuote: true,
-      });
-    } catch (err: any) {
-      // TODO(wittjosiah): Show error in UI.
-      log.catch(err);
-    }
-  }, [script.source]);

package/src/hooks/index.ts

@@ -7,5 +7,4 @@ export * from './format';
 export * from './template';
 
 export * from './useCreateAndDeployScriptTemplates';
-export * from './useToolbarAction';
 export * from './useToolbarState';

package/src/hooks/template.ts

@@ -2,9 +2,7 @@
 // Copyright 2025 DXOS.org
 //
 
-import { useCallback } from 'react';
-
-import { FUNCTIONS_PRESET_META_KEY, type ScriptType } from '@dxos/functions/types';
+import { FUNCTIONS_PRESET_META_KEY, type ScriptType } from '@dxos/functions';
 import { getMeta } from '@dxos/live-object';
 import { createMenuItemGroup, createMenuAction } from '@dxos/react-ui-menu';
 
@@ -20,19 +18,34 @@ const createTemplateSelectGroup = () => {
   });
 };
 
-const createTemplateSelectActions = () => {
+const createTemplateSelectActions = (script: ScriptType) => {
   return templates.map((template) => {
-    return createMenuAction<TemplateActionProperties>(`template--${template.id}`, {
-      label: template.name,
-      value: template.id,
-      type: 'template',
-    });
+    return createMenuAction<TemplateActionProperties>(
+      `template--${template.id}`,
+      () => {
+        script.name = template.name;
+        script.source!.target!.content = template.source;
+        const metaKeys = getMeta(script).keys;
+        const oldPresetIndex = metaKeys.findIndex((key) => key.source === FUNCTIONS_PRESET_META_KEY);
+        if (oldPresetIndex >= 0) {
+          metaKeys.splice(oldPresetIndex, 1);
+        }
+        if (template.presetId) {
+          metaKeys.push({ source: FUNCTIONS_PRESET_META_KEY, id: template.presetId });
+        }
+      },
+      {
+        label: template.name,
+        value: template.id,
+        type: 'template',
+      },
+    );
   });
 };
 
-export const createTemplateSelect = () => {
+export const createTemplateSelect = (script: ScriptType) => {
   const templateSelectGroup = createTemplateSelectGroup();
-  const templateSelectActions = createTemplateSelectActions();
+  const templateSelectActions = createTemplateSelectActions(script);
   return {
     nodes: [templateSelectGroup, ...templateSelectActions],
     edges: [
@@ -41,24 +54,3 @@ export const createTemplateSelect = () => {
     ],
   };
 };
-
-export const useTemplateSelectHandler = ({ script }: { script: ScriptType }) => {
-  return useCallback(
-    (templateId: string) => {
-      const template = templates.find((template) => template.id === templateId);
-      if (template) {
-        script.name = template.name;
-        script.source!.target!.content = template.source;
-        const metaKeys = getMeta(script).keys;
-        const oldPresetIndex = metaKeys.findIndex((key) => key.source === FUNCTIONS_PRESET_META_KEY);
-        if (oldPresetIndex >= 0) {
-          metaKeys.splice(oldPresetIndex, 1);
-        }
-        if (template.presetId) {
-          metaKeys.push({ source: FUNCTIONS_PRESET_META_KEY, id: template.presetId });
-        }
-      }
-    },
-    [script],
-  );
-};

package/src/hooks/useToolbarState.ts

@@ -4,7 +4,7 @@
 
 import { useMemo } from 'react';
 
-import { create } from '@dxos/live-object';
+import { live } from '@dxos/live-object';
 
 import { type DeployState } from './deploy';
 
@@ -12,5 +12,5 @@ export type ScriptToolbarState = Partial<DeployState>;
 
 // TODO(burdon): Replace with context provider?
 export const useToolbarState = (initialState: ScriptToolbarState = {}) => {
-  return useMemo(() => create<ScriptToolbarState>(initialState), []);
+  return useMemo(() => live<ScriptToolbarState>(initialState), []);
 };

package/src/meta.ts

@@ -12,12 +12,13 @@ export const meta: PluginMeta = {
   description:
     'Scripts in Composer allow you to deploy custom functions that run on the edge. These functions can be referenced by your AI agent and called inside of cells in any Sheet. Use scripts to interact with API’s or external data inside of Composer.',
   icon: 'ph--code--regular',
-  source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/experimental/plugin-explorer',
-  tags: ['experimental'],
+  source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-explorer',
+  tags: ['labs'],
   screenshots: ['https://dxos.network/plugin-details-scripts-dark.png'],
 };
 
 // TODO(ZaymonFC): Configure by scopes?
 export const defaultScriptsForIntegration: Record<string, string[]> = {
+  // TODO(wittjosiah): Also include content extraction scripts in the default set.
   'gmail.com': ['dxos.org/script/gmail'],
 };

package/src/templates/chat.ts

@@ -3,21 +3,15 @@
 //
 
 // @ts-ignore
-import { transformServerSentEvents } from 'https://esm.sh/@dxos/script-toolbox';
+import { transformServerSentEvents } from 'https://esm.sh/@dxos/script-toolbox?bundle=false';
 
 /**
  * Chatbot that answers questions based on the context data.
  */
-export default async ({
-  event: {
-    data: { request },
-  },
-  context: { space, ai },
-}: any) => {
-  const textBody = await request.text();
+export default async ({ data: { bodyText }, context: { space, ai } }: any) => {
   let parsedRequest: any;
   try {
-    parsedRequest = JSON.parse(textBody);
+    parsedRequest = JSON.parse(bodyText);
   } catch (err) {
     const answer = await ai.run('@cf/meta/llama-3.1-8b-instruct', {
       stream: true,
@@ -29,7 +23,7 @@ export default async ({
      ${await getContext({ space })}
 
      QUESTION:
-     ${textBody}
+     ${bodyText}
     `,
     });
     return new Response(transformServerSentEvents(answer));

package/src/templates/chess.ts

@@ -5,7 +5,7 @@
 // @ts-ignore
 import { defineFunction, S } from 'dxos:functions';
 // @ts-ignore
-import { Chess } from 'https://esm.sh/chess.js@0.13.1';
+import { Chess } from 'https://esm.sh/chess.js@0.13.1?bundle=false';
 
 export default defineFunction({
   description: 'Plays a random move in a chess game.',
@@ -25,12 +25,7 @@ export default defineFunction({
     }),
   }),
 
-  handler: async ({
-    event: {
-      data: { changedObjectId, player = 'b' },
-    },
-    context: { space },
-  }: any) => {
+  handler: async ({ data: { changedObjectId, player = 'b' }, context: { space } }: any) => {
     const { pgn } = await space.db.query({ id: changedObjectId }).first();
     const game = new Chess();
     game.load_pgn(pgn);

package/src/templates/data-generator.ts

@@ -2,35 +2,10 @@
 // Copyright 2025 DXOS.org
 //
 
-import {
-  EchoObject,
-  defineFunction,
-  S,
-  createStatic,
-  Expando,
-  TypedObject,
-  Ref,
-  LabelAnnotationId,
-  // @ts-ignore
-} from 'dxos:functions';
 // @ts-ignore
-import { randParagraph } from 'https://esm.sh/@ngneat/falso@7.1.1';
-
-export class TextType extends TypedObject({ typename: 'dxos.org/type/Text', version: '0.1.0' })({
-  content: S.String,
-}) {}
-
-export const DocumentSchema = S.Struct({
-  name: S.optional(S.String),
-  fallbackName: S.optional(S.String),
-  content: Ref(TextType),
-  threads: S.mutable(S.Array(Ref(Expando))),
-}).annotations({
-  [LabelAnnotationId]: ['name', 'fallbackName'],
-});
-
-export const DocumentType = DocumentSchema.pipe(EchoObject('dxos.org/type/Document', '0.1.0'));
-export type DocumentType = S.Schema.Type<typeof DocumentType>;
+import { defineFunction, S, create, Expando } from 'dxos:functions';
+// @ts-ignore
+import { randText } from 'https://esm.sh/@ngneat/falso@7.1.1?bundle=false';
 
 export default defineFunction({
   inputSchema: S.Struct({
@@ -41,33 +16,33 @@ export default defineFunction({
 
   outputSchema: S.Struct({}),
 
-  handler: async ({ event: { documentAmount = 10, textSize = 10, mutationAmount = 0 }, context: { space } }: any) => {
+  handler: async ({ data: { documentAmount = 1, textSize = 10, mutationAmount = 0 }, context: { space } }: any) => {
     await space.db.graph.schemaRegistry.addSchema([Expando]);
+    const result: Record<string, any> = {};
+    const objects: Expando[] = [];
 
-    const objects = [];
-    // const rootCollection = await space.properties[COLLECTION_TYPENAME]?.load();
+    // Create objects.
     for (let i = 0; i < documentAmount; i++) {
       const obj = space.db.add(
-        createStatic(Expando, {
+        create(Expando, {
           name: 'scriptGenerated',
-          content: randParagraph({ length: textSize }),
+          content: randText({ charCount: textSize }),
         }),
       );
-      // rootCollection.objects.push(obj);
       objects.push(obj);
+      const objectResult: any = {};
+      // Mutate the object.
+      for (let i = 0; i < mutationAmount; i++) {
+        obj.content = randText({ charCount: textSize });
+      }
+      objectResult.mutations = mutationAmount;
+      objectResult.contentLength = obj.content.length;
+      result[obj.id] = objectResult;
     }
 
-    for (let i = 0; i < mutationAmount; i++) {
-      const obj = objects[Math.floor(Math.random() * objects.length)];
-      obj.content = randParagraph({ length: textSize });
-    }
-
+    // Flush and wait for data to propagate.
     await space.db.flush();
-    // TODO(mykola): This seems to halp with propagating data to space.
-    for (const obj of objects) {
-      await space.db.query({ id: obj.id }).first();
-      console.log('obj', obj.id);
-    }
-    return 'OK';
+    await new Promise((resolve) => setTimeout(resolve, 10_000));
+    return result;
   },
 });

package/src/templates/discord.ts

@@ -3,23 +3,30 @@
 //
 
 // @ts-ignore
-import { createStatic, EchoObject, defineFunction, DXN, Filter, ObjectId, S } from 'dxos:functions';
+import { create, defineFunction, DXN, EchoObject, Filter, ObjectId, S } from 'dxos:functions';
+// @ts-ignore
+import { FetchHttpClient } from 'https://esm.sh/@effect/platform@0.77.2?deps=effect@3.14.21&bundle=false';
 import {
-  FetchHttpClient,
+  DiscordConfig,
+  DiscordREST,
+  DiscordRESTMemoryLive,
   // @ts-ignore
-} from 'https://esm.sh/@effect/platform@0.77.2?deps=effect@3.13.3';
-// @ts-ignore
-import { DiscordConfig, DiscordREST, DiscordRESTMemoryLive } from 'https://esm.sh/dfx@0.113.0?deps=effect@3.13.3';
+} from 'https://esm.sh/dfx@0.113.0?deps=effect@3.14.21&bundle=false';
 // @ts-ignore
-import { Effect, Config, Redacted, Ref } from 'https://esm.sh/effect@3.13.3';
+import { Effect, Config, Redacted, Ref } from 'https://esm.sh/effect@3.14.21?bundle=false';
 
 const MessageSchema = S.Struct({
-  id: S.String,
+  id: ObjectId,
   foreignId: S.Any, // bigint?
   from: S.String,
   created: S.String,
   content: S.String,
-}).pipe(EchoObject({ typename: 'example.com/type/Message', version: '0.1.0' }));
+}).pipe(
+  EchoObject({
+    typename: 'example.com/type/Message',
+    version: '0.1.0',
+  }),
+);
 
 const DEFAULT_AFTER = 1704067200; // 2024-01-01
 
@@ -42,12 +49,7 @@ export default defineFunction({
     newMessages: S.Number,
   }),
 
-  handler: ({
-    event: {
-      data: { channelId, queueId, after = DEFAULT_AFTER, pageSize = 5 },
-    },
-    context: { space },
-  }: any) =>
+  handler: ({ data: { channelId, queueId, after = DEFAULT_AFTER, pageSize = 5 }, context: { space } }: any) =>
     Effect.gen(function* () {
       const { token } = yield* Effect.tryPromise({
         try: () => space.db.query(Filter.typename('dxos.org/type/AccessToken', { source: 'discord.com' })).first(),
@@ -73,7 +75,7 @@ export default defineFunction({
           const messages = yield* rest.getChannelMessages(channelId, options).pipe((res: any) => res.json);
           const queueMessages = messages
             .map((message: any) =>
-              createStatic(MessageSchema, {
+              create(MessageSchema, {
                 id: ObjectId.random(),
                 foreignId: message.id,
                 from: message.author.username,

package/src/templates/echo.ts

@@ -5,15 +5,4 @@
 /**
  * Echos the request data.
  */
-export default async ({
-  event: {
-    data: { request },
-  },
-}: any) => {
-  const data = await request.json();
-  return new Response(JSON.stringify(data ?? {}), {
-    headers: {
-      'Content-Type': 'application/json',
-    },
-  });
-};
+export default async ({ data }: any) => data;

package/src/templates/email.ts

@@ -6,15 +6,9 @@
  * Appends a message to the end of a Document configured through a trigger.
  * Trigger must have a targetDocumentId field set in Meta.
  */
-export default async ({
-  event: {
-    data: { request },
-  },
-  context: { space },
-}: any) => {
-  const { data, trigger } = (await request.json()) as RequestPayload;
+export default async ({ data: { bodyText }, context: { space } }: any) => {
+  const { email, targetDocumentId: documentId } = JSON.parse(bodyText) as RequestPayload;
 
-  const documentId = trigger.meta.targetDocumentId;
   const document = await space.db.query({ id: documentId }, { format: 'plain' }).first();
 
   const contentId = document.content['/'].split(':')[3];
@@ -23,11 +17,11 @@ export default async ({
     documentContent.content,
     '',
     '---',
-    `**From:** ${data.from}`,
-    `**Subject:** ${data.subject}`,
-    `**Date:** ${data.created}`,
+    `**From:** ${email.from}`,
+    `**Subject:** ${email.subject}`,
+    `**Date:** ${email.created}`,
     '',
-    data.body,
+    email.body,
   ].join('\n');
 
   await space.db.update({ id: contentId }, { content: modifiedContent });
@@ -36,6 +30,6 @@ export default async ({
 };
 
 type RequestPayload = {
-  data: { from: string; subject: string; created: string; body: string };
-  trigger: { meta: { targetDocumentId: string } };
+  email: { from: string; subject: string; created: string; body: string };
+  targetDocumentId: string;
 };

package/src/templates/forex-effect.ts

@@ -3,15 +3,15 @@
 //
 
 // @ts-ignore
-import { defineFunction, S } from 'dxos:functions';
+import { S, defineFunction } from 'dxos:functions';
 import {
   HttpClient,
   HttpClientRequest,
   FetchHttpClient,
   // @ts-ignore
-} from 'https://esm.sh/@effect/platform@0.77.2?deps=effect@3.13.3';
+} from 'https://esm.sh/@effect/platform@0.77.2?deps=effect@3.14.21&bundle=false';
 // @ts-ignore
-import { Effect, Schedule } from 'https://esm.sh/effect@3.13.3';
+import { Effect, Schedule } from 'https://esm.sh/effect@3.14.21?bundle=false';
 
 export default defineFunction({
   description: 'Returns the exchange rate between two currencies.',
@@ -23,11 +23,7 @@ export default defineFunction({
 
   outputSchema: S.String.annotations({ description: 'The exchange rate between the two currencies' }),
 
-  handler: async ({
-    event: {
-      data: { from, to },
-    },
-  }: any) =>
+  handler: async ({ data: { from, to } }: any) =>
     Effect.gen(function* () {
       const res = yield* HttpClientRequest.get(`https://free.ratesdb.com/v1/rates?from=${from}&to=${to}`).pipe(
         HttpClient.execute,

package/src/templates/forex.ts

@@ -13,11 +13,7 @@ export default defineFunction({
     to: S.String.annotations({ description: 'The target currency' }),
   }),
 
-  handler: async ({
-    event: {
-      data: { from, to },
-    },
-  }: any) => {
+  handler: async ({ data: { from, to } }: any) => {
     const res = await fetch(`https://free.ratesdb.com/v1/rates?from=${from}&to=${to}`);
     const {
       data: { rates },