Fixes #193: Allowing plug overrides

common/util.ts

@@ -72,39 +72,3 @@ Loading some onboarding content for you (but doing so does require a working int
 
   return parseYamlSettings(settingsText);
 }
-
-// Compares two objects deeply
-export function deepEqual(a: any, b: any): boolean {
-  if (a === b) {
-    return true;
-  }
-  if (typeof a !== typeof b) {
-    return false;
-  }
-  if (typeof a === "object") {
-    if (Array.isArray(a) && Array.isArray(b)) {
-      if (a.length !== b.length) {
-        return false;
-      }
-      for (let i = 0; i < a.length; i++) {
-        if (!deepEqual(a[i], b[i])) {
-          return false;
-        }
-      }
-      return true;
-    } else {
-      const aKeys = Object.keys(a);
-      const bKeys = Object.keys(b);
-      if (aKeys.length !== bKeys.length) {
-        return false;
-      }
-      for (const key of aKeys) {
-        if (!deepEqual(a[key], b[key])) {
-          return false;
-        }
-      }
-      return true;
-    }
-  }
-  return false;
-}

plug-api/lib/json.test.ts

@@ -0,0 +1,21 @@
+import { assertEquals } from "../../test_deps.ts";
+import { deepEqual, deepObjectMerge, expandPropertyNames } from "./json.ts";
+
+Deno.test("utils", () => {
+  assertEquals(deepEqual({ a: 1 }, { a: 1 }), true);
+  assertEquals(deepObjectMerge({ a: 1 }, { a: 2 }), { a: 2 });
+  assertEquals(
+    deepObjectMerge({ list: [1, 2, 3] }, { list: [4, 5, 6] }),
+    { list: [1, 2, 3, 4, 5, 6] },
+  );
+  assertEquals(deepObjectMerge({ a: { b: 1 } }, { a: { c: 2 } }), {
+    a: { b: 1, c: 2 },
+  });
+  assertEquals(expandPropertyNames({ "a.b": 1 }), { a: { b: 1 } });
+  assertEquals(expandPropertyNames({ a: { "a.b": 1 } }), {
+    a: { a: { b: 1 } },
+  });
+  assertEquals(expandPropertyNames({ a: [{ "a.b": 1 }] }), {
+    a: [{ a: { b: 1 } }],
+  });
+});

plug-api/lib/json.ts

@@ -0,0 +1,86 @@
+// Compares two objects deeply
+export function deepEqual(a: any, b: any): boolean {
+  if (a === b) {
+    return true;
+  }
+  if (typeof a !== typeof b) {
+    return false;
+  }
+  if (typeof a === "object") {
+    if (Array.isArray(a) && Array.isArray(b)) {
+      if (a.length !== b.length) {
+        return false;
+      }
+      for (let i = 0; i < a.length; i++) {
+        if (!deepEqual(a[i], b[i])) {
+          return false;
+        }
+      }
+      return true;
+    } else {
+      const aKeys = Object.keys(a);
+      const bKeys = Object.keys(b);
+      if (aKeys.length !== bKeys.length) {
+        return false;
+      }
+      for (const key of aKeys) {
+        if (!deepEqual(a[key], b[key])) {
+          return false;
+        }
+      }
+      return true;
+    }
+  }
+  return false;
+}
+
+// Expands property names in an object containing a .-separated path
+export function expandPropertyNames(a: any): any {
+  if (!a) {
+    return a;
+  }
+  if (typeof a !== "object") {
+    return a;
+  }
+  if (Array.isArray(a)) {
+    return a.map(expandPropertyNames);
+  }
+  const expanded: any = {};
+  for (const key of Object.keys(a)) {
+    const parts = key.split(".");
+    let target = expanded;
+    for (let i = 0; i < parts.length - 1; i++) {
+      const part = parts[i];
+      if (!target[part]) {
+        target[part] = {};
+      }
+      target = target[part];
+    }
+    target[parts[parts.length - 1]] = expandPropertyNames(a[key]);
+  }
+  return expanded;
+}
+
+export function deepObjectMerge(a: any, b: any): any {
+  if (typeof a !== typeof b) {
+    return b;
+  }
+  if (typeof a === "object") {
+    if (Array.isArray(a) && Array.isArray(b)) {
+      return [...a, ...b];
+    } else {
+      const aKeys = Object.keys(a);
+      const bKeys = Object.keys(b);
+      const merged = { ...a };
+      for (const key of bKeys) {
+        if (aKeys.includes(key)) {
+          merged[key] = deepObjectMerge(a[key], b[key]);
+        } else {
+          merged[key] = b[key];
+        }
+      }
+      return merged;
+    }
+  }
+  return b;
+}

plugos/system.ts

@@ -1,7 +1,8 @@
-import { Hook } from "./types.ts";
+import { Hook, Manifest } from "./types.ts";
 import { EventEmitter } from "./event.ts";
 import type { SandboxFactory } from "./sandbox.ts";
 import { Plug } from "./plug.ts";
