@dxos/plugin-script 0.6.13-staging.1e988a3 → 0.6.14-main.2b6a0f3

package/src/templates.ts

@@ -0,0 +1,54 @@
+//
+// Copyright 2024 DXOS.org
+//
+
+// @ts-ignore
+import chat from './templates/chat.ts?raw';
+// @ts-ignore
+import chess from './templates/chess.ts?raw';
+// @ts-ignore
+import echo from './templates/echo.ts?raw';
+// @ts-ignore
+import email from './templates/email.ts?raw';
+// @ts-ignore
+import forex from './templates/forex.ts?raw';
+
+const removeHeader = (str: string) => str.split('\n').slice(4).join('\n');
+
+export type Template = {
+  id: string;
+  name: string;
+  source: string;
+  presetId?: string;
+};
+
+export const templates: Template[] = [
+  {
+    id: 'dxos.org/script/echo',
+    name: 'Echo',
+    source: removeHeader(echo),
+  },
+  {
+    id: 'dxos.org/script/forex',
+    name: 'Forex',
+    source: removeHeader(forex),
+  },
+  {
+    id: 'dxos.org/script/gpt',
+    name: 'Gpt',
+    source: removeHeader(chat),
+    presetId: 'dxos.org/function/gpt',
+  },
+  {
+    id: 'dxos.org/script/chess',
+    name: 'Chess',
+    source: removeHeader(chess),
+    presetId: 'dxos.org/function/chess',
+  },
+  {
+    id: 'dxos.org/script/email',
+    name: 'Email',
+    source: removeHeader(email),
+    presetId: 'dxos.org/function/email',
+  },
+];

package/src/translations.ts

@@ -20,6 +20,8 @@ export default [
         'copy link label': 'Copy function link',
         'format label': 'Format',
         'toggle details label': 'Toggle details panel',
+        'authenticate action label': 'Authenticate functions service',
+        'authenticate button label': 'Authenticate',
       },
     },
   },

package/src/types/types.ts

@@ -6,11 +6,12 @@ import type {
   GraphBuilderProvides,
   IntentResolverProvides,
   MetadataRecordsProvides,
+  SettingsProvides,
   SurfaceProvides,
   TranslationsProvides,
 } from '@dxos/app-framework';
 import { type SchemaProvides } from '@dxos/plugin-client';
-import { type StackProvides } from '@dxos/plugin-stack';
+import { type SpaceInitProvides } from '@dxos/plugin-space';
 
 import { SCRIPT_PLUGIN } from '../meta';
 
@@ -18,10 +19,13 @@ export enum ScriptAction {
   CREATE = `${SCRIPT_PLUGIN}/create`,
 }
 
-export type ScriptPluginProvides = SurfaceProvides &
+export type ScriptSettingsProps = {};
+
+export type ScriptPluginProvides = GraphBuilderProvides &
   IntentResolverProvides &
-  GraphBuilderProvides &
   MetadataRecordsProvides &
-  TranslationsProvides &
   SchemaProvides &
-  StackProvides;
+  SettingsProvides<ScriptSettingsProps> &
+  SpaceInitProvides &
+  SurfaceProvides &
+  TranslationsProvides;

package/dist/lib/browser/ScriptEditor-5Y3EROG3.mjs

