fix: E2E encrypt agent media and fix image display

- Fix AES-CTR silent corruption: agent images were incorrectly fed through
  E2E decryption (which never throws), producing garbage. Now only decrypt
  media when `mediaEncrypted` flag is set.
- Add E2E encryption for agent-sent images: plugin downloads external image,
  encrypts with AES-CTR, uploads via new /api/plugin-upload endpoint.
- Add /api/plugin-upload route with pairing token auth for plugin uploads.
- Use bitmask in `encrypted` column (bit0=text, bit1=media) for backward
  compatibility with old unencrypted agent media.
- Fix WebSocket reconnection storm: skip startAccount when existing client
  is already connected, preventing health-monitor from killing healthy
  connections.

Author: Daniel-Robbins

packages/api/src/do/connection-do.ts

@@ -328,16 +328,19 @@ export class ConnectionDO implements DurableObject {
 
       // For agent.media, cache external images to R2 so they remain accessible
       // even after the original URL expires (e.g. DALL-E temporary URLs).
+      // Skip caching if the plugin already uploaded E2E-encrypted media.
       let persistedMediaUrl = msg.mediaUrl as string | undefined;
-      if (msg.type === "agent.media" && persistedMediaUrl) {
+      if (msg.type === "agent.media" && persistedMediaUrl && !msg.mediaEncrypted) {
         const cachedUrl = await this.cacheExternalMedia(persistedMediaUrl);
         if (cachedUrl) {
           persistedMediaUrl = cachedUrl;
-          // Update the message object so browsers get the cached URL
           msg.mediaUrl = cachedUrl;
         }
       }
 
+      // Bitmask: bit 0 = text encrypted, bit 1 = media encrypted
+      const encryptedBits = (msg.encrypted ? 1 : 0) | (msg.mediaEncrypted ? 2 : 0);
+
       await this.persistMessage({
         id: msg.messageId as string | undefined,
         sender: "agent",
@@ -346,7 +349,7 @@ export class ConnectionDO implements DurableObject {
         text: (msg.text ?? msg.caption ?? "") as string,
         mediaUrl: persistedMediaUrl,
         a2ui: msg.jsonl as string | undefined,
-        encrypted: msg.encrypted ? 1 : 0,
+        encrypted: encryptedBits,
       });
     }
 
@@ -1114,15 +1117,21 @@ export class ConnectionDO implements DurableObject {
           if (mediaUrl) {
             mediaUrl = await this.refreshMediaUrl(mediaUrl, secret);
           }
+          const encBits = (row.encrypted as number) ?? 0;
+          // Derive mediaEncrypted:
+          // - User messages with encrypted=1: media was always encrypted by browser
+          // - Any message with bit 1 set (encrypted >= 2): media was E2E encrypted
+          const mediaEncrypted = (row.sender === "user" && encBits >= 1) || (encBits & 2) !== 0;
           return {
             id: row.id,
             sender: row.sender,
             text: row.text ?? "",
-            timestamp: ((row.created_at as number) ?? 0) * 1000, // unix seconds → ms
+            timestamp: ((row.created_at as number) ?? 0) * 1000,
             mediaUrl,
             a2ui: row.a2ui ?? undefined,
             threadId: row.thread_id ?? undefined,
-            encrypted: row.encrypted ?? 0,
+            encrypted: encBits,
+            mediaEncrypted,
           };
         }),
       );

packages/api/src/index.ts

@@ -1,7 +1,8 @@
 import { Hono } from "hono";
 import { cors } from "hono/cors";
 import type { Env } from "./env.js";
-import { authMiddleware, verifyToken, getJwtSecret, verifyMediaSignature } from "./utils/auth.js";
+import { authMiddleware, verifyToken, getJwtSecret, verifyMediaSignature, signMediaUrl } from "./utils/auth.js";
+import { randomUUID } from "./utils/uuid.js";
 import { auth } from "./routes/auth.js";
 import { agents } from "./routes/agents.js";
 import { channels } from "./routes/channels.js";
@@ -477,6 +478,53 @@ app.get("/api/messages/:userId", async (c) => {
   return stub.fetch(new Request(url.toString()));
 });
 
