dsh-ws-recency 0.9.1 → 0.10.0

package/README.md

@@ -1,6 +1,6 @@
 # dsh-ws-recency
 
-DSH 侧栏的五件事：**工作区分组按最近活跃排序**、**过期历史自动折叠**、**运行中/未读/需跟进三色标记**、**所有置顶会话汇总到顶部一个区**、**删除会话到可恢复的回收站**。单独装上就有效，不依赖其它插件。
+DSH 侧栏的六件事：**工作区分组按最近活跃排序**、**过期历史自动折叠**、**运行中/未读/需跟进三色标记**、**所有置顶会话汇总到顶部一个区**、**删除会话到可恢复的回收站**、**按工具分类的 token 消耗统计**。单独装上就有效，不依赖其它插件。
 
 ## 一、分组排序
 
@@ -12,7 +12,9 @@ DSH 已经把**组内**会话按 `updatedAt` 倒序排好了（排序方式 =
 
 会话超过 `foldDays`（默认 **3 天**）没有更新就折叠起来；整个工作区都过期时，它只剩一行工作区标题——需要翻历史时点开就行。
 
-- **两个控件各管一件事**：宿主的「展开其余 N 条会话」负责让**宿主渲染**更多行（数字由宿主自己报，插件不再改写它）；插件的 `展开历史 N` / `收起历史` 只负责把**已渲染但过期**的行折叠起来，点两次就是展开、收起一对；
+- **每组一个控件**：宿主的「展开其余 N 条会话」被隐藏，由插件的 `展开历史 N` / `收起历史` 接管。N = 宿主还没渲染的行 + 已折叠的过期行；
+  - 点「展开历史」→ 插件逐轮驱动宿主那个隐藏按钮（每轮它会多渲染 5 条，剩下 ≤5 条时一次全出），直到整组都渲染出来，同时展开过期行——**一次点到全展开**；
+  - 点「收起历史」→ 重新折叠过期行（宿主已渲染的部分仍由插件按时间折叠，不会丢失）；
 - 选中 / 运行中 / 等待处理的会话**永不折叠**（可在设置里关掉这个豁免）；
 - 空白草稿行（新会话）不参与折叠判断；
 - 每 5 分钟自动重算一次，所以跨过 3 天边界的会话会自己折叠，不用刷新。
@@ -61,6 +63,16 @@ DSH 原生的置顶只把会话顶到**它所属工作区分组的第一行**，
 
 **不是物理删除**：目录只是被改名搬走，恢复就是把 `.trash/ws-recency/<id>-<时间>/` 移回 `sessions/<project>/<id>/`。这条删除走的是宿主侧路由（`POST /ws-recency/session-trash`，仅接受回环来源），因为浏览器侧碰不到文件系统。
 
+## 六、Token 消耗统计
+
+会话「…」菜单 →「Token 消耗统计」：
+
+- **真实账单**（每步记录的 usage）：步数、输入（未缓存）、缓存命中、输出、合计；
+- **结构占比**（按内容估算）：主 agent 自己（思考 / 回复 / 用户消息 / 系统提示）vs 每个工具，一条占比条 + 图例；
+- **工具表**：调用次数、参数估算、结果估算、合计、占比，按合计降序。
+
+口径说明：prompt 的 token 是「整段上下文每一步都计费」，没法精确归属到某一条消息，所以「主 agent / 工具」的拆分是按内容长度估算（中文≈1 token/字，英文≈4 字符/token），用来比较占比；**总量是真的**。数据从会话日志算，跨重启也能看。大会话第一次打开约 1–2 秒（29MB 日志实测 1.2 秒），10 秒内重复打开走缓存。
+
 ## 设置
 
 **设置 → 通用**：
@@ -96,7 +108,7 @@ dsh plugin --profile <profile> add github:chyxhtc/dsh-ws-recency
 或固定版本的预构建包：
 
 ```powershell
-dsh plugin --profile <profile> add https://github.com/chyxhtc/dsh-ws-recency/releases/download/v0.9.1/dsh-ws-recency-0.9.1.tgz
+dsh plugin --profile <profile> add https://github.com/chyxhtc/dsh-ws-recency/releases/download/v0.10.0/dsh-ws-recency-0.10.0.tgz
 ```
 
 装完把 `dsh-ws-recency` 加进 `~/.hypers-work/profiles/<profile>/package.json` 的 `dsh.profile.bundles`，重启应用。

package/client.js

@@ -69,6 +69,8 @@
         var MIN_DAYS = 1;
         var MAX_DAYS = 90;
         var DEFAULT_DAYS = 3;
+        /** Safety stop for driving the host's own "show more" (5 rows per click). */
+        var MAX_EXPAND_CLICKS = 40;
         var TICK_MS = 5 * 60 * 1000;
 
         var data = { sessions: null, workspaces: null, settings: null, statuses: null, actions: null, service: null, t: null };
@@ -82,6 +84,7 @@
         var dots = new Set();
         var pinHidden = new Set();
         var pinHost = null;
+        var expandClicks = new Map();
         var expandedSections = new Set();
         var headerMarked = new WeakSet();
         var disposed = false;