@@ -1,513 +0,0 @@
-import {
-  getUserFunctionUrlInMetadata,
-  publicKeyToDid,
-  setUserFunctionUrlInMetadata,
-  uploadWorkerFunction
-} from "./chunk-DL5XQRQM.mjs";
-import {
-  Bundler
-} from "./chunk-RHEZ5LUU.mjs";
-import {
-  FunctionType
-} from "./chunk-O4LWBX6A.mjs";
-import {
-  SCRIPT_PLUGIN
-} from "./chunk-JBACGDOJ.mjs";
-import {
-  TypescriptEditor
-} from "./chunk-MRGOT5RF.mjs";
-
-// packages/plugins/experimental/plugin-script/src/components/ScriptEditor.tsx
-import { format } from "prettier";
-import prettierPluginEstree from "prettier/plugins/estree";
-import prettierPluginTypescript from "prettier/plugins/typescript";
-import React3, { useCallback, useMemo, useState as useState3 } from "react";
-import { log as log2 } from "@dxos/log";
-import { useClient } from "@dxos/react-client";
-import { create, createDocAccessor, Filter, fullyQualifiedId, getMeta, getSpace, useQuery } from "@dxos/react-client/echo";
-import { useIdentity } from "@dxos/react-client/halo";
-import { useTranslation as useTranslation3 } from "@dxos/react-ui";
-import { useHasAttention } from "@dxos/react-ui-attention";
-import { createDataExtensions, listener } from "@dxos/react-ui-editor";
-import { mx as mx2 } from "@dxos/react-ui-theme";
-
-// packages/plugins/experimental/plugin-script/src/components/DebugPanel.tsx
-import React, { useEffect, useRef, useState } from "react";
-import { log } from "@dxos/log";
-import { Avatar, DensityProvider, Icon, Input, Toolbar, useControlledValue, useTranslation } from "@dxos/react-ui";
-import { SyntaxHighlighter } from "@dxos/react-ui-syntax-highlighter";
-import { mx } from "@dxos/react-ui-theme";
-var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/experimental/plugin-script/src/components/DebugPanel.tsx";
-var DebugPanel = ({ classNames, functionUrl, binding: _binding, onBindingChange }) => {
-  const { t } = useTranslation(SCRIPT_PLUGIN);
-  const bindingInputRef = useRef(null);
-  const [binding, setBinding] = useControlledValue(_binding ?? "");
-  const handleBlur = () => {
-    onBindingChange?.(binding);
-  };
-  const inputRef = useRef(null);
-  const [input, setInput] = useState("");
-  const [result, setResult] = useState("");
-  const [state, setState] = useState(null);
-  const [history, setHistory] = useState([]);
-  const scrollerRef = useRef(null);
-  const handleScroll = () => {
-    if (scrollerRef.current) {
-      scrollerRef.current.scrollTop = scrollerRef.current.scrollHeight;
-    }
-  };
-  const controller = useRef();
-  useEffect(() => {
-    return () => {
-      handleStop();
-    };
-  }, []);
-  const handleStop = () => {
-    controller.current?.abort("stop");
-    controller.current = void 0;
-  };
-  const handleClear = () => {
-    handleStop();
-    setInput("");
-    setResult("");
-    setHistory([]);
-    inputRef.current?.focus();
-  };
-  const handleResponse = ({ text, data, error } = {}) => {
-    controller.current = void 0;
-    setHistory((history2) => [
-      ...history2,
-      {
-        type: "response",
-        text,
-        data,
-        error
-      }
-    ]);
-    setResult("");
-    setState(null);
-    handleScroll();
-  };
-  const handleRequest = async (input2) => {
-    try {
-      setState("pending");
-      let data = null;
-      if (input2.charAt(0) === "{") {
-        try {
-          const validJsonString = input2.replace(/'/g, '"').replace(/([{,]\s*)([a-zA-Z0-9_]+)(\s*:)/g, '$1"$2"$3');
-          data = JSON.parse(validJsonString);
-          input2 = JSON.stringify(data, null, 2);
-        } catch (err) {
-          inputRef.current?.focus();
-          return;
-        }
-      }
-      setInput("");
-      setResult("");
-      setHistory((history2) => [
-        ...history2,
-        {
-          type: "request",
-          text: input2
-        }
-      ]);
-      setTimeout(() => {
-        handleScroll();
-      });
-      controller.current = new AbortController();
-      const response = await fetch(functionUrl, {
-        signal: controller.current.signal,
-        method: "POST",
-        body: input2,
-        headers: {
-          "Content-Type": data ? "application/json" : "text/plain"
-        }
-      });
-      if (!response.ok) {
-        const text2 = await response.text();
-        handleResponse({
-          error: new Error(text2 || response.statusText || String(response.status))
-        });
-        return;
-      }
-      const contentType = response.headers.get("content-type");
-      if (contentType === "application/json") {
-        const data2 = await response.json();
-        handleResponse({
-          data: data2
-        });
-        return;
-      }
-      setState("responding");
-      let text = "";
-      const reader = response.body.getReader();
-      const pump = async ({ done, value }) => {
-        text = text + new TextDecoder().decode(value);
-        if (!controller.current || done) {
-          handleResponse({
-            text
-          });
-          return;
-        }
-        setResult(text);
-        setTimeout(() => {
-          handleScroll();
-        });
-        return reader.read().then(pump);
-      };
-      void reader.read().then(pump).catch((err) => {
-        if (err.name !== "AbortError") {
-          log.catch(err, void 0, {
-            F: __dxlog_file,
-            L: 163,
-            S: void 0,
-            C: (f, a) => f(...a)
-          });
-        }
-      });
-    } catch (err) {
-      if (err !== "stop") {
-        const error = err instanceof Error ? err : new Error(err);
-        handleResponse({
-          error
-        });
-        log.catch(err, void 0, {
-          F: __dxlog_file,
-          L: 170,
-          S: void 0,
-          C: (f, a) => f(...a)
-        });
-      } else {
-        handleResponse();
-      }
-    }
-  };
-  return /* @__PURE__ */ React.createElement(DensityProvider, {
-    density: "fine"
-  }, /* @__PURE__ */ React.createElement("div", {
-    className: mx("flex flex-col h-full overflow-hidden", classNames)
-  }, /* @__PURE__ */ React.createElement("div", {
-    ref: scrollerRef,
-    className: "flex flex-col gap-6 h-full p-4 overflow-x-hidden overflow-y-auto"
-  }, /* @__PURE__ */ React.createElement(MessageThread, {
-    state,
-    result,
-    history
-  })), /* @__PURE__ */ React.createElement(Toolbar.Root, {
-    classNames: "p-2"
-  }, /* @__PURE__ */ React.createElement(Input.Root, null, /* @__PURE__ */ React.createElement(Input.TextInput, {
-    ref: inputRef,
-    autoFocus: true,
-    placeholder: t("function request placeholder"),
-    value: input,
-    onChange: (ev) => setInput(ev.target.value),
-    onKeyDown: (ev) => ev.key === "Enter" && handleRequest(input)
-  })), /* @__PURE__ */ React.createElement(Input.Root, null, /* @__PURE__ */ React.createElement(Input.TextInput, {
-    ref: bindingInputRef,
-    classNames: "!w-[10rem]",
-    placeholder: t("binding placeholder"),
-    value: binding,
-    onChange: (ev) => setBinding(ev.target.value.toUpperCase()),
-    onBlur: handleBlur
-  })), /* @__PURE__ */ React.createElement(Toolbar.Button, {
-    onClick: () => handleRequest(input)
-  }, /* @__PURE__ */ React.createElement(Icon, {
-    icon: "ph--play--regular",
-    size: 4
-  })), /* @__PURE__ */ React.createElement(Toolbar.Button, {
-    onClick: () => state ? handleStop() : handleClear()
-  }, /* @__PURE__ */ React.createElement(Icon, {
-    icon: state ? "ph--stop--regular" : "ph--trash--regular",
-    size: 4
-  })))));
-};
-var RobotAvatar = () => /* @__PURE__ */ React.createElement(Avatar.Root, {
-  size: 6,
-  variant: "circle"
-}, /* @__PURE__ */ React.createElement(Avatar.Frame, null, /* @__PURE__ */ React.createElement(Avatar.Icon, {
-  icon: "ph--robot--regular"
-})));
-var MessageItem = ({ classNames, message }) => {
-  const { text, data, error } = message;
-  if (error) {
-    return /* @__PURE__ */ React.createElement("span", {
-      className: mx(classNames, "whitespace-pre text-error")
-    }, String(error));
-  } else if (data) {
-    return /* @__PURE__ */ React.createElement(SyntaxHighlighter, {
-      language: "json",
-      className: mx("text-xs", classNames)
-    }, JSON.stringify(data, null, 2));
-  }
-  return /* @__PURE__ */ React.createElement("span", {
-    className: mx(classNames)
-  }, text || "\xD8");
-};
-var MessageThread = ({ state, result, history }) => {
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, history.map((message, i) => /* @__PURE__ */ React.createElement("div", {
-    key: i,
-    className: "grid grid-cols-[3rem_1fr]"
-  }, /* @__PURE__ */ React.createElement("div", null, message.type === "response" && /* @__PURE__ */ React.createElement(RobotAvatar, null)), /* @__PURE__ */ React.createElement("div", {
-    className: mx("flex", message.type === "request" && "justify-end")
-  }, /* @__PURE__ */ React.createElement(MessageItem, {
-    classNames: [
-      message.type === "request" && "p-1 px-2 rounded-lg bg-hoverSurface"
-    ],
-    message
-  })))), /* @__PURE__ */ React.createElement("div", {
-    className: "grid grid-cols-[3rem_1fr]"
-  }, /* @__PURE__ */ React.createElement("div", null, state === "pending" && /* @__PURE__ */ React.createElement(Icon, {
-    icon: "ph--spinner--regular",
-    size: 6,
-    classNames: "animate-spin-slow"
-  }) || result.length > 0 && /* @__PURE__ */ React.createElement(RobotAvatar, null)), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("span", null, result))));
-};
-
-// packages/plugins/experimental/plugin-script/src/components/Toolbar.tsx
-import React2, { useState as useState2 } from "react";
-import { DensityProvider as DensityProvider2, ElevationProvider, Icon as Icon2, Toolbar as NaturalToolbar, Tooltip, useTranslation as useTranslation2 } from "@dxos/react-ui";
-var Toolbar2 = ({ classNames, deployed, error, functionUrl, showPanel, onDeploy, onFormat, onTogglePanel }) => {
-  const { t } = useTranslation2(SCRIPT_PLUGIN);
-  const [pending, setPending] = useState2(false);
-  const handleCopyLink = async () => {
-    if (!functionUrl) {
-      return;
-    }
-    await navigator.clipboard.writeText(functionUrl);
-  };
-  const handleDeploy = async () => {
-    setPending(true);
-    await onDeploy?.();
-    setPending(false);
-  };
-  return /* @__PURE__ */ React2.createElement(DensityProvider2, {
-    density: "fine"
-  }, /* @__PURE__ */ React2.createElement(ElevationProvider, {
-    elevation: "chrome"
-  }, /* @__PURE__ */ React2.createElement(NaturalToolbar.Root, {
-    classNames: [
-      "p-1",
-      classNames
-    ],
-    style: {
-      contain: "layout"
-    }
-  }, onFormat && /* @__PURE__ */ React2.createElement(Tooltip.Root, null, /* @__PURE__ */ React2.createElement(Tooltip.Trigger, {
-    asChild: true
-  }, /* @__PURE__ */ React2.createElement(NaturalToolbar.Button, {
-    variant: "ghost",
-    onClick: onFormat
-  }, /* @__PURE__ */ React2.createElement(Icon2, {
-    icon: "ph--magic-wand--regular",
-    size: 4
-  }))), /* @__PURE__ */ React2.createElement(Tooltip.Portal, null, /* @__PURE__ */ React2.createElement(Tooltip.Content, null, /* @__PURE__ */ React2.createElement(Tooltip.Arrow, null), t("format label")))), /* @__PURE__ */ React2.createElement("div", {
-    role: "separator",
-    className: "grow"
-  }), error ? /* @__PURE__ */ React2.createElement(Tooltip.Root, null, /* @__PURE__ */ React2.createElement(Tooltip.Trigger, null, /* @__PURE__ */ React2.createElement(Icon2, {
-    icon: "ph--warning-circle--regular",
-    size: 4
-  })), /* @__PURE__ */ React2.createElement(Tooltip.Portal, null, /* @__PURE__ */ React2.createElement(Tooltip.Content, null, /* @__PURE__ */ React2.createElement(Tooltip.Arrow, null), error))) : null, functionUrl && deployed && /* @__PURE__ */ React2.createElement(Tooltip.Root, null, /* @__PURE__ */ React2.createElement(Tooltip.Trigger, {
-    asChild: true
-  }, /* @__PURE__ */ React2.createElement(NaturalToolbar.Button, {
-    variant: "ghost",
-    onClick: handleCopyLink
-  }, /* @__PURE__ */ React2.createElement(Icon2, {
-    icon: "ph--link--regular",
-    size: 4
-  }))), /* @__PURE__ */ React2.createElement(Tooltip.Portal, null, /* @__PURE__ */ React2.createElement(Tooltip.Content, null, /* @__PURE__ */ React2.createElement(Tooltip.Arrow, null), t("copy link label")))), /* @__PURE__ */ React2.createElement(Tooltip.Root, null, /* @__PURE__ */ React2.createElement(Tooltip.Trigger, {
-    asChild: true
-  }, /* @__PURE__ */ React2.createElement(NaturalToolbar.Button, {
-    variant: "ghost",
-    onClick: handleDeploy,
-    disabled: pending
-  }, pending ? /* @__PURE__ */ React2.createElement(Icon2, {
-    icon: "ph--spinner--regular",
-    size: 4,
-    classNames: "animate-spin-slow"
-  }) : /* @__PURE__ */ React2.createElement(Icon2, {
-    icon: "ph--cloud-arrow-up--regular",
-    size: 4
-  }))), /* @__PURE__ */ React2.createElement(Tooltip.Portal, null, /* @__PURE__ */ React2.createElement(Tooltip.Content, null, /* @__PURE__ */ React2.createElement(Tooltip.Arrow, null), pending ? t("pending label") : t("deploy label")))), onTogglePanel && /* @__PURE__ */ React2.createElement(Tooltip.Root, null, /* @__PURE__ */ React2.createElement(Tooltip.Trigger, {
-    asChild: true
-  }, /* @__PURE__ */ React2.createElement(NaturalToolbar.Button, {
-    variant: "ghost",
-    onClick: onTogglePanel
-  }, /* @__PURE__ */ React2.createElement(Icon2, {
-    icon: showPanel ? "ph--caret-down--regular" : "ph--caret-up--regular",
-    size: 4
-  }))), /* @__PURE__ */ React2.createElement(Tooltip.Portal, null, /* @__PURE__ */ React2.createElement(Tooltip.Content, null, /* @__PURE__ */ React2.createElement(Tooltip.Arrow, null), t("toggle details label")))))));
-};
-
-// packages/plugins/experimental/plugin-script/src/components/ScriptEditor.tsx
-var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/plugins/experimental/plugin-script/src/components/ScriptEditor.tsx";
-var ScriptEditor = ({ env, script, role }) => {
-  const { t } = useTranslation3(SCRIPT_PLUGIN);
-  const hasAttention = useHasAttention(fullyQualifiedId(script));
-  const client = useClient();
-  const identity = useIdentity();
-  const space = getSpace(script);
-  const [fn] = useQuery(space, Filter.schema(FunctionType, (fn2) => fn2.source === script));
-  const extensions = useMemo(() => [
-    listener({
-      onChange: (text) => {
-        if (script.source && script.source?.content !== text) {
-          script.changed = true;
-        }
-      }
-    }),
-    createDataExtensions({
-      id: script.id,
-      text: script.source && createDocAccessor(script.source, [
-        "content"
-      ]),
-      space,
-      identity
-    })
-  ], [
-    script,
-    script.source,
-    space,
-    identity
-  ]);
-  const [showPanel, setShowPanel] = useState3(false);
-  const initialValue = useMemo(() => script.source?.content, [
-    script.source
-  ]);
-  const existingFunctionUrl = fn && getUserFunctionUrlInMetadata(getMeta(fn));
-  const [error, setError] = useState3();
-  const handleBindingChange = useCallback((binding) => {
-    fn.binding = binding;
-  }, [
-    fn
-  ]);
-  const handleFormat = useCallback(async () => {
-    if (!script.source) {
-      return;
-    }
-    try {
-      script.source.content = await format(script.source.content, {
-        parser: "typescript",
-        plugins: [
-          prettierPluginEstree,
-          prettierPluginTypescript
-        ],
-        semi: true,
-        singleQuote: true
-      });
-    } catch (err) {
-      log2.catch(err, void 0, {
-        F: __dxlog_file2,
-        L: 102,
-        S: void 0,
-        C: (f, a) => f(...a)
-      });
-    }
-  }, [
-    script.source
-  ]);
-  const handleDeploy = useCallback(async () => {
-    if (!script.source || !identity || !space) {
-      return;
-    }
-    setError(void 0);
-    try {
-      const existingFunctionId = existingFunctionUrl?.split("/").at(-1);
-      const ownerDid = existingFunctionUrl?.split("/").at(-2) ?? publicKeyToDid(identity.identityKey);
-      const bundler = new Bundler({
-        platform: "browser",
-        sandboxedModules: [],
-        remoteModules: {}
-      });
-      const buildResult = await bundler.bundle(script.source.content);
-      if (buildResult.error || !buildResult.bundle) {
-        throw buildResult.error;
-      }
-      const { result, functionId, functionVersionNumber, errorMessage } = await uploadWorkerFunction({
-        clientConfig: client.config,
-        halo: client.halo,
-        ownerDid,
-        functionId: existingFunctionId,
-        source: buildResult.bundle
-      });
-      if (result !== "success" || functionId === void 0 || functionVersionNumber === void 0) {
-        throw new Error(errorMessage);
-      }
-      log2.info("function uploaded", {
-        functionId,
-        functionVersionNumber
-      }, {
-        F: __dxlog_file2,
-        L: 137,
-        S: void 0,
-        C: (f, a) => f(...a)
-      });
-      if (fn) {
-        fn.version = functionVersionNumber;
-      }
-      const deployedFunction = fn ?? space.db.add(create(FunctionType, {
-        version: functionVersionNumber,
-        source: script
-      }));
-      const meta = getMeta(deployedFunction);
-      setUserFunctionUrlInMetadata(meta, `/${ownerDid}/${functionId}`);
-      script.changed = false;
-    } catch (err) {
-      log2.catch(err, void 0, {
-        F: __dxlog_file2,
-        L: 147,
-        S: void 0,
-        C: (f, a) => f(...a)
-      });
-      setError(t("upload failed label"));
-    }
-  }, [
-    fn,
-    existingFunctionUrl,
-    script,
-    script.name,
-    script.source
-  ]);
-  const functionUrl = useMemo(() => {
-    if (!existingFunctionUrl) {
-      return;
-    }
-    const baseUrl = new URL("functions/", client.config.values.runtime?.services?.edge?.url);
-    const relativeUrl = existingFunctionUrl.replace(/^\//, "");
-    const url = new URL(`./${relativeUrl}`, baseUrl.toString());
-    space && url.searchParams.set("spaceId", space.id);
-    url.protocol = "https";
-    return url.toString();
-  }, [
-    existingFunctionUrl,
-    space
-  ]);
-  return /* @__PURE__ */ React3.createElement("div", {
-    role: "none",
-    className: mx2("flex flex-col is-full bs-full overflow-hidden", role === "article" && "row-span-2", hasAttention && "attention-surface")
-  }, /* @__PURE__ */ React3.createElement(TypescriptEditor, {
-    id: script.id,
-    env,
-    initialValue,
-    extensions,
-    className: "flex is-full bs-full overflow-hidden ch-focus-ring-inset-over-all"
-  }), /* @__PURE__ */ React3.createElement(Toolbar2, {
-    classNames: "border-t border-separator",
-    deployed: Boolean(existingFunctionUrl) && !script.changed,
-    functionUrl,
-    error,
-    showPanel,
-    onDeploy: handleDeploy,
-    onFormat: handleFormat,
-    onTogglePanel: async () => setShowPanel((showDetails) => !showDetails)
-  }), showPanel && /* @__PURE__ */ React3.createElement(DebugPanel, {
-    functionUrl,
-    binding: fn?.binding,
-    onBindingChange: handleBindingChange
-  }));
-};
-var ScriptEditor_default = ScriptEditor;
-export {
-  ScriptEditor,
-  ScriptEditor_default as default
-};
-//# sourceMappingURL=ScriptEditor-5Y3EROG3.mjs.map