@cassius0924/dsh-usage-dashboard 0.4.0 → 0.5.0

package/lib/client.js

@@ -190,6 +190,26 @@ async function fetchUsage(force = false) {
   return task;
 }
 var sessionUsageInflight = /* @__PURE__ */ new Map();
+var sessionUsageCache = /* @__PURE__ */ new Map();
+var sessionUsageListeners = /* @__PURE__ */ new Map();
+var getCachedSessionUsage = (sessionId) => sessionUsageCache.get(sessionId) ?? null;
+var subscribeSessionUsage = (sessionId, fn) => {
+  let listeners = sessionUsageListeners.get(sessionId);
+  if (listeners === void 0) {
+    listeners = /* @__PURE__ */ new Set();
+    sessionUsageListeners.set(sessionId, listeners);
+  }
+  listeners.add(fn);
+  return () => {
+    listeners?.delete(fn);
+    if (listeners?.size === 0) sessionUsageListeners.delete(sessionId);
+  };
+};
+var publishSessionUsage = (sessionId, response) => {
+  if (!response.ok) return;
+  sessionUsageCache.set(sessionId, response);
+  for (const listener of [...sessionUsageListeners.get(sessionId) ?? []]) listener();
+};
 async function fetchSessionUsage(sessionId, force = false) {
   if (typeof sessionId !== "string" || sessionId === "") {
     return { ok: false, error: "\u7F3A\u5C11\u4F1A\u8BDD id" };
@@ -198,7 +218,10 @@ async function fetchSessionUsage(sessionId, force = false) {
     const inflight = sessionUsageInflight.get(sessionId);
     if (inflight !== void 0) return inflight;
   }
-  const task = getJson(`/api/dsh-usage-dashboard/session?id=${encodeURIComponent(sessionId)}`, "no-store");
+  const task = getJson(`/api/dsh-usage-dashboard/session?id=${encodeURIComponent(sessionId)}`, "no-store").then((response) => {
+    publishSessionUsage(sessionId, response);
+    return response;
+  });
   if (force) return task;
   const tracked = task.finally(() => {
     if (sessionUsageInflight.get(sessionId) === tracked) sessionUsageInflight.delete(sessionId);
@@ -484,7 +507,10 @@ var zh = {
   "links.status": "\u670D\u52A1\u72B6\u6001",
   "settings.title": "\u8BBE\u7F6E",
   "settings.widget": "\u5728\u5176\u4ED6\u9875\u9762\u663E\u793A\u53F3\u4E0B\u89D2\u60AC\u6D6E\u989D\u5EA6\u7A97\u53E3",
-  "settings.widgetHint": "\u5F53\u524D\u989D\u5EA6\u9875\u5DF2\u5C55\u793A\u5B8C\u6574\u6570\u636E\uFF0C\u60AC\u6D6E\u7A97\u4F1A\u81EA\u52A8\u9690\u85CF\uFF1B\u5207\u56DE Chat \u6216 Trajectory \u540E\u6062\u590D\u3002",
+  "settings.widgetHint": "\u989D\u5EA6\u9875\u4F1A\u81EA\u52A8\u9690\u85CF\u6D6E\u7A97\uFF1B\u5176\u4ED6\u9875\u9762\u662F\u5426\u5C55\u793A\u7531\u4E0B\u65B9\u9009\u62E9\u51B3\u5B9A\u3002",
+  "settings.widgetTabs": "\u5C55\u793A\u6D6E\u7A97\u7684\u9875\u9762",
+  "settings.widgetTabsHint": "\u9875\u9762\u5217\u8868\u6765\u81EA DSH \u7684\u5B9E\u65F6 Tab \u6CE8\u518C\u8868\uFF1B\u5176\u4ED6\u63D2\u4EF6\u65B0\u589E\u7684 Tab \u4E5F\u4F1A\u81EA\u52A8\u51FA\u73B0\u5728\u8FD9\u91CC\u3002",
+  "settings.widgetTabsEmpty": "\u5F53\u524D\u6CA1\u6709\u53EF\u914D\u7F6E\u7684\u4F1A\u8BDD\u9875\u9762\u3002",
   "settings.lowBalance": "\u4F59\u989D\u9884\u8B66\u7EBF",
   "settings.lowBalanceOn": "\u4F59\u989D\u4F4E\u4E8E {amount} {currency} \u65F6\uFF0C\u8FD9\u91CC\u548C\u60AC\u6D6E\u7A97\u90FD\u4F1A\u8F6C\u4E3A\u8B66\u793A\u8272\u3002\u586B 0 \u5173\u95ED\u3002",
   "settings.lowBalanceOff": "\u5DF2\u5173\u95ED\u4F59\u989D\u9884\u8B66\u3002\u586B\u4E00\u4E2A\u5927\u4E8E 0 \u7684\u6570\u5F00\u542F\u3002",
@@ -497,6 +523,8 @@ var zh = {
   "widget.lowTitle": "\u4F59\u989D\u4F4E\u4E8E\u9884\u8B66\u7EBF {amount}",
   "widget.todayCostTitle": "\u4ECA\u65E5\u6D88\u8017\uFF08\u4F30\u7B97\uFF09\xB7 {age}",
   "widget.todayCost": "\u4ECA\u65E5\u6D88\u8017",
+  "widget.sessionCostTitle": "\u5F53\u524D\u4F1A\u8BDD\u7D2F\u8BA1\u6D88\u8017\uFF08\u4F30\u7B97\uFF09",
+  "widget.sessionCost": "\u5F53\u524D\u4F1A\u8BDD",
   "widget.noBalance": "\u6682\u65E0\u4F59\u989D\u6570\u636E",
   "widget.dragCard": "\u62D6\u52A8\u5230\u56DB\u4E2A\u89D2\u843D",
   "widget.dragGrip": "\u62D6\u52A8\u4EE5\u79FB\u52A8",
@@ -505,6 +533,9 @@ var zh = {
   "widget.collapse": "\u6536\u8D77",
   "widget.expandAria": "\u5C55\u5F00\u989D\u5EA6\u7A97\u53E3",
   "widget.collapseAria": "\u6536\u8D77\u989D\u5EA6\u7A97\u53E3",
+  "messageCost.label": "\u672C\u8F6E\u8D39\u7528",
+  "messageCost.tooltip": "\u7531 dsh-usage-dashboard \u63D0\u4F9B \xB7 \u672C\u8F6E\u5BF9\u8BDD\u8D39\u7528\u4E3A\u4F30\u7B97\u503C",
+  "messageCost.aria": "{amount}\uFF0C\u672C\u8F6E\u5BF9\u8BDD\u4F30\u7B97\u8D39\u7528\uFF0C\u7531 dsh-usage-dashboard \u63D0\u4F9B",
   "boundary.title": "\u989D\u5EA6\u9762\u677F\u51FA\u9519\u4E86",
   "boundary.body": "\u6E32\u67D3\u65F6\u629B\u4E86\u5F02\u5E38\uFF0C\u901A\u5E38\u662F\u6D4F\u89C8\u5668\u91CC\u5B58\u7740\u65E7\u7248\u672C\u7684\u7F13\u5B58\u6570\u636E\u3002\u6E05\u6389\u672C\u63D2\u4EF6\u7684\u672C\u5730\u6570\u636E\u518D\u91CD\u65B0\u52A0\u8F7D\u5C31\u80FD\u6062\u590D\u3002",
   "boundary.reset": "\u6E05\u9664\u672C\u5730\u6570\u636E\u5E76\u91CD\u65B0\u52A0\u8F7D"
@@ -725,7 +756,10 @@ var en = {
   "links.status": "Service status",
   "settings.title": "Settings",
   "settings.widget": "Show the floating balance widget on other views",
-  "settings.widgetHint": "The widget hides while this full dashboard is open, then returns on Chat or Trajectory.",
+  "settings.widgetHint": "The widget always hides on Usage; choose its other views below.",
+  "settings.widgetTabs": "Show widget on",
+  "settings.widgetTabsHint": "This live list comes from DSH\u2019s tab registry, including tabs added by other plugins.",
+  "settings.widgetTabsEmpty": "There are no configurable conversation views right now.",
   "settings.lowBalance": "Balance warning",
   "settings.lowBalanceOn": "This page and the widget turn amber below {amount} {currency}. Enter 0 to disable.",
   "settings.lowBalanceOff": "Balance warnings are off. Enter an amount above 0 to enable them.",
@@ -738,6 +772,8 @@ var en = {
   "widget.lowTitle": "Balance below warning threshold {amount}",
   "widget.todayCostTitle": "Today\u2019s spend (estimated) \xB7 {age}",
   "widget.todayCost": "Today\u2019s spend",
+  "widget.sessionCostTitle": "Estimated spend for the current session",
+  "widget.sessionCost": "Current session",
   "widget.noBalance": "No balance data",
   "widget.dragCard": "Drag to any corner",
   "widget.dragGrip": "Drag to move",
@@ -746,6 +782,9 @@ var en = {
   "widget.collapse": "Collapse",
   "widget.expandAria": "Expand balance widget",
   "widget.collapseAria": "Collapse balance widget",
+  "messageCost.label": "Turn cost",
+  "messageCost.tooltip": "Provided by dsh-usage-dashboard \xB7 estimated cost for this turn",
+  "messageCost.aria": "{amount}, estimated cost for this turn, provided by dsh-usage-dashboard",
   "boundary.title": "The usage dashboard crashed",
   "boundary.body": "Rendering failed, usually because this browser still has cached data from an older version. Clear this plugin\u2019s local data and reload to recover.",
   "boundary.reset": "Clear local data and reload"
@@ -1101,6 +1140,15 @@ function getComposerElement(frame) {
   if (frame === null) return null;
   return slotElement(frame, "conversation.composer.dock", "ancestor");
 }
+function getActiveConversationViewId(frame, viewIds) {
+  if (viewIds.length === 0) return null;
+  const header = frame === null ? null : slotElement(frame, "conversation.session.header", "child");
+  const tablist = header?.querySelector('[role="tablist"]') ?? null;
+  if (tablist === null) return viewIds[0] ?? null;
+  const tabs = [...tablist.querySelectorAll('[role="tab"]')];
+  const activeIndex = tabs.findIndex((tab) => tab.getAttribute("aria-selected") === "true");
+  return activeIndex < 0 ? viewIds[0] ?? null : viewIds[activeIndex] ?? null;
+}
 
 // src/client/export.ts
 var BEIJING_OFFSET_MS2 = 8 * 60 * 60 * 1e3;
@@ -1240,6 +1288,8 @@ function createStore(key, isValid, fallback) {
 }
 var isThreshold = (value) => typeof value === "number" && Number.isFinite(value) && value >= 0;
 var widgetVisibleStore = createStore("widget.visible", isBoolean, true);
+var isWidgetTabIds = (value) => value === null || Array.isArray(value) && value.every((id) => typeof id === "string" && id !== "") && new Set(value).size === value.length;
+var widgetTabIdsStore = createStore("widget.tabIds", isWidgetTabIds, null);
 var lowBalanceStore = createStore("alert.lowBalance", isThreshold, 10);
 var monthlyBudgetStore = createStore("budget.monthly", isThreshold, 0);
 var isUsageWindowDays = (value) => typeof value === "number" && USAGE_WINDOW_DAYS.some((days) => days === value);
@@ -1978,6 +2028,9 @@ function BalanceDashboard(props) {
   const [freshnessNow, setFreshnessNow] = (0, import_react4.useState)(Date.now());
   const hadDataRef = (0, import_react4.useRef)(cachedBalance !== null || cachedUsage !== null);
   const [widgetOn, setWidgetOn] = (0, import_react4.useState)(widgetVisibleStore.get());
+  const [widgetTabIds, setWidgetTabIds] = (0, import_react4.useState)(widgetTabIdsStore.get());
+  const [viewTabs, setViewTabs] = (0, import_react4.useState)(() => props.views.list());
+  (0, import_react4.useEffect)(() => props.views.subscribe(() => setViewTabs(props.views.list())), [props.views]);
   const [lowBalance, setLowBalance] = (0, import_react4.useState)(lowBalanceStore.get());
   const [monthlyBudget, setMonthlyBudget] = (0, import_react4.useState)(monthlyBudgetStore.get());
   const [barMode, setBarMode] = (0, import_react4.useState)("daily");
@@ -1986,6 +2039,8 @@ function BalanceDashboard(props) {
   const [chartMetric, setChartMetric] = (0, import_react4.useState)(chartMetricStore.get());
   const [runwayHovering, setRunwayHovering] = (0, import_react4.useState)(false);
   const [runwayManuallyOpened, setRunwayManuallyOpened] = (0, import_react4.useState)(false);
+  const [remainingHovering, setRemainingHovering] = (0, import_react4.useState)(false);
+  const [remainingManuallyOpened, setRemainingManuallyOpened] = (0, import_react4.useState)(false);
   const budgetInputRef = (0, import_react4.useRef)(null);
   const rootRef = (0, import_react4.useRef)(null);
   const [composerHeight, setComposerHeight] = (0, import_react4.useState)(null);
@@ -2118,6 +2173,13 @@ function BalanceDashboard(props) {
     setWidgetOn(next);
     widgetVisibleStore.set(next);
   };
+  const widgetTabs = viewTabs.filter((tab) => tab.id !== "balance");
+  const toggleWidgetTab = (id) => {
+    const selected = widgetTabIds ?? widgetTabs.map((tab) => tab.id);
+    const next = selected.includes(id) ? selected.filter((tabId) => tabId !== id) : [...selected, id];
+    setWidgetTabIds(next);
+    widgetTabIdsStore.set(next);
+  };
   const changeLowBalance = (value) => {
     setLowBalance(value);
     lowBalanceStore.set(value);
@@ -2273,17 +2335,36 @@ function BalanceDashboard(props) {
       primary !== null ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-balance-grid", children: [
         /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat", children: [
           /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-stat-label", children: t("balance.remaining") }),
-          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("details", { className: "dq-stat-value dq-remaining", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("summary", { title: t("balance.breakdownTitle"), children: [
-              fmt(primary.total),
-              " ",
-              primary.currency
-            ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-remaining-breakdown", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: t("balance.toppedUp", { amount: fmt(primary.toppedUp) }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-remaining-granted", children: t("balance.granted", { amount: fmt(primary.granted) }) })
-            ] })
-          ] })
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+            "details",
+            {
+              className: "dq-stat-value dq-remaining",
+              open: remainingHovering || remainingManuallyOpened,
+              onPointerEnter: () => setRemainingHovering(true),
+              onPointerLeave: () => setRemainingHovering(false),
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+                  "summary",
+                  {
+                    title: t("balance.breakdownTitle"),
+                    onClick: (e) => {
+                      e.preventDefault();
+                      setRemainingManuallyOpened((v) => !v);
+                    },
+                    children: [
+                      fmt(primary.total),
+                      " ",
+                      primary.currency
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-remaining-breakdown", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: t("balance.toppedUp", { amount: fmt(primary.toppedUp) }) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-remaining-granted", children: t("balance.granted", { amount: fmt(primary.granted) }) })
+                ] })
+              ]
+            }
+          )
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-stat", children: [
           /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-stat-label", children: t("balance.runway") }),
@@ -2465,6 +2546,23 @@ function BalanceDashboard(props) {
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: t("settings.widget") })
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-toggle-hint", children: t("settings.widgetHint") }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-setting dq-setting--tabs", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-setting-label", id: "dq-widget-tabs-label", children: t("settings.widgetTabs") }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-setting-control dq-widget-tabs", role: "group", "aria-labelledby": "dq-widget-tabs-label", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "dq-widget-tab-list", children: widgetTabs.map((tab) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("label", { className: "dq-widget-tab", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+              "input",
+              {
+                type: "checkbox",
+                checked: widgetTabIds === null || widgetTabIds.includes(tab.id),
+                onChange: () => toggleWidgetTab(tab.id)
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: tab.label })
+          ] }, tab.id)) }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "dq-setting-hint", children: widgetTabs.length === 0 ? t("settings.widgetTabsEmpty") : t("settings.widgetTabsHint") })
+        ] })
+      ] }),
       /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-setting", children: [
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("label", { className: "dq-setting-label", htmlFor: "dq-low-balance", children: t("settings.lowBalance") }),
         /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "dq-setting-control", children: [
@@ -2507,10 +2605,50 @@ function BalanceDashboard(props) {
   ] });
 }
 