@@ -91,6 +94,7 @@
           "[" + ROOT_ATTR + '="true"]>*{flex:0 0 auto}',
           "[" + HIDDEN_ATTR + '="true"]{display:none !important}',
           "[" + PIN_HIDDEN_ATTR + '="true"]{display:none !important}',
+          '[class*="' + OVERFLOW_TOKEN + '"]{display:none !important}',
           ".wsr-pin{display:flex;flex-direction:column;flex:0 0 auto;padding:2px 0 6px;margin-bottom:4px;border-bottom:.5px solid var(--dsw-alias-border-l2)}",
           ".wsr-pin-head{font-size:11px;line-height:16px;color:var(--dsw-alias-label-tertiary);padding:4px 12px 2px}",
           ".wsr-pin-row{display:flex;align-items:center;gap:8px;height:30px;padding:0 12px;border-radius:6px;cursor:pointer}",
@@ -100,6 +104,29 @@
           ".wsr-pin-unpin{flex:none;border:none;background:transparent;color:var(--dsw-alias-label-tertiary);cursor:pointer;font-size:11px;padding:2px 4px;border-radius:4px;visibility:hidden}",
           ".wsr-pin-row:hover .wsr-pin-unpin{visibility:visible}",
           ".wsr-pin-unpin:hover{color:var(--dsw-alias-label-primary)}",
+          ".wsr-modal-backdrop{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.45)}",
+          ".wsr-modal{width:min(720px,92vw);max-height:84vh;display:flex;flex-direction:column;background:var(--dsw-alias-bg-layer-1,#1f2226);color:var(--dsw-alias-label-primary,#e8e8e8);border:.5px solid var(--dsw-alias-border-l2,rgba(255,255,255,.14));border-radius:10px;box-shadow:0 12px 40px rgba(0,0,0,.45);overflow:hidden}",
+          ".wsr-modal-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:.5px solid var(--dsw-alias-border-l2,rgba(255,255,255,.1))}",
+          ".wsr-modal-title{font-size:14px;font-weight:600}",
+          ".wsr-modal-close{border:none;background:transparent;color:var(--dsw-alias-label-tertiary,#9aa0a6);font-size:18px;line-height:1;cursor:pointer;padding:2px 6px;border-radius:4px}",
+          ".wsr-modal-close:hover{color:var(--dsw-alias-label-primary,#e8e8e8)}",
+          ".wsr-modal-body{padding:14px;overflow:auto;display:flex;flex-direction:column;gap:12px;font-size:12px}",
+          ".wsr-stats-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}",
+          ".wsr-stats-card{background:var(--dsw-alias-bg-layer-2,rgba(255,255,255,.04));border-radius:8px;padding:8px 10px}",
+          ".wsr-stats-value{font-size:15px;font-weight:600}",
+          ".wsr-stats-label{font-size:11px;color:var(--dsw-alias-label-tertiary)}",
+          ".wsr-stats-bar{display:flex;height:10px;border-radius:5px;overflow:hidden;background:rgba(255,255,255,.06)}",
+          ".wsr-stats-seg{height:100%}",
+          ".wsr-stats-legend{display:flex;flex-wrap:wrap;gap:10px}",
+          ".wsr-stats-legend-item{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--dsw-alias-label-tertiary)}",
+          ".wsr-stats-swatch{width:8px;height:8px;border-radius:2px}",
+          ".wsr-stats-table{display:flex;flex-direction:column}",
+          ".wsr-stats-row{display:grid;grid-template-columns:1.4fr .6fr .8fr .8fr .8fr .6fr;gap:6px;padding:6px 4px;border-bottom:.5px solid rgba(255,255,255,.06)}",
+          ".wsr-stats-head{color:var(--dsw-alias-label-tertiary);font-size:11px}",
+          ".wsr-td{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}",
+          ".wsr-td-name{font-weight:500}",
+          ".wsr-td-strong{font-weight:600}",
+          ".wsr-stats-note{color:var(--dsw-alias-label-tertiary);font-size:11px;line-height:1.5}",
           ".wsr-toggle{width:100%;height:28px;padding:0 12px 0 calc(28px + var(--dsh-workspace-indent,0px));cursor:pointer;text-align:left;color:var(--dsw-alias-label-tertiary);background:0 0;border:none;font-size:12px}",
           ".wsr-toggle:hover{color:var(--dsw-alias-label-secondary)}",
           '[' + STATE_ATTR + '="running"] [class*="_title"]{color:#4f8ef7}',
@@ -134,6 +161,24 @@
           "menu.flag": "\u6807\u8bb0\u9700\u8981\u8ddf\u8fdb",
           "menu.unflag": "\u53d6\u6d88\u8ddf\u8fdb\u6807\u8bb0",
           "menu.trash": "\u5220\u9664\u4f1a\u8bdd\uff08\u79fb\u5165\u56de\u6536\u7ad9\uff09",
