SilverBullet pivot to become an offline-first PWA (#403)

plugs/markdown/markdown.plug.yaml

@@ -1,6 +1,4 @@
 name: markdown
-imports:
-  - https://get.silverbullet.md/global.plug.json
 assets:
   - "assets/*"
 requiredPermissions:
@@ -12,9 +10,9 @@ functions:
       name: "Markdown Preview: Toggle"
       key: Ctrl-p
       mac: Cmd-p
+
   preview:
     path: "./preview.ts:updateMarkdownPreview"
-    env: client
     events:
       - plug:load
       - editor:updated
@@ -22,16 +20,9 @@ functions:
       - editor:pageReloaded
   previewClickHandler:
     path: "./preview.ts:previewClickHandler"
-    env: client
     events:
       - preview:click
 
-  # $share: file:* publisher for markdown files
-  sharePublisher:
-    path: ./share.ts:sharePublisher
-    events:
-      - share:file
-
   markdownWidget:
     path: ./widget.ts:markdownWidget
     codeWidget: markdown

plugs/markdown/markdown.ts

@@ -1,11 +1,13 @@
-import { clientStore, editor, system } from "$sb/silverbullet-syscall/mod.ts";
+import { editor } from "$sb/silverbullet-syscall/mod.ts";
 import { readSettings } from "$sb/lib/settings_page.ts";
+import { updateMarkdownPreview } from "./preview.ts";
+import { store } from "$sb/plugos-syscall/mod.ts";
 
 export async function togglePreview() {
-  const currentValue = !!(await clientStore.get("enableMarkdownPreview"));
-  await clientStore.set("enableMarkdownPreview", !currentValue);
+  const currentValue = !!(await store.get("enableMarkdownPreview"));
+  await store.set("enableMarkdownPreview", !currentValue);
   if (!currentValue) {
-    await system.invokeFunction("client", "preview");
+    await updateMarkdownPreview();
   } else {
     await hideMarkdownPreview();
   }

plugs/markdown/markdown_render.test.ts

@@ -2,32 +2,31 @@ import buildMarkdown from "../../common/markdown_parser/parser.ts";
 import { parse } from "../../common/markdown_parser/parse_tree.ts";
 import { System } from "../../plugos/system.ts";
 
-import corePlug from "../../dist_bundle/_plug/core.plug.json" assert {
-  type: "json",
-};
-import tasksPlug from "../../dist_bundle/_plug/tasks.plug.json" assert {
-  type: "json",
-};
 import { createSandbox } from "../../plugos/environments/deno_sandbox.ts";
 import { loadMarkdownExtensions } from "../../common/markdown_parser/markdown_ext.ts";
 import { renderMarkdownToHtml } from "./markdown_render.ts";
 import { assertEquals } from "../../test_deps.ts";
-import { urlToPathname } from "../../plugos/util.ts";
 
 Deno.test("Markdown render", async () => {
   const system = new System<any>("server");
-  await system.load(corePlug, createSandbox);
-  await system.load(tasksPlug, createSandbox);
+  await system.load(
+    new URL("../../dist_plug_bundle/_plug/core.plug.js", import.meta.url),
+    createSandbox,
+  );
+  await system.load(
+    new URL("../../dist_plug_bundle/_plug/tasks.plug.js", import.meta.url),
+    createSandbox,
+  );
   const lang = buildMarkdown(loadMarkdownExtensions(system));
   const testFile = Deno.readTextFileSync(
-    urlToPathname(new URL("test/example.md", import.meta.url)),
+    new URL("test/example.md", import.meta.url).pathname,
   );
   const tree = parse(lang, testFile);
-  renderMarkdownToHtml(tree, {
+  await renderMarkdownToHtml(tree, {
     failOnUnknown: true,
-    renderFrontMatter: true,
   });
   // console.log("HTML", html);
+  await system.unloadAll();
 });
 
 Deno.test("Smart hard break test", async () => {

plugs/markdown/markdown_render.ts

@@ -4,14 +4,12 @@ import {
   renderToText,
   traverseTree,
 } from "$sb/lib/tree.ts";
-import * as YAML from "yaml";
 import { Fragment, renderHtml, Tag } from "./html_render.ts";
 
 type MarkdownRenderOptions = {
   failOnUnknown?: true;
   smartHardBreak?: true;
   annotationPositions?: true;
-  renderFrontMatter?: true;
   attachmentUrlPrefix?: string;
   // When defined, use to inline images as data: urls
   inlineAttachments?: (url: string) => Promise<string>;
@@ -78,33 +76,7 @@ function render(
         body: cleanTags(mapRender(t.children!)),
       };
     case "FrontMatter":
-      if (options.renderFrontMatter) {
-        const yamlCode = renderToText(t.children![1]);
-        const parsedYaml = YAML.parse(yamlCode) as Record<string, any>;
-        const rows: Tag[] = [];
-        for (const [k, v] of Object.entries(parsedYaml)) {
-          rows.push({
-            name: "tr",
-            body: [
-              { name: "td", attrs: { class: "key" }, body: k },
-              {
-                name: "td",
-                attrs: { class: "value" },
-                body: YAML.stringify(v),
-              },
-            ],
-          });
-        }
-        return {
-          name: "table",
-          attrs: {
-            class: "front-matter",
-          },
-          body: rows,
-        };
-      } else {
-        return null;
-      }
+      return null;
     case "CommentBlock":
       // Remove, for now
       return null;
@@ -261,7 +233,7 @@ function render(
       return {
         name: "a",
         attrs: {
-          href: `/${ref.replaceAll(" ", "_").replace("@", "#")}`,
+          href: `/${ref.replace("@", "#")}`,
         },
         body: linkText,
       };

plugs/markdown/preview.ts

@@ -1,15 +1,10 @@
-import {
-  clientStore,
-  editor,
-  space,
-  system,
-} from "$sb/silverbullet-syscall/mod.ts";
-import { asset } from "$sb/plugos-syscall/mod.ts";
-import { parseMarkdown } from "../../plug-api/silverbullet-syscall/markdown.ts";
+import { editor, space, system } from "$sb/silverbullet-syscall/mod.ts";
+import { asset, store } from "$sb/plugos-syscall/mod.ts";
+import { parseMarkdown } from "$sb/silverbullet-syscall/markdown.ts";
 import { renderMarkdownToHtml } from "./markdown_render.ts";
 
 export async function updateMarkdownPreview() {
-  if (!(await clientStore.get("enableMarkdownPreview"))) {
+  if (!(await store.get("enableMarkdownPreview"))) {
     return;
   }
   const text = await editor.getText();
@@ -20,7 +15,6 @@ export async function updateMarkdownPreview() {
   const html = await renderMarkdownToHtml(mdTree, {
     smartHardBreak: true,
     annotationPositions: true,
-    renderFrontMatter: true,
     inlineAttachments: async (url): Promise<string> => {
       if (!url.includes("://")) {
         try {

plugs/markdown/share.ts

@@ -1,24 +0,0 @@
-import { markdown, space } from "$sb/silverbullet-syscall/mod.ts";
-import { LocalFileSystem } from "$sb/plugos-syscall/mod.ts";
-import { asset } from "$sb/plugos-syscall/mod.ts";
-import { renderMarkdownToHtml } from "./markdown_render.ts";
-import { PublishEvent } from "$sb/app_event.ts";
-
-export async function sharePublisher(event: PublishEvent) {
-  const path = event.uri.split(":")[1];
-  const pageName = event.name;
-  const text = await space.readPage(pageName);
-  const tree = await markdown.parseMarkdown(text);
-
-  const rootFS = new LocalFileSystem("");
-
-  const css = await asset.readAsset("assets/styles.css");
-  const markdownHtml = renderMarkdownToHtml(tree, {
-    smartHardBreak: true,
-  });
-
-  const html =
-    `<html><head><style>${css}</style></head><body><div id="root">${markdownHtml}</div></body></html>`;
-  await rootFS.writeFile(path, html, "utf8");
-  return true;
-}

plugs/markdown/util.ts

@@ -6,7 +6,7 @@ import {
 import { markdown } from "$sb/silverbullet-syscall/mod.ts";
 
 export function encodePageUrl(name: string): string {
-  return name.replaceAll(" ", "_");
+  return name;
 }
 
 export async function cleanMarkdown(