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

2023-05-23 20:53:53 +02:00
parent b256269897
commit 5f484bed57
389 changed files with 4484 additions and 291129 deletions
@@ -1,3 +1,160 @@
-globalThis.addEventListener("fetch", function () {
-  return;
+import Dexie from "https://esm.sh/v120/dexie@3.2.2/dist/dexie.js";
+import { mime } from "https://deno.land/x/mimetypes@v1.0.0/mod.ts";
+
+import type { FileContent } from "../common/spaces/indexeddb_space_primitives.ts";
+import { simpleHash } from "../common/crypto.ts";
+import { clientStore } from "../plug-api/silverbullet-syscall/mod.ts";
+
+const CACHE_NAME = "{{CACHE_NAME}}";
+
+const precacheFiles = Object.fromEntries([
+  "/",
+  "/.client/reset.html",
+  "/.client/client.js",
+  "/.client/favicon.png",
+  "/.client/iAWriterMonoS-Bold.woff2",
+  "/.client/iAWriterMonoS-BoldItalic.woff2",
+  "/.client/iAWriterMonoS-Italic.woff2",
+  "/.client/iAWriterMonoS-Regular.woff2",
+  "/.client/logo.png",
+  "/.client/logo-dock.png",
+  "/.client/main.css",
+  "/.client/manifest.json",
+].map((path) => [path, path + "?v=" + CACHE_NAME, path])); // Cache busting
+
+self.addEventListener("install", (event: any) => {
+  console.log("[Service worker]", "Installing service worker...");
+  event.waitUntil(
+    caches.open(CACHE_NAME)
+      .then((cache) => {
+        console.log(
+          "[Service worker]",
+          "Now pre-caching client files",
+        );
+        return cache.addAll(Object.values(precacheFiles)).then(() => {
+          console.log(
+            "[Service worker]",
+            Object.keys(precacheFiles).length,
+            "client files cached",
+          );
+          // @ts-ignore: No need to wait
+          self.skipWaiting();
+        });
+      }),
+  );
+});
+
+self.addEventListener("activate", (event: any) => {
+  console.log("[Service worker]", "Activating new service worker!!!");
+  event.waitUntil(
+    caches.keys().then((cacheNames) => {
+      return Promise.all(
+        cacheNames.map((cacheName) => {
+          if (cacheName !== CACHE_NAME) {
+            console.log("[Service worker]", "Removing old cache", cacheName);
+            return caches.delete(cacheName);
+          }
+        }),
+      ).then(() => {
+        // Let's activate ourselves for all existing clients
+        // @ts-ignore: No need to wait, clients is a serviceworker thing
+        return clients.claim();
+      });
+    }),
+  );
+});
+
+let db: Dexie | undefined;
+let fileContentTable: Dexie.Table<FileContent, string> | undefined;
+
+self.addEventListener("fetch", (event: any) => {
+  const url = new URL(event.request.url);
+
+  // Use the custom cache key if available, otherwise use the request URL
+  const cacheKey = precacheFiles[url.pathname] || event.request.url;
+
+  event.respondWith(
+    // Try the static (client) file cache first
+    caches.match(cacheKey)
+      .then((response) => {
+        // Return the cached response if found
+        if (response) {
+          return response;
+        }
+
+        const requestUrl = new URL(event.request.url);
+        const pathname = requestUrl.pathname;
+        // If this is a /.fs request, this can either be a plug worker load or an attachment load
+        if (pathname.startsWith("/.fs")) {
+          if (fileContentTable && !event.request.headers.has("x-sync-mode")) {
+            console.log(
+              "Attempting to serve file from locally synced space:",
+              pathname,
+            );
+            // Don't fetch from DB when in sync mode (because then updates won't sync)
+            const path = decodeURIComponent(
+              requestUrl.pathname.slice("/.fs/".length),
+            );
+            return fileContentTable.get(path).then(
+              (data) => {
+                if (data) {
+                  console.log("Serving from space", path);
+                  return new Response(data.data, {
+                    headers: {
+                      "Content-type": mime.getType(path) ||
+                        "application/octet-stream",
+                    },
+                  });
+                } else {
+                  console.error(
+                    "Did not find file in locally synced space",
+                    path,
+                  );
+                  return new Response("Not found", {
+                    status: 404,
+                  });
+                }
+              },
+            );
+          } else {
+            // Just fetch the file directly
+            return fetch(event.request);
+          }
+        } else if (pathname !== "/.auth") {
+          // Must be a page URL, let's serve index.html which will handle it
+          return caches.match(precacheFiles["/"]).then((response) => {
+            // This shouldnt't happen, index.html not in the cache for some reason
+            return response || fetch(event.request);
+          });
+        } else {
+          return fetch(event.request);
+        }
+      }),
+  );
+});
+
+self.addEventListener("message", (event: any) => {
+  if (event.data.type === "flushCache") {
+    caches.delete(CACHE_NAME)
+      .then(() => {
+        console.log("[Service worker]", "Cache deleted");
+        db?.close();
+        event.source.postMessage({ type: "cacheFlushed" });
+      });
+  }
+  if (event.data.type === "config") {
+    const spaceFolderPath = event.data.config.spaceFolderPath;
+    const dbPrefix = "" + simpleHash(spaceFolderPath);
+
+    // Setup space
+    db = new Dexie(`${dbPrefix}_space`, {
+      indexedDB: globalThis.indexedDB,
+    });
+    db.version(1).stores({
+      fileMeta: "name",
+      fileContent: "name",
+    });
+
+    fileContentTable = db.table<FileContent, string>("fileContent");
+  }
 });