+// ---- Plugin upload (pairing token auth) ----
+app.post("/api/plugin-upload", async (c) => {
+  const token = c.req.header("X-Pairing-Token");
+  if (!token) {
+    return c.json({ error: "Missing X-Pairing-Token header" }, 401);
+  }
+  const row = await c.env.DB.prepare(
+    "SELECT user_id FROM pairing_tokens WHERE token = ? AND revoked_at IS NULL",
+  )
+    .bind(token)
+    .first<{ user_id: string }>();
+  if (!row) {
+    return c.json({ error: "Invalid pairing token" }, 401);
+  }
+
+  const userId = row.user_id;
+  const contentType = c.req.header("Content-Type") ?? "";
+  if (!contentType.includes("multipart/form-data")) {
+    return c.json({ error: "Expected multipart/form-data" }, 400);
+  }
+
+  const formData = await c.req.formData();
+  const file = formData.get("file") as File | null;
+  if (!file) {
+    return c.json({ error: "No file provided" }, 400);
+  }
+
+  const MAX_SIZE = 20 * 1024 * 1024;
+  if (file.size > MAX_SIZE) {
+    return c.json({ error: "File too large (max 20 MB)" }, 413);
+  }
+
+  const fileType = file.type || "application/octet-stream";
+  const ext = file.name.split(".").pop()?.toLowerCase() ?? "bin";
+  const safeExt = /^[a-z0-9]{1,5}$/.test(ext) ? ext : "bin";
+  const filename = `${Date.now()}-${randomUUID().slice(0, 8)}.${safeExt}`;
+  const key = `media/${userId}/${filename}`;
+
+  await c.env.MEDIA.put(key, file.stream(), {
+    httpMetadata: { contentType: fileType },
+  });
+
+  const secret = getJwtSecret(c.env);
+  const url = await signMediaUrl(userId, filename, secret, 3600);
+  return c.json({ url, key });
+});
+
 // ---- Protected routes (require Bearer token) — AFTER ws routes ----
 app.route("/api", protectedApp);
 

packages/plugin/src/channel.ts

@@ -9,7 +9,7 @@ import { getBotsChatRuntime } from "./runtime.js";
 import type { BotsChatChannelConfig, CloudInbound, ResolvedBotsChatAccount } from "./types.js";
 import { BotsChatCloudClient } from "./ws-client.js";
 import crypto from "crypto";
-import { encryptText, decryptText, decryptBytes, toBase64, fromBase64 } from "./e2e-crypto.js";
+import { encryptText, encryptBytes, decryptText, decryptBytes, toBase64, fromBase64 } from "./e2e-crypto.js";
 
 // ---------------------------------------------------------------------------
 // A2UI message-tool hints — injected via agentPrompt.messageToolHints so
