feat(kanban): restore commands offline

req: local/001\nreq: local/002\nreq: local/003\nreq: local/004

examples/kanban/static/command-log.js

@@ -41,6 +41,16 @@ function clientReady(root) {
   });
 }
 
+async function prepareOfflineShell(root) {
+  if (!("serviceWorker" in navigator)) throw new Error("service workers are unavailable");
+  await navigator.serviceWorker.register("/offline.js", { scope: "/" });
+  await navigator.serviceWorker.ready;
+  if (!navigator.serviceWorker.controller) {
+    await new Promise((resolve) => navigator.serviceWorker.addEventListener("controllerchange", resolve, { once: true }));
+  }
+  root.setAttribute("data-kanban-offline-ready", "");
+}
+
 function stableSession() {
   const key = "hemx-kanban-session-v1";
   let session = sessionStorage.getItem(key);
@@ -120,6 +130,7 @@ async function start() {
   const root = document.querySelector(ROOT);
   if (!root) return;
   const databasePromise = openCommandLog();
+  const offlineReady = prepareOfflineShell(root).catch((error) => report(root, "offline", error));
   await clientReady(root);
   let wasmHandler;
   const durableHandler = async (...wire) => {
@@ -157,6 +168,7 @@ async function start() {
     for (const command of commands) window.hemx.applyBatch(await project(root, wasmHandler, command), root);
     root.setAttribute("data-kanban-command-count", String(commands.length));
     root.setAttribute("data-kanban-command-ready", "");
+    await offlineReady;
   } catch (error) {
     report(root, "restore", error);
     throw error;