+// src/client/message-cost.tsx
+var import_react5 = require("react");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var fmtTurnCost = (cost) => cost.toLocaleString(void 0, {
+  minimumFractionDigits: cost > 0 && cost < 0.01 ? 4 : 2,
+  maximumFractionDigits: cost > 0 && cost < 0.01 ? 6 : 4
+});
+var cachedData = (sessionId) => {
+  const response = getCachedSessionUsage(sessionId);
+  return response?.ok === true ? response.data ?? null : null;
+};
+function MessageCost({ sessionId, messageId }) {
+  const { t } = useI18n();
+  const [data, setData] = (0, import_react5.useState)(() => cachedData(sessionId));
+  (0, import_react5.useEffect)(() => {
+    setData(cachedData(sessionId));
+    const unsubscribe = subscribeSessionUsage(sessionId, () => setData(cachedData(sessionId)));
+    const hit = cachedData(sessionId)?.turns.some((turn2) => turn2.messageId === messageId) ?? false;
+    if (!hit) void fetchSessionUsage(sessionId);
+    return unsubscribe;
+  }, [messageId, sessionId]);
+  const turn = data?.turns.find((candidate) => candidate.messageId === messageId);
+  if (turn === void 0) return null;
+  const amount = `\xA5 ${fmtTurnCost(turn.cost)}`;
+  const tooltip = t("messageCost.tooltip");
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+    "span",
+    {
+      className: "dq-message-cost",
+      tabIndex: 0,
+      "data-dq-tooltip": tooltip,
+      "aria-label": t("messageCost.aria", { amount }),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "dq-message-cost-separator", "aria-hidden": true, children: "\xB7" }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "dq-message-cost-amount", children: amount })
+      ]
+    }
+  );
+}
+
 // src/client/styles.ts
 var css = `
 .dsh-quota-root{position:absolute;right:16px;bottom:16px;z-index:2147483000;pointer-events:auto;opacity:1;visibility:visible;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:13px;line-height:1.45;color:var(--dsw-alias-label-primary,#1f2328);transition:left .28s cubic-bezier(.22,1,.36,1),top .28s cubic-bezier(.22,1,.36,1),opacity .16s ease-out,visibility 0s linear}
-.dsh-quota-root.dsh-quota-root--dashboard{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .14s ease-out,visibility 0s linear .14s}
+.dsh-quota-root.dsh-quota-root--hidden{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .14s ease-out,visibility 0s linear .14s}
 .dsh-quota-root.dsh-quota-dragging{transition:none}
 .dsh-quota-card,.dsh-quota-card *{box-sizing:border-box}
 .dsh-quota-card{background:var(--dsw-alias-bg-overlay,#ffffff);border:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.12));border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.18);padding:12px 14px;min-width:208px;max-width:270px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
@@ -2540,6 +2678,17 @@ var css = `
 .dsh-quota-label{color:var(--dsw-alias-label-secondary,#59636e)}
 .dsh-quota-value{color:var(--dsw-alias-label-primary,#1f2328);font-variant-numeric:tabular-nums}
 .dsh-quota-error{color:var(--dsw-alias-state-error-primary,#cf222e)}
+.dq-message-cost{position:relative;display:inline-flex;align-items:center;order:10;gap:10px;height:28px;color:var(--dsw-alias-label-tertiary,#59636e);font-size:12px;line-height:20px;font-variant-numeric:tabular-nums;white-space:nowrap;cursor:help}
+.dq-message-cost-separator{cursor:default}
+.dq-message-cost-amount{text-decoration-line:underline;text-decoration-style:dotted;text-decoration-color:currentColor;text-underline-offset:4px}
+.dq-message-cost:hover{color:var(--dsw-alias-label-secondary,#3f4852)}
+.dq-message-cost:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:2px;border-radius:4px}
+.dq-message-cost::after{content:attr(data-dq-tooltip);position:absolute;left:0;top:calc(100% + 6px);z-index:2147483001;width:max-content;max-width:min(240px,calc(100vw - 24px));padding:6px 9px;border-radius:8px;background:var(--dsw-alias-bg-inverse,#1f2328);color:var(--dsw-alias-label-inverse,#fff);box-shadow:0 6px 18px rgba(0,0,0,.22);font-size:12px;font-weight:400;line-height:1.45;text-align:left;white-space:normal;pointer-events:none;opacity:0;visibility:hidden;transform:translateY(-3px);transition:opacity .12s ease-out,transform .12s cubic-bezier(.22,1,.36,1),visibility 0s linear .12s}
+.dq-message-cost:hover::after,.dq-message-cost:focus-visible::after{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .12s ease-out,transform .12s cubic-bezier(.22,1,.36,1),visibility 0s linear}
+@media (hover:hover){
+  [data-time-hover-root] .dq-message-cost{opacity:0;transition:opacity 80ms ease}
+  [data-time-hover-root]:hover .dq-message-cost,[data-time-hover-root]:focus-within .dq-message-cost{opacity:1}
+}
 /* \u5361\u7247\u95F4\u8DDD\uFF08\u6B64\u5904 gap\uFF09\u523B\u610F\u5927\u4E8E\u5361\u5185\u5C0F\u8282\u95F4\u8DDD\uFF08margin-top:12/14/16px \u90A3\u4E00\u6863\uFF09\uFF0C\u5236\u9020"\u5361\u7247\u5916\u758F\u3001\u5361\u7247\u5185\u5BC6"\u7684
    \u758F\u5BC6\u5BF9\u6BD4\uFF1A24px \u76F8\u5BF9\u5361\u5185\u6700\u5927\u6863 16px \u4ECD\u6709 1.5 \u500D\u7EA7\u5DEE\uFF0C\u76F8\u5BF9\u5E38\u89C1\u6863 12px \u6709 2 \u500D\u7EA7\u5DEE\uFF0C\u4E0D\u4E0E .dq-card \u7684
    padding\uFF0816px/20px\uFF0C\u5361\u7247\u5185\u90E8\u547C\u5438\u611F\uFF0C\u8F6E\u6B21 36 \u5DF2\u5B9A\uFF09\u6DF7\u540C\u3002 */
@@ -2606,12 +2755,15 @@ var css = `
 .dq-runway[open] .dq-runway-detail{display:block}
 /* hero number for the balance, matching .dq-period-cost; relies on cascade order (declared after
    .dq-stat-value, same specificity) to win over the .dq-stat-value it's paired with in JSX \u2014 keep it below */
+/* \u8F6E\u6B21 47: .dq-remaining is a controlled <details> too now (see dashboard.tsx), same reason as
+   .dq-runway above \u2014 an unopened <details>'s non-summary children don't actually render in current
+   Chromium regardless of author display value, so the old :hover{display:flex} branch was dead code. */
 .dq-remaining{position:relative;font-size:22px;font-weight:680;letter-spacing:-.01em;line-height:1.25}
 .dq-remaining>summary{display:inline-block;list-style:none;border-radius:4px;cursor:pointer;text-decoration:underline dotted var(--dsw-alias-border-l2,rgba(0,0,0,.25));text-underline-offset:4px}
 .dq-remaining>summary::-webkit-details-marker{display:none}
 .dq-remaining>summary:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:3px}
 .dq-remaining-breakdown{display:none;position:absolute;top:calc(100% + 6px);left:0;z-index:20;flex-direction:column;gap:4px;padding:8px 10px;background:var(--dsw-alias-bg-overlay,#ffffff);border:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.12));border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.15);white-space:nowrap;font-size:12px;font-weight:500;color:var(--dsw-alias-label-primary,#1f2328)}
-.dq-remaining:hover .dq-remaining-breakdown,.dq-remaining[open] .dq-remaining-breakdown{display:flex}
+.dq-remaining[open] .dq-remaining-breakdown{display:flex}
 .dq-remaining-granted{color:var(--dsw-alias-label-tertiary,#59636e);font-weight:400;font-size:11px}
 /* narrow screens: .dq-balance-grid wraps its 3 stats onto separate lines, so the absolutely-positioned
    .dq-remaining-breakdown/.dq-runway-detail popovers can float down over whichever stat now sits in the
@@ -2772,7 +2924,11 @@ p.dq-session-sub{margin:8px 0}
 .dq-toggle{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:13px;margin-top:14px;padding-top:14px;border-top:1px solid var(--dsw-alias-border-l1,rgba(0,0,0,.08))}
 .dq-toggle input{width:16px;height:16px;accent-color:var(--dsw-alias-state-business-primary,#0969da);cursor:pointer}
 .dq-toggle-hint{margin:5px 0 0 26px;font-size:12px;line-height:1.5;color:var(--dsw-alias-label-secondary,#59636e)}
-.dq-toggle input:focus-visible,.dq-model-item input:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:2px}
+.dq-widget-tabs{align-items:flex-start;flex-direction:column;gap:7px}
+.dq-widget-tab-list{display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px}
+.dq-widget-tab{display:inline-flex;align-items:center;gap:7px;min-height:28px;color:var(--dsw-alias-label-primary,#1f2328);font-size:12px;cursor:pointer}
+.dq-widget-tab input{width:14px;height:14px;margin:0;accent-color:var(--dsw-alias-state-business-primary,#0969da);cursor:pointer;flex:none}
+.dq-toggle input:focus-visible,.dq-model-item input:focus-visible,.dq-widget-tab input:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:2px}
 .dq-link:focus-visible,.dq-model-btn:focus-visible,.dq-chart-switch-btn:focus-visible,.dq-export-btn:focus-visible{outline:2px solid var(--dsw-alias-state-business-primary,#0969da);outline-offset:2px}
 .dq-usage-totals{display:flex;flex-wrap:wrap;gap:12px 24px;margin-bottom:16px}
 /* value itself (number+unit, e.g. "9999.9\u4E07") must never break across lines inside its own column \u2014
@@ -2882,14 +3038,15 @@ p.dq-session-sub{margin:8px 0}
 @media (prefers-reduced-motion:reduce){
   .dsh-quota-root,.dsh-quota-root *,
   .dsh-quota-root *::before,.dsh-quota-root *::after,
+  .dq-message-cost,.dq-message-cost::after,
   .dq-balance,.dq-balance *,
   .dq-balance *::before,.dq-balance *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 }
 `;
 
 // src/client/widget.tsx
-var import_react5 = require("react");
-var import_jsx_runtime5 = require("react/jsx-runtime");
+var import_react6 = require("react");
+var import_jsx_runtime6 = require("react/jsx-runtime");
 var MARGIN = 16;
 var CORNER_KEY = "widget.corner";
 var COLLAPSED_KEY = "widget.collapsed";
@@ -2937,30 +3094,68 @@ function cornerPos(corner, node, bounds) {
   if (corner === "bl") return { x: xLeft, y: yBottom };
   return { x: xRight, y: yBottom };
 }
-function QuotaWidget() {
+function QuotaWidget(props) {
   const { t } = useI18n();
-  const [visible, setVisible] = (0, import_react5.useState)(widgetVisibleStore.get());
-  (0, import_react5.useEffect)(() => widgetVisibleStore.subscribe(() => setVisible(widgetVisibleStore.get())), []);
-  const [quotaViewActive2, setQuotaViewActive] = (0, import_react5.useState)(quotaViewActiveStore.get());
-  (0, import_react5.useEffect)(() => quotaViewActiveStore.subscribe(() => setQuotaViewActive(quotaViewActiveStore.get())), []);
-  const [lowBalance, setLowBalance] = (0, import_react5.useState)(lowBalanceStore.get());
-  (0, import_react5.useEffect)(() => lowBalanceStore.subscribe(() => setLowBalance(lowBalanceStore.get())), []);
+  const sessionId = props.useSessions((state) => state.current);
+  const [visible, setVisible] = (0, import_react6.useState)(widgetVisibleStore.get());
+  (0, import_react6.useEffect)(() => widgetVisibleStore.subscribe(() => setVisible(widgetVisibleStore.get())), []);
+  const [quotaViewActive2, setQuotaViewActive] = (0, import_react6.useState)(quotaViewActiveStore.get());
+  (0, import_react6.useEffect)(() => quotaViewActiveStore.subscribe(() => setQuotaViewActive(quotaViewActiveStore.get())), []);
+  const [lowBalance, setLowBalance] = (0, import_react6.useState)(lowBalanceStore.get());
+  (0, import_react6.useEffect)(() => lowBalanceStore.subscribe(() => setLowBalance(lowBalanceStore.get())), []);
+  const [selectedTabIds, setSelectedTabIds] = (0, import_react6.useState)(widgetTabIdsStore.get());
+  (0, import_react6.useEffect)(() => widgetTabIdsStore.subscribe(() => setSelectedTabIds(widgetTabIdsStore.get())), []);
+  const [viewTabs, setViewTabs] = (0, import_react6.useState)(() => props.views.list());
+  (0, import_react6.useEffect)(() => props.views.subscribe(() => setViewTabs(props.views.list())), [props.views]);
+  const [activeViewId, setActiveViewId] = (0, import_react6.useState)(null);
   const cachedBalance = getCachedBalance();
-  const [data, setData] = (0, import_react5.useState)(cachedBalance?.data ?? null);
-  const [error, setError] = (0, import_react5.useState)(null);
-  const [loading, setLoading] = (0, import_react5.useState)(cachedBalance === null);
-  const [collapsed, setCollapsed] = (0, import_react5.useState)(() => loadPref(COLLAPSED_KEY, isBoolean, false));
-  const [pos, setPos] = (0, import_react5.useState)(null);
-  const [corner, setCorner] = (0, import_react5.useState)(() => loadPref(CORNER_KEY, isCorner, "br"));
-  const [dragging, setDragging] = (0, import_react5.useState)(false);
-  const rootRef = (0, import_react5.useRef)(null);
-  const dragRef = (0, import_react5.useRef)(null);
+  const [data, setData] = (0, import_react6.useState)(cachedBalance?.data ?? null);
+  const [error, setError] = (0, import_react6.useState)(null);
+  const [loading, setLoading] = (0, import_react6.useState)(cachedBalance === null);
+  const [collapsed, setCollapsed] = (0, import_react6.useState)(() => loadPref(COLLAPSED_KEY, isBoolean, false));
+  const [pos, setPos] = (0, import_react6.useState)(null);
+  const [corner, setCorner] = (0, import_react6.useState)(() => loadPref(CORNER_KEY, isCorner, "br"));
+  const [dragging, setDragging] = (0, import_react6.useState)(false);
+  const rootRef = (0, import_react6.useRef)(null);
+  const dragRef = (0, import_react6.useRef)(null);
   const readUsage = () => {
     const cached = getCachedUsage();
     return { data: cached?.ok === true ? cached.data ?? null : null, at: getCachedUsageAt() };
   };
-  const [usage, setUsage] = (0, import_react5.useState)(readUsage);
-  (0, import_react5.useEffect)(() => subscribeUsage(() => setUsage(readUsage())), []);
+  const [usage, setUsage] = (0, import_react6.useState)(readUsage);
+  (0, import_react6.useEffect)(() => subscribeUsage(() => setUsage(readUsage())), []);
+  const readSessionUsage = (id) => {
+    if (id === void 0) return null;
+    const response = getCachedSessionUsage(id);
+    return response?.ok === true ? response.data ?? null : null;
+  };
+  const [sessionUsage, setSessionUsage] = (0, import_react6.useState)(() => readSessionUsage(sessionId));
+  (0, import_react6.useEffect)(() => {
+    setSessionUsage(readSessionUsage(sessionId));
+    if (sessionId === void 0) return;
+    const unsubscribe = subscribeSessionUsage(sessionId, () => setSessionUsage(readSessionUsage(sessionId)));
+    void fetchSessionUsage(sessionId);
+    return unsubscribe;
+  }, [sessionId]);
+  (0, import_react6.useLayoutEffect)(() => {
+    const viewIds = viewTabs.map((tab) => tab.id);
+    const read = () => {
+      const next = getActiveConversationViewId(getShellFrame(rootRef.current), viewIds);
+      setActiveViewId((previous) => previous === next ? previous : next);
+    };
+    read();
+    const frame = getShellFrame(rootRef.current);
+    let observer = null;
+    if (frame !== null && typeof MutationObserver === "function") {
+      observer = new MutationObserver(read);
+      observer.observe(frame, { subtree: true, childList: true, attributes: true, attributeFilter: ["aria-selected"] });
+    }
+    const poll = setInterval(read, 1e3);
+    return () => {
+      observer?.disconnect();
+      clearInterval(poll);
+    };
+  }, [sessionId, viewTabs]);
   const load = async (showLoading, force = false) => {
     if (showLoading) setLoading(true);
     try {
@@ -2979,14 +3174,14 @@ function QuotaWidget() {
       setLoading(false);
     }
   };
-  (0, import_react5.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     void load(true);
     const id = setInterval(() => {
       void load(false);
     }, 6e4);
     return () => clearInterval(id);
   }, []);
-  (0, import_react5.useLayoutEffect)(() => {
+  (0, import_react6.useLayoutEffect)(() => {
     if (!visible || quotaViewActive2) return;
     const node = rootRef.current;
     if (node === null) return;
@@ -3106,49 +3301,68 @@ function QuotaWidget() {
     endDrag(true);
   };
   if (!visible) return null;
+  const allowedOnActiveView = activeViewId === null ? sessionId === void 0 : activeViewId !== "balance" && (selectedTabIds === null || selectedTabIds.includes(activeViewId));
+  const hidden = quotaViewActive2 || !allowedOnActiveView;
   const primary = data !== null && data.balances.length > 0 ? data.balances[0] : null;
   const balanceValue = primary !== null ? Number(primary.total) : Number.NaN;
   const low = lowBalance > 0 && Number.isFinite(balanceValue) && balanceValue < lowBalance;
   const dotClass = primary === null ? "dsh-quota-dot dsh-quota-dot--idle" : data?.isAvailable === false ? "dsh-quota-dot dsh-quota-dot--error" : low ? "dsh-quota-dot dsh-quota-dot--warn" : "dsh-quota-dot";
   const ageMinutes = usage.at === null ? null : Math.floor((Date.now() - usage.at) / 6e4);
   const usageAgeText = ageMinutes === null || ageMinutes < 1 ? t("widget.updatedNow") : t("widget.stale", { minutes: ageMinutes });
+  const sessionCostRow = sessionUsage === null ? null : /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-row", title: t("widget.sessionCostTitle"), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-label", children: t("widget.sessionCost") }),
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "dsh-quota-value", children: [
+      "\xA5 ",
+      fmtTurnCost(sessionUsage.cost)
+    ] })
+  ] });
   let body = null;
   if (!collapsed) {
     if (loading && data === null && error === null) {
-      body = /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "dsh-quota-body", children: t("widget.loading") });
+      body = /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-body", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { children: t("widget.loading") }),
+        sessionCostRow
+      ] });
     } else if (error !== null && data === null) {
-      body = /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "dsh-quota-body dsh-quota-error", children: localizeApiError(error, t, "error.query") });
+      body = /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-body", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "dsh-quota-error", children: localizeApiError(error, t, "error.query") }),
+        sessionCostRow
+      ] });
     } else if (primary !== null) {
-      body = /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "dsh-quota-body", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "dsh-quota-remaining-label", children: t("balance.remaining") }),
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { title: low ? t("widget.lowTitle", { amount: fmt(lowBalance) }) : void 0, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: `dsh-quota-total${low ? " dsh-quota-total--low" : ""}`, children: fmt(primary.total) }),
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "dsh-quota-currency", children: primary.currency })
+      body = /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-body", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "dsh-quota-remaining-label", children: t("balance.remaining") }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { title: low ? t("widget.lowTitle", { amount: fmt(lowBalance) }) : void 0, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: `dsh-quota-total${low ? " dsh-quota-total--low" : ""}`, children: fmt(primary.total) }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-currency", children: primary.currency })
         ] }),
