@liguoshuai/pi-web-chat 2.18.13 → 2.19.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@liguoshuai/pi-web-chat",
-  "version": "2.18.13",
+  "version": "2.19.1",
   "description": "A ChatGPT/Gemini-style web UI for the pi coding agent, powered by pi's RPC mode.",
   "type": "module",
   "main": "server.js",
@@ -42,8 +42,8 @@
   "dependencies": {
     "express": "^4.21.2",
     "ws": "^8.18.0",
-    "@liguoshuai/pi-chat-server": "2.18.13",
-    "@liguoshuai/pi-chat-protocol": "2.18.13"
+    "@liguoshuai/pi-chat-protocol": "2.19.1",
+    "@liguoshuai/pi-chat-server": "2.19.1"
   },
   "scripts": {
     "build": "node --check server.js && node --check bin/pi-web-chat.js && node --check public/markdown.js && node --check public/app.js",

package/public/app.js

@@ -168,8 +168,17 @@ async function loadServerConfig() {
     }
     if (data.version) {
       state.version = data.version;
-      const verEl = $("#appVersion");
-      if (verEl) verEl.textContent = `v${data.version}`;
+    }
+    if (data.piVersion) {
+      state.piVersion = data.piVersion;
+    }
+    const piVerEl = $("#piVersion");
+    if (piVerEl) {
+      piVerEl.textContent = state.piVersion ? ` v${state.piVersion}` : "";
+    }
+    const verEl = $("#appVersion");
+    if (verEl) {
+      verEl.textContent = state.version ? ` v${state.version}` : "";
     }
     if (data.defaultModel) {
       state.defaultModel = data.defaultModel;
@@ -757,6 +766,7 @@ function reconstructFromEntries(entries, timing = null) {
       lastUserTs = msgTs;
       turnIndex++;
       thinkingIdx = 0;          // reset thinking index for the new turn
+      const isSteer = Boolean(m.isSteer || e.isSteer || e.customType === "steer" || m.customType === "steer");
       // Extract optional images from user message content array
       let images = [];
       if (Array.isArray(m.content)) {
@@ -768,7 +778,7 @@ function reconstructFromEntries(entries, timing = null) {
             url: c.data ? `data:${c.mimeType || "image/png"};base64,${c.data}` : (c.url || "")
           }));
       }
-      out.push({ role: "user", text: extractContentText(m.content), images, ts: msgTs });
+      out.push({ role: "user", text: extractContentText(m.content), images, ts: msgTs, isSteer });
     } else if (m.role === "assistant") {
       let turnDurationMs = null;
       // Try timing data first, then fall back to timestamp heuristic.
@@ -836,10 +846,19 @@ function extractContentText(content) {
     .join("\n\n");
 }
 
-function appendSystemNotice(text) {
+function appendSystemNotice(text, replaceIfLast = true) {
   if (!text) return;
   const chatInner = $("#chat-inner");
   if (!chatInner) return;
+  const lastChild = chatInner.lastElementChild;
+  if (replaceIfLast && lastChild && lastChild.classList.contains("system-notice-divider")) {
+    const textEl = lastChild.querySelector(".system-notice-text");
+    if (textEl) {
+      textEl.textContent = text;
+      scrollBottom();
+      return;
+    }
+  }
   const node = el("div", { class: "system-notice-divider" }, [
     el("span", { class: "system-notice-text", text })
   ]);
@@ -1651,6 +1670,9 @@ function refreshStreamingContent() {
           el("span", { class: "thinking-spinner" }),
           el("span", { class: "thinking-label", text: "正在思考中…" })
         ]));
+        content.appendChild(el("div", { class: "streaming-cursor-row" }, [
+          el("span", { class: "typing-cursor" })
+        ]));
       }
     }
     scrollBottom();