+          "menu.stats": "Token \u6d88\u8017\u7edf\u8ba1",
+          "stats.title": "Token \u6d88\u8017\u7edf\u8ba1",
+          "stats.loading": "\u7edf\u8ba1\u4e2d\u2026\uff08\u5927\u4f1a\u8bdd\u9700\u8981\u4e00\u4e24\u79d2\uff09",
+          "stats.failed": "\u7edf\u8ba1\u5931\u8d25\uff1a",
+          "stats.steps": "\u6b65\u6570",
+          "stats.input": "\u8f93\u5165\uff08\u672a\u7f13\u5b58\uff09",
+          "stats.cache": "\u7f13\u5b58\u547d\u4e2d",
+          "stats.output": "\u8f93\u51fa",
+          "stats.total": "\u5408\u8ba1",
+          "stats.agent": "\u4e3b agent",
+          "stats.col.source": "\u6765\u6e90",
+          "stats.col.calls": "\u8c03\u7528",
+          "stats.col.args": "\u53c2\u6570",
+          "stats.col.results": "\u7ed3\u679c",
+          "stats.col.total": "\u4f30\u7b97",
+          "stats.col.share": "\u5360\u6bd4",
+          "stats.note": "\u5408\u8ba1\u6765\u81ea\u6bcf\u6b65\u8bb0\u5f55\u7684\u771f\u5b9e usage\uff08\u7f13\u5b58\u547d\u4e2d + \u8f93\u5165 + \u8f93\u51fa\uff09\uff1b\u672c\u8868\u6309\u6765\u6e90\u7684\u62c6\u5206\u662f\u6309\u5185\u5bb9\u957f\u5ea6\u4f30\u7b97\uff08\u4e2d\u6587\u7ea6 1 token/\u5b57\uff0c\u82f1\u6587\u7ea6 4 \u5b57\u7b26/token\uff09\uff0c\u7528\u4e8e\u6bd4\u8f83\u5360\u6bd4\uff0c\u4e0d\u662f\u8ba1\u8d39\u53e3\u5f84\u3002",
+          "stats.agentDetail": "主 agent 构成：思考 {reasoning} · 回复 {text} · 用户消息 {user} · 系统提示 {system}",
           "trash.confirm": "\u5220\u9664\u8fd9\u4e2a\u4f1a\u8bdd\uff1f\n\n\u4f1a\u5148\u505c\u6b62\u5b83\u6b63\u5728\u8fdb\u884c\u7684\u5de5\u4f5c\uff0c\u518d\u628a\u65e5\u5fd7\u76ee\u5f55\u79fb\u5165\u56de\u6536\u7ad9\uff08\u4e0d\u662f\u7269\u7406\u5220\u9664\uff0c\u53ef\u4ee5\u624b\u52a8\u6062\u590d\uff09\u3002",
           "trash.failed": "\u5220\u9664\u5931\u8d25\uff1a",
         };
@@ -154,6 +199,24 @@
           "menu.flag": "Mark as needs follow-up",
           "menu.unflag": "Clear follow-up mark",
           "menu.trash": "Delete session (move to trash)",
+          "menu.stats": "Token statistics",
+          "stats.title": "Token statistics",
+          "stats.loading": "Counting\u2026 (a large session takes a second or two)",
+          "stats.failed": "Statistics failed: ",
+          "stats.steps": "steps",
+          "stats.input": "input (uncached)",
+          "stats.cache": "cache read",
+          "stats.output": "output",
+          "stats.total": "total",
+          "stats.agent": "main agent",
+          "stats.col.source": "source",
+          "stats.col.calls": "calls",
+          "stats.col.args": "args",
+          "stats.col.results": "results",
+          "stats.col.total": "estimate",
+          "stats.col.share": "share",
+          "stats.note": "Totals come from the recorded per-step usage (cache read + input + output). The per-source split is estimated from content length (about 1 token per CJK character, 4 characters per token otherwise) so the shares are comparable, not billable.",
+          "stats.agentDetail": "Agent composition: reasoning {reasoning} \u00b7 reply {text} \u00b7 user messages {user} \u00b7 system prompt {system}",
           "trash.confirm": "Delete this session?\n\nIt stops whatever the session is running, then moves the log directory into the trash folder (a move, not an erase: you can restore it by hand).",
           "trash.failed": "Delete failed: ",
         };
@@ -364,6 +427,22 @@
           return session !== undefined && session !== null && session.blank === true;
         }
 
