@liguoshuai/pi-web-chat 1.8.0 → 1.8.4

package/docs/ARCHITECTURE.md

@@ -1,6 +1,6 @@
 # 架构设计文档
 
-> pi-web-chat 的技术架构、数据流、关键设计决策与扩展点说明（对应 v1.7.5 版本）。
+> pi-web-chat 的技术架构、数据流、关键设计决策与扩展点说明（对应 v1.8.4 版本）。
 
 ---
 
@@ -176,5 +176,6 @@ pi-web-chat/
 │   └── CHANGELOG.md                # 版本变更日志
 └── scripts/                        # 服务安装/卸载脚本
     ├── install-service.sh
+    ├── uninstall-service.sh
     └── pi-web-chat.service
 ```

package/docs/CHANGELOG.md

@@ -7,6 +7,61 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ---
 
+## [1.8.4] - 2026-07-26
+
+### Added
+- **Markdown 渲染能力增强 (Markdown Enhancements: HR, Strikethrough & Task Checkboxes)**：
+  - 支持标准 Markdown 水平分割线（`---`、`***`、`___`）渲染为 `<hr>` 标签。
+  - 支持删除线语法（`~~strikethrough~~`）渲染为 `<del>` 标签。
+  - 支持任务列表复选框（`- [ ]` 与 `- [x]`）及加号无序列表（`+ item`）。
+  - 为 `h4`、`h5`、`h6`、`hr`、`del` 及任务复选框补充了精细的暗色主题 CSS 样式。
+
+### Fixed
+- **移动端息屏/切出恢复后历史消息自动同步 (Mobile Reconnect Session Auto-Sync)**：
+  - 修复手机端在后台挂起或息屏后切回页面时，未能及时同步后台已生成完毕的最新回复内容的问题。
+  - 增加 `syncSessionHistory` 历史同步机制，并在 `ws.onopen`、`visibilitychange` 与 `pageshow` 事件中自动拉取磁盘最新消息渲染至对话区。
+  - 优化 `backfill_start` / `backfill_end` 流式状态重置，保障后台生成途中切回时无缝追平实时生成内容。
+- **未绑定会话孤儿子进程即时回收 (Immediate Cleanup of Unkeyed Idle Agents)**：当客户端打开新建会话页面但未发送消息即关闭或切换时，后端未分配 Session Key 的孤立 `PiAgent` 进程在连接断开后立即释放，避免占用 5 分钟闲置内存。
+- **切换与加载历史会话时工作目录自动同步 (Session CWD Auto-Sync)**：点击侧边栏或通过 URL 参数（`?session=...`）打开会话时，自动将 `state.cwd` 同步为会话真实的 `data.header.cwd`，确保 Agent 执行环境与会话一致。
+- **工作目录变更后项目级默认配置实时重载 (Project Settings Live Reload on CWD Change)**：切换工作目录时重新获取 `/api/config?cwd=...`，确保项目根目录下的 `.pi/settings.json` 模型配置即时生效。
+- **波浪号路径解析规范化 (Tilde `~` Path Resolution Normalization)**：服务端引入统一的 `normalizePath`，确保会话参数与路径校验中包含的 `~` 家目录前缀能被正确展开并绝对化。
+- **历史错误消息展示保护 (Error Notice on Historical Failed Messages)**：修复历史会话中若生成中途报错中断时未能渲染失败提示条的问题。
+- **Package.json 发布字段补充 (Scripts Directory Inclusion)**：在 `package.json` 的 `files` 字段中加入 `scripts/` 目录，确保 Systemd 服务脚本正常打包发布。
+
+---
+
+## [1.8.3] - 2026-07-26
+
+### Fixed
+- **移动端工作目录切换弹窗按钮溢出修复 (CWD Modal Mobile Overflow & Input Sizing)**：
+  - 修复手机端切换工作目录弹窗中“确定切换”按钮超出卡片右侧边框的问题。
+  - 为 `.input-group input` 添加 `min-width: 0` 和 `box-sizing: border-box`，消除原生 input 元素的内在最小宽度导致的 Flexbox 溢出。
+  - 适配移动端弹窗内边距与间距（padding 降至 16px），并在 `<= 380px` 窄屏设备上自适应将按钮折行全宽呈现，防止水平溢出。
+
+---
+
+## [1.8.2] - 2026-07-26
+
+### Fixed
+- **移动端顶栏空间挤压与思考胶囊截断修复 (Mobile Topbar Layout & Thinking Pill Overflow)**：
+  - 移除移动端 `.model-pill-container` 的固定 `max-width: 130px` 宽度限制，修复深度思考胶囊被挤压截断、只显示一半图标的问题。
+  - 优化移动端顶栏各元素间距与自适应弹性缩放：侧边栏菜单按钮调整为 36px，工作目录胶囊最大宽度限制为 75px，模型胶囊适度收敛文字并隐藏默认徽章，思考胶囊保留完整图标与级别文本。
+  - 增加对 `<= 360px` 极窄小屏设备的精细化响应式适配规则，保障全尺寸移动端设备顶部操作栏整齐美观且不换行、不溢出。
+
+---
+
+## [1.8.1] - 2026-07-26
+
+### Fixed
+- **模型切换系统通知未定义函数报错修复 (Missing appendSystemNotice ReferenceError)**：补充前端 `appendSystemNotice` 函数实现，使用 `.system-notice-divider` 与 `.system-notice-text` 渲染模型变更系统提示，解决切换模型时触发 `ReferenceError` 的问题。
+- **思考深度循环切换响应数据字段适配 (cycle_thinking_level Response Handling)**：兼容 Pi RPC 响应中返回的 `data.level` 字段，避免因字段名不匹配导致思考深度未能及时更新。
+- **会话自定义命名解析与侧边栏即时呈现 (Session Name & session_info Extraction)**：服务端 `/api/sessions` 与 `/api/session` 增加对 `session_info` 记录的解析，支持读取用户通过 `set_session_name` 设置的会话名称并在侧边栏和顶栏直观显示。
+- **默认模型设为已启用模型列表防回退保护 (enabledModels Sync on Set Default)**：在写入 `defaultModel` 时同步检查并加入 `enabledModels` 列表，防止 Pi core 启动时回退至 `enabledModels[0]`。
+- **会话历史加载异常容错与提示 (Session Load Error Handling)**：`loadSession` 增加网络及文件读取异常判断与 Toast 友好提示，避免读取异常会话文件时界面卡死。
+- **Systemd User 单元文件权限沙箱配置优化 (Systemd Unit Workspace Access)**：移除 `ProtectHome=read-only`，确保作为用户级服务启动时 Pi Agent 可以正常读写和编辑工作区项目文件。
+
+---
+
 ## [1.8.0] - 2026-07-26
 
 ### Added

package/docs/ISSUES.md

@@ -146,5 +146,123 @@
 - 修改 `detachWs`，当所有连接断开但 Agent 仍在生成中时，保留 `eventBuffer` 保证继续录制。
 - 修改 `replayBuffered`，在 Agent 仍处于 busy 状态时消费后不清空缓存，使多个设备/多个 Tab 可多次或同时连入并安全回溯追平全部生成细节，并在流式终止时通过 `agent_settled` 进行最终的统一清理。
 
+---
+
+## 14. 切换模型时触发 `appendSystemNotice is not defined` 报错
+
+**症状**：在顶部模型下拉菜单中切换模型后，控制台报错 `ReferenceError: appendSystemNotice is not defined`，并在 `/api/log-error` 中记录错误日志。
+
+**根因**：前端 `app.js` 在处理模型切换和接收 `set_model` 响应时调用了 `appendSystemNotice` 函数在消息流中插入切换提醒，但在重构时该辅助函数未被声明。
+
+**修复**：在 `app.js` 中补充 `appendSystemNotice(text)` 实现，利用 CSS 中已定义好的 `.system-notice-divider` 与 `.system-notice-text` 类在聊天区尾部安全插入居中分割标签。
+
+---
+
+## 15. `cycle_thinking_level` 响应字段未正确更新思考深度
+
+**症状**：通过 RPC 调用循环切换思考级别后，前端状态与顶栏思考胶囊未实时更新。
+
+**根因**：Pi RPC 模式下 `cycle_thinking_level` 返回的响应数据为 `{ level: ThinkingLevel }`，而前端代码按 `obj.data?.thinkingLevel` 读取导致取得 `undefined`。
+
+**修复**：在 `app.js` 中改为 `const newLevel = obj.data?.level || obj.data?.thinkingLevel;`，兼容标准 RPC 返回格式。
+
+---
+
+## 16. 自定义会话名称 (`session_info`) 无法在侧边栏与顶栏显示
+
+**症状**：通过 `set_session_name` 重命名会话后，侧边栏列表中依然只展示第一条用户 prompt 提取出的简略标题。
+
+**根因**：服务端 `getSessionMetadata` 和 `/api/session` 在逐行扫描 `.jsonl` 时只查找了 `type === "session"` 和 `type === "message"`，忽略了 `type === "session_info"` 记录。
+
+**修复**：
+- 服务端解析 `.jsonl` 时提取最新的 `session_info.name` 作为 `sessionName` 返回。
+- 前端 `renderSidebar` 优先使用 `s.sessionName || s.firstUser || "新对话"` 进行渲染。
+
+---
+
+## 17. Systemd 用户服务中 `ProtectHome=read-only` 导致 Agent 读写工作区报错
+
+**症状**：通过 `install-service.sh` 将服务安装至 systemd user 后，Pi 编程代理在用户项目目录中执行 `write` 或 `edit` 工具时触发 `EACCES` 权限拒绝错误。
+
+**根因**：服务单元模板设置了 `ProtectHome=read-only` 并仅将 `~/.pi` 和 `~/.npm-global` 列入白名单，导致 Agent 无法在 `$HOME/projects` 等工作区目录下创建或修改文件。
+
+**修复**：移除该限制，让 User-level 服务在常规用户权限上下文下直接操作工作区。
+
+---
+
+## 18. 移动端顶栏空间挤压与思考胶囊截断
+
+**症状**：在手机端竖屏打开页面时，顶栏右侧的“深度思考 / 推理级别”（`🧠 High`）胶囊被挤压，只能看到一半的脑花图标，文本完全不可见。
+
+**根因**：移动端媒体查询中为 `.model-pill-container` 设置了 `max-width: 130px` 的硬限制。由于模型胶囊占据了大部分宽度，容器剩余宽度不足以完整容纳思考胶囊，导致其被裁剪。
+
+**修复**：
+- 移除移动端 `.model-pill-container` 的 `max-width: 130px` 限制，改为弹性无约束容器。
+- 优化顶栏各按钮尺寸与间距：缩小菜单按钮为 36px，工作目录胶囊限制最大 75px，模型胶囊适度缩略模型名并隐藏手机端冗余的“默认”徽章，为思考胶囊留出充足显示空间。
+- 追加 `<= 360px` 极窄屏响应式规则，确保在 iPhone SE 等小屏设备上也能完整显示。
+
+---
+
+## 19. 移动端切换工作目录弹窗按钮超出边框
+
+**症状**：在手机端点击顶栏切换工作目录（CWD Modal）时，右侧的“确定切换”按钮超出了弹窗白色/暗色卡片右边框。
+
+**根因**：
+1. 原生 `<input>` 元素具有默认的内在 `size`（`min-width: auto` 相当于约 180px~200px）。在小屏手机上，input 的内在最小宽度加上“确定切换”按钮宽度和弹窗内边距超出了视口总可用宽度。
+2. 移动端没有针对 `.modal` 和 `.input-group` 进行专门的响应式约束和内边距收敛。
+
+**修复**：
+- 给 `.input-group input` 添加 `min-width: 0; box-sizing: border-box;`，确保其在 flex 容器中可以自由收缩。
+- 在移动端媒体查询中调整弹窗内边距为 16px，优化输入框与按钮的 padding。
+- 在 `<= 380px` 超窄屏设备上自适应将输入框与操作按钮上下垂直排列（`flex-direction: column`），确保彻底杜绝横向溢出。
+
+---
+
+## 20. 未绑定会话孤儿子进程即时回收
+
+**症状**：客户端打开新建会话页面但未发送任何 Prompt 就关闭页面或切换至其他会话时，后端生成的未分配 Session Key 的孤立 `PiAgent` 子进程会持续占用内存 5 分钟后才被回收。
+
+**根因**：原先 `detachWs` 统一对所有断连进程开启 5 分钟 `IDLE_TIMEOUT_MS` 倒计时。然而未绑定会话 Key 的进程由于没有 Session Key，后续没有任何客户端可以重新挂载接入该进程。
+
+**修复**：在 `detachWs` 中增加判断，若 Agent 未分配 Session Key（`!this.sessionKey`）且处于完全空闲状态（`!this.isBusy`），则在最后一个连接断开时立即调用 `stop()` 释放进程资源，避免无用进程驻留内存。
+
+---
+
+## 21. 切换与直接加载历史会话时工作目录 (CWD) 自动同步
+
+**症状**：通过 URL 参数（如 `?session=...`）或点击侧边栏加载属于其他工作目录的历史会话时，前端工作目录（CWD）未能联动更新，导致后续发送消息时 Agent 在错误的工作目录下执行命令与操作文件。
+
+**根因**：`loadSession` 在从 `/api/session` 接口获取会话详情后，仅解析了 `model` 和消息历史，未读取 `header.cwd` 同步更新 `state.cwd`。
+
+**修复**：在 `loadSession` 中自动比对并应用 `data.header.cwd`，同步更新 `state.cwd`、`localStorage` 及顶栏工作目录显示，确保后续 WebSocket 连接与 Agent 子进程的工作目录与会话原始目录精确一致。
+
+---
+
+## 22. 波浪号 (`~`) 路径解析规范化与 Markdown 渲染增强
+
+**症状**：
+1. 若 WebSocket 会话参数或切换会话传入带有 `~` 的路径，Node 原生 `path.resolve` 无法自动展开用户家目录，导致路径解析不一致。
+2. 模型输出的 Markdown 水平分割线（`---` / `***`）、删除线（`~~strikethrough~~`）、任务复选框（`- [ ]` / `- [x]`）未能正确渲染。
+
+**修复**：
+- 服务端增加 `normalizePath` 统一处理 `~` 家目录展开与绝对路径规范化。
+- 前端 Markdown 渲染器增加对水平分割线 `<hr>`、删除线 `<del>`、任务列表复选框以及加号无序列表（`+ item`）的完整语法支持与对应样式。
+
+---
+
+## 23. 移动端切出/息屏恢复后会话未同步后台最新对话内容
+
+**症状**：在手机端发送消息或查看对话时，若切出应用或息屏锁定，等待一段时间后再返回页面（WebSocket 提示“网络连接已恢复”），但聊天窗口中仍停留在息屏前的旧状态，未能展示后台已生成完毕的完整回复。
+
+**根因**：
+1. 手机端在息屏或后台挂起时，浏览器暂停 JS 执行并断开 WebSocket。
+2. 任务在服务端后台运行完毕后，pi 将完整消息写入磁盘 `.jsonl` 并触发 `agent_settled`，随后服务端清空了针对该轮次的事件环形 Buffer。
+3. 手机端唤醒并重新建立 WebSocket 连接后，前端仅请求了 `get_state`，未主动从服务端 `/api/session` 重新拉取最新的会话历史消息，导致 DOM 中残留断线前的未完成状态。
+
+**修复**：
+- 抽取通用的 `syncSessionHistory(file)` 历史同步机制。
+- 在 `ws.onopen`（重连成功时）、`visibilitychange`（页面可见性恢复时）以及 `pageshow`（移动端切回页面时）自动触发 `syncSessionHistory`，重新拉取并渲染磁盘最新消息。
+- 完善 `backfill_start` / `backfill_end` 流式状态重置，确保如果在后台仍在流式生成途中切回，能清空旧数据并无缝追平实时流式内容。
+
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@liguoshuai/pi-web-chat",
-  "version": "1.8.0",
+  "version": "1.8.4",
   "description": "A ChatGPT/Gemini-style web UI for the pi coding agent, powered by pi's RPC mode.",
   "type": "module",
   "main": "server.js",
@@ -12,6 +12,7 @@
     "bin/",
     "public/",
     "docs/",
+    "scripts/",
     "README.md",
     "LICENSE"
   ],

package/public/app.js

@@ -71,9 +71,10 @@ function updateCwdDisplay() {
   if (wrap) wrap.title = `工作目录: ${state.cwd || "~"}`;
 }
 
-function setCwd(newCwd) {
+async function setCwd(newCwd) {
   state.cwd = newCwd;
   localStorage.setItem("pi_cwd", newCwd);
+  await loadServerConfig();
   updateCwdDisplay();
   clearChat();
   showEmptyState(true);
@@ -112,12 +113,18 @@ function saveRecentModel(model) {
 }
 
 async function loadServerConfig() {
+  if (!state.cwd) {
+    state.cwd = localStorage.getItem("pi_cwd") || document.body.dataset.cwd || "";
+  }
   try {
     const cwdParam = state.cwd ? `?cwd=${encodeURIComponent(state.cwd)}` : "";
     const res = await fetch(`${API}/api/config${cwdParam}`);
     const data = await res.json();
     if (data.home) state.homeDir = data.home;
     if (data.serverCwd) state.serverCwd = data.serverCwd;
+    if (!state.cwd) {
+      state.cwd = state.serverCwd || state.homeDir || "";
+    }
     if (data.version) {
       state.version = data.version;
       const verEl = $("#appVersion");
@@ -131,7 +138,7 @@ async function loadServerConfig() {
     }
   } catch {}
   if (!state.cwd) {
-    state.cwd = localStorage.getItem("pi_cwd") || state.serverCwd || state.homeDir || "";
+    state.cwd = state.serverCwd || state.homeDir || "";
   }
   loadRecentModels();
   updateCwdDisplay();
@@ -358,9 +365,14 @@ function renderInlineMd(text) {
       flushList();
       outHtml += mdTable(seg.lines);
     } else if (seg.kind === "line") {
-      // headings
-      const m = seg.text.match(/^(#{1,6})\s+(.*)$/);
-      if (m) {
+      // horizontal rule
+      if (/^\s*([-*_])\s*\1\s*\1[\s\-_*]*$/.test(seg.text)) {
+        flushPara();
+        flushList();
+        outHtml += "<hr>";
+      } else if (/^(#{1,6})\s+(.*)$/.test(seg.text)) {
+        // headings
+        const m = seg.text.match(/^(#{1,6})\s+(.*)$/);
         flushPara();
         flushList();
         const level = m[1].length;
@@ -373,7 +385,7 @@ function renderInlineMd(text) {
         flushPara();
         flushList();
         outHtml += `<blockquote>${mdInlineBlock(seg.text.replace(/^>\s?/, ""))}</blockquote>`;
-      } else if (/^\s*[-*]\s+/.test(seg.text) || /^\s*\d+\.\s+/.test(seg.text)) {
+      } else if (/^\s*[-*+]\s+/.test(seg.text) || /^\s*\d+\.\s+/.test(seg.text)) {
         // list item — group consecutive into ul/ol
         // simple inline handling: wrap each list item line.
         const isOrdered = /^\s*\d+\.\s+/.test(seg.text);
@@ -384,7 +396,16 @@ function renderInlineMd(text) {
           linkListOrdered = isOrdered;
           outHtml += "<" + linkListOpen + ">";
         }
-        outHtml += `<li>${mdInlineBlock(seg.text.replace(/^\s*([-*]|\d+\.)\s+/, ""))}</li>`;
+        let itemText = seg.text.replace(/^\s*([-*+]|\d+\.)\s+/, "");
+        let taskPrefix = "";
+        if (/^\[ \]\s+/.test(itemText)) {
+          taskPrefix = '<input type="checkbox" disabled class="task-list-item-checkbox"> ';
+          itemText = itemText.replace(/^\[ \]\s+/, "");
+        } else if (/^\[[xX]\]\s+/.test(itemText)) {
+          taskPrefix = '<input type="checkbox" checked disabled class="task-list-item-checkbox"> ';
+          itemText = itemText.replace(/^\[[xX]\]\s+/, "");
+        }
+        outHtml += `<li>${taskPrefix}${mdInlineBlock(itemText)}</li>`;
       } else {
         flushList();
         para.push(seg.text);
@@ -405,6 +426,8 @@ function mdInlineBlock(text) {
   // bold
   s = s.replace(/\*\*([^*]+)\*\*/g, "<strong>$1</strong>");
   s = s.replace(/__([^_]+)__/g, "<strong>$1</strong>");
+  // strikethrough
+  s = s.replace(/~~([^~]+)~~/g, "<del>$1</del>");
   // italic
   s = s.replace(/(^|[^*])\*([^*]+)\*/g, "$1<em>$2</em>");
   s = s.replace(/(^|[^_])_([^_]+)_/g, "$1<em>$2</em>");
@@ -465,7 +488,7 @@ function renderSidebar(sessions) {
     return;
   }
   sessions.forEach((s) => {
-    const title = s.firstUser || "新对话";
+    const title = s.sessionName || s.firstUser || "新对话";
     const when = s.timestamp ? new Date(s.timestamp).toLocaleString("zh-CN", { month: "numeric", day: "numeric", hour: "2-digit", minute: "2-digit" }) : "";
     const item = el("div", {
       class: "session-item" + (s.file === state.currentSessionFile ? " active" : ""),
@@ -514,6 +537,44 @@ function initMobileToolbarFab() {
   });
 }
 
+async function syncSessionHistory(file, force = false) {
+  if (!file) return;
+  try {
+    const res = await fetch(`${API}/api/session?file=${encodeURIComponent(file)}`);
+    if (!res.ok) return;
+    const data = await res.json();
+    if (!data || data.error) return;
+
+    if (data.header?.cwd && data.header.cwd !== state.cwd) {
+      state.cwd = data.header.cwd;
+      localStorage.setItem("pi_cwd", state.cwd);
+      updateCwdDisplay();
+    }
+
+    if (data.model) {
+      state.currentModel = data.model;
+      renderModelPill();
+    }
+
+    const topName = data.sessionName || (data.header?.id ? baseName(file) : "新对话");
+    $("#topSessionName").textContent = topName;
+
+    // Only overwrite chat if force is true or we're not actively streaming mid-turn live
+    if (force || !state.streaming) {
+      clearChat();
+      const msgs = reconstructFromEntries(data.entries || []);
+      showEmptyState(msgs.length === 0);
+      for (const m of msgs) {
+        appendMessageNode(m.role, m);
+      }
+      scrollBottom();
+      refreshSessions();
+    }
+  } catch (e) {
+    console.warn("syncSessionHistory error:", e);
+  }
+}
+
 async function loadSession(file) {
   state.currentSessionFile = file;
   state.streaming = false;
@@ -529,28 +590,9 @@ async function loadSession(file) {
   if (window.innerWidth <= 768) {
     closeSidebar();
   }
-  // pull transcript from REST then connect a fresh WS pointed at this session
-  const res = await fetch(`${API}/api/session?file=${encodeURIComponent(file)}`);
-  const data = await res.json();
-
-  if (data.model) {
-    state.currentModel = data.model;
-    renderModelPill();
-  }
-
-  clearChat();
-  document.querySelector("#emptyState").style.display = "none";
-  const chat = $("#chat-inner");
-  // Walk through path entries to render messages in order.
-  // We reconstruct assistant/user/toolResult blocks.
-  const msgs = reconstructFromEntries(data.entries || []);
-  for (const m of msgs) {
-    appendMessageNode(m.role, m);
-  }
+  await syncSessionHistory(file, true);
   // Reconnect websocket pointed at this session so new prompts continue history.
   connectWs({ session: file });
-  // Update sidebar active highlight
-  refreshSessions();
 }
 
 function reconstructFromEntries(entries) {
@@ -582,7 +624,7 @@ function reconstructFromEntries(entries) {
         }
         return part;
       });
-      if (m.stopReason === "error" && content.length === 0) {
+      if (m.stopReason === "error") {
         let errMsg = m.errorMessage || "生成失败（模型返回错误）";
         try {
           const parsed = JSON.parse(errMsg);
@@ -601,9 +643,21 @@ function extractContentText(content) {
   if (typeof content === "string") return content;
   if (!Array.isArray(content)) return "";
   return content
-    .filter(c => c.type === "text" || typeof c === "string")
-    .map(c => typeof c === "string" ? c : c.text)
-    .join("");
+    .filter(c => c && (c.type === "text" || typeof c === "string"))
+    .map(c => typeof c === "string" ? c : (c.text || ""))
+    .filter(Boolean)
+    .join("\n\n");
+}
+
+function appendSystemNotice(text) {
+  if (!text) return;
+  const chatInner = $("#chat-inner");
+  if (!chatInner) return;
+  const node = el("div", { class: "system-notice-divider" }, [
+    el("span", { class: "system-notice-text", text })
+  ]);
+  chatInner.appendChild(node);
+  scrollBottom();
 }
 
 // ---- Chat rendering ----
@@ -825,14 +879,22 @@ function makeToolBlockFromCall(call) {
 
 function summaryArgs(name, args) {
   if (!args) return "";
+  let obj = args;
+  if (typeof args === "string") {
+    try { obj = JSON.parse(args); } catch { return args; }
+  }
   try {
-    if (name === "bash" && args.command) return args.command;
-    if (name === "read" && args.path) return args.path;
-    if (name === "write" && args.path) return args.path;
-    if (name === "edit" && args.path) return args.path;
-    if (name === "ls" && args.path) return args.path;
-    if (name === "grep") return args.pattern || "";
-    if (name === "find") return args.pattern || args.path || "";
+    if (name === "bash" && obj.command) return obj.command;
+    if (name === "read" && obj.path) return obj.path;
+    if (name === "write" && obj.path) return obj.path;
+    if (name === "edit" && obj.path) return obj.path;
+    if (name === "ls" && obj.path) return obj.path;
+    if (name === "grep") return obj.pattern || "";
+    if (name === "find") return obj.pattern || obj.path || "";
+    if (typeof obj === "object" && obj !== null) {
+      const keys = Object.keys(obj);
+      if (keys.length === 1 && typeof obj[keys[0]] === "string") return obj[keys[0]];
+    }
     return "";
   } catch { return ""; }
 }
@@ -1100,14 +1162,18 @@ function connectWs(opts = {}) {
   state.ws = ws;
   ws._gen = myGen;
 
-  ws.onopen = () => {
+  ws.onopen = async () => {
     if (ws._gen !== wsGen) return;
     isConnecting = false;
     setConnStatus("connected");
     startPingInterval();
 
-    if (wasDisconnected || reconnectAttempts > 0) {
+    const isReconnecting = wasDisconnected || reconnectAttempts > 0 || opts.isReconnect;
+    if (isReconnecting) {
       showToast("网络连接已恢复");
+      if (targetSession) {
+        await syncSessionHistory(targetSession, true);
+      }
     }
     wasDisconnected = false;
     reconnectAttempts = 0;
@@ -1168,6 +1234,11 @@ function handlePiMessage(obj) {
   // that happened in the background while no browser was attached.
   if (obj.type === "backfill_start") {
     state.isBackfilling = true;
+    state.streaming = true;
+    setComposerAborting(true);
+    state.streamingItems = [];
+    state.streamingMsg = null;
+    state.activeToolCalls.clear();
     return;
   }
   if (obj.type === "backfill_end") {
@@ -1178,6 +1249,11 @@ function handlePiMessage(obj) {
       setComposerAborting(true);
       ensureStreamingMsg();
       refreshStreamingContent();
+    } else {
+      finalizeStreamingMsg();
+      state.streaming = false;
+      setComposerAborting(false);
+      refreshSessions();
     }
     // jump to the latest content once the replay is done
     requestAnimationFrame(scrollBottom);
@@ -1213,8 +1289,9 @@ function handlePiMessage(obj) {
       }
     }
     else if (obj.command === "cycle_thinking_level" && obj.success) {
-      if (obj.data?.thinkingLevel) {
-        state.thinkingLevel = obj.data.thinkingLevel;
+      const newLevel = obj.data?.level || obj.data?.thinkingLevel;
+      if (newLevel) {
+        state.thinkingLevel = newLevel;
         renderThinkingPill();
         updateEmptyStateModelInfo();
       }
@@ -1264,6 +1341,7 @@ function handlePiMessage(obj) {
       finalizeStreamingMsg();
       state.streaming = false;
       setComposerAborting(false);
+      sendWs({ type: "get_state" });
       refreshSessions(); // titles may have changed
       break;
     case "message_start": {
@@ -1366,8 +1444,7 @@ function handlePiMessage(obj) {
     case "tool_execution_update": {
       const tc = state.activeToolCalls.get(obj.toolCallId);
       if (tc) {
-        const pr = obj.partialResult;
-        const text = pr && pr.content ? (Array.isArray(pr.content) ? pr.content.map(c => c.text || "").join("") : "") : "";
+        const text = extractContentText(obj.partialResult?.content);
         tc.body.innerHTML = escapeHtml(text) || "(执行中…)";
       }
       break;
@@ -1375,8 +1452,7 @@ function handlePiMessage(obj) {
     case "tool_execution_end": {
       const tc = state.activeToolCalls.get(obj.toolCallId);
       if (tc) {
-        const res = obj.result;
-        const text = res && res.content ? (Array.isArray(res.content) ? res.content.map(c => c.text || "").join("") : "") : "";
+        const text = extractContentText(obj.result?.content);
         tc.body.innerHTML = escapeHtml(text) || "(无输出)";
         tc.head.querySelector(".state").textContent = obj.isError ? "错误" : "完成";
         tc.head.querySelector(".state").classList.toggle("error", !!obj.isError);
@@ -1485,7 +1561,11 @@ function updateState(d) {
       finalizeStreamingMsg();
       state.streaming = false;
       setComposerAborting(false);
-      refreshSessions();
+      if (state.currentSessionFile) {
+        syncSessionHistory(state.currentSessionFile, true);
+      } else {
+        refreshSessions();
+      }
     }
   }
 }
@@ -2300,10 +2380,22 @@ async function init() {
         scheduleReconnect(0);
       } else {
         try { state.ws.send(JSON.stringify({ type: "ping" })); } catch {}
+        if (state.currentSessionFile && !state.streaming) {
+          syncSessionHistory(state.currentSessionFile, true);
+        }
       }
     }
   });
 
+  window.addEventListener("pageshow", () => {
+    if (!state.wsConnected) {
+      reconnectAttempts = 0;
+      scheduleReconnect(0);
+    } else if (state.currentSessionFile && !state.streaming) {
+      syncSessionHistory(state.currentSessionFile, true);
+    }
+  });
+
   // Global event delegation for code block copy buttons
   document.addEventListener("click", async (e) => {
     const btn = e.target.closest(".btn-copy-code");

package/public/style.css

@@ -439,12 +439,30 @@ body {
 }
 .msg.assistant .content ul, .msg.assistant .content ol { margin: 8px 0 12px 24px; }
 .msg.assistant .content li { margin: 4px 0; }
-.msg.assistant .content h1, .msg.assistant .content h2, .msg.assistant .content h3 {
+.msg.assistant .content h1, .msg.assistant .content h2, .msg.assistant .content h3,
+.msg.assistant .content h4, .msg.assistant .content h5, .msg.assistant .content h6 {
   margin: 16px 0 10px; line-height: 1.3;
 }
 .msg.assistant .content h1 { font-size: 20px; }
 .msg.assistant .content h2 { font-size: 18px; }
 .msg.assistant .content h3 { font-size: 16px; }
+.msg.assistant .content h4 { font-size: 14.5px; }
+.msg.assistant .content h5 { font-size: 13.5px; }
+.msg.assistant .content h6 { font-size: 12.5px; }
+.msg.assistant .content hr {
+  border: none;
+  border-top: 1px solid var(--border);
+  margin: 16px 0;
+}
+.msg.assistant .content del {
+  text-decoration: line-through;
+  opacity: 0.7;
+}
+.msg.assistant .content .task-list-item-checkbox {
+  margin-right: 6px;
+  vertical-align: -2px;
+  accent-color: var(--accent);
+}
 .msg.assistant .content a { color: #4ea1ff; text-decoration: none; }
 .msg.assistant .content a:hover { text-decoration: underline; }
 .msg.assistant .content table {
@@ -811,9 +829,12 @@ body {
 .input-group {
   display: flex;
   gap: 8px;
+  width: 100%;
+  box-sizing: border-box;
 }
 .input-group input {
   flex: 1;
+  min-width: 0;
   background: var(--bg-input);
   border: 1px solid var(--border);
   border-radius: 10px;
@@ -822,6 +843,7 @@ body {
   font-size: 13px;
   font-family: "SF Mono", Menlo, Consolas, monospace;
   outline: none;
+  box-sizing: border-box;
 }
 .input-group input:focus {
   border-color: var(--text-dim);
@@ -837,6 +859,8 @@ body {
   cursor: pointer;
   white-space: nowrap;
   transition: background 0.15s;
+  flex-shrink: 0;
+  box-sizing: border-box;
 }
 .btn-primary:hover { background: var(--accent-hover); }
 
@@ -1205,9 +1229,9 @@ body {
 
   /* Topbar Mobile Adjustments — fixed, taller, shadowed so it is always findable */
   .topbar {
-    height: 54px;
-    padding: 0 12px;
-    gap: 8px;
+    height: 52px;
+    padding: 0 8px;
+    gap: 6px;
     position: fixed;
     top: 0;
     left: 0;
@@ -1219,36 +1243,37 @@ body {
   }
 
   .main {
-    padding-top: 54px;
+    padding-top: 52px;
   }
 
   .topbar .session-name {
-    font-size: 14px;
+    font-size: 13px;
     font-weight: 500;
     min-width: 0;
     flex: 1;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
-    padding: 0 4px;
+    padding: 0 2px;
   }
 
   .btn-toggle-sidebar {
-    width: 40px;
-    height: 40px;
+    width: 36px;
+    height: 36px;
     padding: 0;
     color: var(--text);
     background: var(--bg-hover);
+    flex-shrink: 0;
   }
   .btn-toggle-sidebar svg {
-    width: 22px;
-    height: 22px;
+    width: 20px;
+    height: 20px;
   }
 
   #cwdPillWrap {
-    padding: 5px 9px;
+    padding: 4px 7px;
     font-size: 11px;
-    max-width: 90px;
+    max-width: 75px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
@@ -1256,25 +1281,65 @@ body {
   }
 
   .model-pill-container {
-    max-width: 130px;
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    flex-shrink: 0;
+    max-width: none;
   }
 
   .model-pill {
-    padding: 5px 8px;
+    padding: 4px 8px;
     font-size: 11px;
-    max-width: 90px;
+    max-width: 105px;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
     flex-shrink: 0;
+    gap: 4px;
   }
   .model-pill-name {
-    max-width: 50px;
+    max-width: 65px;
+  }
+  .model-pill-badge {
+    display: none !important;
   }
 
   .thinking-pill {
-    padding: 5px 7px;
+    padding: 4px 7px;
+    font-size: 11px;
+    flex-shrink: 0;
+    white-space: nowrap;
+    gap: 3px;
+    display: inline-flex;
+    align-items: center;
+  }
+  .thinking-pill .thinking-icon {
+    font-size: 12px;
+  }
+  .thinking-pill .thinking-label {
     font-size: 11px;
+    font-weight: 500;
+  }
+
+  @media (max-width: 360px) {
+    .topbar {
+      padding: 0 4px;
+      gap: 4px;
+    }
+    #cwdPillWrap {
+      max-width: 50px;
+      padding: 4px 5px;
+    }
+    .model-pill {
+      max-width: 90px;
+    }
+    .model-pill-name {
+      max-width: 50px;
+    }
+    .thinking-pill {
+      padding: 4px 5px;
+    }
   }
 
   /* Model & Thinking Dropdown Menu Mobile Adjustments */
@@ -1395,6 +1460,58 @@ body {
     height: 32px;
   }
 
+  /* CWD Modal Mobile Adjustments */
+  .modal {
+    width: 92%;
+    max-width: 440px;
+    padding: 16px;
+    border-radius: 14px;
+    gap: 12px;
+    box-sizing: border-box;
+  }
+  .modal-header h3 {
+    font-size: 15px;
+  }
+  .modal-desc {
+    font-size: 12px;
+  }
+  .input-group {
+    display: flex;
+    flex-direction: row;
+    gap: 6px;
+    width: 100%;
+    box-sizing: border-box;
+  }
+  .input-group input {
+    font-size: 13px;
+    padding: 9px 10px;
+    min-width: 0;
+  }
+  .btn-primary {
+    padding: 0 14px;
+    font-size: 12px;
+    height: 38px;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+  }
+  .quick-dirs .chips .chip {
+    font-size: 11px;
+    padding: 5px 8px;
+    word-break: break-all;
+  }
+
+  @media (max-width: 380px) {
+    .input-group {
+      flex-direction: column;
+      gap: 8px;
+    }
+    .btn-primary {
+      width: 100%;
+    }
+  }
+
   .composer-hint {
     font-size: 10px;
     margin-top: 6px;

package/scripts/install-service.sh

@@ -0,0 +1,84 @@
+#!/usr/bin/env bash
+# Install pi-web-chat as a user-level systemd service.
+#
+# Why user-level? pi reads/writes ~/.pi and cwd files under $HOME, and it
+# launches `pi` from ~/.npm-global/bin (or wherever $PI_BIN points). Running
+# as a system unit would either need root or your home dir in a bind mount;
+# user-level systemd (systemd --user) is the obvious fit and needs no sudo.
+#
+# Usage:
+#   ./scripts/install-service.sh [PORT] [--restart]
+#
+# After install:
+#   journalctl --user -u pi-web-chat -f
+#   systemctl --user status pi-web-chat
+#   systemctl --user restart pi-web-chat
+
+set -euo pipefail
+
+HERE="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
+ROOT="$(cd "$HERE/.." && pwd)"
+SRC="$HERE/pi-web-chat.service"
+DEST_DIR="${XDG_CONFIG_HOME:-$HOME/.config}/systemd/user"
+DEST="$DEST_DIR/pi-web-chat.service"
+
+PORT="${1:-3000}"
+RESTART_NOW="no"
+for arg in "$@"; do
+  case "$arg" in
+    --restart|--now) RESTART_NOW="yes" ;;
+  esac
+done
+
+# Sanity checks.
+if [[ ! -f "$SRC" ]]; then
+  echo "ERR: unit file not found at $SRC" >&2; exit 1
+fi
+if ! command -v node >/dev/null 2>&1; then
+  echo "ERR: 'node' not on PATH" >&2; exit 1
+fi
+if ! command -v systemctl >/dev/null 2>&1; then
+  echo "ERR: 'systemctl' not on PATH — this installer only supports systemd" >&2; exit 1
+fi
+# User systemd needs linger for services to outlive the login session.
+if ! loginctl show-user "$USER" 2>/dev/null | grep -q '^Linger=yes'; then
+  echo "⚠ Linger is not enabled for $USER — service will stop at logout."
+  echo "  To keep it running after logout, run (one-off, requires sudo):"
+  echo "    sudo loginctl enable-linger $USER"
+fi
+
+mkdir -p "$DEST_DIR"
+
+# Concrete paths. The shipped unit uses %h for portability, but %h is only
+# resolved when the user systemd instance starts — and we want a file that
+# 'systemctl --user status' shows an exact path on, so substitute now.
+USER_HOME="$HOME"
+PROJECT_DIR="$ROOT"
+NODE_BIN="$(command -v node)"
+
+# Read the template and substitute.
+sed \
+  -e "s|^WorkingDirectory=.*|WorkingDirectory=$PROJECT_DIR|" \
+  -e "s|^ExecStart=.*|ExecStart=$NODE_BIN $PROJECT_DIR/server.js|" \
+  -e "s|^Environment=PORT=.*|Environment=PORT=$PORT|" \
+  -e "s|%h/projects/pi-web-chat|$PROJECT_DIR|g" \
+  -e "s|%h/|$USER_HOME/|g" \
+  "$SRC" > "$DEST"
+
+echo "✔ wrote $DEST"
+
+# Reload + (re)enable + start.
+systemctl --user daemon-reload
+systemctl --user enable pi-web-chat.service
+if [[ "$RESTART_NOW" == "yes" ]] || systemctl --user is-active --quiet pi-web-chat.service; then
+  systemctl --user restart pi-web-chat.service
+else
+  systemctl --user start pi-web-chat.service || true
+fi
+
+echo
+echo "Status:"
+systemctl --user --no-pager status pi-web-chat.service || true
+echo
+echo "Logs:"
+echo "  journalctl --user -u pi-web-chat -f"

package/scripts/pi-web-chat.service

@@ -0,0 +1,41 @@
+[Unit]
+Description=pi-web-chat (pi RPC web UI)
+Documentation=https://github.com/liguoshuai-1990/pi-web-chat
+# Run after the user session / network is available (no-op for user systemd
+# units that run after the user logs in).
+After=network-online.target
+Wants=network-online.target
+
+[Service]
+Type=simple
+# Project lives in $HOME/projects/pi-web-chat — override with `WorkingDirectory=`
+# in an override unit or in install-service.sh if you keep it elsewhere.
+# We don't hardcode the path here so the file is portable across machines /
+# forks; the install script substitutes it at install time.
+WorkingDirectory=%h/projects/pi-web-chat
+
+# Same reasoning for the Node binary — prefer what Node.js EnvFile says if
+# the user has nvm/fnm; otherwise rely on /usr/bin/node being on PATH.
+ExecStart=/usr/bin/env node server.js
+
+# Allow overriding via environment files / drop-ins without editing this
+# unit. PORT, PI_BIN, PI_SESSIONS_DIR etc. are honored by server.js.
+Environment=PORT=3000
+Environment=NODE_ENV=production
+Environment=PI_SKIP_VERSION_CHECK=1
+
+# Logging: stdout/stderr go to journald. `journalctl --user -u pi-web-chat -f`.
+StandardOutput=journal
+StandardError=journal
+SyslogIdentifier=pi-web-chat
+
+# Restart on any failure; back off so we don't tight-loop if node is broken.
+Restart=on-failure
+RestartSec=3
+
+# Hardening.
+NoNewPrivileges=true
+PrivateTmp=true
+
+[Install]
+WantedBy=default.target

package/scripts/uninstall-service.sh

@@ -0,0 +1,25 @@
+#!/usr/bin/env bash
+# Remove the pi-web-chat user systemd service.
+# Does NOT delete the project directory or sessions.
+
+set -euo pipefail
+
+UNIT_NAME="pi-web-chat.service"
+DEST="${XDG_CONFIG_HOME:-$HOME/.config}/systemd/user/$UNIT_NAME"
+
+if ! command -v systemctl >/dev/null 2>&1; then
+  echo "ERR: 'systemctl' not on PATH" >&2; exit 1
+fi
+
+if systemctl --user list-unit-files "$UNIT_NAME" 2>/dev/null | grep -q "$UNIT_NAME"; then
+  systemctl --user disable --now "$UNIT_NAME" || true
+  echo "✔ disabled $UNIT_NAME"
+fi
+
+if [[ -f "$DEST" ]]; then
+  rm "$DEST"
+  systemctl --user daemon-reload
+  echo "✔ removed $DEST"
+else
+  echo "no unit file at $DEST"
+fi

package/server.js

@@ -36,15 +36,20 @@ function resolvePiBin() {
 const PI_BIN = resolvePiBin();
 function home() { return os.homedir(); }
 
-function normalizeCwd(dir) {
-  if (!dir) return process.cwd() || home();
-  let resolved = dir;
-  if (dir.startsWith("~")) {
-    resolved = path.join(home(), dir.slice(1));
+function normalizePath(p) {
+  if (!p) return "";
+  let resolved = p;
+  if (p.startsWith("~")) {
+    resolved = path.join(home(), p.slice(1));
   }
   return path.resolve(resolved);
 }
 
+function normalizeCwd(dir) {
+  if (!dir) return process.cwd() || home();
+  return normalizePath(dir);
+}
+
 // Where pi stores sessions, organized by cwd-encoded subdirectory.
 const SESSIONS_DIR = process.env.PI_SESSIONS_DIR || path.join(home(), ".pi", "agent", "sessions");
 const PORT = process.env.PORT || 3000;
@@ -172,13 +177,19 @@ class PiAgent {
       if (IDLE_DROP_HEAP) {
         try { if (typeof global.gc === "function") global.gc(); } catch {}
       }
+      // If unkeyed AND truly idle (never had a session assigned and not busy),
+      // no client can ever re-attach to it. Stop immediately to reclaim memory.
+      if (!this.sessionKey && !this.isBusy) {
+        this.stop();
+        return;
+      }
       this.maybeScheduleIdleKill();
     }
   }
 
   setSessionKey(cwd, sessionPath) {
     if (!sessionPath) return;
-    const resolved = path.resolve(sessionPath);
+    const resolved = normalizePath(sessionPath);
     const key = `${cwd}:${resolved}`;
     if (this.sessionKey && this.sessionKey !== key) {
       activeAgents.delete(this.sessionKey);
@@ -551,6 +562,19 @@ app.post("/api/set-default-model", async (req, res) => {
       current.defaultThinkingLevel = thinkingLevel;
     }
 
+    // If enabledModels is configured in settings.json, ensure the new default model
+    // is in the enabledModels list, otherwise Pi core startup logic will fall back
+    // to enabledModels[0] instead of using defaultModel.
+    if (Array.isArray(current.enabledModels) && current.enabledModels.length > 0) {
+      const fullId = `${provider}/${modelId}`;
+      const inList = current.enabledModels.some(item =>
+        item === fullId || item === modelId || item === `${provider}/*` || item === "*"
+      );
+      if (!inList) {
+        current.enabledModels.unshift(fullId);
+      }
+    }
+
     await writeFile(settingsPath, JSON.stringify(current, null, 2), "utf8");
 
     res.json({
@@ -604,11 +628,13 @@ async function listAllSessionFiles() {
   // Root-level .jsonl files (created when we pass --session-dir to pi).
   const top = await readdir(SESSIONS_DIR, { withFileTypes: true }).catch(() => []);
   for (const e of top) {
-    if (e.isFile() && e.name.endsWith(".jsonl")) files.push(path.join(SESSIONS_DIR, e.name));
+    if ((e.isFile() || e.isSymbolicLink()) && e.name.endsWith(".jsonl")) {
+      files.push(path.join(SESSIONS_DIR, e.name));
+    }
   }
 
   // Subdirectory .jsonl files (created by pi itself when cwd is encoded).
-  const subdirs = top.filter(d => d.isDirectory());
+  const subdirs = top.filter(d => d.isDirectory() || (d.isSymbolicLink() && !d.name.endsWith(".jsonl")));
   for (const d of subdirs) {
     const dp = path.join(SESSIONS_DIR, d.name);
     const names = (await readdir(dp).catch(() => [])).filter(f => f.endsWith(".jsonl"));
@@ -629,11 +655,14 @@ async function getSessionMetadata(file) {
 
   const content = await readFile(file, "utf8");
   const lines = content.split("\n").filter(Boolean);
-  let header = null, title = null, msgCount = 0;
+  let header = null, title = null, sessionName = null, msgCount = 0;
   for (const line of lines) {
     let o;
     try { o = JSON.parse(line); } catch { continue; }
     if (o.type === "session") header = o;
+    if (o.type === "session_info" && o.name) {
+      sessionName = o.name.trim();
+    }
     if (o.type === "message" && o.message && o.message.role === "user" && !title) {
       title = extractText(o.message.content).slice(0, 80);
     }
@@ -649,6 +678,7 @@ async function getSessionMetadata(file) {
       file,
       name: path.basename(file),
       id: header.id,
+      sessionName: sessionName || null,
       timestamp: header.timestamp,
       firstUser: title,
       messageCount: msgCount,
@@ -662,15 +692,18 @@ app.get("/api/sessions", async (req, res) => {
   try {
     const cwd = normalizeCwd(req.query.cwd);
     const all = await listAllSessionFiles();
-    const sessions = [];
-    for (const full of all) {
-      try {
-        const meta = await getSessionMetadata(full);
-        if (meta && meta.cwd === cwd) {
-          sessions.push(meta.sessionInfo);
-        }
-      } catch {}
-    }
+    const results = await Promise.all(
+      all.map(async (full) => {
+        try {
+          const meta = await getSessionMetadata(full);
+          if (meta && meta.cwd === cwd) {
+            return meta.sessionInfo;
+          }
+        } catch {}
+        return null;
+      })
+    );
+    const sessions = results.filter(Boolean);
     sessions.sort((a, b) => (b.timestamp || "").localeCompare(a.timestamp || ""));
     res.json({ cwd, sessions });
   } catch (e) {
@@ -684,7 +717,7 @@ function extractText(content) {
   if (!Array.isArray(content)) return "";
   return content
     .filter(c => c && (c.type === "text" || typeof c === "string"))
-    .map(c => typeof c === "string" ? c : c.text)
+    .map(c => typeof c === "string" ? c : (c.text || ""))
     .join("");
 }
 
@@ -695,8 +728,8 @@ app.get("/api/session", async (req, res) => {
     if (!file || !file.endsWith(".jsonl")) return res.status(400).json({ error: "bad file" });
     
     // Security check: ensure the file path is within SESSIONS_DIR
-    const resolvedFile = path.resolve(file);
-    const resolvedSessionsDir = path.resolve(SESSIONS_DIR);
+    let resolvedFile = normalizePath(file);
+    const resolvedSessionsDir = normalizePath(SESSIONS_DIR);
     const relPath = path.relative(resolvedSessionsDir, resolvedFile);
     if (relPath.startsWith("..") || path.isAbsolute(relPath)) {
       return res.status(403).json({ error: "Access denied" });
@@ -706,9 +739,13 @@ app.get("/api/session", async (req, res) => {
     const lines = content.split("\n").filter(Boolean);
     const entries = [];
     let header = null;
+    let sessionName = null;
     for (const line of lines) {
       let o; try { o = JSON.parse(line); } catch { continue; }
       if (o.type === "session") header = o;
+      if (o.type === "session_info" && o.name) {
+        sessionName = o.name.trim();
+      }
       entries.push(o);
     }
     // Build a map and reconstruct the active path from root -> leaf.
@@ -762,7 +799,7 @@ app.get("/api/session", async (req, res) => {
       }
     }
 
-    res.json({ header, entries: entryChain, model: sessionModel });
+    res.json({ header, entries: entryChain, model: sessionModel, sessionName });
   } catch (e) {
     console.error(e);
     res.status(500).json({ error: String(e) });
@@ -804,7 +841,7 @@ wss.on("connection", (ws, req) => {
   const url = new URL(req.url, "http://x");
   const cwd = normalizeCwd(url.searchParams.get("cwd"));
   const session = url.searchParams.get("session") || null;
-  const key = session ? `${cwd}:${path.resolve(session)}` : null;
+  const key = session ? `${cwd}:${normalizePath(session)}` : null;
 
   let agent = null;
   if (key && activeAgents.has(key) && activeAgents.get(key).alive) {