tavern-harness 0.1.19 → 0.1.21

package/CHANGELOG.md

@@ -3,6 +3,62 @@
 > 本文件由 `scripts/changelog.mjs` 从 `changelog/v*.md` 生成，请勿手动编辑。
 > 版本对比链接见文末；源文件位于仓库 `changelog/` 目录。
 
+## [0.1.21] - 2026-10-26
+
+### 中文
+
+#### 改进
+
+- 移动端会话头部的操作按钮收进「更多操作」菜单（工作区文件、编辑对话、重置对话、导出游玩记录、删除对话），头部不再拥挤；主题切换按钮仍然直接显示
+- 移动端会话标题可用的横向空间明显变大，长标题能显示更多内容
+- 会话列表中的标题和副标题过长时改为末尾渐隐，不再用省略号生硬截断
+- 会话头部的上下文用量标签字号略微收小，和标题搭配更协调
+
+### English
+
+#### Changed
+
+- On mobile, session header actions now collapse into a "More actions" menu (workspace files, edit, reset, export gameplay, delete), so the header is no longer cramped; the theme toggle stays one tap away
+- Mobile session titles get noticeably more horizontal room, so long titles reveal more of their text
+- Long session list titles and subtitles now fade out at the end instead of being cut off with an ellipsis
+- The context usage badge in the session header uses a slightly smaller font so it sits better next to the title
+
+## [0.1.20] - 2026-10-26
+
+### 中文
+
+#### 新增
+
+- 新增「纯净模式」：只显示消息正文，隐藏思考过程和工具调用；没有正文的消息也会一并隐藏，实际的思考和工具执行不受影响（在「设置 → 工具执行」中开启）
+- HTML 预览可以在新页面打开，方便全屏查看和调试交互式页面
+
+#### 改进
+
+- 长会话加载明显更快：消息列表不再携带每次请求的原始日志，改为打开「查看原始日志」时按需读取；切回已加载过的会话时直接复用内存中的内容，不再重复拉取
+- 长会话下持久化服务更稳定：响应启用 brotli / gzip 压缩，服务繁忙时刷新页面不再误报会话加载失败
+- HTML 预览的缩放按钮移到底部说明栏，不再占用顶部工具栏，预览区域更宽敞
+
+#### 修复
+
+- 会话标题过长时不再挤压右侧按钮：标题限制最大宽度并在末尾渐隐
+
+### English
+
+#### Added
+
+- New "Pure mode": shows only message bodies, hiding reasoning and tool calls; messages without body text are hidden too, while actual reasoning and tool execution keep running (enable it in Settings → Tool execution)
+- HTML previews can be opened in a new page for full-screen viewing and debugging interactive pages
+
+#### Changed
+
+- Long conversations load noticeably faster: message lists no longer carry per-request raw logs — they're fetched only when you open "View raw log" — and switching back to a session you've already loaded reuses the in-memory copy instead of fetching it again
+- The persistence service holds up better with long conversations: responses are brotli / gzip compressed, and a busy service no longer triggers false "failed to load session" errors after a page refresh
+- HTML preview zoom buttons moved to the bottom note bar, freeing the top toolbar and giving the preview more room
+
+#### Fixed
+
+- Long session titles no longer squeeze the header buttons: the title is capped in width and fades out at the end
+
 ## [0.1.19] - 2026-10-25
 
 ### 中文
@@ -552,6 +608,8 @@
 - Vite + React + Zustand + Dexie stack with browser-side local persistence
 
 <!-- 链接定义 -->
+[0.1.21]: https://github.com/Rannichan/Tavern-Harness/compare/v0.1.20...v0.1.21
+[0.1.20]: https://github.com/Rannichan/Tavern-Harness/compare/v0.1.19...v0.1.20
 [0.1.19]: https://github.com/Rannichan/Tavern-Harness/compare/v0.1.18...v0.1.19
 [0.1.18]: https://github.com/Rannichan/Tavern-Harness/compare/v0.1.17...v0.1.18
 [0.1.17]: https://github.com/Rannichan/Tavern-Harness/compare/v0.1.16...v0.1.17

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tavern-harness",
-  "version": "0.1.19",
+  "version": "0.1.21",
   "description": "Tavern Harness — 酒馆模式下的本地 AI Agent 助手（MyAgent-Android 的 Web 复刻）",
   "private": false,
   "type": "module",

package/persistence-server.mjs

@@ -4,6 +4,7 @@
 
 import { createServer } from 'node:http';
 import { randomBytes, timingSafeEqual } from 'node:crypto';
+import { brotliCompressSync, constants as zlibConstants, gzipSync } from 'node:zlib';
 import { mkdirSync } from 'node:fs';
 import { homedir } from 'node:os';
 import { dirname, join, resolve } from 'node:path';
