From a967306a2f538c4ca8536298288e38334522394c Mon Sep 17 00:00:00 2001
From: JianMiau <bir840124@gmail.com>
Date: Mon, 20 Jul 2026 14:35:00 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BB=BB=E5=8B=99=E6=B4=BE=E7=99=BC=E6=8C=89?=
 =?UTF-8?q?=E9=88=95=E5=8A=A0=20hover=20=E6=B0=A3=E6=B3=A1=E6=8F=90?=
 =?UTF-8?q?=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

摘要：
「續上次 session」與「派發任務」滑鼠停留時顯示氣泡說明,
講清楚 resume 的限制:只能延續已結束的 session,
無法插入正在終端機進行中的互動對話。

根本原因：
resume 的行為(--resume 最新已結束 session、執行中任務會排隊)
只寫在 README,介面上沒有任何說明,容易誤以為能接管進行中的對話。

影響：
純 UI 提示,無行為變更。

修法：
styles.css 新增 .tip 通用氣泡(data-tip 屬性 + ::before/::after,
延遲淡入、面板內靠右對齊);SidePanel 兩個控制項掛上說明文字。

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 src/components/SidePanel.tsx | 16 ++++++++---
 src/styles.css               | 54 ++++++++++++++++++++++++++++++++++++
 2 files changed, 66 insertions(+), 4 deletions(-)

diff --git a/src/components/SidePanel.tsx b/src/components/SidePanel.tsx
index 6417be3..30e0e6d 100644
--- a/src/components/SidePanel.tsx
+++ b/src/components/SidePanel.tsx
@@ -42,13 +42,21 @@ function TaskComposer({ agentId }: { agentId: string }) {
         }}
       />
       <div className="task-composer-row">
-        <label>
+        <label
+          className="tip"
+          data-tip="延續該專案最近一段「已結束」的 session 繼續對話(--resume)。注意:無法插入正在終端機進行中的互動對話;若該專案已有任務在跑,新任務會自動排隊。"
+        >
           <input type="checkbox" checked={resume} onChange={(e) => setResume(e.target.checked)} />
           續上次 session
         </label>
-        <button className="btn assign-btn" onClick={send} disabled={sending || !prompt.trim()}>
-          {sending ? "派發中…" : "🚀 派發任務"}
-        </button>
+        <span
+          className="tip"
+          data-tip="在該專案目錄開一個 headless session 執行此任務,過程會即時顯示在辦公室,完成後於事件紀錄回報。"
+        >
+          <button className="btn assign-btn" onClick={send} disabled={sending || !prompt.trim()}>
+            {sending ? "派發中…" : "🚀 派發任務"}
+          </button>
+        </span>
       </div>
     </div>
   );
diff --git a/src/styles.css b/src/styles.css
index 15b3056..aed8625 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -376,6 +376,60 @@
   cursor: pointer;
 }
 
+/* hover tooltip bubble (data-tip) */
+.tip {
+  position: relative;
+}
+
+.tip::before {
+  content: "";
+  position: absolute;
+  bottom: calc(100% + 2px);
+  left: 24px;
+  border: 6px solid transparent;
+  border-top-color: var(--text);
+  opacity: 0;
+  transition: opacity 0.15s ease 0.15s;
+  pointer-events: none;
+}
+
+.tip::after {
+  content: attr(data-tip);
+  position: absolute;
+  bottom: calc(100% + 13px);
+  left: 0;
+  width: 230px;
+  background: var(--text);
+  color: var(--bg-panel);
+  font-size: 11px;
+  font-weight: 500;
+  line-height: 1.55;
+  padding: 8px 10px;
+  border-radius: 9px;
+  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
+  opacity: 0;
+  transition: opacity 0.15s ease 0.15s;
+  pointer-events: none;
+  white-space: normal;
+  text-align: left;
+  z-index: 20;
+}
+
+.tip:hover::before,
+.tip:hover::after {
+  opacity: 1;
+}
+
+.task-composer-row .tip::after {
+  left: auto;
+  right: 0;
+}
+
+.task-composer-row label.tip::after {
+  left: 0;
+  right: auto;
+}
+
 .task-composer-row .assign-btn {
   width: auto;
   margin-top: 0;