sparkecoder 0.1.127 → 0.1.129

package/web/.next/standalone/web/src/components/chat-interface.tsx

@@ -544,6 +544,56 @@ interface QueuedMessage {
   selectedElements?: string | null;
 }
 
+/**
+ * Walk an arbitrary JSON-ish value and replace base64 image / binary
+ * blobs with a short placeholder. Without this, dumping a session that
+ * read several screenshots produces a multi-MB file that crashes the
+ * clipboard / chokes the IDE when you paste it back in.
+ *
+ * Heuristics for "this is binary I should strip":
+ *  - parts whose `.type` is `'image-data'`, `'image'`, `'file'`
+ *  - any string field named `data` / `image` / `base64` whose length is large
+ *  - any string > 8 KB that looks like base64 (long, no spaces)
+ */
+function stripBinaryBlobs(value: unknown, depth = 0): unknown {
+  if (depth > 100) return '[max depth]'; // belt-and-suspenders against cycles
+  if (value == null) return value;
+  if (typeof value === 'string') {
+    // Strip data: URIs and very long base64-looking blobs.
+    if (value.length > 8 * 1024 && /^(data:[^;]+;base64,)?[A-Za-z0-9+/=]{1000,}$/.test(value)) {
+      return `[stripped: ~${(value.length / 1024).toFixed(1)}KB base64]`;
+    }
+    return value;
+  }
+  if (Array.isArray(value)) return value.map((v) => stripBinaryBlobs(v, depth + 1));
+  if (typeof value === 'object') {
+    const obj = value as Record<string, unknown>;
+    // Whole-part replacement for known binary part types.
+    const type = obj.type;
+    if (type === 'image-data' || type === 'image' || type === 'file') {
+      const dataLen = typeof obj.data === 'string' ? obj.data.length : 0;
+      const imageLen = typeof obj.image === 'string' ? obj.image.length : 0;
+      return {
+        type,
+        mediaType: obj.mediaType,
+        filename: obj.filename,
+        __strippedBytes: dataLen || imageLen || 0,
+      };
+    }
+    const out: Record<string, unknown> = {};
+    for (const [k, v] of Object.entries(obj)) {
+      // Aggressive strip for fields that almost always carry binary payloads.
+      if ((k === 'data' || k === 'image' || k === 'base64') && typeof v === 'string' && v.length > 4 * 1024) {
+        out[k] = `[stripped: ~${(v.length / 1024).toFixed(1)}KB]`;
+        continue;
+      }
+      out[k] = stripBinaryBlobs(v, depth + 1);
+    }
+    return out;
+  }
+  return value;
+}
+
 /**
  * Gather EVERYTHING a developer might want to debug a session and return it
  * as a single pretty-printed JSON blob suitable for pasting into a bug
@@ -551,10 +601,11 @@ interface QueuedMessage {
  * recorded as `{ __error: '...' }` in its slot so the rest of the dump
  * still arrives.
  *
- * Intentionally chunky: messages include full model-message content,
- * tool inputs/outputs, attachments, todos, plans, checkpoints, working-
- * directory diff, pending approvals, browser recordings, etc. The whole
- * point is "everything we could possibly need."
+ * Intentionally chunky for code / config / message text, but binary blobs
+ * (screenshots, file uploads, image attachments) are stripped down to a
+ * `{__strippedBytes: N}` marker — the model already saw them at the time,
+ * and including a 1.3 MB base64 PNG per screenshot makes the dump
+ * unusable (we hit 4.5 MB in practice before stripping).
  */
 async function buildSessionDebugDump(sessionId: string): Promise<string> {
   const safe = async <T,>(label: string, fn: () => Promise<T>): Promise<T | { __error: string }> => {
@@ -593,14 +644,15 @@ async function buildSessionDebugDump(sessionId: string): Promise<string> {
     safe('browserRecordings', () => getBrowserRecordings(sessionId)),
   ]);
 
-  const dump = {
+  const dump = stripBinaryBlobs({
     __meta: {
       kind: 'sparkecoder-session-debug-dump',
-      version: 1,
+      version: 2,
       capturedAt: new Date().toISOString(),
       sessionId,
       origin: typeof window !== 'undefined' ? window.location.origin : null,
       userAgent: typeof navigator !== 'undefined' ? navigator.userAgent : null,
+      stripping: 'binary blobs (images, file uploads, base64 > 8KB) are replaced with size markers',
     },
     session,
     messages,
@@ -614,7 +666,7 @@ async function buildSessionDebugDump(sessionId: string): Promise<string> {
     pendingInput,
     browserStream,
     browserRecordings,
-  };
+  });
   return JSON.stringify(dump, null, 2);
 }