+        /** The host's own "show more" button, hidden by CSS but still clickable. */
+        function overflowButtonOf(section) {
+          if (typeof section.querySelector !== "function") return null;
+          return section.querySelector('button[class*="' + OVERFLOW_TOKEN + '"]');
+        }
+
+        /** The count the host reports on its own button, 0 when there is none. */
+        function labelNumber(button) {
+          if (button === null || button === undefined) return 0;
+          var text = typeof button.textContent === "string" ? button.textContent : "";
+          var match = /\d+/.exec(text);
+          if (match === null) return 0;
+          var value = Number(match[0]);
+          return Number.isFinite(value) && value > 0 ? value : 0;
+        }
+
         /** Collapsing a group resets its fold state, so the click is observed. */
         function markHeader(header, key) {
           if (typeof header.addEventListener !== "function" || headerMarked.has(header)) return;
@@ -411,6 +490,13 @@
          * Fold the rows the host rendered that have not changed for `foldDays`, and
          * offer the group's own control to bring them back. A workspace whose every
          * session is that old therefore renders as a bare header.
+         *
+         * The host's own "show more" button is hidden (CSS) and driven from here: it
+         * only renders five rows at a time and cannot collapse once everything is
+         * rendered, which made "show more" look broken next to a fold. Expanding the
+         * group now clicks that hidden button once per pass until the host has
+         * rendered every session, so one click reveals everything; collapsing just
+         * folds the stale rows again.
          */
         function foldRows(entries, settings, sessions, now) {
           var cutoff = now - settings.foldDays * DAY;
@@ -418,9 +504,29 @@
             var entry = entries[i];
             var section = entry.section;
             var rows = rowElements(section);
+            var hostButton = overflowButtonOf(section);
             markHeader(entry.header, entry.key);
 
             var expanded = expandedSections.has(entry.key);
+            var hostHidden = hostButton === null ? 0 : labelNumber(hostButton);
+            var hostExpanded = hostButton !== null
+              && typeof hostButton.getAttribute === "function"
+              && hostButton.getAttribute("aria-expanded") === "true";
+            if (expanded && hostButton !== null && !hostExpanded) {
+              /* The host renders five more per click (or everything when five or
+                 fewer remain) and reports `aria-expanded` once nothing is hidden.
+                 Stopping on that flag is what keeps the loop from collapsing the
+                 very thing it just expanded - a click on an expanded host button
+                 resets the watermark. */
+              var used = expandClicks.get(entry.key) || 0;
+              if (used < MAX_EXPAND_CLICKS) {
+                expandClicks.set(entry.key, used + 1);
+                hostButton.click();
+              }
+            } else if (!expanded) {
+              expandClicks.delete(entry.key);
+            }
+
             var folded = 0;
             for (var j = 0; j < rows.length; j += 1) {
               var row = rows[j];
@@ -439,22 +545,22 @@
               }
             }
 
-            /* The host's own "show more" button and this fold are two different
-               things: the host decides which rows it RENDERS, this plugin decides
-               which rendered rows stay VISIBLE. Touching the host's label or its
-               click made the two fight (a count nobody could trust, and a collapse
-               that never came back), so they stay separate: the group gets its own
-               "show history" control whenever something is folded. */
+            /* ONE control per group: its count is everything the group still hides,
+               both the rows the host did not render and the stale rows this plugin
+               folded. Expanding drives the hidden host button until nothing is left
+               unrendered, so one click reveals the whole group. */
+            var remaining = folded + hostHidden;
             if (expanded) {
               (function (entryKey) {
                 ensureToggle(section, entryKey, t("fold.hide"), function () {
                   expandedSections.delete(entryKey);
+                  expandClicks.delete(entryKey);
                   schedule();
                 });
               })(entry.key);
-            } else if (folded > 0) {
+            } else if (remaining > 0) {
               (function (entryKey) {
-                ensureToggle(section, entryKey, t("fold.show", { n: folded }), function () {
+                ensureToggle(section, entryKey, t("fold.show", { n: remaining }), function () {
                   expandedSections.add(entryKey);
                   schedule();
                 });
@@ -797,6 +903,186 @@
           }, props.t("menu.trash"));
         }
 
+        /* ------------------------- token statistics ------------------------- */
+
+        var statsModal = null;
+
+        function formatTokens(value) {
+          var n = Number(value) || 0;
+          if (n >= 1e9) return (n / 1e9).toFixed(2) + "B";
+          if (n >= 1e6) return (n / 1e6).toFixed(2) + "M";
+          if (n >= 1e3) return (n / 1e3).toFixed(1) + "K";
+          return String(Math.round(n));
+        }
+
+        function formatShare(share) {
+          if (typeof share !== "number" || !Number.isFinite(share)) return "-";
+          return (share * 100).toFixed(1) + "%";
+        }
+
+        function closeStatsPanel() {
+          if (statsModal !== null) {
+            if (typeof statsModal.remove === "function") statsModal.remove();
+            statsModal = null;
+          }
+          if (typeof document !== "undefined" && typeof document.removeEventListener === "function") {
+            document.removeEventListener("keydown", onStatsKey);
+          }
+        }
+
+        function onStatsKey(event) {
+          if (event !== undefined && event.key === "Escape") closeStatsPanel();
+        }
+
+        function statsDiv(className, text) {
+          var node = document.createElement("div");
+          node.className = className;
+          if (text !== undefined) node.textContent = text;
+          return node;
+        }
+
+        /** One table row: source, calls, argument tokens, result tokens, total, share. */
+        function statsRow(label, calls, args, results, total, share) {
+          var row = document.createElement("div");
+          row.className = "wsr-stats-row";
+          var name = statsDiv("wsr-td wsr-td-name", label);
+          row.appendChild(name);
+          row.appendChild(statsDiv("wsr-td", calls === null ? "-" : String(calls)));
+          row.appendChild(statsDiv("wsr-td", args === null ? "-" : formatTokens(args)));
+          row.appendChild(statsDiv("wsr-td", results === null ? "-" : formatTokens(results)));
+          row.appendChild(statsDiv("wsr-td wsr-td-strong", formatTokens(total)));
+          row.appendChild(statsDiv("wsr-td", formatShare(share)));
+          return row;
+        }
+
+        function renderStats(body, stats) {
+          body.textContent = "";
+          while (body.firstChild !== null) body.removeChild(body.firstChild);
+          var totals = stats.totals || {};
+          var estimate = stats.estimate || {};
+          var agent = estimate.agent || {};
+
+          var grid = document.createElement("div");
+          grid.className = "wsr-stats-grid";
+          var cards = [
+            [t("stats.steps"), formatTokens(stats.steps)],
+            [t("stats.input"), formatTokens(totals.inputTokens)],
+            [t("stats.cache"), formatTokens(totals.cacheReadTokens)],
+            [t("stats.output"), formatTokens(totals.outputTokens)],
+            [t("stats.total"), formatTokens(totals.totalTokens)],
+          ];
+          for (var i = 0; i < cards.length; i += 1) {
+            var card = statsDiv("wsr-stats-card");
+            card.appendChild(statsDiv("wsr-stats-value", cards[i][1]));
+            card.appendChild(statsDiv("wsr-stats-label", cards[i][0]));
+            grid.appendChild(card);
+          }
+          body.appendChild(grid);
+
+          var tools = estimate.tools || [];
+          var palette = ["#d97706", "#059669", "#7c3aed", "#db2777", "#0891b2", "#65a30d", "#9333ea", "#dc2626"];
+          var segments = [{ name: t("stats.agent"), share: agent.share || 0, color: "#4b8bf5" }];
+          for (var j = 0; j < tools.length; j += 1) segments.push({ name: tools[j].name, share: tools[j].share || 0, color: palette[j % palette.length] });
+
+          var bar = statsDiv("wsr-stats-bar");
+          for (var k = 0; k < segments.length; k += 1) {
+            if (segments[k].share <= 0) continue;
+            var piece = statsDiv("wsr-stats-seg");
+            piece.style.width = (segments[k].share * 100).toFixed(2) + "%";
+            piece.style.background = segments[k].color;
+            piece.setAttribute("title", segments[k].name + " " + formatShare(segments[k].share));
+            bar.appendChild(piece);
+          }
+          body.appendChild(bar);
+
+          var legend = statsDiv("wsr-stats-legend");
+          for (var m = 0; m < segments.length; m += 1) {
+            if (segments[m].share <= 0) continue;
+            var item = statsDiv("wsr-stats-legend-item");
+            var swatch = statsDiv("wsr-stats-swatch");
+            swatch.style.background = segments[m].color;
+            item.appendChild(swatch);
+            item.appendChild(statsDiv("wsr-stats-legend-text", segments[m].name + " " + formatShare(segments[m].share)));
+            legend.appendChild(item);
+          }
+          body.appendChild(legend);
+
+          var table = statsDiv("wsr-stats-table");
+          var head = document.createElement("div");
+          head.className = "wsr-stats-row wsr-stats-head";
+          var columns = ["stats.col.source", "stats.col.calls", "stats.col.args", "stats.col.results", "stats.col.total", "stats.col.share"];
+          for (var n = 0; n < columns.length; n += 1) head.appendChild(statsDiv("wsr-td", t(columns[n])));
+          table.appendChild(head);
+          table.appendChild(statsRow(t("stats.agent"), stats.steps, null, null, agent.total, agent.share));
+          for (var p = 0; p < tools.length; p += 1) {
+            var tool = tools[p];
+            table.appendChild(statsRow(tool.name, tool.calls, tool.args, tool.results, tool.total, tool.share));
+          }
+          body.appendChild(table);
+
+          body.appendChild(statsDiv("wsr-stats-detail", t("stats.agentDetail", {
+            reasoning: formatTokens(agent.reasoning),
+            text: formatTokens(agent.text),
+            user: formatTokens(agent.user),
+            system: formatTokens(agent.system),
+          })));
+          body.appendChild(statsDiv("wsr-stats-note", t("stats.note")));
+        }
+
+        function openStatsPanel(sessionId) {
+          if (typeof document === "undefined") return;
+          closeStatsPanel();
+          var backdrop = statsDiv("wsr-modal-backdrop");
+          var panel = statsDiv("wsr-modal");
+          backdrop.appendChild(panel);
+          var head = statsDiv("wsr-modal-head");
+          head.appendChild(statsDiv("wsr-modal-title", t("stats.title")));
+          var close = document.createElement("button");
+          close.type = "button";
+          close.className = "wsr-modal-close";
+          close.textContent = "\u00d7";
+          close.addEventListener("click", closeStatsPanel);
+          head.appendChild(close);
+          panel.appendChild(head);
+          var body = statsDiv("wsr-modal-body");
+          body.textContent = t("stats.loading");
+          panel.appendChild(body);
+          backdrop.addEventListener("click", function (event) {
+            if (event !== undefined && event.target === backdrop) closeStatsPanel();
+          });
+          document.body.appendChild(backdrop);
+          statsModal = backdrop;
+          document.addEventListener("keydown", onStatsKey);
+
+          fetch("/ws-recency/session-stats", {
+            method: "POST",
+            headers: { "content-type": "application/json" },
+            body: JSON.stringify({ sessionId: sessionId }),
+          })
+            .then(function (response) { return response.json(); })
+            .then(function (result) {
+              if (result === null || result.ok !== true) {
+                body.textContent = t("stats.failed") + (result && result.error ? result.error : "unknown");
+                return;
+              }
+              renderStats(body, result.stats);
+            })
+            .catch(function (error) {
+              body.textContent = t("stats.failed") + (error && error.message ? error.message : error);
+            });
+        }
+
+        /** Session "..." menu row: token statistics of that session. */
+        function StatsMenuItem(props) {
+          var Item = ui.MenuItemButton;
+          if (typeof Item !== "function") return null;
+          var Icon = ui.IconDataOutlineRegular;
+          return h(Item, {
+            icon: typeof Icon === "function" ? h(Icon, {}) : undefined,
+            onSelect: function () { openStatsPanel(props.sessionId); },
+          }, props.t("menu.stats"));
+        }
+
         /** Settings -> General row: how old a session must be before it is folded. */
         function SettingsRow(props) {
           var settings = props.useStore(function (state) { return state; });
@@ -913,6 +1199,7 @@
           pinHidden.clear();
           if (pinHost !== null && pinHost.parentElement !== null) pinHost.remove();
           pinHost = null;
+          expandClicks.clear();
           roots.forEach(function (root) { root.removeAttribute(ROOT_ATTR); });
           roots.clear();
           var marked = document.querySelectorAll("[" + STATE_ATTR + "]");
@@ -1029,6 +1316,16 @@
             }, FollowUpDot);
           });
 
