fix(macos): load web chat from bundled html

2025-12-07 16:10:22 +01:00
parent 9aea85a953
commit f4fa9bf51a
2 changed files with 158 additions and 157 deletions
--- a/apps/macos/Sources/Clawdis/Resources/WebChat/index.html
+++ b/apps/macos/Sources/Clawdis/Resources/WebChat/index.html
@@ -0,0 +1,143 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="Content-Security-Policy" content="default-src 'self' 'unsafe-inline' data: blob:;">
+  <title>Clawd Web Chat</title>
+  <link rel="stylesheet" href="app.css">
+  <script type="importmap">
+  {
+    "imports": {
+      "@mariozechner/pi-web-ui": "./index.js",
+      "@mariozechner/pi-web-ui/": "./",
+      "@mariozechner/pi-ai": "./pi-ai-stub.js",
+      "@mariozechner/pi-ai/": "./pi-ai-stub.js",
+      "@mariozechner/mini-lit": "./vendor/@mariozechner/mini-lit/dist/index.js",
+      "@mariozechner/mini-lit/": "./vendor/@mariozechner/mini-lit/dist/",
+      "lit": "./vendor/lit/index.js",
+      "lit/": "./vendor/lit/",
+      "lucide": "./vendor/lucide/dist/esm/lucide.js",
+      "pdfjs-dist": "./vendor/pdfjs-dist/build/pdf.js",
+      "pdfjs-dist/": "./vendor/pdfjs-dist/",
+      "pdfjs-dist/build/pdf.worker.min.mjs": "./vendor/pdfjs-dist/build/pdf.worker.min.mjs",
+      "docx-preview": "./vendor/docx-preview/dist/docx-preview.mjs",
+      "jszip": "./vendor/jszip/dist/jszip.min.js",
+      "highlight.js": "./vendor/highlight.js/es/index.js",
+      "@lmstudio/sdk": "./vendor/@lmstudio/sdk/dist/index.mjs",
+      "ollama/browser": "./vendor/ollama/dist/browser.mjs",
+      "@sinclair/typebox": "./vendor/@sinclair/typebox/build/esm/index.mjs",
+      "xlsx": "./vendor/xlsx/xlsx.mjs"
+    }
+  }
+  </script>
+  <style>
+    html, body { height: 100%; margin: 0; padding: 0; }
+    #app { height: 100%; }
+  </style>
+</head>
+<body>
+  <div id="app" style="padding:16px;font:14px -apple-system, BlinkMacSystemFont, sans-serif;color:#222">Booting web chat…</div>
+  <script type="module">
+    if (!window.process) window.process = { env: {} };
+
+    const bootstrap = window.__clawdisBootstrap || {};
+    const initialMessages = Array.isArray(bootstrap.initialMessages) ? bootstrap.initialMessages : [];
+    const sessionKey = typeof bootstrap.sessionKey === "string" ? bootstrap.sessionKey : "main";
+
+    const status = (msg) => {
+      console.log(msg);
+      if (typeof window.__clawdisLog === "function") window.__clawdisLog(msg);
+      const el = document.getElementById("app");
+      if (el && !el.dataset.booted) el.textContent = msg;
+    };
+
+    status("boot: starting imports");
+
+    (async () => {
+      try {
+        const { Agent } = await import("./agent/agent.js");
+        status("boot: agent loaded");
+        const { ChatPanel } = await import("./ChatPanel.js");
+        status("boot: ChatPanel loaded");
+        const { AppStorage, setAppStorage } = await import("./storage/app-storage.js");
+        status("boot: pi-web-ui imported");
+        const { getModel } = await import("@mariozechner/pi-ai");
+        status("boot: pi-ai stub imported");
+
+        class NativeTransport {
+          async *run(messages, userMessage, cfg, signal) {
+            const result = await window.__clawdisSend({
+              type: "chat",
+              payload: { text: userMessage.content?.[0]?.text ?? "", sessionKey }
+            });
+            const usage = {
+              input: 0,
+              output: 0,
+              cacheRead: 0,
+              cacheWrite: 0,
+              cost: { input: 0, output: 0, cacheRead: 0, cacheWrite: 0, total: 0 }
+            };
+            const assistant = {
+              role: "assistant",
+              content: [{ type: "text", text: result.text ?? "" }],
+              api: cfg.model.api,
+              provider: cfg.model.provider,
+              model: cfg.model.id,
+              usage,
+              stopReason: "stop",
+              timestamp: Date.now()
+            };
+            yield { type: "turn_start" };
+            yield { type: "message_start", message: assistant };
+            yield { type: "message_end", message: assistant };
+            yield { type: "turn_end" };
+            yield { type: "agent_end" };
+          }
+        }
+
+        const storage = new AppStorage();
+        setAppStorage(storage);
+
+        const agent = new Agent({
+          initialState: {
+            systemPrompt: "You are Clawd (primary session).",
+            model: getModel("anthropic", "claude-opus-4-5"),
+            thinkingLevel: "off",
+            messages: initialMessages
+          },
+          transport: new NativeTransport()
+        });
+
+        const origPrompt = agent.prompt.bind(agent);
+        agent.prompt = async (input, attachments) => {
+          const userMessage = {
+            role: "user",
+            content: [{ type: "text", text: input }],
+            attachments: attachments?.length ? attachments : undefined,
+            timestamp: Date.now()
+          };
+          agent.appendMessage(userMessage);
+          return origPrompt(input, attachments);
+        };
+
+        const panel = new ChatPanel();
+        panel.style.height = "100%";
+        panel.style.display = "block";
+        await panel.setAgent(agent);
+        const mount = document.getElementById("app");
+        mount.dataset.booted = "1";
+        mount.textContent = "";
+        mount.appendChild(panel);
+        status("boot: ready");
+      } catch (err) {
+        const msg = err?.stack || err?.message || String(err);
+        if (typeof window.__clawdisLog === "function") window.__clawdisLog(msg);
+        document.body.style.color = "#e06666";
+        document.body.style.fontFamily = "monospace";
+        document.body.style.padding = "16px";
+        document.body.innerText = "Web chat failed to load:\\n" + msg;
+      }
+    })();
+  </script>
+</body>
+</html>