-        usage.data !== null && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "dsh-quota-row", title: t("widget.todayCostTitle", { age: usageAgeText }), children: [
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "dsh-quota-label", children: t("widget.todayCost") }),
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: "dsh-quota-value", children: [
+        usage.data !== null && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-row", title: t("widget.todayCostTitle", { age: usageAgeText }), children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-label", children: t("widget.todayCost") }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "dsh-quota-value", children: [
             "\xA5 ",
             fmt(usage.data.summary.today.cost)
           ] })
         ] }),
-        data?.isAvailable === false && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "dsh-quota-row", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "dsh-quota-label", children: t("common.status") }),
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "dsh-quota-value dsh-quota-error", children: t("common.unavailable") })
+        sessionCostRow,
+        data?.isAvailable === false && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-row", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-label", children: t("common.status") }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-value dsh-quota-error", children: t("common.unavailable") })
         ] })
       ] });
     } else {
-      body = /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "dsh-quota-body dsh-quota-error", children: t("widget.noBalance") });
+      body = /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-body", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "dsh-quota-error", children: t("widget.noBalance") }),
+        sessionCostRow
+      ] });
     }
   }
   const style = pos !== null ? { left: `${pos.x}px`, top: `${pos.y}px`, right: "auto", bottom: "auto" } : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
     "div",
     {
-      className: `dsh-quota-root${dragging ? " dsh-quota-dragging" : ""}${quotaViewActive2 ? " dsh-quota-root--dashboard" : ""}`,
+      className: `dsh-quota-root${dragging ? " dsh-quota-dragging" : ""}${hidden ? " dsh-quota-root--hidden" : ""}`,
       style,
-      "aria-hidden": quotaViewActive2,
-      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+      "aria-hidden": hidden,
+      children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
         "div",
         {
           ref: rootRef,
@@ -3160,14 +3374,14 @@ function QuotaWidget() {
           onPointerCancel: () => endDrag(false),
           onLostPointerCapture: () => endDrag(false),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "dsh-quota-header", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "dsh-quota-title", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "dsh-quota-grip", title: t("widget.dragGrip"), children: "\u2807" }),
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: dotClass }),
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "dsh-quota-name", children: t("widget.title") })
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-header", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-title", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-grip", title: t("widget.dragGrip"), children: "\u2807" }),
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: dotClass }),
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "dsh-quota-name", children: t("widget.title") })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "dsh-quota-actions", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "dsh-quota-actions", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
                   "button",
                   {
                     className: "dsh-quota-btn",
@@ -3178,11 +3392,12 @@ function QuotaWidget() {
                     onClick: () => {
                       void load(true, true);
                       void fetchUsage(true);
+                      if (sessionId !== void 0) void fetchSessionUsage(sessionId, true);
                     },
                     children: "\u21BB"
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
                   "button",
                   {
                     className: "dsh-quota-btn",
@@ -3200,7 +3415,7 @@ function QuotaWidget() {
                 )
               ] })
             ] }),