@@ -1663,7 +1685,7 @@ function refreshStreamingContent() {
     const lastItem = items[items.length - 1];
     if (lastItem.type === "text") {
       const lastEl = content.lastElementChild;
-      if (lastEl && !lastEl.classList.contains("thinking-block") && !lastEl.classList.contains("tool-block")) {
+      if (lastEl && !lastEl.classList.contains("thinking-block") && !lastEl.classList.contains("tool-block") && !lastEl.classList.contains("streaming-cursor-row")) {
         const showCursor = state.streaming;
         lastEl.innerHTML = renderMarkdown(lastItem.text) + (showCursor ? '<span class="typing-cursor"></span>' : "");
         scrollBottom();
@@ -1675,6 +1697,7 @@ function refreshStreamingContent() {
   // Full rebuild (new items added or structure changed)
   content.innerHTML = "";
   const lastIdx = items.length - 1;
+  let hasText = false;
   for (let i = 0; i < items.length; i++) {
     const item = items[i];
     const isLast = (i === lastIdx);
@@ -1684,10 +1707,16 @@ function refreshStreamingContent() {
     } else if (item.type === "tool") {
       if (item.tc?.block) content.appendChild(item.tc.block);
     } else if (item.type === "text") {
+      hasText = true;
       const showCursor = state.streaming && isLast;
       content.appendChild(el("div", { html: renderMarkdown(item.text) + (showCursor ? '<span class="typing-cursor"></span>' : "") }));
     }
   }
+  if (state.streaming && !hasText) {
+    content.appendChild(el("div", { class: "streaming-cursor-row" }, [
+      el("span", { class: "typing-cursor" })
+    ]));
+  }
   lastRenderedItemCount = items.length;
   scrollBottom();
 }
@@ -3071,6 +3100,13 @@ function submitSteer() {
     return;
   }
 
+  // If there was an active streaming assistant block before steering, finalize it
+  // so that subsequent assistant chunks render in a new block below this steer message!
+  if (state.streamingMsg) {
+    finalizeStreamingMsg();
+    state.streaming = true; // resume streaming flag for subsequent response
+  }
+
   appendMessageNode("user", { text, isSteer: true, ts: Date.now() });
   ta.value = "";
   autoResize();

package/public/index.html

@@ -30,11 +30,10 @@
         <div id="connStatus" class="conn-status" title="点击可重新连接"><span id="connDot" style="color: var(--danger);">●</span>&nbsp;<span id="connLabel">连接中…</span></div>
         <div class="sidebar-bottom-meta">
           <div class="sidebar-bottom-links">
-            <a href="https://pi.dev" target="_blank" rel="noopener">pi.dev</a>
+            <a href="https://pi.dev" target="_blank" rel="noopener">pi<span id="piVersion"></span></a>
             <span class="sidebar-link-sep">·</span>
-            <a href="https://github.com/liguoshuai-1990/pi-web-chat" target="_blank" rel="noopener">pi-web-chat</a>
+            <a href="https://github.com/liguoshuai-1990/pi-chat" target="_blank" rel="noopener">pi-chat<span id="appVersion"></span></a>
           </div>
-          <span id="appVersion" class="app-version" title="pi-web-chat 版本"></span>
         </div>
       </div>
       <div class="sidebar-resizer" id="sidebarResizer" title="拖拽调整侧边栏宽度，双击恢复默认"></div>

package/public/style.css

@@ -342,7 +342,6 @@ body {
   margin-top: 6px;
   display: flex;
   align-items: center;
-  justify-content: space-between;
   gap: 8px;
 }
 .sidebar-bottom-links {
@@ -928,6 +927,13 @@ body {
   to { opacity: 1; transform: scale(1.25); }
 }
 
+.streaming-cursor-row {
+  margin-top: 6px;
+  line-height: 1;
+}
+.streaming-cursor-row .typing-cursor::after {
+  margin-left: 0;
+}
 .typing-cursor::after {
   content: "▋"; display: inline-block; margin-left: 2px;
   animation: blink 1s steps(2) infinite; color: var(--accent);