@dxos/plugin-script 0.7.5-main.ff8607b → 0.7.5-staging.b81e783

package/src/components/DebugPanel/DebugPanel.tsx

@@ -7,7 +7,7 @@ import React, { forwardRef, useEffect, useRef, useState } from 'react';
 import { log } from '@dxos/log';
 import { Avatar, Icon, Input, type ThemedClassName, Toolbar, useTranslation } from '@dxos/react-ui';
 import { SyntaxHighlighter } from '@dxos/react-ui-syntax-highlighter';
-import { mx } from '@dxos/react-ui-theme';
+import { errorText, mx } from '@dxos/react-ui-theme';
 
 import { SCRIPT_PLUGIN } from '../../meta';
 
@@ -232,7 +232,7 @@ const MessageItem = ({ classNames, message }: ThemedClassName<{ message: Message
   const wrapper = 'p-1 px-2 rounded-lg bg-hoverSurface overflow-auto';
   return (
     <div className={mx('flex', type === 'request' ? 'ml-[1rem] justify-end' : 'mr-[1rem]', classNames)}>
-      {error && <div className={mx(wrapper, 'whitespace-pre text-error')}>{String(error)}</div>}
+      {error && <div className={mx(wrapper, 'whitespace-pre', errorText)}>{String(error)}</div>}
 
       {text !== undefined && (
         <div className={mx(wrapper, type === 'request' && 'bg-primary-400 dark:bg-primary-600')}>

package/src/components/FrameContainer/FrameContainer.tsx

@@ -5,17 +5,17 @@
 import React, { useEffect, useRef } from 'react';
 
 import { clientServiceBundle } from '@dxos/client-protocol';
+import { type BundleResult } from '@dxos/functions/bundler';
+import { invariant } from '@dxos/invariant';
 import { log } from '@dxos/log';
 import { useClient } from '@dxos/react-client';
 import { baseSurface, mx } from '@dxos/react-ui-theme';
 import { createProtoRpcPeer } from '@dxos/rpc';
 import { createIFramePort } from '@dxos/rpc-tunnel';
 
-import { type BundlerResult } from '../../bundler';
-
 export type FrameContainerProps = {
   containerUrl: string;
-  result: BundlerResult;
+  result: BundleResult;
   debug?: boolean;
 };
 
@@ -46,6 +46,7 @@ export const FrameContainer = ({ containerUrl, result, debug = true }: FrameCont
   }, [iframeRef]);
 
   // Encodes compiled code via URL.
+  invariant(result.sourceHash, 'Source hash is required.');
   const sourceHash = Buffer.from(result.sourceHash).toString('hex');
   const src = result.bundle && `${containerUrl}?ts=${sourceHash}#code=${encodeURIComponent(result.bundle)}`;
 
@@ -58,7 +59,7 @@ export const FrameContainer = ({ containerUrl, result, debug = true }: FrameCont
           <div
             className={mx(
               baseSurface,
-              'flex absolute right-2 bottom-2 w-[400px] h-[200px] ring rounded',
+              'flex absolute right-2 bottom-2 w-[30rem] h-[200px] ring rounded',
               'z-20 overflow-x-hidden overflow-y-auto',
             )}
           >

package/src/components/ScriptContainer.tsx

@@ -14,19 +14,24 @@ import { mx } from '@dxos/react-ui-theme';
 
 import { DebugPanel } from './DebugPanel';
 import { ScriptToolbar } from './ScriptToolbar';
-import { useDeployState } from './ScriptToolbar/deploy';
-import { useToolbarState } from './ScriptToolbar/useToolbarState';
 import { TypescriptEditor, type TypescriptEditorProps } from './TypescriptEditor';
+import { useDeployState, useToolbarState } from '../hooks';
 import { type ScriptSettingsProps } from '../types';
 
 export type ScriptEditorProps = ThemedClassName<{
   script: ScriptType;
-  settings: ScriptSettingsProps;
+  settings?: ScriptSettingsProps;
   role?: string;
 }> &
   Pick<TypescriptEditorProps, 'env'>;
 
-export const ScriptContainer = ({ role, classNames, script, settings, env }: ScriptEditorProps) => {
+export const ScriptContainer = ({
+  role,
+  classNames,
+  script,
+  settings = { editorInputMode: 'vscode' },
+  env,
+}: ScriptEditorProps) => {
   const identity = useIdentity();
   const space = getSpace(script);
 
@@ -49,7 +54,7 @@ export const ScriptContainer = ({ role, classNames, script, settings, env }: Scr
     [script, script.source.target, space, identity],
   );
 
-  const state = useToolbarState({ view: 'split' });
+  const state = useToolbarState({ view: 'editor' });
   useDeployState({ state, script });
 
   return (

package/src/components/ScriptSettingsPanel.tsx

@@ -10,7 +10,7 @@ import { FunctionType, type ScriptType, getInvocationUrl, getUserFunctionUrlInMe
 import { log } from '@dxos/log';
 import { useClient } from '@dxos/react-client';
 import { Filter, getMeta, getSpace, useQuery } from '@dxos/react-client/echo';
-import { Button, Clipboard, Input, Separator, useControlledValue, useTranslation } from '@dxos/react-ui';
+import { Button, Clipboard, Input, Separator, useControlledState, useTranslation } from '@dxos/react-ui';
 import { AccessTokenType } from '@dxos/schema';
 
 import { SCRIPT_PLUGIN } from '../meta';
@@ -57,7 +57,7 @@ export const ScriptSettingsPanel = ({ script }: ScriptSettingsPanelProps) => {
     return () => clearTimeout(timeout);
   }, [githubToken, gistKey]);
 
-  const [binding, setBinding] = useControlledValue(fn?.binding ?? '');
+  const [binding, setBinding] = useControlledState(fn?.binding ?? '');
   const handleBindingChange = useCallback(
     (event: ChangeEvent<HTMLInputElement>) => {
       setBinding(event.target.value);
@@ -114,6 +114,20 @@ export const ScriptSettingsPanel = ({ script }: ScriptSettingsPanelProps) => {
 
   return (
     <>
+      <div role='form' className='flex flex-col w-full p-2 gap-4'>
+        <Input.Root>
+          <div role='none' className='flex flex-col gap-1'>
+            <Input.Label>{t('description label')}</Input.Label>
+            <Input.TextInput
+              placeholder={t('description placeholder')}
+              value={script.description ?? ''}
+              onChange={(event) => {
+                script.description = event.target.value;
+              }}
+            />
+          </div>
+        </Input.Root>
+      </div>
       {fn && functionUrl && (
         <>
           <Separator />

package/src/components/ScriptToolbar/ScriptToolbar.tsx

@@ -10,12 +10,14 @@ import { ElevationProvider, type ThemedClassName } from '@dxos/react-ui';
 import { stackItemContentToolbarClassNames } from '@dxos/react-ui-editor';
 import { createGapSeparator, MenuProvider, ToolbarMenu, useMenuActions } from '@dxos/react-ui-menu';
 
-import { createDeploy } from './deploy';
-import { createFormat } from './format';
-import { createTemplateSelect } from './templateSelect';
-import { useToolbarAction } from './useToolbarAction';
-import { type ScriptToolbarState } from './useToolbarState';
-import { createView } from './view';
+import {
+  type ScriptToolbarState,
+  createDeploy,
+  createFormat,
+  createTemplateSelect,
+  createView,
+  useToolbarAction,
+} from '../../hooks';
 
 export type ScriptToolbarProps = ThemedClassName<{
   role?: string;

package/src/components/TypescriptEditor/TypescriptEditor.tsx

@@ -27,7 +27,7 @@ import {
   useTextEditor,
   type UseTextEditorProps,
 } from '@dxos/react-ui-editor';
-import { nonNullable } from '@dxos/util';
+import { isNonNullable } from '@dxos/util';
 
 export type TypescriptEditorProps = {
   id: string;
@@ -94,7 +94,7 @@ export const TypescriptEditor = ({
               ]
             : [],
         ],
-      ].filter(nonNullable),
+      ].filter(isNonNullable),
       selection,
       scrollTo,
     }),

package/src/events.ts

@@ -0,0 +1,11 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+import { defineEvent } from '@dxos/app-framework';
+
+import { SCRIPT_PLUGIN } from './meta';
+
+export namespace ScriptEvents {
+  export const SetupCompiler = defineEvent(`${SCRIPT_PLUGIN}/event/setup-compiler`);
+}

package/src/{components/ScriptToolbar → hooks}/deploy.ts

@@ -6,13 +6,14 @@ import { useCallback, useEffect, useMemo } from 'react';
 
 import {
   FunctionType,
+  type ScriptType,
   getInvocationUrl,
   getUserFunctionUrlInMetadata,
   incrementSemverPatch,
-  type ScriptType,
   setUserFunctionUrlInMetadata,
   uploadWorkerFunction,
 } from '@dxos/functions';
+import { Bundler } from '@dxos/functions/bundler';
 import { log } from '@dxos/log';
 import { useClient } from '@dxos/react-client';
 import { Filter, create, getMeta, getSpace, makeRef, useQuery } from '@dxos/react-client/echo';
@@ -20,8 +21,7 @@ import { useTranslation } from '@dxos/react-ui';
 import { createMenuAction } from '@dxos/react-ui-menu';
 
 import { type ViewState } from './view';
-import { Bundler } from '../../bundler';
-import { SCRIPT_PLUGIN } from '../../meta';
+import { SCRIPT_PLUGIN } from '../meta';
 
 export type DeployActionProperties = { type: 'deploy' } | { type: 'copy' };
 
@@ -105,7 +105,7 @@ export const useDeployHandler = ({ state, script }: { state: Partial<DeployState
       const existingFunctionId = existingFunctionUrl?.split('/').at(-1);
 
       const bundler = new Bundler({ platform: 'browser', sandboxedModules: [], remoteModules: {} });
-      const buildResult = await bundler.bundle(script.source.target!.content);
+      const buildResult = await bundler.bundle({ source: script.source.target!.content });
       if (buildResult.error || !buildResult.bundle) {
         throw buildResult.error;
       }
@@ -130,12 +130,24 @@ export const useDeployHandler = ({ state, script }: { state: Partial<DeployState
         fn ?? space.db.add(create(FunctionType, { name: functionId, version, source: makeRef(script) }));
 
       script.changed = false;
+      if (script.description !== undefined && script.description.trim() !== '') {
+        deployedFunction.description = script.description;
+      } else if (meta.description) {
+        deployedFunction.description = meta.description;
+      } else {
+        log.verbose('no description in function metadata', { functionId });
+      }
 
       if (meta.inputSchema) {
         deployedFunction.inputSchema = meta.inputSchema;
       } else {
         log.verbose('no input schema in function metadata', { functionId });
       }
+      if (meta.outputSchema) {
+        deployedFunction.outputSchema = meta.outputSchema;
+      } else {
+        log.verbose('no output schema in function metadata', { functionId });
+      }
 
       setUserFunctionUrlInMetadata(getMeta(deployedFunction), `/${space.id}/${functionId}`);
 

package/src/{components/ScriptToolbar → hooks}/format.ts

@@ -11,7 +11,7 @@ import { type ScriptType } from '@dxos/functions';
 import { log } from '@dxos/log';
 import { createMenuAction } from '@dxos/react-ui-menu';
 
-import { SCRIPT_PLUGIN } from '../../meta';
+import { SCRIPT_PLUGIN } from '../meta';
 
 export type FormatActionProperties = { type: 'format' };
 

package/src/hooks/index.ts

@@ -0,0 +1,11 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+export * from './deploy';
+export * from './format';
+export * from './template';
+export * from './view';
+
+export * from './useToolbarAction';
+export * from './useToolbarState';

package/src/{components/ScriptToolbar/templateSelect.ts → hooks/template.ts}

@@ -8,8 +8,8 @@ import { FUNCTIONS_PRESET_META_KEY, type ScriptType } from '@dxos/functions';
 import { getMeta } from '@dxos/live-object';
 import { createMenuItemGroup, createMenuAction } from '@dxos/react-ui-menu';
 
-import { SCRIPT_PLUGIN } from '../../meta';
-import { templates } from '../../templates';
+import { SCRIPT_PLUGIN } from '../meta';
+import { templates } from '../templates';
 
 export type TemplateActionProperties = { type: 'template'; value: string };
 

package/src/{components/ScriptToolbar → hooks}/useToolbarAction.ts

@@ -10,7 +10,7 @@ import { type MenuAction, type MenuActionHandler } from '@dxos/react-ui-menu';
 
 import { type DeployActionProperties, useDeployHandler, useCopyHandler } from './deploy';
 import { type FormatActionProperties, useFormatHandler } from './format';
-import { type TemplateActionProperties, useTemplateSelectHandler } from './templateSelect';
+import { type TemplateActionProperties, useTemplateSelectHandler } from './template';
 import { type ScriptToolbarState } from './useToolbarState';
 import { type ViewActionProperties } from './view';
 

package/src/{components/ScriptToolbar → hooks}/view.ts

@@ -4,7 +4,7 @@
 
 import { createMenuAction, createMenuItemGroup } from '@dxos/react-ui-menu';
 
-import { SCRIPT_PLUGIN } from '../../meta';
+import { SCRIPT_PLUGIN } from '../meta';
 
 export type ViewType = 'editor' | 'split' | 'debug';
 

package/src/index.ts

@@ -2,7 +2,6 @@
 // Copyright 2023 DXOS.org
 //
 
-export * from './bundler';
 export { ScriptCapabilities } from './capabilities';
 export * from './components';
 export * from './meta';

package/src/templates/chess.ts

@@ -1,41 +1,48 @@
-//
-// Copyright 2024 DXOS.org
-//
-
+// @ts-ignore
+import { defineFunction, S } from 'dxos:functions';
 // @ts-ignore
 import { Chess } from 'https://esm.sh/chess.js@0.13.1';
 
-/**
- * Plays a random move in a chess game.
- */
-export default async ({
-  event: {
-    data: { request },
-  },
-  context: { space },
-}: any) => {
-  const {
-    data: {
-      objects: [gameId],
-      player = 'b',
-    },
-  } = await request.json();
+export default defineFunction({
+  description: 'Plays a random move in a chess game.',
 
-  const { pgn } = await space.crud.query({ id: gameId }).first();
-  const game = new Chess();
-  game.load_pgn(pgn);
-  if (game.turn() !== player) {
-    return new Response('Invalid turn', { status: 409 });
-  }
+  inputSchema: S.Struct({
+    changedObjectId: S.String.annotations({
+      description: 'The objects to play the game on.',
+    }),
+    player: S.optional(S.Literal('w', 'b')).annotations({
+      description: 'The player to play the game as.',
+    }),
+  }),
 
-  const moves = game.moves();
-  const move = moves[Math.floor(Math.random() * moves.length)];
-  if (!move) {
-    return new Response('No legal moves', { status: 406 });
-  }
+  outputSchema: S.Struct({
+    state: S.String.annotations({
+      description: 'The state of the game as an ASCII art board.',
+    }),
+  }),
 
-  game.move(move);
-  const newPgn = game.pgn();
-  await space.crud.update({ id: gameId }, { pgn: newPgn });
-  return new Response(game.ascii());
-};
+  handler: async ({
+    event: {
+      data: { changedObjectId, player = 'b' },
+    },
+    context: { space },
+  }: any) => {
+    const { pgn } = await space.db.query({ id: changedObjectId }).first();
+    const game = new Chess();
+    game.load_pgn(pgn);
+    if (game.turn() !== player) {
+      return new Response('Invalid turn', { status: 409 });
+    }
+
+    const moves = game.moves();
+    const move = moves[Math.floor(Math.random() * moves.length)];
+    if (!move) {
+      return new Response('No legal moves', { status: 406 });
+    }
+
+    game.move(move);
+    const newPgn = game.pgn();
+    await space.db.update({ id: changedObjectId }, { pgn: newPgn, fen: game.fen() });
+    return { state: game.ascii() };
+  },
+});

package/src/templates/discord.ts

@@ -0,0 +1,103 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+// @ts-ignore
+import { createStatic, EchoObject, defineFunction, DXN, Filter, ObjectId, S } from 'dxos:functions';
+import {
+  FetchHttpClient,
+  // @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';
+// @ts-ignore
+import { Effect, Config, Redacted, Ref } from 'https://esm.sh/effect@3.13.3';
+
+const MessageSchema = S.Struct({
+  id: S.String,
+  foreignId: S.Any, // bigint?
+  from: S.String,
+  created: S.String,
+  content: S.String,
+}).pipe(EchoObject('example.com/type/Message', '0.1.0'));
+
+const DEFAULT_AFTER = 1704067200; // 2024-01-01
+
+const generateSnowflake = (unixTimestamp: number): bigint => {
+  const discordEpoch = 1420070400000n; // Discord Epoch (ms)
+  return (BigInt(unixTimestamp * 1000) - discordEpoch) << 22n;
+};
+
+export default defineFunction({
+  inputSchema: S.Struct({
+    // TODO(wittjosiah): Remove. This is used to provide a terminal for a cron trigger.
+    tick: S.optional(S.String),
+    channelId: S.String,
+    after: S.optional(S.Number),
+    pageSize: S.optional(S.Number),
+    queueId: S.String,
+  }),
+
+  outputSchema: S.Struct({
+    newMessages: S.Number,
+  }),
+
+  handler: ({
+    event: {
+      data: { channelId, queueId, after = DEFAULT_AFTER, pageSize = 5 },
+    },
+    context: { space },
+  }: any) =>
+    Effect.gen(function* () {
+      const { token } = yield* Effect.tryPromise(() =>
+        space.db.query(Filter.typename('dxos.org/type/AccessToken', { source: 'discord.com' })).first(),
+      );
+      const { objects } = yield* Effect.tryPromise(() => space.queues.queryQueue(DXN.parse(queueId)));
+      const backfill = objects.length === 0;
+      const newMessages = yield* Ref.make(0);
+      const lastMessage = yield* Ref.make(objects.at(-1));
+
+      const enqueueMessages = Effect.gen(function* () {
+        const rest = yield* DiscordREST;
+
+        while (true) {
+          const last = yield* Ref.get(lastMessage);
+          const options = {
+            after: backfill && !last ? `${generateSnowflake(after)}` : last?.foreignId,
+            limit: pageSize,
+          };
+          const messages = yield* rest.getChannelMessages(channelId, options).pipe((res: any) => res.json);
+          const queueMessages = messages
+            .map((message: any) =>
+              createStatic(MessageSchema, {
+                id: ObjectId.random(),
+                foreignId: message.id,
+                from: message.author.username,
+                created: message.timestamp,
+                content: message.content,
+              }),
+            )
+            .toReversed();
+          if (queueMessages.length > 0) {
+            yield* Effect.tryPromise(() => space.queues.insertIntoQueue(DXN.parse(queueId), queueMessages));
+            yield* Ref.update(newMessages, (n: any) => n + queueMessages.length);
+            yield* Ref.update(lastMessage, (m: any) => queueMessages.at(-1));
+          }
+          if (messages.length < pageSize) {
+            break;
+          }
+        }
+      }).pipe(
+        Effect.provide(DiscordRESTMemoryLive),
+        Effect.provide(
+          DiscordConfig.layerConfig({
+            token: Config.succeed(Redacted.make(token)),
+          }),
+        ),
+        Effect.provide(FetchHttpClient.layer),
+      );
+
+      yield* enqueueMessages;
+      return { newMessages: yield* Ref.get(newMessages) };
+    }),
+});

package/src/templates/echo.ts

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

package/src/templates/forex-effect.ts

@@ -0,0 +1,41 @@
+//
+// Copyright 2025 DXOS.org
+//
+
+// @ts-ignore
+import { defineFunction, S } from 'dxos:functions';
+import {
+  HttpClient,
+  HttpClientRequest,
+  FetchHttpClient,
+  // @ts-ignore
+} from 'https://esm.sh/@effect/platform@0.77.2?deps=effect@3.13.3';
+// @ts-ignore
+import { Effect, Schedule } from 'https://esm.sh/effect@3.13.3';
+
+export default defineFunction({
+  description: 'Returns the exchange rate between two currencies.',
+
+  inputSchema: S.Struct({
+    from: S.String.annotations({ description: 'The source currency' }),
+    to: S.String.annotations({ description: 'The target currency' }),
+  }),
+
+  outputSchema: S.String.annotations({ description: 'The exchange rate between the two currencies' }),
+
+  handler: async ({
+    event: {
+      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,
+        Effect.flatMap((res: any) => res.json),
+        Effect.timeout('1 second'),
+        Effect.retry(Schedule.exponential(1000).pipe(Schedule.compose(Schedule.recurs(3)))),
+        Effect.scoped,
+      );
+      return res.data.rates[to].toString();
+    }).pipe(Effect.provide(FetchHttpClient.layer)),
+});

package/src/templates/forex.ts

@@ -1,21 +1,28 @@
 //
-// Copyright 2024 DXOS.org
+// Copyright 2025 DXOS.org
 //
 
-/**
- * Returns the exchange rate between two currencies.
- */
-export default async ({
-  event: {
-    data: { request },
-  },
-}: any) => {
-  const { args: [from = 'EUR', to = 'USD'] = [] } = await request.json();
+// @ts-ignore
+import { defineFunction, S } from 'dxos:functions';
+
+export default defineFunction({
+  description: 'Returns the exchange rate between two currencies.',
 
-  const res = await fetch(`https://free.ratesdb.com/v1/rates?from=${from}&to=${to}`);
-  const {
-    data: { rates },
-  } = await res.json();
+  inputSchema: S.Struct({
+    from: S.String.annotations({ description: 'The source currency' }),
+    to: S.String.annotations({ description: 'The target currency' }),
+  }),
 
-  return new Response(rates[to].toString());
-};
+  handler: async ({
+    event: {
+      data: { from, to },
+    },
+  }: any) => {
+    const res = await fetch(`https://free.ratesdb.com/v1/rates?from=${from}&to=${to}`);
+    const {
+      data: { rates },
+    } = await res.json();
+
+    return rates[to].toString();
+  },
+});

package/src/templates/index.ts

@@ -7,10 +7,14 @@ import chat from './chat.ts?raw';
 // @ts-ignore
 import chess from './chess.ts?raw';
 // @ts-ignore
+import discord from './discord.ts?raw';
+// @ts-ignore
 import echo from './echo.ts?raw';
 // @ts-ignore
 import email from './email.ts?raw';
 // @ts-ignore
+import forexEffect from './forex-effect.ts?raw';
+// @ts-ignore
 import forex from './forex.ts?raw';
 
 const removeHeader = (str: string) => str.split('\n').slice(4).join('\n');
@@ -33,6 +37,11 @@ export const templates: Template[] = [
     name: 'Forex',
     source: removeHeader(forex),
   },
+  {
+    id: 'dxos.org/script/forex-effect',
+    name: 'Forex (Effect)',
+    source: removeHeader(forexEffect),
+  },
   {
     id: 'dxos.org/script/gpt',
     name: 'Gpt',
@@ -51,4 +60,10 @@ export const templates: Template[] = [
     source: removeHeader(email),
     presetId: 'dxos.org/function/email',
   },
+  {
+    id: 'dxos.org/script/discord',
+    name: 'Discord',
+    source: removeHeader(discord),
+    presetId: 'dxos.org/function/discord',
+  },
 ];

package/src/translations.ts

@@ -17,6 +17,8 @@ export default [
         'object title placeholder': 'New script',
         'create object label': 'Create script',
         'create stack section label': 'Create script',
+        'description label': 'Description',
+        'description placeholder': 'Describe what the script does.',
         'binding placeholder': 'Function name',
         'function request placeholder': 'Function request',
         'deploy label': 'Deploy',