-            collapsed && primary !== null && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "dsh-quota-collapsed-total-row", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: `dsh-quota-collapsed-total${low ? " dsh-quota-total--low" : ""}`, children: [
+            collapsed && primary !== null && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "dsh-quota-collapsed-total-row", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: `dsh-quota-collapsed-total${low ? " dsh-quota-total--low" : ""}`, children: [
               fmt(primary.total),
               " ",
               primary.currency
@@ -3213,13 +3428,31 @@ function QuotaWidget() {
   );
 }
 
+// src/client/views.ts
+var labelOf = (entry) => {
+  const { id = "", label } = entry.options;
+  try {
+    const resolved = typeof label === "function" ? label() : label;
+    return typeof resolved === "string" && resolved !== "" ? resolved : id;
+  } catch {
+    return id;
+  }
+};
+function conversationViewsSource(slots) {
+  return {
+    list: () => slots.entries("conversation.view").flatMap((entry) => entry.options.id === void 0 ? [] : [{ id: entry.options.id, label: labelOf(entry) }]),
+    subscribe: (fn) => slots.subscribe("conversation.view", fn)
+  };
+}
+
 // src/client/index.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 var name = "dsh-usage-dashboard";
 var inject = ["slots", "locale"];
 function apply(ctx) {
   ctx.effect(() => ctx.locale.register(NS, { zh, en }), "dsh-usage-dashboard: browser dictionaries");
   const t = ctx.locale.bind(NS);
+  const views = conversationViewsSource(ctx.slots);
   if (typeof document !== "undefined") {
     const tag = document.createElement("style");
     tag.dataset.plugin = "dsh-usage-dashboard";
@@ -3232,7 +3465,17 @@ function apply(ctx) {
   });
   ctx.slots.inject("shell.overlay", () => ctx.slots.register(
     { name: "shell.overlay", id: "deepseek-quota", order: 1e3, locale: NS, label: () => t("widget.title") },
-    ({ t: slotT }) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ErrorBoundary, { t: slotT, silent: true, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(QuotaWidget, {}) }) })
+    ({ t: slotT, useSessions }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorBoundary, { t: slotT, silent: true, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(QuotaWidget, { useSessions, views }) }) })
+  ));
+  ctx.slots.inject("conversation.chat.assistant-actions", () => ctx.slots.register(
+    {
+      name: "conversation.chat.assistant-actions",
+      id: "dsh-usage-turn-cost",
+      order: 5,
+      locale: NS,
+      label: () => t("messageCost.label")
+    },
+    ({ t: slotT, sessionId, messageId }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorBoundary, { t: slotT, silent: true, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MessageCost, { sessionId, messageId }) }) })
   ));
   ctx.slots.inject("conversation.view", () => ctx.slots.register(
     { name: "conversation.view", id: "balance", order: 20, locale: NS, label: () => t("nav.quota") },
@@ -3243,7 +3486,7 @@ function apply(ctx) {
     // `sessionId` is typed optional defensively even though the host is
     // expected to always supply it: BalanceDashboard renders the current-
     // session card only when it actually has one, never throws either way.
-    ({ t: slotT, sessionId }) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ErrorBoundary, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(BalanceDashboard, { sessionId }) }) })
+    ({ t: slotT, sessionId }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(LocaleProvider, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ErrorBoundary, { t: slotT, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BalanceDashboard, { sessionId, views }) }) })
   ));
 }
 return module.exports; } });