claude-simple 0.2.34 → 0.2.36

package/dist/index.html

@@ -4,13 +4,13 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
   <title>Claude Code</title>
-  <link rel="stylesheet" href="/style.0.2.34.min.css">
+  <link rel="stylesheet" href="/style.0.2.36.min.css">
   <link rel="stylesheet" href="/highlight.min.css">
   <script src="/marked.min.js"></script>
   <script src="/highlight.min.js"></script>
 </head>
 <body class="h-dvh overflow-hidden flex flex-col bg-base-100 text-base-content">
   <div id="root" class="flex flex-col flex-1 overflow-hidden"></div>
-  <script type="module" src="/app.0.2.34.min.js"></script>
+  <script type="module" src="/app.0.2.36.min.js"></script>
 </body>
 </html>

package/dist/{style.0.2.34.min.css → style.0.2.36.min.css}

@@ -140,6 +140,29 @@
   }
 }
 
+.file-download-toast {
+  position: fixed;
+  left: 50%;
+  bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px));
+  transform: translateX(-50%) translateY(8px);
+  z-index: 80;
+  max-width: min(92vw, 28rem);
+  padding: 0.7rem 1rem;
+  border-radius: 0.7rem;
+  background: var(--color-primary, #3b82f6);
+  color: var(--color-primary-content, #fff);
+  font-size: 0.85rem;
+  line-height: 1.35;
+  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity .18s ease, transform .18s ease;
+}
+.file-download-toast.visible {
+  opacity: 1;
+  transform: translateX(-50%) translateY(0);
+}
+
 /* File row actions: hover-reveal on desktop only */
 @media (min-width: 641px) {
   .file-row-action {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-simple",
-  "version": "0.2.34",
+  "version": "0.2.36",
   "type": "module",
   "bin": {
     "claude-simple": "server.js",

package/public/app.js

@@ -3,7 +3,7 @@ import { ctx } from './state.js';
 import { probeHub } from './api.js?v=ui-24';
 import { initShell, showApp, initAuth, resumeSession, switchTab, shouldRestoreSessionOnBoot } from './shell.js';
 import { initChat } from './chat.js?v=ui-24';
-import { initFilesTab } from './files.js?v=ui-24';
+import { initFilesTab } from './files.js?v=ui-29';
 import { initGitTab } from './git.js';
 import { initSettings } from './settings.js';
 import { initNotes } from './notes.js';
@@ -11,7 +11,7 @@ import { initTerminal } from './terminal.js';
 import { initImagePaste } from './chat.js?v=ui-24';
 import { initMetaAgent } from './agent-panel.js';
 import { initRouter, applyInitialRoute, parseHashPath } from './router.js';
-import { initPwa } from './pwa.js?v=ui-24';
+import { initPwa } from './pwa.js?v=ui-29';
 import { initMobileChrome } from './mobile.js';
 
 function markBootReady() {

package/public/download-status.js

@@ -0,0 +1,25 @@
+/** Shared download status copy for the Files tab toast. */
+export function sizeLabel(size) {
+  if (size == null) return '';
+  if (size > 1024 * 1024) return `${(size / (1024 * 1024)).toFixed(1)} MB`;
+  if (size > 1024) return `${(size / 1024).toFixed(1)} KB`;
+  return `${size} B`;
+}
+
+export function formatDownloadStatus(name, received, total) {
+  const n = name || 'file';
+  if (total > 0 && received != null) {
+    const pct = Math.min(100, Math.round((received / total) * 100));
+    return `正在下载 ${n}（${pct}%）`;
+  }
+  if (received > 0) return `正在下载 ${n}（${sizeLabel(received)}）`;
+  return `正在下载 ${n}…`;
+}
+
+export function formatDownloadDone(name) {
+  return `已保存 ${name || 'file'}，请查看浏览器下载栏`;
+}
+
+export function formatDownloadHandedOff(name) {
+  return `已交给浏览器下载 ${name || 'file'}`;
+}

package/public/files.js

@@ -6,6 +6,12 @@ import { resolveWorkspaceFile } from './workspace-path.js?v=ui-23';
 import { renderMermaid } from './mermaid.js';
 import { renderMath } from './math.js';
 import { parseMarkdownWithMath } from './markdown.js';
+import {
+  sizeLabel,
+  formatDownloadStatus,
+  formatDownloadDone,
+  formatDownloadHandedOff,
+} from './download-status.js?v=ui-29';
 
 // ── Helpers ───────────────────────────────────────────────────────────────────
 function fileIcon(name) {
@@ -33,13 +39,6 @@ function isMarkdownFile(path) {
   return ext === 'md' || ext === 'markdown' || ext === 'mdx';
 }
 
-function sizeLabel(size) {
-  if (size == null) return '';
-  if (size > 1024 * 1024) return `${(size / (1024 * 1024)).toFixed(1)} MB`;
-  if (size > 1024) return `${(size / 1024).toFixed(1)} KB`;
-  return `${size} B`;
-}
-
 function base64ToArrayBuffer(b64) {
   const bin = atob(b64);
   const bytes = new Uint8Array(bin.length);
@@ -381,35 +380,75 @@ function triggerUpload() {
   input.click();
 }
 
+let downloadBusy = false;
+let downloadToastTimer = 0;
+
+function downloadToastEl() {
+  let el = document.getElementById('file-download-toast');
+  if (el) return el;
+  el = document.createElement('div');
+  el.id = 'file-download-toast';
+  el.className = 'file-download-toast';
+  el.setAttribute('role', 'status');
+  el.setAttribute('aria-live', 'polite');
+  el.hidden = true;
+  document.body.appendChild(el);
+  return el;
+}
+
+function showDownloadToast(text, { sticky = false } = {}) {
+  const el = downloadToastEl();
+  el.textContent = text;
+  el.hidden = false;
+  el.classList.add('visible');
+  clearTimeout(downloadToastTimer);
+  if (!sticky) {
+    downloadToastTimer = setTimeout(() => {
+      el.classList.remove('visible');
+    }, 5000);
+  }
+}
+
+function triggerBrowserDownload(href, name) {
+  const a = document.createElement('a');
+  a.href = href;
+  a.download = name;
+  a.rel = 'noopener';
+  a.style.display = 'none';
+  document.body.appendChild(a);
+  a.click();
+  a.remove();
+}
+
 async function downloadFile(proj, filePath) {
   const root = filesRoot.peek() || proj?.path || '';
   if (!root) {
     alert('No path selected — set root first');
     return;
   }
+  if (downloadBusy) {
+    showDownloadToast('已有文件正在下载');
+    return;
+  }
   const id = '_';
   const name = (filePath || '').split('/').pop() || 'download';
-  // Prefer Authorization header (no token in URL / logs). authQuery kept as
-  // fallback for environments that only support plain navigations.
   const qs = new URLSearchParams({ root, path: filePath, download: 'true' });
   const url = `/api/projects/${id}/file?${qs}`;
+  downloadBusy = true;
+  showDownloadToast(formatDownloadStatus(name), { sticky: true });
   try {
-    const handle = typeof window.showSaveFilePicker === 'function'
-      ? await window.showSaveFilePicker({ suggestedName: name }) : null;
     const res = await fetch(url, { headers: authHeaders(), credentials: 'same-origin' });
     if (!res.ok) {
       const d = await res.json().catch(() => ({}));
       throw new Error(d.error || `HTTP ${res.status}`);
     }
-    if (handle && res.body) {
-      await res.body.pipeTo(await handle.createWritable());
-      return;
-    }
-    // Browsers without a file sink hand large downloads to their download manager.
     const maxBlob = 16 * 1024 * 1024;
-    if (Number(res.headers.get('content-length')) > maxBlob) {
+    const total = Number(res.headers.get('content-length')) || 0;
+    if (total > maxBlob || !res.body) {
       await res.body?.cancel();
-      throw new Error('Use native download');
+      triggerBrowserDownload(`/api/projects/${id}/file?${authQuery({ root, path: filePath, download: 'true' })}`, name);
+      showDownloadToast(formatDownloadHandedOff(name));
+      return;
     }
     const reader = res.body.getReader();
     const chunks = []; let bytes = 0;
@@ -417,37 +456,31 @@ async function downloadFile(proj, filePath) {
       const { done, value } = await reader.read();
       if (done) break;
       bytes += value.byteLength;
-      if (bytes > maxBlob) { await reader.cancel(); throw new Error('Use native download'); }
+      if (bytes > maxBlob) {
+        await reader.cancel();
+        triggerBrowserDownload(`/api/projects/${id}/file?${authQuery({ root, path: filePath, download: 'true' })}`, name);
+        showDownloadToast(formatDownloadHandedOff(name));
+        return;
+      }
       chunks.push(value);
+      showDownloadToast(formatDownloadStatus(name, bytes, total), { sticky: true });
     }
     const blob = new Blob(chunks, { type: res.headers.get('content-type') || 'application/octet-stream' });
     const objectUrl = URL.createObjectURL(blob);
-    const a = document.createElement('a');
-    a.href = objectUrl;
-    a.download = name;
-    a.rel = 'noopener';
-    a.style.display = 'none';
-    document.body.appendChild(a);
-    a.click();
-    a.remove();
-    // iOS may need the URL briefly; revoke after a beat.
+    triggerBrowserDownload(objectUrl, name);
     setTimeout(() => URL.revokeObjectURL(objectUrl), 60_000);
+    showDownloadToast(formatDownloadDone(name));
   } catch (e) {
     if (e.name === 'AbortError') return;
-    // Last resort: open with token query (works when fetch is blocked, e.g. some WebViews).
     try {
-      const fallback = `/api/projects/${id}/file?${authQuery({ root, path: filePath, download: 'true' })}`;
-      const a = document.createElement('a');
-      a.href = fallback;
-      a.download = name;
-      a.rel = 'noopener';
-      a.target = '_blank';
-      document.body.appendChild(a);
-      a.click();
-      a.remove();
+      triggerBrowserDownload(`/api/projects/${id}/file?${authQuery({ root, path: filePath, download: 'true' })}`, name);
+      showDownloadToast(formatDownloadHandedOff(name));
     } catch {
+      showDownloadToast(`下载失败：${e.message}`);
       alert(`Download failed: ${e.message}`);
     }
+  } finally {
+    downloadBusy = false;
   }
 }
 

package/public/index.html

@@ -85,7 +85,7 @@
   <script src="/vendor/mermaid.min.js"></script>
   <link rel="stylesheet" href="/vendor/katex.min.css">
   <script src="/vendor/katex.min.js"></script>
-  <link rel="stylesheet" href="style.css?v=ui-28">
+  <link rel="stylesheet" href="style.css?v=ui-29">
 </head>
 <body class="h-dvh overflow-hidden flex flex-col bg-base-100 text-base-content">
   <div id="root" class="flex flex-col flex-1 overflow-hidden"></div>
@@ -101,6 +101,6 @@
       }
     }, 10000);
   </script>
-  <script type="module" src="app.js?v=ui-28"></script>
+  <script type="module" src="app.js?v=ui-29"></script>
 </body>
 </html>

package/public/pwa.js

@@ -69,7 +69,7 @@ export function initPwa() {
 
   // Register after first paint so install doesn't compete with boot.
   const register = () => {
-    navigator.serviceWorker.register('/sw.js?v=33', { scope: '/' })
+    navigator.serviceWorker.register('/sw.js?v=38', { scope: '/' })
       .then((reg) => {
         reg.addEventListener('updatefound', () => {
           const sw = reg.installing;

package/public/style.css

@@ -138,6 +138,29 @@
   }
 }
 
+.file-download-toast {
+  position: fixed;
+  left: 50%;
+  bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px));
+  transform: translateX(-50%) translateY(8px);
+  z-index: 80;
+  max-width: min(92vw, 28rem);
+  padding: 0.7rem 1rem;
+  border-radius: 0.7rem;
+  background: var(--color-primary, #3b82f6);
+  color: var(--color-primary-content, #fff);
+  font-size: 0.85rem;
+  line-height: 1.35;
+  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity .18s ease, transform .18s ease;
+}
+.file-download-toast.visible {
+  opacity: 1;
+  transform: translateX(-50%) translateY(0);
+}
+
 /* File row actions: hover-reveal on desktop only */
 @media (min-width: 641px) {
   .file-row-action {

package/public/sw.js

@@ -1,12 +1,12 @@
 /* Agent UI service worker — cache shell assets only.
  * Never intercepts WebSocket or mutates API semantics beyond offline fallback.
  * Bump CACHE when shipping UI that must invalidate old shells. */
-const CACHE = 'agent-ui-shell-v37';
+const CACHE = 'agent-ui-shell-v38';
 const PRECACHE = [
   '/',
   '/index.html',
   '/manifest.webmanifest',
-  '/style.css?v=ui-28',
+  '/style.css?v=ui-29',
   '/style.css',
   '/ui.min.css',
   '/vendor/mini-react.min.js',
@@ -16,7 +16,7 @@ const PRECACHE = [
   '/vendor/mermaid.min.js',
   '/vendor/katex.min.js',
   '/vendor/katex.min.css',
-  '/app.js?v=ui-28',
+  '/app.js?v=ui-29',
   '/icons/icon-192.png',
   '/icons/icon-512.png',
   '/icons/icon-maskable-512.png',

package/src/runtime/http-transfer.js

@@ -1,4 +1,5 @@
 import { WebSocket } from 'ws';
+import { request } from 'node:http';
 import { setTimeout as sleep } from 'node:timers/promises';
 
 // Aggregate wire budget across downloads/previews, separate from chat traffic.
@@ -46,15 +47,22 @@ export function createHTTPTransfer({ gatewayURL, token, machineId, budget = new
         ws.send(JSON.stringify({ ...data, reqId: msg.reqId }), err => err ? reject(err) : resolve());
       });
       try {
-        const res = await fetch(url, { ...options, signal: controller.signal });
-        const headers = sanitizeHeaders(Object.fromEntries(res.headers.entries()));
+        // A paced consumer can outlive the local server's keep-alive timeout.
+        // Read the dedicated HTTP stream directly instead of fetch's pooled parser.
+        const res = await new Promise((resolve, reject) => {
+          const req = request(url, { method: options.method, headers: { ...options.headers, Connection: 'close', 'Accept-Encoding': 'identity' }, signal: controller.signal }, resolve);
+          req.on('error', reject);
+          req.end(options.body);
+        });
+        const upstreamHeaders = Object.fromEntries(Object.entries(res.headers).filter(([, value]) => value != null).map(([key, value]) => [key, Array.isArray(value) ? value.join(', ') : String(value)]));
+        const headers = sanitizeHeaders(upstreamHeaders);
         // Identity bodies retain their exact length (ordinary proxy replies recompute it).
-        if (!res.headers.get('content-encoding') || res.headers.get('content-encoding') === 'identity') {
-          const length = res.headers.get('content-length');
-          if (length !== null) headers['content-length'] = length;
+        if (!upstreamHeaders['content-encoding'] || upstreamHeaders['content-encoding'] === 'identity') {
+          const length = upstreamHeaders['content-length'];
+          if (length != null) headers['content-length'] = length;
         }
-        await send({ type: 'http-res-start', status: res.status, headers });
-        for await (const value of res.body || []) {
+        await send({ type: 'http-res-start', status: res.statusCode, headers });
+        for await (const value of res) {
           // Each frame is small; sends wait for socket backpressure and share a rate cap.
           for (let offset = 0; offset < value.byteLength; offset += 24 * 1024) {
             const chunk = Buffer.from(value.subarray(offset, offset + 24 * 1024));
@@ -65,6 +73,7 @@ export function createHTTPTransfer({ gatewayURL, token, machineId, budget = new
         await send({ type: 'http-end' });
       } catch (err) {
         if (ws.readyState === WebSocket.OPEN) await send({ type: 'http-error', message: err.message }).catch(() => {});
+        console.warn(`[transfer] ${msg.reqId}: ${err.message}`);
         throw err;
       }
     } finally {