+          ctx.slots.inject("sidebar.workspaces.session.menu.item", function () {
+            return ctx.slots.register({
+              name: "sidebar.workspaces.session.menu.item",
+              id: "ws-recency-stats",
+              order: 710,
+              store: prefs,
+              locale: NS,
+            }, StatsMenuItem);
+          });
+
           ctx.slots.inject("sidebar.workspaces.session.menu.item", function () {
             return ctx.slots.register({
               name: "sidebar.workspaces.session.menu.item",

package/index.js

@@ -19,8 +19,9 @@
  *
  * @module dsh-ws-recency
  */
-import { mkdir, readdir, rename } from "node:fs/promises";
+import { access, mkdir, readFile, readdir, rename, stat } from "node:fs/promises";
 import { dirname, join } from "node:path";
+import { zstdDecompressSync } from "node:zlib";
 
 /** Cordis plugin name shown by the loader. */
 export const name = "ws-recency";
@@ -208,7 +209,271 @@ export async function handleTrashRequest(ctx, req, res) {
   }
 }
 
-/** Cordis entry point: mount the route when the host has a web server. */
+/* ------------------------------------------------------------------------- *
+ * Token statistics
+ *
+ * The Client knows nothing about what a finished session cost, and a session may
+ * be months old, so this reads the session's own log. Recorded usage is exact
+ * (per assistant step: input / cache-read / output); the split between the agent
+ * itself and each tool is an estimate over the recorded content, because a
+ * prompt's tokens cannot be attributed to a single message - the whole context
+ * is billed every step.
+ *
+ * The log is a sequence of independent Zstandard frames, one per append, and the
+ * standard decoder stops after the first one. Splitting on the frame magic and
+ * decoding each frame is what makes the whole transcript readable.
+ * ------------------------------------------------------------------------- */
+
+export const STATS_SESSION_PATH = "/ws-recency/session-stats";
+
+const ZSTD_MAGIC = Buffer.from([0x28, 0xb5, 0x2f, 0xfd]);
+const STATS_CACHE_MS = 10 * 1000;
+const statsCache = new Map();
+
+/** bytes/4 per Latin character, ~1 token per CJK character. */
+export function estimateTokens(text) {
+  if (typeof text !== "string" || text === "") return 0;
+  let cjk = 0;
+  let other = 0;
+  for (const character of text) {
+    const code = character.codePointAt(0);
+    if ((code >= 0x2e80 && code <= 0x9fff) || (code >= 0xf900 && code <= 0xfaff) || (code >= 0x3000 && code <= 0x303f) || (code >= 0xff00 && code <= 0xffef)) cjk += 1;
+    else other += 1;
+  }
+  return Math.ceil(cjk + other / 4);
+}
+
+/** Text of one content block / a whole content array, whatever shape it takes. */
+function blockText(content) {
+  if (typeof content === "string") return content;
+  if (!Array.isArray(content)) return "";
+  let text = "";
+  for (const block of content) {
+    if (block === null || typeof block !== "object") continue;
+    if (typeof block.text === "string") text += block.text;
+    else if (typeof block.arguments === "string") text += block.arguments;
+    else if (typeof block.content === "string") text += block.content;
+  }
+  return text;
+}
+
+/**
+ * Aggregate one session's events into costs.
+ *
+ * Pure on purpose: the tests call it with hand-written events, and the route
+ * calls it with the decoded log.
+ */
+export function aggregateSession(events) {
+  const summary = {
+    session: { id: "", title: "", cwd: "", createdAt: 0, lastAt: 0 },
+    steps: 0,
+    totals: { inputTokens: 0, cacheReadTokens: 0, outputTokens: 0, totalTokens: 0 },
+    estimate: { agent: { reasoning: 0, text: 0, user: 0, system: 0, total: 0 }, tools: [], toolsTotal: 0, grandTotal: 0 },
+  };
+  const tools = new Map();
+  const callNames = new Map();
+  const toolOf = (name) => {
+    const key = typeof name === "string" && name !== "" ? name : "unknown";
+    let entry = tools.get(key);
+    if (entry === undefined) {
+      entry = { name: key, calls: 0, args: 0, results: 0, total: 0, share: 0 };
+      tools.set(key, entry);
+    }
+    return entry;
+  };
+
+  for (const event of events) {
+    if (event === null || typeof event !== "object") continue;
+    const data = event.data ?? {};
+    if (typeof event.time === "number") {
+      if (summary.session.createdAt === 0 || event.time < summary.session.createdAt) summary.session.createdAt = event.time;
+      if (event.time > summary.session.lastAt) summary.session.lastAt = event.time;
+    }
+    switch (event.type) {
+      case "session": {
+        if (typeof event.id === "string") summary.session.id = event.id;
+        if (typeof event.cwd === "string") summary.session.cwd = event.cwd;
+        if (typeof event.createdAt === "number") summary.session.createdAt = event.createdAt;
+        if (typeof data.createdAt === "number") summary.session.createdAt = data.createdAt;
+        break;
+      }
+      case "session/title": {
+        const title = typeof data === "string" ? data : data.title;
+        if (typeof title === "string" && title !== "") summary.session.title = title;
+        break;
+      }
+      case "assistant/message": {
+        const usage = data.usage;
+        if (usage !== null && typeof usage === "object") {
+          summary.steps += 1;
+          summary.totals.inputTokens += Number(usage.inputTokens) || 0;
+          summary.totals.cacheReadTokens += Number(usage.cacheReadTokens) || 0;
+          summary.totals.outputTokens += Number(usage.outputTokens) || 0;
+          summary.totals.totalTokens += Number(usage.totalTokens) || 0;
+        }
+        const content = data.message !== null && data.message !== undefined ? data.message.content : undefined;
+        for (const block of Array.isArray(content) ? content : []) {
+          if (block === null || typeof block !== "object") continue;
+          if (block.type === "reasoning") summary.estimate.agent.reasoning += estimateTokens(block.text);
+          else if (block.type === "text") summary.estimate.agent.text += estimateTokens(block.text);
+          else if (block.type === "tool-call" && block.id !== undefined) callNames.set(String(block.id), block.name);
+        }
+        break;
+      }
+      case "tool/call": {
+        const name = data.name;
+        if (data.callId !== undefined) callNames.set(String(data.callId), name);
+        const entry = toolOf(name);
+        entry.calls += 1;
+        entry.args += estimateTokens(data.arguments);
+        break;
+      }
+      case "tool/result": {
+        const name = callNames.get(String(data.toolCallId ?? data.message?.source?.callId ?? ""));
+        const entry = toolOf(name);
+        entry.results += estimateTokens(blockText(data.message !== null && data.message !== undefined ? data.message.content : data.content));
+        break;
+      }
+      case "user/message": {
+        summary.estimate.agent.user += estimateTokens(blockText(data.message !== null && data.message !== undefined ? data.message.content : data.content));
+        break;
+      }
+      case "system/message": {
+        summary.estimate.agent.system += estimateTokens(blockText(data.message !== null && data.message !== undefined ? data.message.content : data.content));
+        break;
+      }
+      default:
+        break;
+    }
+  }
+
+  const agent = summary.estimate.agent;
+  agent.total = agent.reasoning + agent.text + agent.user + agent.system;
+  const list = [...tools.values()].sort((a, b) => (b.args + b.results) - (a.args + a.results));
+  for (const entry of list) entry.total = entry.args + entry.results;
+  summary.estimate.tools = list;
+  summary.estimate.toolsTotal = list.reduce((sum, entry) => sum + entry.total, 0);
+  summary.estimate.grandTotal = agent.total + summary.estimate.toolsTotal;
+  const grand = summary.estimate.grandTotal;
+  if (grand > 0) {
+    for (const entry of list) entry.share = entry.total / grand;
+    summary.estimate.agent.share = agent.total / grand;
+  }
+  return summary;
+}
+
+/** Decode every Zstandard frame of a session log and parse its JSONL records. */
+export async function readSessionEvents(path) {
+  const bytes = await readFile(path);
+  const offsets = [];
+  let at = bytes.indexOf(ZSTD_MAGIC, 0);
+  while (at !== -1) {
+    offsets.push(at);
+    at = bytes.indexOf(ZSTD_MAGIC, at + 4);
+  }
+  const parts = [];
+  for (let index = 0; index < offsets.length; index += 1) {
+    const end = index + 1 < offsets.length ? offsets[index + 1] : bytes.length;
+    try {
+      parts.push(zstdDecompressSync(bytes.subarray(offsets[index], end)));
+    } catch {
+      /* a torn tail: the rest of the log is still usable */
+    }
+  }
+  const events = [];
+  for (const line of Buffer.concat(parts).toString("utf8").split("\n")) {
+    if (line === "") continue;
+    try {
+      events.push(JSON.parse(line));
+    } catch {
+      /* a torn final record */
+    }
+  }
+  return events;
+}
+
+/** Absolute path of a session log, or undefined when it is gone. */
+async function sessionLogPath(ctx, sessionId) {
+  try {
+    const stat = await ctx.sessionPersistence.stat(sessionId);
+    const meta = stat !== undefined && stat !== null ? stat.header ?? stat : undefined;
+    if (meta !== undefined && typeof ctx.sessionPersistence.locate === "function") {
+      const located = ctx.sessionPersistence.locate(meta);
+      if (located !== undefined && located !== null && typeof located.path === "string") return located.path;
+    }
+  } catch {
+    /* fall back to the scan */
+  }
+  const home = await dshHome();
+  const root = join(home, "sessions");
+  let projects;
+  try {
+    projects = await readdir(root, { withFileTypes: true });
+  } catch {
+    return undefined;
+  }
+  for (const project of projects) {
+    if (!project.isDirectory()) continue;
+    const candidate = join(root, project.name, sessionId, "session.v4.jsonl.zstd");
+    try {
+      await access(candidate);
+      return candidate;
+    } catch {
+      /* keep scanning */
+    }
+  }
+  return undefined;
+}
+
+/** Statistics for one session, cached briefly so re-opening the panel is cheap. */
+export async function sessionStatistics(ctx, sessionId) {
+  const path = await sessionLogPath(ctx, sessionId);
+  if (path === undefined) return { ok: false, error: "session log not found" };
+  let info;
+  try {
+    info = await stat(path);
+  } catch {
+    return { ok: false, error: "session log not found" };
+  }
+  const cacheKey = `${info.size}:${info.mtimeMs}`;
+  const cached = statsCache.get(sessionId);
+  if (cached !== undefined && cached.cacheKey === cacheKey && Date.now() - cached.at < STATS_CACHE_MS) return { ok: true, stats: cached.stats };
+  try {
+    const events = await readSessionEvents(path);
+    const stats = aggregateSession(events);
+    if (stats.session.id === "") stats.session.id = sessionId;
+    statsCache.set(sessionId, { cacheKey, stats, at: Date.now() });
+    return { ok: true, stats };
+  } catch (error) {
+    return { ok: false, error: error instanceof Error ? error.message : String(error) };
+  }
+}
+
+/** POST { sessionId } -> token statistics for that session. */
+export async function handleStatsRequest(ctx, req, res) {
+  if ((req.method ?? "POST").toUpperCase() !== "POST") {
+    sendJson(res, 405, { ok: false, error: "method not allowed" });
+    return;
+  }
+  if (!loopbackOrigin(req)) {
+    sendJson(res, 403, { ok: false, error: "origin not trusted" });
+    return;
+  }
+  try {
+    const body = await readJsonBody(req);
+    const sessionId = body !== null && typeof body.sessionId === "string" ? body.sessionId.trim() : "";
+    if (sessionId === "") {
+      sendJson(res, 400, { ok: false, error: "sessionId required" });
+      return;
+    }
+    const result = await sessionStatistics(ctx, sessionId);
+    sendJson(res, result.ok ? 200 : 404, result);
+  } catch (error) {
+    sendJson(res, 500, { ok: false, error: error instanceof Error ? error.message : String(error) });
+  }
+}
+
+/** Cordis entry point: mount the routes when the host has a web server. */
 export function apply(ctx) {
   try {
     if (typeof ctx.inject === "function") {
@@ -218,9 +483,14 @@ export function apply(ctx) {
           path: TRASH_SESSION_PATH,
           handler: (req, res) => handleTrashRequest(ctx, req, res),
         }), "ws-recency: trash route");
+        webCtx.effect(() => webCtx.webServer.register({
+          kind: "exact",
+          path: STATS_SESSION_PATH,
+          handler: (req, res) => handleStatsRequest(ctx, req, res),
+        }), "ws-recency: stats route");
       });
     }
   } catch {
-    /* a headless profile simply gets no route */
+    /* a headless profile simply gets no routes */
   }
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "dsh-ws-recency",
-  "version": "0.9.1",
-  "description": "Sidebar session management for DeepSeek Harness: workspace groups sorted by latest activity, stale history folded, a global pinned section, follow-up marks, and session delete into a recoverable trash.",
+  "version": "0.10.0",
+  "description": "Sidebar session management for DeepSeek Harness: workspace groups sorted by latest activity, stale history folded, a global pinned section, follow-up marks, session delete into a recoverable trash, and per-session token statistics split by tool.",
   "license": "MIT",
   "author": "chyxhtc",
   "repository": {