+import { deepObjectMerge } from "$sb/lib/json.ts";
 
 export interface SysCallMapping {
   [key: string]: (ctx: SyscallContext, ...args: any) => Promise<any> | any;
@@ -95,11 +96,21 @@ export class System<HookT> extends EventEmitter<SystemEvents<HookT>> {
   async load(
     workerUrl: URL,
     sandboxFactory: SandboxFactory<HookT>,
+    // Mapping plug name -> manifest overrides
+    manifestOverrides?: Record<string, Partial<Manifest<HookT>>>,
   ): Promise<Plug<HookT>> {
     const plug = new Plug(this, workerUrl, sandboxFactory);
 
     // Wait for worker to boot, and pass back its manifest
     await plug.ready;
+
+    if (manifestOverrides && manifestOverrides[plug.manifest!.name]) {
+      plug.manifest = deepObjectMerge(
+        plug.manifest,
+        manifestOverrides[plug.manifest!.name],
+      );
+      console.log("New manifest", plug.manifest);
+    }
     // and there it is!
     const manifest = plug.manifest!;
 

web/client.ts

@@ -35,6 +35,7 @@ import { OpenPages } from "./open_pages.ts";
 import { MainUI } from "./editor_ui.tsx";
 import { DexieMQ } from "../plugos/lib/mq.dexie.ts";
 import { cleanPageRef } from "$sb/lib/resolve.ts";
+import { expandPropertyNames } from "$sb/lib/json.ts";
 const frontMatterRegex = /^---\n(([^\n]|\n)*?)---\n/;
 
 const autoSaveInterval = 1000;
@@ -389,7 +390,11 @@ export class Client {
       console.info("No SETTINGS page, falling back to default", e);
       settingsText = '```yaml\nindexPage: "[[index]]"\n```\n';
     }
-    const settings = parseYamlSettings(settingsText!) as BuiltinSettings;
+    let settings = parseYamlSettings(settingsText!) as BuiltinSettings;
+
+    settings = expandPropertyNames(settings);
+
+    console.log("Settings", settings);
 
     if (!settings.indexPage) {
       settings.indexPage = "[[index]]";

web/client_system.ts

@@ -96,6 +96,7 @@ export class ClientSystem {
       const plug = await this.system.load(
         new URL(`/${fileName}`, location.href),
         createSandbox,
+        this.editor.settings.plugOverrides,
       );
       if ((plug.manifest! as Manifest).syntax) {
         // If there are syntax extensions, rebuild the markdown parser immediately
@@ -154,6 +155,7 @@ export class ClientSystem {
         await this.system.load(
           new URL(plugName, location.origin),
           createSandbox,
+          this.editor.settings.plugOverrides,
         );
       } catch (e: any) {
         console.error("Could not load plug", plugName, "error:", e.message);

web/components/filter.tsx

@@ -10,7 +10,7 @@ import { FunctionalComponent } from "https://esm.sh/v99/preact@10.11.3/src/index
 import { FeatherProps } from "https://esm.sh/v99/preact-feather@4.2.1/dist/types";
 import { MiniEditor } from "./mini_editor.tsx";
 import { fuzzySearchAndSort } from "./fuse_search.ts";
-import { deepEqual } from "../../common/util.ts";
+import { deepEqual } from "$sb/lib/json.ts";
 
 export function FilterList({
   placeholder,

web/types.ts

@@ -1,3 +1,4 @@
+import { Manifest } from "../common/manifest.ts";
 import { AppCommand } from "./hooks/command.ts";
 
 export type PageMeta = {
@@ -33,9 +34,10 @@ export type PanelMode = number;
 
 export type BuiltinSettings = {
   indexPage: string;
+  customStyles?: string;
+  plugOverrides?: Record<string, Partial<Manifest>>;
   // Format: compatible with docker ignore
   spaceIgnore?: string;
-  customStyles?: string;
 };
 
 export type PanelConfig = {

website/SETTINGS.md

@@ -28,4 +28,19 @@ spaceIgnore: |
    dist
    largefolder
    *.mp4
+# Plug overrides allow you to override any property in a plug manifest at runtime
+# The primary use case of this is to override or define keyboard shortcuts. You can use the . notation, to quickly "dive deep" into the structure
+plugOverrides:
+  core:
+    # Matching this YAML structure:
+    # https://github.com/silverbulletmd/silverbullet/blob/main/plugs/core/core.plug.yaml
+    # and overriding the "key" for centering the cursor
+    functions.centerCursor.command.key: Ctrl-Alt-p
+    # However, it's even possible to define custom slash commands this way without building a plug:
+    functions.todayHeader:
+      redirect: insertTemplateText
+      slashCommand:
+        name: today-header
+        value: |
+          ## {{today}}
 ```