openclacky 1.2.7 → 1.2.8

data/lib/clacky/web/billing.js

@@ -4,6 +4,7 @@
 const Billing = (() => {
   let _summary = null;
   let _daily = [];
+  let _sessions = []; // 会话列表
   let _allModels = []; // 保存完整的模型列表
   let _currentPeriod = "day";
   let _currentModel = "all";
@@ -73,15 +74,19 @@ const Billing = (() => {
 
     try {
       const modelParam = (_currentModel && _currentModel !== "all") ? `&model=${encodeURIComponent(_currentModel)}` : "";
-      const [summaryRes, dailyRes] = await Promise.all([
+      const [summaryRes, dailyRes, sessionsRes] = await Promise.all([
         fetch(`/api/billing/summary?period=${_currentPeriod}${modelParam}`),
-        fetch(`/api/billing/daily?days=30${modelParam}`)
+        fetch(`/api/billing/daily?days=30${modelParam}`),
+        fetch(`/api/billing/sessions?period=${_currentPeriod}${modelParam}&limit=100`)
       ]);
 
       _summary = await summaryRes.json();
       const dailyData = await dailyRes.json();
       _daily = dailyData.days || [];
 
+      const sessionsData = await sessionsRes.json();
+      _sessions = sessionsData.sessions || [];
+
       // 保存完整模型列表（仅在未筛选时更新）
       if (!_currentModel || _currentModel === "all") {
         _allModels = _summary.by_model ? Object.keys(_summary.by_model) : [];
@@ -172,6 +177,10 @@ const Billing = (() => {
         <div class="billing-chart-row">
           ${_renderCombinedChart()}
         </div>
+
+        <div class="billing-sessions-row">
+          ${_renderSessionList()}
+        </div>
       </div>
     `;
 
@@ -219,14 +228,19 @@ const Billing = (() => {
           <span class="tooltip-date">${date}</span>
           <span class="tooltip-total">${total} tokens</span>
         </div>
+        <div class="tooltip-row">
+          <span class="tooltip-dot tooltip-total"></span>
+          <span class="tooltip-label">${I18n.t("billing.totalTokens") || "Total Tokens"}</span>
+          <span class="tooltip-value">${total}</span>
+        </div>
         <div class="tooltip-row">
           <span class="tooltip-dot tooltip-cache-hit"></span>
-          <span class="tooltip-label">${I18n.t("billing.inputCacheHit") || "Input (Cache Hit)"}</span>
+          <span class="tooltip-label">${I18n.t("billing.inputCacheHit") || "Input (Hit)"}</span>
           <span class="tooltip-value">${cacheHit}</span>
         </div>
         <div class="tooltip-row">
           <span class="tooltip-dot tooltip-cache-miss"></span>
-          <span class="tooltip-label">${I18n.t("billing.inputCacheMiss") || "Input (Cache Miss)"}</span>
+          <span class="tooltip-label">${I18n.t("billing.inputCacheMiss") || "Input (Miss)"}</span>
           <span class="tooltip-value">${cacheMiss}</span>
         </div>
         <div class="tooltip-row">
@@ -333,35 +347,50 @@ const Billing = (() => {
   }
 
   function _renderTokenBreakdown() {
+    const totalTokens = _summary.total_tokens || 0;
+    const promptTokens = _summary.prompt_tokens || 0;
+    const completionTokens = _summary.completion_tokens || 0;
+    const cacheReadTokens = _summary.cache_read_tokens || 0;
+    const cacheMissTokens = promptTokens - cacheReadTokens;
+
     return `
       <div class="billing-section billing-token-section">
         <h3>${I18n.t("billing.tokenBreakdown") || "Token Breakdown"}</h3>
         <div class="billing-token-bars">
           <div class="billing-token-bar-item">
             <div class="billing-token-bar-header">
-              <span class="billing-token-bar-label">${I18n.t("billing.inputCacheHit") || "Input (Cache Hit)"}</span>
-              <span class="billing-token-bar-value">${_formatCompact(_summary.cache_read_tokens)}</span>
+              <span class="billing-token-bar-label">${I18n.t("billing.totalTokens") || "Total Tokens"}</span>
+              <span class="billing-token-bar-value">${_formatCompact(totalTokens)}</span>
             </div>
             <div class="billing-token-bar-track">
-              <div class="billing-token-bar-fill billing-bar-cache-read" style="width: ${_getTokenPercent('cache_read')}%"></div>
+              <div class="billing-token-bar-fill billing-bar-total" style="width: 100%"></div>
             </div>
           </div>
           <div class="billing-token-bar-item">
             <div class="billing-token-bar-header">
-              <span class="billing-token-bar-label">${I18n.t("billing.inputCacheMiss") || "Input (Cache Miss)"}</span>
-              <span class="billing-token-bar-value">${_formatCompact(_summary.prompt_tokens)}</span>
+              <span class="billing-token-bar-label">${I18n.t("billing.inputCacheHit") || "Input (Hit)"}</span>
+              <span class="billing-token-bar-value">${_formatCompact(cacheReadTokens)}</span>
             </div>
             <div class="billing-token-bar-track">
-              <div class="billing-token-bar-fill billing-bar-prompt" style="width: ${_getTokenPercent('prompt')}%"></div>
+              <div class="billing-token-bar-fill billing-bar-cache-read" style="width: ${_getTokenPercent(cacheReadTokens, totalTokens)}%"></div>
+            </div>
+          </div>
+          <div class="billing-token-bar-item">
+            <div class="billing-token-bar-header">
+              <span class="billing-token-bar-label">${I18n.t("billing.inputCacheMiss") || "Input (Miss)"}</span>
+              <span class="billing-token-bar-value">${_formatCompact(cacheMissTokens)}</span>
+            </div>
+            <div class="billing-token-bar-track">
+              <div class="billing-token-bar-fill billing-bar-cache-miss" style="width: ${_getTokenPercent(cacheMissTokens, totalTokens)}%"></div>
             </div>
           </div>
           <div class="billing-token-bar-item">
             <div class="billing-token-bar-header">
               <span class="billing-token-bar-label">${I18n.t("billing.output") || "Output"}</span>
-              <span class="billing-token-bar-value">${_formatCompact(_summary.completion_tokens)}</span>
+              <span class="billing-token-bar-value">${_formatCompact(completionTokens)}</span>
             </div>
             <div class="billing-token-bar-track">
-              <div class="billing-token-bar-fill billing-bar-completion" style="width: ${_getTokenPercent('completion')}%"></div>
+              <div class="billing-token-bar-fill billing-bar-completion" style="width: ${_getTokenPercent(completionTokens, totalTokens)}%"></div>
             </div>
           </div>
         </div>
@@ -369,9 +398,8 @@ const Billing = (() => {
     `;
   }
 
-  function _getTokenPercent(type) {
-    const total = _summary.total_tokens || 1;
-    const value = _summary[type + '_tokens'] || 0;
+  function _getTokenPercent(value, total) {
+    if (!total || total === 0) return 0;
     return Math.min((value / total) * 100, 100).toFixed(1);
   }
 
@@ -427,9 +455,8 @@ const Billing = (() => {
 
     const recentDays = _daily.slice(-14);
     // Max values for scaling
-    const maxInput = Math.max(...recentDays.map(d => (d.prompt_tokens || 0) + (d.cache_read_tokens || 0)), 1);
-    const maxOutput = Math.max(...recentDays.map(d => d.completion_tokens || 0), 1);
-    const maxVal = Math.max(maxInput, maxOutput);
+    const maxInput = Math.max(...recentDays.map(d => d.prompt_tokens || 0), 1);
+    const maxOutput = Math.max(...recentDays.map(d => d.completion_tokens || 0), 1);    const maxVal = Math.max(maxInput, maxOutput);
 
     // Chart height in pixels
     const chartHeight = 120;
@@ -437,9 +464,10 @@ const Billing = (() => {
     // Generate bars: each date has Input (stacked: cache hit + cache miss) and Output
     const chartBars = recentDays.map((d, i) => {
       const cacheHit = d.cache_read_tokens || 0;        // 命中缓存
-      const cacheMiss = d.prompt_tokens || 0;           // 未命中缓存（实际发送的prompt）
+      const totalPrompt = d.prompt_tokens || 0;         // 全部输入token
+      const cacheMiss = totalPrompt - cacheHit;         // 未命中缓存 = 全部输入 - 命中
       const output = d.completion_tokens || 0;
-      const totalInput = cacheHit + cacheMiss;
+      const totalInput = totalPrompt;
       const totalTokens = totalInput + output;
 
       // Calculate heights in pixels
@@ -471,13 +499,17 @@ const Billing = (() => {
         <div class="billing-chart-header">
           <h4>${I18n.t("billing.dailyUsage") || "Usage Details"}</h4>
           <div class="billing-chart-legends">
+            <span class="billing-chart-legend">
+              <span class="billing-legend-dot billing-legend-total"></span>
+              ${I18n.t("billing.totalTokens") || "Total Tokens"}
+            </span>
             <span class="billing-chart-legend">
               <span class="billing-legend-dot billing-legend-cache-hit"></span>
-              ${I18n.t("billing.inputCacheHit") || "Input (Cache Hit)"}
+              ${I18n.t("billing.inputCacheHit") || "Input (Hit)"}
             </span>
             <span class="billing-chart-legend">
               <span class="billing-legend-dot billing-legend-cache-miss"></span>
-              ${I18n.t("billing.inputCacheMiss") || "Input (Cache Miss)"}
+              ${I18n.t("billing.inputCacheMiss") || "Input (Miss)"}
             </span>
             <span class="billing-chart-legend">
               <span class="billing-legend-dot billing-legend-output"></span>
@@ -493,6 +525,69 @@ const Billing = (() => {
     `;
   }
 
+  function _renderSessionList() {
+    if (!_sessions || _sessions.length === 0) {
+      return `
+        <div class="billing-section billing-sessions-section">
+          <h3>${I18n.t("billing.sessions") || "Sessions"}</h3>
+          <div class="billing-sessions-empty">${I18n.t("billing.noSessions") || "No session data"}</div>
+        </div>
+      `;
+    }
+
+    const rows = _sessions.map((s, index) => {
+      const sessionId = s.session_id || "unknown";
+      const isDeleted = s.is_deleted;
+      const sessionName = s.session_name || sessionId;
+      const displayName = isDeleted ? (I18n.t("billing.deletedSessions") || "已删除会话") : (sessionName.length > 25 ? sessionName.slice(0, 25) + "..." : sessionName);
+      const totalCost = _convertCost(s.total_cost || 0);
+      const totalTokens = s.total_tokens || 0;
+      const promptTokens = s.prompt_tokens || 0;
+      const cacheHit = s.cache_read_tokens || 0;
+      const cacheMiss = promptTokens - cacheHit;
+      const completionTokens = s.completion_tokens || 0;
+      const requests = s.requests || 0;
+      const models = (s.models || []).join(", ");
+      const lastRequest = s.last_request ? new Date(s.last_request).toLocaleString() : "-";
+      const rowClass = isDeleted ? "billing-session-row billing-session-deleted" : "billing-session-row";
+
+      return `
+        <div class="${rowClass}" data-session-id="${_esc(sessionId)}">
+          <div class="billing-cell billing-cell-index">${index + 1}</div>
+          <div class="billing-cell billing-cell-session" title="${_esc(sessionName)}">
+            <span class="billing-cell-main">${_esc(displayName)}</span>
+            <span class="billing-cell-sub">${requests} ${I18n.t("billing.requests") || "req"} · ${_esc(models)}</span>
+          </div>
+          <div class="billing-cell billing-cell-number">${_formatCompact(totalTokens)}</div>
+          <div class="billing-cell billing-cell-number billing-cell-hit">${_formatCompact(cacheHit)}</div>
+          <div class="billing-cell billing-cell-number billing-cell-miss">${_formatCompact(cacheMiss)}</div>
+          <div class="billing-cell billing-cell-number">${_formatCompact(completionTokens)}</div>
+          <div class="billing-cell billing-cell-cost">${_getCurrencySymbol()}${_formatCost(totalCost)}</div>
+          <div class="billing-cell billing-cell-time">${lastRequest}</div>
+        </div>
+      `;
+    }).join("");
+
+    return `
+      <div class="billing-section billing-sessions-section">
+        <h3>${I18n.t("billing.sessions") || "Sessions"}</h3>
+        <div class="billing-sessions-header">
+          <span class="billing-cell billing-cell-index">#</span>
+          <span class="billing-cell billing-cell-session">${I18n.t("billing.sessionId") || "Session"}</span>
+          <span class="billing-cell billing-cell-number">${I18n.t("billing.headerTotal") || "总消耗"}</span>
+          <span class="billing-cell billing-cell-number">${I18n.t("billing.headerHit") || "命中"}</span>
+          <span class="billing-cell billing-cell-number">${I18n.t("billing.headerMiss") || "未命中"}</span>
+          <span class="billing-cell billing-cell-number">${I18n.t("billing.headerOutput") || "输出"}</span>
+          <span class="billing-cell billing-cell-cost">${I18n.t("billing.cost") || "Cost"}</span>
+          <span class="billing-cell billing-cell-time">${I18n.t("billing.lastRequest") || "Time"}</span>
+        </div>
+        <div class="billing-sessions-list">
+          ${rows}
+        </div>
+      </div>
+    `;
+  }
+
   // ── Helpers ─────────────────────────────────────────────────────────────────
 
   function _formatCost(cost) {

data/lib/clacky/web/i18n.js

@@ -686,15 +686,25 @@ const I18n = (() => {
       "billing.cacheHit":        "Cache Hit",
       "billing.inputCacheHit":   "Input (Cache Hit)",
       "billing.inputCacheMiss":  "Input (Cache Miss)",
-      "billing.output":          "Output",
-      "billing.tokenUsage":      "Token Usage",
+      "billing.totalInput":      "Total Input",
+      "billing.output":          "Output",      "billing.tokenUsage":      "Token Usage",
       "billing.costTrend":       "Cost Trend",
       "billing.noData":          "No data available",
 
       "error.insufficient_credit": "Insufficient LLM credit. Please top up your account to continue.",
       "error.insufficient_credit.action": "Top up",
-    },
 
+      "billing.sessions":        "Sessions",
+      "billing.sessionId":       "Session",
+      "billing.tokens":          "Tokens",
+      "billing.lastRequest":     "Last Request",
+      "billing.noSessions":      "No session data",
+      "billing.deletedSessions": "Deleted Sessions",
+      "billing.headerTotal":     "Total",
+      "billing.headerHit":       "Hit",
+      "billing.headerMiss":      "Miss",
+      "billing.headerOutput":    "Output",
+    },
     zh: {
       // ── Sidebar ──
       "sidebar.chat":     "会话",
@@ -1366,16 +1376,26 @@ const I18n = (() => {
       "billing.cacheHit":        "缓存命中",
       "billing.inputCacheHit":   "输入（命中缓存）",
       "billing.inputCacheMiss":  "输入（未命中缓存）",
-      "billing.output":          "输出",
-      "billing.tokenUsage":      "Token 用量",
+      "billing.totalTokens":     "Token 总消耗",
+      "billing.totalInput":      "总输入",
+      "billing.output":          "输出",      "billing.tokenUsage":      "Token 用量",
       "billing.costTrend":       "费用趋势",
       "billing.noData":          "暂无数据",
 
       "error.insufficient_credit": "LLM（大模型）余额不足，请充值后继续使用。",
       "error.insufficient_credit.action": "去充值",
+      "billing.sessions":        "会话消耗",
+      "billing.sessionId":       "会话",
+      "billing.tokens":          "Token",
+      "billing.lastRequest":     "最后请求",
+      "billing.noSessions":      "暂无会话数据",
+      "billing.deletedSessions": "已删除会话",
+      "billing.headerTotal":     "总消耗",
+      "billing.headerHit":       "命中",
+      "billing.headerMiss":      "未命中",
+      "billing.headerOutput":    "输出",
     }
   };
-
   // ── State ──────────────────────────────────────────────────────────────────
   let _lang = localStorage.getItem(STORAGE_KEY) || DEFAULT_LANG;
 

data/lib/clacky.rb

@@ -83,6 +83,7 @@ require_relative "clacky/idle_compression_timer"
 # Agent modules
 require_relative "clacky/agent/message_compressor"
 require_relative "clacky/agent/hook_manager"
+require_relative "clacky/shell_hook_loader"
 require_relative "clacky/agent/tool_registry"
 
 # UI modules
@@ -132,6 +133,11 @@ require_relative "clacky/server/web_ui_controller"
 require_relative "clacky/server/browser_manager"
 require_relative "clacky/cli"
 
+# Runtime patch layer: load user/AI patches from ~/.clacky/patches/ after all
+# gem code is defined, so fingerprints reflect the actual installed source.
+require_relative "clacky/patch_loader"
+Clacky::PatchLoader.load_all
+
 module Clacky
   class AgentInterrupted < Exception; end  # Inherit from Exception to bypass rescue StandardError
   class AgentError < StandardError; end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: openclacky
 version: !ruby/object:Gem::Version
-  version: 1.2.7
+  version: 1.2.8
 platform: ruby
 authors:
 - windy
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2026-05-31 00:00:00.000000000 Z
+date: 2026-06-01 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: faraday
@@ -374,6 +374,7 @@ files:
 - lib/clacky/default_skills/cron-task-creator/SKILL.md
 - lib/clacky/default_skills/cron-task-creator/evals/evals.json
 - lib/clacky/default_skills/deploy/SKILL.md
+- lib/clacky/default_skills/extend-openclacky/SKILL.md
 - lib/clacky/default_skills/mcp-manager/SKILL.md
 - lib/clacky/default_skills/new/SKILL.md
 - lib/clacky/default_skills/new/scripts/create_rails_project.sh
@@ -417,6 +418,7 @@ files:
 - lib/clacky/message_format/open_ai.rb
 - lib/clacky/message_history.rb
 - lib/clacky/openai_stream_aggregator.rb
+- lib/clacky/patch_loader.rb
 - lib/clacky/plain_ui_controller.rb
 - lib/clacky/platform_http_client.rb
 - lib/clacky/providers.rb
@@ -444,6 +446,7 @@ files:
 - lib/clacky/server/channel/channel_config.rb
 - lib/clacky/server/channel/channel_manager.rb
 - lib/clacky/server/channel/channel_ui_controller.rb
+- lib/clacky/server/channel/user_adapter_loader.rb
 - lib/clacky/server/discover.rb
 - lib/clacky/server/epipe_safe_io.rb
 - lib/clacky/server/http_server.rb
@@ -452,6 +455,7 @@ files:
 - lib/clacky/server/session_registry.rb
 - lib/clacky/server/web_ui_controller.rb
 - lib/clacky/session_manager.rb
+- lib/clacky/shell_hook_loader.rb
 - lib/clacky/skill.rb
 - lib/clacky/skill_loader.rb
 - lib/clacky/telemetry.rb