@@ -51,6 +51,8 @@ function readAgentModel(_agentId: string): string | undefined {
 const cloudClients = new Map<string, BotsChatCloudClient>();
 /** Maps accountId → cloudUrl so handleCloudMessage can resolve relative URLs */
 const cloudUrls = new Map<string, string>();
+/** Maps accountId → pairingToken for plugin HTTP uploads */
+const pairingTokens = new Map<string, string>();
 
 function getCloudClient(accountId: string): BotsChatCloudClient | undefined {
   return cloudClients.get(accountId);
@@ -176,17 +178,18 @@ export const botschatPlugin = {
       mediaUrl?: string;
       accountId?: string | null;
     }) => {
-      const client = getCloudClient(ctx.accountId ?? "default");
+      const accountId = ctx.accountId ?? "default";
+      const client = getCloudClient(accountId);
       if (!client?.connected) {
         return { ok: false, error: new Error("Not connected to BotsChat cloud") };
       }
       const messageId = crypto.randomUUID();
       let text = ctx.text;
       let encrypted = false;
+      let mediaEncrypted = false;
 
-      if (client.e2eKey && text) { // Only encrypt checksum if present
+      if (client.e2eKey && text) {
         try {
-             // Encrypt caption using messageId as contextId
              const ciphertext = await encryptText(client.e2eKey, text, messageId);
              text = toBase64(ciphertext);
              encrypted = true;
@@ -195,17 +198,63 @@ export const botschatPlugin = {
         }
       }
 
+      let finalMediaUrl = ctx.mediaUrl;
+
+      if (client.e2eKey && ctx.mediaUrl && !ctx.mediaUrl.startsWith("/api/media/")) {
+        try {
+          const baseUrl = cloudUrls.get(accountId);
+          const token = pairingTokens.get(accountId);
+          if (baseUrl && token) {
+            const resp = await fetch(ctx.mediaUrl, { signal: AbortSignal.timeout(15_000) });
+            if (resp.ok) {
+              const rawBytes = new Uint8Array(await resp.arrayBuffer());
+              const encBytes = await encryptBytes(client.e2eKey, rawBytes, `${messageId}:media`);
+
+              const contentType = resp.headers.get("Content-Type") ?? "application/octet-stream";
+              const extMap: Record<string, string> = { "image/png": "png", "image/jpeg": "jpg", "image/gif": "gif", "image/webp": "webp" };
+              const ext = extMap[contentType] ?? (contentType.startsWith("image/") ? "png" : "bin");
+
+              const formData = new FormData();
+              const blob = new Blob([encBytes as any], { type: contentType });
+              formData.append("file", blob, `encrypted.${ext}`);
+
+              const uploadUrl = `${baseUrl.replace(/\/$/, "")}/api/plugin-upload`;
+              const uploadResp = await fetch(uploadUrl, {
+                method: "POST",
+                headers: { "X-Pairing-Token": token },
+                body: formData as any,
+                signal: AbortSignal.timeout(30_000),
+              });
+
+              if (uploadResp.ok) {
+                const result = await uploadResp.json() as { url: string };
+                finalMediaUrl = result.url;
+                mediaEncrypted = true;
+                console.log(`[botschat][sendMedia] E2E encrypted media uploaded (${rawBytes.length} → ${encBytes.length} bytes)`);
+              } else {
+                console.error(`[botschat][sendMedia] Plugin upload failed: HTTP ${uploadResp.status}`);
+              }
+            } else {
+              console.error(`[botschat][sendMedia] Failed to download media: HTTP ${resp.status}`);
+            }
+          }
+        } catch (err) {
+          console.error(`[botschat][sendMedia] E2E media encryption failed, sending unencrypted:`, err);
+        }
+      }
+
       const notifyPreview = (encrypted && client.notifyPreview && ctx.text)
         ? (ctx.text.length > 100 ? ctx.text.slice(0, 100) + "…" : ctx.text)
         : undefined;
-      if (ctx.mediaUrl) {
+      if (finalMediaUrl) {
         client.send({
           type: "agent.media",
           sessionKey: ctx.to,
-          mediaUrl: ctx.mediaUrl,
+          mediaUrl: finalMediaUrl,
           caption: text || undefined,
           messageId,
           encrypted,
+          mediaEncrypted,
           ...(notifyPreview ? { notifyPreview } : {}),
         });
       } else {
@@ -241,11 +290,16 @@ export const botschatPlugin = {
       }
 
       const existingClient = cloudClients.get(accountId);
+      if (existingClient?.connected) {
+        log?.info(`[${accountId}] Already connected — skipping restart`);
+        return existingClient;
+      }
       if (existingClient) {
-        log?.info(`[${accountId}] Disconnecting previous client before reconnect`);
+        log?.info(`[${accountId}] Disconnecting stale client before reconnect`);
         existingClient.disconnect();
         cloudClients.delete(accountId);
         cloudUrls.delete(accountId);
+        pairingTokens.delete(accountId);
       }
 
       ctx.setStatus({
@@ -281,12 +335,14 @@ export const botschatPlugin = {
 
       cloudClients.set(accountId, client);
       cloudUrls.set(accountId, account.cloudUrl);
+      pairingTokens.set(accountId, account.pairingToken);
       client.connect();
 
       ctx.abortSignal.addEventListener("abort", () => {
         client.disconnect();
         cloudClients.delete(accountId);
         cloudUrls.delete(accountId);
+        pairingTokens.delete(accountId);
       });
 
       return client;

packages/plugin/src/types.ts

@@ -58,6 +58,7 @@ export type CloudOutbound =
       replyToId?: string;
       threadId?: string;
       encrypted?: boolean;
+      mediaEncrypted?: boolean;
       messageId?: string;
       notifyPreview?: string;
     }

packages/web/src/App.tsx

@@ -696,6 +696,7 @@ export default function App() {
             text: msg.text as string,
             timestamp: Date.now(),
             threadId,
+            encrypted: !!msg.encrypted,
           };
           if (threadId && sessionKey) {
             dispatch({ type: "ADD_THREAD_MESSAGE", message: chatMsg });
@@ -714,6 +715,8 @@ export default function App() {
             mediaUrl: msg.mediaUrl as string,
             timestamp: Date.now(),
             threadId,
+            encrypted: !!msg.encrypted,
+            mediaEncrypted: !!msg.mediaEncrypted,
           };
           if (threadId && sessionKey) {
             dispatch({ type: "ADD_THREAD_MESSAGE", message: mediaMsg });

packages/web/src/api.ts

@@ -291,7 +291,8 @@ export type MessageRecord = {
   mediaUrl?: string;
   a2ui?: string;
   threadId?: string;
-  encrypted?: boolean;
+  encrypted?: boolean | number;
+  mediaEncrypted?: boolean;
 };
 
 export const messagesApi = {

packages/web/src/components/ChatWindow.tsx

@@ -461,6 +461,8 @@ export function ChatWindow({ sendMessage }: ChatWindowProps) {
       text: trimmed,
       timestamp: Date.now(),
       mediaUrl,
+      encrypted: E2eService.hasKey(),
+      mediaEncrypted: !!mediaUrl && E2eService.hasKey(),
     };
 
     dispatch({ type: "ADD_MESSAGE", message: msg });
@@ -1061,7 +1063,7 @@ function MessageRow({
             text={msg.text}
             mediaUrl={msg.mediaUrl}
             messageId={msg.id}
-            encrypted={!!msg.mediaUrl && E2eService.hasKey()}
+            encrypted={!!msg.mediaEncrypted && !!msg.mediaUrl && E2eService.hasKey()}
             a2ui={msg.a2ui}
             isStreaming={msg.isStreaming}
             onAction={onAction}

packages/web/src/components/ThreadPanel.tsx

@@ -216,6 +216,8 @@ export function ThreadPanel({ sendMessage }: ThreadPanelProps) {
                 <MessageContent
                   text={parentMessage.text}
                   mediaUrl={parentMessage.mediaUrl}
+                  messageId={parentMessage.id}
+                  encrypted={!!parentMessage.mediaEncrypted && !!parentMessage.mediaUrl && E2eService.hasKey()}
                   a2ui={parentMessage.a2ui}
                   onAction={handleA2UIAction}
                   onResolveAction={(value, label) => handleResolveAction(parentMessage.id, value, label)}
@@ -274,6 +276,8 @@ export function ThreadPanel({ sendMessage }: ThreadPanelProps) {
                   <MessageContent
                     text={msg.text}
                     mediaUrl={msg.mediaUrl}
+                    messageId={msg.id}
+                    encrypted={!!msg.mediaEncrypted && !!msg.mediaUrl && E2eService.hasKey()}
                     a2ui={msg.a2ui}
                     isStreaming={msg.isStreaming}
                     onAction={handleA2UIAction}

packages/web/src/store.ts

@@ -15,6 +15,10 @@ export type ChatMessage = {
   /** Tracks which action blocks have been resolved, keyed by prompt hash */
   resolvedActions?: Record<string, { value: string; label: string }>;
   isEncryptedLocked?: boolean;
+  /** Whether the message text was E2E encrypted (bitmask from API: bit0=text, bit1=media) */
+  encrypted?: boolean | number;
+  /** Whether the media binary was E2E encrypted (derived from sender + encrypted flag) */
+  mediaEncrypted?: boolean;
 };
 
 export type ActiveView = "messages" | "automations";