@@ -72,11 +73,26 @@ function setWriteLock(lock) {
 }
 
 function json(res, status, body) {
-  res.writeHead(status, {
+  const payload = Buffer.from(JSON.stringify(body));
+  const acceptedEncodings = String(res.req.headers['accept-encoding'] || '').toLowerCase();
+  const headers = {
     'Content-Type': 'application/json; charset=utf-8',
     'Cache-Control': 'no-store',
-  });
-  res.end(JSON.stringify(body));
+    'Vary': 'Accept-Encoding',
+  };
+  let encoded = payload;
+  if (payload.length >= 1024 && /\bbr\b/.test(acceptedEncodings)) {
+    encoded = brotliCompressSync(payload, {
+      params: { [zlibConstants.BROTLI_PARAM_QUALITY]: 4 },
+    });
+    headers['Content-Encoding'] = 'br';
+  } else if (payload.length >= 1024 && /\bgzip\b/.test(acceptedEncodings)) {
+    encoded = gzipSync(payload, { level: 6 });
+    headers['Content-Encoding'] = 'gzip';
+  }
+  headers['Content-Length'] = String(encoded.length);
+  res.writeHead(status, headers);
+  res.end(encoded);
 }
 
 function readJson(req, maxBytes) {
@@ -152,6 +168,12 @@ function saveRecord(collection, key, value) {
 
 const getRecord = database.prepare('SELECT value_json, updated_at FROM app_records WHERE collection = ? AND record_key = ?');
 const listRecords = database.prepare('SELECT record_key, value_json, updated_at FROM app_records WHERE collection = ? ORDER BY record_key');
+const getMessageRawLog = database.prepare(`
+  SELECT json_extract(value_json, '$.rawRequestBody') AS raw_request_body,
+         json_extract(value_json, '$.rawResponseBody') AS raw_response_body
+  FROM app_records
+  WHERE collection = 'messages' AND record_key = ?
+`);
 const listRecordsByJsonField = database.prepare(`
   SELECT record_key, value_json, updated_at
   FROM app_records
@@ -268,6 +290,21 @@ const server = createServer(async (req, res) => {
       return;
     }
 
+    if (pathname === '/records/message-raw-log') {
+      if (collection !== 'messages' || !validKey(body.key)) {
+        json(res, 400, { ok: false, message: 'A valid message key is required' });
+        return;
+      }
+      const record = getMessageRawLog.get(body.key);
+      json(res, 200, {
+        ok: true,
+        rawLog: record ? {
+          rawRequestBody: record.raw_request_body ?? null,
+          rawResponseBody: record.raw_response_body ?? null,
+        } : null,
+      });
+      return;
+    }
     if (pathname === '/records/list' || pathname === '/records/list-by-field') {
       let rows;
       if (pathname === '/records/list-by-field') {
@@ -284,11 +321,16 @@ const server = createServer(async (req, res) => {
       } else {
         rows = listRecords.all(collection);
       }
-      const records = rows.map((row) => ({
-        key: row.record_key,
-        value: JSON.parse(row.value_json),
-        updatedAt: row.updated_at,
-      }));
+      const records = rows.map((row) => {
+        const value = JSON.parse(row.value_json);
+        // 原始请求与响应只在用户显式打开日志时按消息 id 获取，避免长会话重复传输大字段。
+        if (collection === 'messages') {
+          value.rawLogAvailable = Boolean(value.rawRequestBody || value.rawResponseBody);
+          value.rawRequestBody = null;
+          value.rawResponseBody = null;
+        }
+        return { key: row.record_key, value, updatedAt: row.updated_at };
+      });
       json(res, 200, { ok: true, records });
       return;
     }

package/src/App.tsx

@@ -24,6 +24,27 @@ function formatContextTokens(tokens: number): string {
   return `${(tokens / 1_000).toFixed(1)}K`;
 }
 
+function ChatLoadingPlaceholder({ session }: { session: import('./types/models').ChatSession }) {
+  const npcs = useStore((s) => s.npcs);
+  const t = useT();
+  const npc = session.associatedId != null ? npcs.find((item) => item.id === session.associatedId) : null;
+
+  return (
+    <div className="chat-scroll" aria-busy="true">
+      <div className="chat-col">
+        <div className="empty-state fade-up">
+          <div className="big">🫖</div>
+          <div>
+            {session.mode === 'STANDARD' && <><b>{t('chat.emptyStandardTitle')}</b><br />{t('chat.emptyStandardSub')}</>}
+            {session.mode === 'NPC' && <><b>{t('chat.emptyNpcTitle', { name: npc?.name ?? t('chat.speakerChar') })}</b><br />{npc?.greeting}</>}
+            {session.mode === 'GROUP' && <><b>{t('chat.emptyGroupTitle')}</b><br />{t('chat.emptyGroupSub')}</>}
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+
 export default function App() {
   const [takingControl, setTakingControl] = useState(false);
   const initStatus = useStore((s) => s.initStatus);
@@ -39,6 +60,7 @@ export default function App() {
     setMountedViews([...mountedViews, activeView]);
   }
   const activeSessionId = useStore((s) => s.activeSessionId);
+  const [renderedSessionId, setRenderedSessionId] = useState<number | null>(activeSessionId);
   const sessions = useStore((s) => s.sessions);
   const messages = useStore((s) => s.messages);
   const contextCompressions = useStore((s) => s.contextCompressions);
@@ -75,10 +97,19 @@ export default function App() {
   }, [isStreaming]);
 
   const activeSession = sessions.find((s) => s.id === activeSessionId) ?? null;
-  const sessionMessages = activeSessionId != null ? (messages[activeSessionId] ?? []) : [];
   const sessionParticipants = activeSessionId != null ? (participants[activeSessionId] ?? []) : [];
   const isStreamingSession = useStore((s) => s.streaming.sessionId === activeSessionId);
 
+  useEffect(() => {
+    if (activeSessionId == null || messages[activeSessionId] !== undefined) {
+      setRenderedSessionId(activeSessionId);
+    }
+  }, [activeSessionId, messages]);
+
+  const renderedSession = sessions.find((s) => s.id === renderedSessionId) ?? null;
+  const renderedSessionMessages = renderedSessionId != null ? (messages[renderedSessionId] ?? []) : [];
+  const renderedSessionParticipants = renderedSessionId != null ? (participants[renderedSessionId] ?? []) : [];
+
   const handleTakeOverControl = async () => {
     setTakingControl(true);
     try {
@@ -150,14 +181,18 @@ export default function App() {
                 <SessionHeader session={activeSession} participants={sessionParticipants} />
                 <div className="chat-main-row">
                   <div className="chat-main-col">
-                    <ChatView
-                      session={activeSession}
-                      messages={sessionMessages}
-                      participants={sessionParticipants}
-                      compressions={contextCompressions[activeSession.id!] ?? []}
-                      streaming={isStreamingSession}
-                      active={activeView === 'chat'}
-                    />
+                    {renderedSession != null && renderedSession.id === activeSession.id ? (
+                      <ChatView
+                        session={renderedSession}
+                        messages={renderedSessionMessages}
+                        participants={renderedSessionParticipants}
+                        compressions={contextCompressions[renderedSession.id!] ?? []}
+                        streaming={isStreamingSession}
+                        active={activeView === 'chat'}
+                      />
+                    ) : (
+                      <ChatLoadingPlaceholder session={activeSession} />
+                    )}
                     <ChatInput sessionId={activeSession.id!} />
                   </div>
                   <TurnQueuePanel session={activeSession} participants={sessionParticipants} />
@@ -292,6 +327,8 @@ function SessionHeader({
   const [confirmDelete, setConfirmDelete] = useState(false);
   const [exportOpen, setExportOpen] = useState(false);
   const [showWorkspace, setShowWorkspace] = useState(false);
+  const [showMobileActions, setShowMobileActions] = useState(false);
+  const mobileActionsRef = useRef<HTMLDivElement>(null);
 
   const messages = useStore((s) => s.messages[session.id!] ?? []);
   const contextTokens = useMemo(() => {
@@ -315,6 +352,17 @@ function SessionHeader({
     || (themeMode === 'system' && document.documentElement.dataset.theme === 'dark');
   const toggleTheme = () => void setSettings({ themeMode: isDarkTheme ? 'light' : 'dark' });
 
+  useEffect(() => {
+    if (!showMobileActions) return;
+    const closeOnOutsidePointerDown = (event: PointerEvent) => {
+      if (!mobileActionsRef.current?.contains(event.target as Node)) {
+        setShowMobileActions(false);
+      }
+    };
+    document.addEventListener('pointerdown', closeOnOutsidePointerDown);
+    return () => document.removeEventListener('pointerdown', closeOnOutsidePointerDown);
+  }, [showMobileActions]);
+
   return (
     <div className="chat-header">
       <SessionVisual mode={session.mode} npcName={npcRef?.name ?? undefined} hue={npcRef?.avatarColorOrdinal ?? 0} imageUrl={npcRef?.avatarDataUrl} members={session.mode === 'GROUP' ? groupMemberAvatars : undefined} size="lg" />
@@ -326,7 +374,7 @@ function SessionHeader({
           </div>
         )}
       </div>
-      <div className="chat-actions">
+      <div className="chat-actions" ref={mobileActionsRef}>
         <button className="btn-ghost icon-tooltip" title={t(usesPublicWorkspace ? 'header.workspaceRootHint' : 'header.workspaceHint')} onClick={() => setShowWorkspace(true)}>
           <Icon name="folder" size={17} />
         </button>
@@ -343,7 +391,17 @@ function SessionHeader({
           <Icon name="trash" size={17} />
         </button>
         <button
-          className="btn-ghost icon-tooltip"
+          className="btn-ghost icon-tooltip chat-actions-more"
+          type="button"
+          title={t('header.moreActions')}
+          aria-label={t('header.moreActions')}
+          aria-expanded={showMobileActions}
+          onClick={() => setShowMobileActions(!showMobileActions)}
+        >
+          <Icon name="more" size={18} />
+        </button>
+        <button
+          className="btn-ghost icon-tooltip chat-theme-toggle"
           type="button"
           title={t(isDarkTheme ? 'header.switchToLightTip' : 'header.switchToDarkTip')}
           aria-label={t(isDarkTheme ? 'header.switchToLightTip' : 'header.switchToDarkTip')}
@@ -351,6 +409,25 @@ function SessionHeader({
         >
           <Icon name={isDarkTheme ? 'sun' : 'moon'} size={17} />
         </button>
+        {showMobileActions && (
+          <div className="chat-actions-menu card">
+            <button onClick={() => { setShowWorkspace(true); setShowMobileActions(false); }}>
+              <Icon name="folder" size={15} /> {t('header.workspaceAction')}
+            </button>
+            <button onClick={() => { setShowEdit(true); setShowMobileActions(false); }}>
+              <Icon name="pencil" size={15} /> {t('nav.editSession')}
+            </button>
+            <button onClick={() => { setConfirmReset(true); setShowMobileActions(false); }}>
+              <Icon name="refresh" size={15} /> {t('header.resetSessionTip')}
+            </button>
+            <button onClick={() => { setExportOpen(true); setShowMobileActions(false); }}>
+              <Icon name="share" size={15} /> {t('nav.exportGameplay')}
+            </button>
+            <button className="danger" onClick={() => { setConfirmDelete(true); setShowMobileActions(false); }}>
+              <Icon name="trash" size={15} /> {t('header.deleteTip')}
+            </button>
+          </div>
+        )}
       </div>
 
       {showEdit && <NewSessionMenu editingSession={session} onClose={() => setShowEdit(false)} />}

package/src/components/ChatView.tsx

@@ -1,5 +1,6 @@
 import { Fragment, lazy, Suspense, useEffect, useLayoutEffect, useMemo, useRef, useState, type ReactNode, type UIEvent } from 'react';
 import { useStore } from '../store/store';
+import { db } from '../db/database';
 import { type ChatMessage, type ChatParticipant, type ChatSession, type ContextCompression, type ToolCallRecord, displayModelName } from '../types/models';
 import { Avatar, Icon, Markdown, Collapse, Modal, AttachCard } from './shared';
 import { FileDisplayViewButton, parseStoredDisplayRef } from './FileDisplayModal';
@@ -119,6 +120,39 @@ export function ChatView({
     () => new Map(compressions.map((compression) => [compression.endMessageId, compression])),
     [compressions],
   );
+  const parsedToolCallsCache = useRef(new Map<number, { source: string; calls: ToolCallRecord[] }>());
+  const toolMessageData = useMemo(() => {
+    const resultsByCallId = new Map<string, ChatMessage[]>();
+    const displayedCallIds = new Set<string>();
+
+    for (const message of messages) {
+      if (message.role === 'tool' && message.toolCallId) {
+        const results = resultsByCallId.get(message.toolCallId);
+        if (results) results.push(message);
+        else resultsByCallId.set(message.toolCallId, [message]);
+        continue;
+      }
+      if (message.role !== 'assistant' || !message.toolCallsJson) continue;
+
+      const cached = message.id != null ? parsedToolCallsCache.current.get(message.id) : undefined;
+      let calls: ToolCallRecord[];
+      if (cached?.source === message.toolCallsJson) {
+        calls = cached.calls;
+      } else {
+        try {
+          calls = JSON.parse(message.toolCallsJson) as ToolCallRecord[];
+        } catch {
+          calls = [];
+        }
+        if (message.id != null) {
+          parsedToolCallsCache.current.set(message.id, { source: message.toolCallsJson, calls });
+        }
+      }
+      for (const call of calls) if (call.id) displayedCallIds.add(call.id);
+    }
+
+    return { resultsByCallId, displayedCallIds };
+  }, [messages]);
 
   useEffect(() => {
     const el = scrollRef.current;
@@ -275,33 +309,6 @@ export function ChatView({
     return personaId != null ? s.npcs.find((npc) => npc.id === personaId)?.name ?? null : null;
   });
 
-  // 工具调用结果按 toolCallId 分组；已由 assistant 消息工具卡片展示的调用 id，其结果并入卡片内部渲染
-  const toolResultsByCallId = useMemo(() => {
-    const map = new Map<string, ChatMessage[]>();
-    for (const m of messages) {
-      if (m.role === 'tool' && m.toolCallId) {
-        const arr = map.get(m.toolCallId);
-        if (arr) arr.push(m);
-        else map.set(m.toolCallId, [m]);
-      }
-    }
-    return map;
-  }, [messages]);
-  const displayedToolCallIds = useMemo(() => {
-    const ids = new Set<string>();
-    for (const m of messages) {
-      if (m.role !== 'assistant') continue;
-      try {
-        for (const tc of JSON.parse(m.toolCallsJson || '[]') as ToolCallRecord[]) {
-          if (tc.id) ids.add(tc.id);
-        }
-      } catch {
-        /* ignore */
-      }
-    }
-    return ids;
-  }, [messages]);
-
   const handleScroll = (event: UIEvent<HTMLDivElement>) => {
     const el = event.currentTarget;
     // 隐藏过程中浏览器会把滚动位置夹到 0 并派发一次 scroll 事件，
@@ -354,8 +361,8 @@ export function ChatView({
               userPersonaName={userPersonaName}
               loopIndex={isGroup ? (m.loopIndex ?? 0) : null}
               streaming={streaming && m.id === lastMsgId(messages)}
-              toolResultsByCallId={toolResultsByCallId}
-              suppressedResultIds={displayedToolCallIds}
+              toolResultsByCallId={toolMessageData.resultsByCallId}
+              suppressedResultIds={toolMessageData.displayedCallIds}
             />
             {compressionsByEndMessageId.has(m.id!) && (
               <div className="compression-banner-wrap">
@@ -422,6 +429,7 @@ function MessageBubble({
 }) {
   const t = useT();
   const providers = useStore((s) => s.providers);
+  const pureMode = useStore((s) => s.settings?.pureMode === true);
   const turnStreaming = useStore((s) => s.streaming.sessionId === session.id);
   const longPressProps = useMessageLongPress(msg, session);
   // System 消息（/new 标记）
@@ -434,6 +442,7 @@ function MessageBubble({
 
   // 工具消息
   if (msg.role === 'tool') {
+    if (pureMode) return null;
     // 该结果已并入发起它的工具调用卡片内部 → 不再独立渲染
     if (msg.toolCallId && suppressedResultIds.has(msg.toolCallId)) return null;
     const isError = msg.content.startsWith('ERROR:') || msg.content.startsWith('CANCELLED:');
@@ -486,6 +495,8 @@ function MessageBubble({
     return <UserBubble msg={msg} session={session} userPersonaName={userPersonaName} loopIndex={loopIndex} />;
   }
 
+  if (pureMode && !displayContent && msg.attachments.length === 0) return null;
+
   // 用于「点击队列发言 → 对话定位」：NPC 用 participantId，玩家/未知用 null（定位到循环首条）
   const speakerKey = msg.speakerParticipantId != null ? String(msg.speakerParticipantId) : null;
 
@@ -510,7 +521,7 @@ function MessageBubble({
           {msg.modelUsed && !msg.modelUsed.startsWith('scheduled:') && <span className="msg-model" title={msg.modelUsed}>{displayModelName(providers, msg.modelUsed)}</span>}
           <span className="msg-time">{fmtTime(msg.timestamp)}</span>
         </div>
-        {msg.thinkingContent && (
+        {!pureMode && msg.thinkingContent && (
           <Collapse
             title={t('chat.thinking')}
             icon="🧠"
@@ -521,7 +532,7 @@ function MessageBubble({
             <Markdown text={msg.thinkingContent} mathEnabled={false} />
           </Collapse>
         )}
-        {toolCalls.length > 0 && (
+        {!pureMode && toolCalls.length > 0 && (
           <div className="tool-calls">
             {toolCalls.map((tc, i) => (
               <ToolCallCard
@@ -1411,16 +1422,21 @@ export function MessageMenu() {
       },
     });
   }
-  if (msg.rawRequestBody || msg.rawResponseBody) {
+  if (msg.rawRequestBody || msg.rawResponseBody || msg.rawLogAvailable) {
     actions.push({
       label: t('chat.viewRaw'),
       icon: 'file',
-      onClick: () => {
-        setRawLog({
-          data: msg,
-          title: t('chat.rawLogTitle', { id: msg.id ?? '' }),
-          filename: `raw-log-${msg.id}.txt`,
-        });
+      onClick: async () => {
+        const rawLog = msg.rawRequestBody || msg.rawResponseBody
+          ? msg
+          : await db.messages.getRawLog(msg.id!);
+        if (rawLog) {
+          setRawLog({
+            data: { ...rawLog, id: msg.id, role: msg.role },
+            title: t('chat.rawLogTitle', { id: msg.id ?? '' }),
+            filename: `raw-log-${msg.id}.txt`,
+          });
+        }
         closeMsgMenu();
       },
     });

package/src/components/FileDisplayModal.tsx

@@ -79,6 +79,7 @@ export function FileDisplayModal() {
   const [loadState, setLoadState] = useState<'loading' | 'ok' | 'error'>('loading');
   const [imgError, setImgError] = useState(false);
   const [htmlZoom, setHtmlZoom] = useState(1);
+  const lastModalHtmlZoomRef = useRef(1);
   const [textWrap, setTextWrap] = useState(true);
   const [isPictureInPicture, setIsPictureInPicture] = useState(true);
   const [pipRect, setPipRect] = useState<PipRect>(createPipRect);
@@ -124,11 +125,14 @@ export function FileDisplayModal() {
     setImgError(false);
     setZoom(1);
     setPan({ x: 0, y: 0 });
-    setHtmlZoom(1);
     setTextWrap(true);
     if (isNewDisplay) {
+      const opensInPictureInPicture = active.presentation === 'pip' || active.presentation == null;
+      setHtmlZoom(opensInPictureInPicture ? lastModalHtmlZoomRef.current : 1);
       setPipRect(createPipRect());
-      setIsPictureInPicture(active.presentation === 'pip' || active.presentation == null);
+      setIsPictureInPicture(opensInPictureInPicture);
+    } else {
+      setHtmlZoom(1);
     }
   }, [active]);
 
@@ -276,6 +280,11 @@ export function FileDisplayModal() {
     setIsPictureInPicture(false);
   };
 
+  const openHtmlInNewPage = () => {
+    if (!active || !workspaceDir) return;
+    window.open(previewUrl(active.path, workspaceDir), '_blank', 'noopener,noreferrer');
+  };
+
   const startResize = (edge: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right') => (e: ReactPointerEvent<HTMLButtonElement>) => {
     pipGestureRef.current = {
       type: 'resize',
@@ -312,8 +321,16 @@ export function FileDisplayModal() {
 
   const zoomIn = () => setZoom((z) => Math.min(8, +(z * 1.3).toFixed(2)));
   const zoomOut = () => setZoom((z) => Math.max(0.1, +(z / 1.3).toFixed(2)));
-  const htmlZoomIn = () => setHtmlZoom((z) => Math.min(2, +(z + 0.1).toFixed(1)));
-  const htmlZoomOut = () => setHtmlZoom((z) => Math.max(0.5, +(z - 0.1).toFixed(1)));
+  const updateHtmlZoom = (update: (zoom: number) => number) => {
+    setHtmlZoom((zoom) => {
+      const nextZoom = update(zoom);
+      if (!isPictureInPicture) lastModalHtmlZoomRef.current = nextZoom;
+      return nextZoom;
+    });
+  };
+  const htmlZoomIn = () => updateHtmlZoom((z) => Math.min(2, +(z + 0.1).toFixed(1)));
+  const htmlZoomOut = () => updateHtmlZoom((z) => Math.max(0.5, +(z - 0.1).toFixed(1)));
+  const resetHtmlZoom = () => updateHtmlZoom(() => 1);
   const resetView = () => {
     setZoom(1);
     setPan({ x: 0, y: 0 });
@@ -393,7 +410,16 @@ export function FileDisplayModal() {
               }}
             />
           </div>
-          <div className="display-html-note">{t('display.htmlSandboxNote')}</div>
+          <div className="display-html-note">
+            <span>{t('display.htmlSandboxNote')}</span>
+            {!isPictureInPicture && (
+              <span className="display-html-zoom-group">
+                <button className="icon-btn" title={t('display.htmlZoomOut')} onClick={htmlZoomOut}><Icon name="zoom-out" size={15} /></button>
+                <button className="icon-btn" title={t('display.resetHtmlZoom')} onClick={resetHtmlZoom}>{Math.round(htmlZoom * 100)}%</button>
+                <button className="icon-btn" title={t('display.htmlZoomIn')} onClick={htmlZoomIn}><Icon name="zoom-in" size={15} /></button>
+              </span>
+            )}
+          </div>
         </div>
       );
     }
@@ -451,13 +477,6 @@ export function FileDisplayModal() {
               <button className="icon-btn" title={t('display.zoomIn')} onClick={zoomIn}><Icon name="zoom-in" size={15} /></button>
             </span>
           )}
-          {active.kind === 'html' && loadState === 'ok' && (
-            <span className="display-zoom-group">
-              <button className="icon-btn" title={t('display.htmlZoomOut')} onClick={htmlZoomOut}><Icon name="zoom-out" size={15} /></button>
-              <button className="icon-btn" title={t('display.resetHtmlZoom')} onClick={() => setHtmlZoom(1)}>{Math.round(htmlZoom * 100)}%</button>
-              <button className="icon-btn" title={t('display.htmlZoomIn')} onClick={htmlZoomIn}><Icon name="zoom-in" size={15} /></button>
-            </span>
-          )}
           {active.kind === 'text' && !MD_EXTS.has(ext) && loadState === 'ok' && (
             <button
               className={`icon-btn ${textWrap ? 'active' : ''}`}
@@ -469,6 +488,16 @@ export function FileDisplayModal() {
               <Icon name="text-wrap" size={17} />
             </button>
           )}
+          {active.kind === 'html' && loadState === 'ok' && workspaceDir && (
+            <button
+              className="icon-btn"
+              title={t('display.openHtmlInNewPage')}
+              aria-label={t('display.openHtmlInNewPage')}
+              onClick={openHtmlInNewPage}
+            >
+              <Icon name="open-in-new" size={17} />
+            </button>
+          )}
           <button
             className="icon-btn"
             title={t(isPictureInPicture ? 'display.exitPictureInPicture' : 'display.pictureInPicture')}

package/src/components/SettingsView.tsx

@@ -82,6 +82,22 @@ export const SettingsView = memo(function SettingsView() {
               <span className="switch-slider" />
             </label>
           </div>
+          <div className="set-row settings-tool-row">
+            <div>
+              <div className="s-label" id="pure-mode-label">{t('settings.pureMode')}</div>
+              <div className="s-desc" id="pure-mode-desc">{t('settings.pureModeDesc')}</div>
+            </div>
+            <label className="switch">
+              <input
+                type="checkbox"
+                aria-labelledby="pure-mode-label"
+                aria-describedby="pure-mode-desc"
+                checked={settings.pureMode === true}
+                onChange={(e) => setSettings({ pureMode: e.target.checked })}
+              />
+              <span className="switch-slider" />
+            </label>
+          </div>
         </div>
 
         {/* 生成参数 */}

package/src/components/shared.tsx

@@ -403,6 +403,7 @@ const ICONS: Record<string, React.ReactNode> = {
   cancel: <path d="M18 6 6 18M6 6l12 12" />,
   x: <path d="M18 6 6 18M6 6l12 12" />,
   share: <><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8" /><path d="m16 6-4-4-4 4M12 2v13" /></>,
+  'open-in-new': <><path d="M14 3h7v7M21 3l-9 9" /><path d="M19 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2h6" /></>,
   sort: <><path d="M11 5h10M11 9h7M11 13h4" /><path d="m3 17 3 3 3-3M6 20V4" /></>,
   pencil: <><path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5l-5 1 1-5Z" /><path d="m15 5 4 4" /></>,
   upload: <><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" /><path d="m17 8-5-5-5 5M12 3v12" /></>,

package/src/core/i18n.ts

@@ -81,6 +81,8 @@ const MESSAGES: Record<LangKey, Record<string, string>> = {
     'header.modeStandard': '标准对话',
     'header.modeNpc': '角色对话',
     'header.modeGroup': '群聊',
+    'header.moreActions': '更多操作',
+    'header.workspaceAction': '工作区文件',
     'header.editSessionTip': '编辑对话设置',
     'header.resetSessionTip': '重置对话',
     'header.resetSessionTitle': '重置对话',
@@ -195,6 +197,8 @@ const MESSAGES: Record<LangKey, Record<string, string>> = {
     'settings.title': '设置',
     'settings.sub': '模型 API 配置、超参数与主题',
     'settings.toolExecution': '🛠️ 工具执行',
+    'settings.pureMode': '纯净模式',
+    'settings.pureModeDesc': '仅影响前端展示：隐藏对话中的思考和工具调用；没有正文的消息会一并隐藏，不影响实际思考和工具调用。',
     'settings.yoloMode': 'YOLO 模式',
     'settings.yoloModeDesc': '自动批准工具修改和 Shell 执行，无需逐次确认。仅在信任角色和技能时开启。',
     'settings.genParams': '🎛 生成参数',
@@ -533,6 +537,7 @@ const MESSAGES: Record<LangKey, Record<string, string>> = {
     'display.exitPictureInPicture': '退出画中画',
     'display.resizePictureInPicture': '调整画中画大小',
     'display.htmlSandboxNote': 'HTML 应用在受限沙箱中运行，并可加载同目录资源',
+    'display.openHtmlInNewPage': '在新页面打开 HTML',
 
     // ---- 系统提示词 ----
     'prompt.worldBook': '=== 世界书 ===',
@@ -602,6 +607,8 @@ const MESSAGES: Record<LangKey, Record<string, string>> = {
     'header.modeStandard': '標準對話',
     'header.modeNpc': '角色對話',
     'header.modeGroup': '群聊',
+    'header.moreActions': '更多操作',
+    'header.workspaceAction': '工作區檔案',
     'header.editSessionTip': '編輯對話設定',
     'header.resetSessionTip': '重置對話',
     'header.resetSessionTitle': '重置對話',
@@ -713,6 +720,8 @@ const MESSAGES: Record<LangKey, Record<string, string>> = {
     'settings.title': '設定',
     'settings.sub': '模型 API 設定、超參數與主題',
     'settings.toolExecution': '🛠️ 工具執行',
+    'settings.pureMode': '純淨模式',
+    'settings.pureModeDesc': '僅影響前端顯示：隱藏對話中的思考和工具呼叫；沒有正文的訊息會一併隱藏，不影響實際思考和工具呼叫。',
     'settings.yoloMode': 'YOLO 模式',
     'settings.yoloModeDesc': '自動批准工具修改和 Shell 執行，無需逐次確認。僅在信任角色和技能時開啟。',
     'settings.genParams': '🎛 產生參數',
@@ -1043,6 +1052,7 @@ const MESSAGES: Record<LangKey, Record<string, string>> = {
     'display.exitPictureInPicture': '退出畫中畫',
     'display.resizePictureInPicture': '調整畫中畫大小',
     'display.htmlSandboxNote': 'HTML 應用程式在受限沙箱中執行，並可載入同目錄資源',
+    'display.openHtmlInNewPage': '在新頁面開啟 HTML',
 
     'prompt.worldBook': '=== 世界書 ===',
     'prompt.userInfo': '=== USER INFO (用戶扮演的角色) ===',
@@ -1111,6 +1121,8 @@ const MESSAGES: Record<LangKey, Record<string, string>> = {
     'header.modeStandard': 'Standard chat',
     'header.modeNpc': 'Character chat',
     'header.modeGroup': 'Group chat',
+    'header.moreActions': 'More actions',
+    'header.workspaceAction': 'Workspace files',
     'header.editSessionTip': 'Edit conversation settings',
     'header.resetSessionTip': 'Reset conversation',
     'header.resetSessionTitle': 'Reset conversation',
@@ -1222,6 +1234,8 @@ const MESSAGES: Record<LangKey, Record<string, string>> = {
     'settings.title': 'Settings',
     'settings.sub': 'Model API config, hyperparameters and theme',
     'settings.toolExecution': '🛠️ Tool execution',
+    'settings.pureMode': 'Pure mode',
+    'settings.pureModeDesc': 'Front-end display only: hide reasoning and tool calls in chats; messages without body content are hidden too. Actual reasoning and tool calls still run.',
     'settings.yoloMode': 'YOLO mode',
     'settings.yoloModeDesc': 'Automatically approve tool changes and Shell commands without asking each time. Only enable for trusted characters and skills.',
     'settings.genParams': '🎛 Generation parameters',
@@ -1552,6 +1566,7 @@ const MESSAGES: Record<LangKey, Record<string, string>> = {
     'display.exitPictureInPicture': 'Exit picture in picture',
     'display.resizePictureInPicture': 'Resize picture in picture',
     'display.htmlSandboxNote': 'HTML application runs in a restricted sandbox with same-directory resources available',
+    'display.openHtmlInNewPage': 'Open HTML in a new page',
 
     'prompt.worldBook': '=== LOREBOOK ===',
     'prompt.userInfo': '=== USER INFO (role played by the user) ===',

package/src/db/database.ts

@@ -282,40 +282,52 @@ let hasWriteLock = false;
 let lockHeartbeat: number | null = null;
 
 const PERSISTENCE_REQUEST_TIMEOUT_MS = 8_000;
+const PERSISTENCE_STARTUP_RETRY_DELAY_MS = 250;
 
 async function persistenceRequest<T>(path: string, body: Record<string, unknown> = {}): Promise<T> {
-  const controller = new AbortController();
-  const timeout = globalThis.setTimeout(() => controller.abort(), PERSISTENCE_REQUEST_TIMEOUT_MS);
-  let response: Response;
-  try {
-    response = await fetch(`/api-v3${path}`, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ ...body, clientId }),
-      signal: controller.signal,
-    });
-  } catch (error) {
-    if (error instanceof DOMException && error.name === 'AbortError') {
-      throw new Error(`Persistence request ${path} timed out`);
+  for (let attempt = 0; attempt < 2; attempt++) {
+    const controller = new AbortController();
+    const timeout = globalThis.setTimeout(() => controller.abort(), PERSISTENCE_REQUEST_TIMEOUT_MS);
+    let response: Response;
+    try {
+      response = await fetch(`/api-v3${path}`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ ...body, clientId }),
+        signal: controller.signal,
+      });
+    } catch (error) {
+      if (attempt === 0) {
+        await new Promise((resolve) => globalThis.setTimeout(resolve, PERSISTENCE_STARTUP_RETRY_DELAY_MS));
+        continue;
+      }
+      if (error instanceof DOMException && error.name === 'AbortError') {
+        throw new Error(`Persistence request ${path} timed out`);
+      }
+      throw new Error('Unable to reach the persistence service');
+    } finally {
+      globalThis.clearTimeout(timeout);
     }
-    throw new Error('Unable to reach the persistence service');
-  } finally {
-    globalThis.clearTimeout(timeout);
-  }
-  let payload: T & { ok?: boolean; message?: string };
-  try {
-    payload = await response.json() as T & { ok?: boolean; message?: string };
-  } catch {
-    throw new Error(`Persistence service returned an invalid response (${response.status})`);
-  }
-  if (!response.ok || payload.ok === false) {
-    if (response.status === 423) {
-      hasWriteLock = false;
-      markControlReadOnly();
+    let payload: T & { ok?: boolean; message?: string };
+    try {
+      payload = await response.json() as T & { ok?: boolean; message?: string };
+    } catch {
+      throw new Error(`Persistence service returned an invalid response (${response.status})`);
+    }
+    if (response.status === 503 && payload.message === 'Persistence server not running' && attempt === 0) {
+      await new Promise((resolve) => globalThis.setTimeout(resolve, PERSISTENCE_STARTUP_RETRY_DELAY_MS));
+      continue;
     }
-    throw new Error(`Persistence request ${path} failed: ${payload.message || `HTTP ${response.status}`}`);
+    if (!response.ok || payload.ok === false) {
+      if (response.status === 423) {
+        hasWriteLock = false;
+        markControlReadOnly();
+      }
+      throw new Error(`Persistence request ${path} failed: ${payload.message || `HTTP ${response.status}`}`);
+    }
+    return payload;
   }
-  return payload;
+  throw new Error(`Persistence request ${path} failed after retry`);
 }
 
 async function requireWriteLock(): Promise<void> {
@@ -497,6 +509,14 @@ class RemoteTable<T extends object> {
     const result = await persistenceRequest<{ record: { value: T } | null }>('/records/get', { collection: this.collection, key: Array.isArray(key) ? key.join(':') : String(key) });
     return result.record?.value;
   }
+  async getRawLog(key: number): Promise<Pick<ChatMessage, 'rawRequestBody' | 'rawResponseBody'> | null> {
+    if (this.collection !== 'messages') throw new Error('Raw logs are only available for messages');
+    const result = await persistenceRequest<{ rawLog: Pick<ChatMessage, 'rawRequestBody' | 'rawResponseBody'> | null }>('/records/message-raw-log', {
+      collection: this.collection,
+      key: String(key),
+    });
+    return result.rawLog;
+  }
   async count(): Promise<number> { return (await this.toArray()).length; }
   async add(value: T): Promise<number> {
     await requireWriteLock();
@@ -651,6 +671,7 @@ export const DEFAULT_SETTINGS: AppSettings = {
   isThinkingModeEnabled: true,
   isToolCallsEnabled: true,
   yoloMode: false,
+  pureMode: false,
   statsResetTime: null,
 };
 
@@ -697,6 +718,9 @@ export async function initDatabase(): Promise<void> {
     if (settings && settings.yoloMode === undefined) {
       await db.settings.update(1, { yoloMode: false });
     }
+    if (settings && settings.pureMode === undefined) {
+      await db.settings.update(1, { pureMode: false });
+    }
     if (settings && (settings.language !== null || settings.themeMode !== 'system')) {
       await db.settings.update(1, { language: null, themeMode: 'system' });
     }

package/src/generated/changelog.json

@@ -1,7 +1,91 @@
 {
-  "latest": "0.1.19",
+  "latest": "0.1.21",
   "repo": "https://github.com/Rannichan/Tavern-Harness",
   "entries": [
+    {
+      "version": "0.1.21",
+      "date": "2026-10-26",
+      "breaking": false,
+      "compare": "v0.1.20...v0.1.21",
+      "groups": {
+        "zh-CN": [
+          {
+            "kind": "changed",
+            "items": [
+              "移动端会话头部的操作按钮收进「更多操作」菜单（工作区文件、编辑对话、重置对话、导出游玩记录、删除对话），头部不再拥挤；主题切换按钮仍然直接显示",
+              "移动端会话标题可用的横向空间明显变大，长标题能显示更多内容",
+              "会话列表中的标题和副标题过长时改为末尾渐隐，不再用省略号生硬截断",
+              "会话头部的上下文用量标签字号略微收小，和标题搭配更协调"
+            ]
+          }
+        ],
+        "en": [
+          {
+            "kind": "changed",
+            "items": [
+              "On mobile, session header actions now collapse into a \"More actions\" menu (workspace files, edit, reset, export gameplay, delete), so the header is no longer cramped; the theme toggle stays one tap away",
+              "Mobile session titles get noticeably more horizontal room, so long titles reveal more of their text",
+              "Long session list titles and subtitles now fade out at the end instead of being cut off with an ellipsis",
+              "The context usage badge in the session header uses a slightly smaller font so it sits better next to the title"
+            ]
+          }
+        ]
+      }
+    },
+    {
+      "version": "0.1.20",
+      "date": "2026-10-26",
+      "breaking": false,
+      "compare": "v0.1.19...v0.1.20",
+      "groups": {
+        "zh-CN": [
+          {
+            "kind": "added",
+            "items": [
+              "新增「纯净模式」：只显示消息正文，隐藏思考过程和工具调用；没有正文的消息也会一并隐藏，实际的思考和工具执行不受影响（在「设置 → 工具执行」中开启）",
+              "HTML 预览可以在新页面打开，方便全屏查看和调试交互式页面"
+            ]
+          },
+          {
+            "kind": "changed",
+            "items": [
+              "长会话加载明显更快：消息列表不再携带每次请求的原始日志，改为打开「查看原始日志」时按需读取；切回已加载过的会话时直接复用内存中的内容，不再重复拉取",
+              "长会话下持久化服务更稳定：响应启用 brotli / gzip 压缩，服务繁忙时刷新页面不再误报会话加载失败",
+              "HTML 预览的缩放按钮移到底部说明栏，不再占用顶部工具栏，预览区域更宽敞"
+            ]
+          },
+          {
+            "kind": "fixed",
+            "items": [
+              "会话标题过长时不再挤压右侧按钮：标题限制最大宽度并在末尾渐隐"
+            ]
+          }
+        ],
+        "en": [
+          {
+            "kind": "added",
+            "items": [
+              "New \"Pure mode\": shows only message bodies, hiding reasoning and tool calls; messages without body text are hidden too, while actual reasoning and tool execution keep running (enable it in Settings → Tool execution)",
+              "HTML previews can be opened in a new page for full-screen viewing and debugging interactive pages"
+            ]
+          },
+          {
+            "kind": "changed",
+            "items": [
+              "Long conversations load noticeably faster: message lists no longer carry per-request raw logs — they're fetched only when you open \"View raw log\" — and switching back to a session you've already loaded reuses the in-memory copy instead of fetching it again",
+              "The persistence service holds up better with long conversations: responses are brotli / gzip compressed, and a busy service no longer triggers false \"failed to load session\" errors after a page refresh",
+              "HTML preview zoom buttons moved to the bottom note bar, freeing the top toolbar and giving the preview more room"
+            ]
+          },
+          {
+            "kind": "fixed",
+            "items": [
+              "Long session titles no longer squeeze the header buttons: the title is capped in width and fades out at the end"
+            ]
+          }
+        ]
+      }
+    },
     {
       "version": "0.1.19",
       "date": "2026-10-25",

package/src/store/store.ts

@@ -478,8 +478,16 @@ export const useStore = create<AppState>((set, get) => ({
       return { activeSessionId: id, activeView: 'chat', activitySessionIds };
     });
     if (id != null) {
-      get().loadMessages(id);
-      get().refreshLiveQueue(id);
+      const state = get();
+      // 已加载的会话切回时复用内存快照，避免重复传输、解析并覆盖整段历史。
+      // 生成中的会话仍强制刷新，以合并其他写入路径持久化的最新字段。
+      if (state.messages[id] === undefined || state.streaming.sessionId === id) {
+        void state.loadMessages(id).catch((error) => {
+          console.error(`Failed to load session ${id}`, error);
+          state.addToast(translate('toast.genFailed', { msg: error instanceof Error ? error.message : String(error) }), 'error');
+        });
+      }
+      void state.refreshLiveQueue(id).catch((error) => console.error(`Failed to load queue for session ${id}`, error));
     }
   },
 

package/src/theme/global.css

@@ -573,9 +573,10 @@ body.resizing .sidebar-resizer {
 }
 .session-item .stitle-text {
   overflow: hidden;
-  text-overflow: ellipsis;
   white-space: nowrap;
   min-width: 0;
+  -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 18px), transparent);
+  mask-image: linear-gradient(to right, #000 calc(100% - 18px), transparent);
 }
 .session-item .spinned {
   display: inline-flex;
@@ -615,7 +616,8 @@ body.resizing .sidebar-resizer {
   color: var(--text-faint);
   white-space: nowrap;
   overflow: hidden;
-  text-overflow: ellipsis;
+  -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 18px), transparent);
+  mask-image: linear-gradient(to right, #000 calc(100% - 18px), transparent);
 }
 /* ---------- 会话区域（头部 + 滚动列表） ---------- */
 .session-section {
@@ -1045,12 +1047,15 @@ body.resizing .sidebar-resizer {
   min-width: 0;
 }
 .chat-header .ttitle {
+  position: relative;
+  max-width: min(36vw, 420px);
+  overflow: hidden;
   font-family: var(--font-serif);
   font-weight: 700;
   font-size: 17px;
   white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
+  -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent 100%);
+  mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent 100%);
 }
 .chat-header .tsub {
   font-size: 12px;
@@ -1069,6 +1074,7 @@ body.resizing .sidebar-resizer {
 }
 .chat-header .tsub-mode {
   flex-shrink: 0;
+  font-size: 12px;
   font-weight: 700;
   color: var(--primary);
 }
@@ -1082,6 +1088,7 @@ body.resizing .sidebar-resizer {
 /* ---------- 聊天头部右侧动作按钮 ---------- */
 .chat-actions {
   display: flex;
+  flex: 0 0 auto;
   align-items: center;
   gap: 4px;
 }
@@ -1096,6 +1103,7 @@ body.resizing .sidebar-resizer {
   background: transparent;
   color: var(--text-dim);
   transition: background 0.15s ease, color 0.15s ease;
+  flex-shrink: 0;
   cursor: pointer;
 }
 .chat-actions .icon-tooltip:hover {
@@ -1106,6 +1114,10 @@ body.resizing .sidebar-resizer {
   color: var(--danger);
   background: var(--danger-soft);
 }
+.chat-actions .chat-actions-more,
+.chat-actions-menu {
+  display: none;
+}
 
 /* ---------- 卡片/仪表盘 ---------- */
 .dash-scroll {
@@ -1794,6 +1806,7 @@ hr.sep {
   }
 
   .chat-header .ttitle {
+    max-width: min(52vw, 260px);
     font-size: 15px;
   }
 
@@ -1802,28 +1815,67 @@ hr.sep {
   }
 
   .chat-actions {
-    display: flex;
-    flex: 0 1 auto;
-    min-width: 0;
-    justify-content: flex-end;
+    position: relative;
+    flex: 0 0 auto;
     gap: 0;
-    max-width: none;
-    overflow-x: auto;
-    overscroll-behavior-x: contain;
-    scrollbar-width: none;
-    touch-action: pan-x;
   }
 
-  .chat-actions::-webkit-scrollbar {
+  .chat-actions .icon-tooltip:not(.chat-actions-more, .chat-theme-toggle) {
     display: none;
   }
 
+  .chat-actions .chat-actions-more {
+    display: inline-flex;
+  }
+
   .chat-actions .icon-tooltip {
     width: 34px;
     height: 34px;
     flex-shrink: 0;
   }
 
+  .chat-actions-menu {
+    position: absolute;
+    top: calc(100% + 6px);
+    right: 0;
+    z-index: 60;
+    display: flex;
+    flex-direction: column;
+    min-width: 164px;
+    padding: 6px;
+    background: var(--surface);
+    border: 1px solid var(--border);
+    border-radius: 12px;
+    box-shadow: var(--shadow-lg);
+  }
+
+  .chat-actions-menu button {
+    display: flex;
+    align-items: center;
+    gap: 9px;
+    width: 100%;
+    padding: 8px 10px;
+    border: none;
+    border-radius: 8px;
+    background: none;
+    color: var(--text);
+    font-size: 13px;
+    font-weight: 600;
+    text-align: left;
+  }
+
+  .chat-actions-menu button:hover {
+    background: var(--surface-2);
+  }
+
+  .chat-actions-menu button.danger {
+    color: var(--danger);
+  }
+
+  .chat-actions-menu button.danger:hover {
+    background: var(--danger-soft);
+  }
+
   .chat-scroll {
     padding-top: 14px;
   }

package/src/theme/views.css

@@ -1614,11 +1614,38 @@
   opacity: 1;
 }
 .display-html-note {
-  padding: 7px 14px;
+  min-height: 29px;
+  box-sizing: border-box;
+  padding: 2px 14px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 10px;
   font-size: 11.5px;
   color: var(--text-faint);
   border-top: 1px solid var(--border-soft);
 }
+.display-html-note > span:first-child {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.display-html-zoom-group {
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  gap: 2px;
+}
+.display-html-zoom-group .icon-btn {
+  width: 24px;
+  height: 24px;
+  border-radius: 6px;
+}
+.display-html-zoom-group .icon-btn:nth-child(2) {
+  width: 42px;
+  font-size: 11px;
+}
 
 /* 文本 / 代码 / 纯文本 */
 .display-md-scroll,

package/src/types/models.ts

@@ -55,6 +55,8 @@ export interface AppSettings {
   isToolCallsEnabled: boolean;
   /** 自动批准工具执行确认（YOLO）；默认关闭。 */
   yoloMode: boolean;
+  /** 隐藏对话中的思考与工具调用，仅保留消息正文；默认关闭。 */
+  pureMode: boolean;
   statsResetTime: number | null;
 }
 
@@ -218,6 +220,8 @@ export interface ChatMessage {
   displayRef: string | null;
   rawRequestBody: string | null;
   rawResponseBody: string | null;
+  /** 列表加载时仅标记原始日志可用；正文在用户打开日志时按需读取。 */
+  rawLogAvailable?: boolean;
 }
 
 /** 保留原始消息的上下文压缩记录，仅用于构建后续 LLM 请求。 */

package/vite.config.ts

@@ -179,8 +179,10 @@ function persistenceProxyPlugin(): Plugin {
   const ensurePersistence = async (): Promise<number | null> => {
     if (starting) return starting;
     starting = (async () => {
-      if (childPort != null && (await portOpen(childPort)) && (await serviceReady(childPort))) return childPort;
-      if (persistenceChild) return null;
+      // 已经由本 Vite 实例拉起的子进程无需在每个请求前探活：服务忙于压缩或读取长会话时，
+      // 400 ms 健康检查会误判它已离线，导致刷新后会话请求收到伪 503。
+      if (persistenceChild && childPort != null && persistenceChild.exitCode == null) return childPort;
+      if (persistenceChild) stopPersistence();
       for (let port = DEFAULT_PORT; port < DEFAULT_PORT + 20; port++) {
         if (await portOpen(port)) continue;
         childPort = port;
@@ -240,6 +242,11 @@ function persistenceProxyPlugin(): Plugin {
             proxyRes.pipe(res);
           });
           proxyReq.once('error', (error: Error) => {
+            // 连接错误才说明端口失效；下一个请求会清理并重新拉起服务。
+            if (childPort === port) {
+              persistenceChild = null;
+              childPort = null;
+            }
             res.writeHead(502, { 'Content-Type': 'application/json' });
             res.end(JSON.stringify({ ok: false, message: `Persistence proxy error: ${error.message}` }));
           });