@hystudio/dsh-quota-pill 0.2.3 → 0.2.5

package/AGENTS.md

@@ -33,6 +33,7 @@ There are **two credential families**, and this matters for every step:
 | DSH Platform sign-in | `deepseek` | **nothing** — works if they are signed in to DeepSeek Platform in DSH |
 | API key | `kimi`, `opencode`, `commandcode` | a key pasted into `~/.dsh/.credentials.yaml` |
 | OAuth via CLIProxyAPI | `xai`, `codex`, `agy` | **CLIProxyAPI installed and logged in once** |
+| Console session cookie | `opendesign` | the `__Secure-better-auth.session_token` cookie from the Open Design cloud dashboard |
 
 **Check DeepSeek first.** It is the official account and needs no setup beyond a
 DSH Platform sign-in, so it is usually the one the user actually wants. If it

package/README.md

@@ -22,6 +22,7 @@ into the live number.
 | **xAI (Grok)** | OAuth token from [CLIProxyAPI](https://github.com/router-for-me/CLIProxyAPI) |
 | **Codex (ChatGPT Plus)** | same — and CLIProxyAPI must be **running** |
 | **Antigravity** | same |
+| **Open Design** (optional) | `refs.OPENDESIGN_SESSION_COOKIE` — the cloud console's session cookie |
 
 **DeepSeek works with no setup at all** if you are signed in to DeepSeek Platform
 in DSH — that is the official account, and it is the one most users care about.
@@ -30,8 +31,10 @@ The three API-key providers need nothing but the key. The three OAuth providers
 need CLIProxyAPI installed and logged in, because that is what holds the tokens;
 this plugin only reads them and never runs an OAuth flow itself.
 
-Every provider is optional. Unconfigured ones say exactly what is missing instead
-of showing a fake zero.
+Every provider is optional, and **only the ones you actually have are listed**:
+the pill reads DSH's `session/modelCatalog` to learn which providers the app can
+route to, so removing a provider from DSH removes it from the pill too. A provider
+that is present but has no credential is skipped rather than shown as an empty row.
 
 ## Install
 
@@ -190,6 +193,14 @@ would flicker between models you do not even have configured.
 `monthlyCap = weekly.cap × 2`, an identity verified against two different plans
 (31.6 + 38.4 = 70 with `weekly.cap` 35; 0.225 + 9.775 = 10 with `weekly.cap` 6).
 
+**Open Design** keeps its allowance in the cloud console, not in the API key you
+use for inference. The `amr-link.open-design.ai/v1` gateway has no balance
+endpoint at all; the console's own `amr-api` does, and it authenticates with a
+`__Secure-better-auth.session_token` cookie. That cookie is HttpOnly, so grab it
+from devtools → Application → Cookies. The workspace id is discovered
+automatically. The request goes through system curl because Cloudflare rejects
+Node's TLS fingerprint on that host with `error code: 1010`.
+
 **DeepSeek** is a prepaid CNY wallet, so there is no percentage to show — the pill
 shows the balance and, separately, any bonus credit. Two traps worth recording:
 the stored credential is a *Platform login grant*, not an `api.deepseek.com` API

package/client.js

@@ -595,6 +595,50 @@ window.__ModuleLoader__.load({
       const panelRef = React.useRef(null);
       const prevRunning = React.useRef(running);
 
+      // 面板位置：固定在视口内，而不是跟着触发器「贴」到哪算哪。
+      //
+      // 旧写法直接取触发器的 left，面板 340px 宽，窄窗口时右边就被切掉了；
+      // bottom 固定向上展开，窗口矮时上面同样被切。这里改成：
+      //   · 水平：优先对齐触发器左边，再夹到视口内
+      //   · 垂直：上方放得下就向上，放不下就翻到触发器下面
+      //   · 两侧都塞不满时给 maxHeight，让面板自己滚动而不是溢出
+      const [panelStyle, setPanelStyle] = React.useState(null);
+      const GAP = 8;      // 与触发器的间距
+      const EDGE = 12;    // 距视口边缘的最小留白
+      const PANEL_MAX_W = 340;
+
+      /** 把面板夹进视口：水平贴触发器左边但不出界，垂直放不下就翻到下方。 */
+      const placePanel = React.useCallback(() => {
+        const el = anchorRef.current;
+        if (!el) return;
+        const r = el.getBoundingClientRect();
+        setPanelStyle(computePanelPlacement(
+          { left: r.left, top: r.top, bottom: r.bottom },
+          {
+            width: window.innerWidth || document.documentElement.clientWidth,
+            height: window.innerHeight || document.documentElement.clientHeight,
+          },
+          panelRef.current ? panelRef.current.offsetHeight : 0,
+          GAP, EDGE, PANEL_MAX_W,
+        ));
+      }, []);
+
+      React.useEffect(() => {
+        if (!open) { setPanelStyle(null); return undefined; }
+        placePanel();
+        // 挂载后量到真实高度再算一次，翻转判定才准
+        const raf = requestAnimationFrame(placePanel);
+        const onViewportChange = () => placePanel();
+        window.addEventListener('resize', onViewportChange);
+        // capture: 工具条自身可能滚动，滚动会改变触发器的位置
+        window.addEventListener('scroll', onViewportChange, true);
+        return () => {
+          cancelAnimationFrame(raf);
+          window.removeEventListener('resize', onViewportChange);
+          window.removeEventListener('scroll', onViewportChange, true);
+        };
+      }, [open, placePanel]);
+
       // 面板页签：默认「当前」（本会话在用的 provider），可切到「全部」。
       const [tab, setTab] = React.useState('current');
       // 切换动画从哪一侧滑入：'right' = 新内容自右来（往前进），'left' = 自左来。
@@ -926,11 +970,10 @@ window.__ModuleLoader__.load({
             role: 'dialog',
             'aria-label': 'quota',
             className: 'quota-pill-panel',
-            style: {
-              position: 'fixed',
-              left: (anchorRef.current ? anchorRef.current.getBoundingClientRect().left : 0),
-              bottom: (anchorRef.current ? window.innerHeight - anchorRef.current.getBoundingClientRect().top + 8 : 0),
-            },
+            style: panelStyle
+              ? { position: 'fixed', ...panelStyle }
+              // 第一帧还没算好位置：先藏着，否则会先画在错误的地方再跳一下
+              : { position: 'fixed', left: 0, top: 0, visibility: 'hidden' },
           },
             h('div', {
               className: 'quota-pill-tabs',
@@ -1176,6 +1219,36 @@ window.__ModuleLoader__.load({
       return Math.abs(credits.total - credits.remain) > 1e-9 || Math.abs(pct - 100) > 0.01;
     }
 
+    /**
+     * 计算面板该放在哪，纯函数（不碰 DOM，便于测试）。
+     *
+     * 面板固定在视口里，不跟着触发器「贴」到哪算哪：
+     *   · 水平：优先对齐触发器左边，再夹进视口，宁可左移也不切边
+     *   · 垂直：上方放得下就向上展开，放不下就翻到触发器下方
+     *   · 都不够高时返回 maxHeight，让面板内部滚动，绝不溢出视口
+     *
+     * @param anchor  触发器的 getBoundingClientRect 形状 {left, top, bottom}
+     * @param viewport {width, height}
+     * @param panelHeight 面板实测高度，0 表示还没量到
+     */
+    function computePanelPlacement(anchor, viewport, panelHeight, gap, edge, maxWidth) {
+      const vw = viewport.width;
+      const vh = viewport.height;
+      const width = Math.min(maxWidth, vw - edge * 2);
+      const left = Math.max(edge, Math.min(anchor.left, vw - width - edge));
+
+      const spaceAbove = anchor.top - gap - edge;
+      const spaceBelow = vh - anchor.bottom - gap - edge;
+      const up = panelHeight === 0
+        ? spaceAbove >= spaceBelow
+        : (spaceAbove >= panelHeight || spaceAbove >= spaceBelow);
+
+      const base = { left, width, overflowY: 'auto' };
+      return up
+        ? { ...base, bottom: Math.max(edge, vh - anchor.top + gap), maxHeight: Math.max(140, spaceAbove), placement: 'up' }
+        : { ...base, top: Math.max(edge, anchor.bottom + gap), maxHeight: Math.max(140, spaceBelow), placement: 'down' };
+    }
+
     function WindowRow(props) {
       const { label, pct, reset, credits, lang, stale } = props;
       const isNum = typeof pct === 'number' && Number.isFinite(pct);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hystudio/dsh-quota-pill",
-  "version": "0.2.3",
+  "version": "0.2.5",
   "private": false,
   "type": "module",
   "description": "Quota pill for DeepSeek Harness: remaining quota for every LLM subscription you have, in one collapsible pill",

package/src/adapters-opendesign.js

@@ -0,0 +1,141 @@
+/**
+ * Open Design (open-design.ai) — Cloud coding-plan allowance.
+ *
+ * Optional provider. Unlike the others it does **not** read an API key: the
+ * allowance lives in the cloud console's own API and is authenticated with the
+ * console's session cookie. Set it once:
+ *
+ *   ~/.dsh/.credentials.yaml
+ *     refs:
+ *       OPENDESIGN_SESSION_COOKIE: <__Secure-better-auth.session_token value>
+ *
+ * To get that value: open https://open-design.ai/cloud/dashboard while signed in,
+ * then in the browser's devtools read the `__Secure-better-auth.session_token`
+ * cookie (it is HttpOnly, so `document.cookie` will not show it).
+ *
+ * Two traps, both verified:
+ *   · The inference gateway at amr-link.open-design.ai/v1 has NO balance
+ *     endpoint — it is a chat proxy only. Probing it for quota always 404s.
+ *   · amr-api sits behind Cloudflare, which rejects Node's TLS fingerprint with
+ *     `error code: 1010`. The request therefore goes through system curl.
+ *     That is the same request over a different TLS stack, not an auth bypass.
+ */
+import { readRef } from './credentials.js';
+import { getJsonViaCurl } from './http.js';
+
+const API = process.env.OPENDESIGN_API_BASE || 'https://amr-api.open-design.ai/api/v1';
+
+const round2 = (n) => Math.round(n * 100) / 100;
+
+function headers(cookie) {
+  return {
+    Cookie: '__Secure-better-auth.session_token=' + cookie,
+    Origin: 'https://open-design.ai',
+    Referer: 'https://open-design.ai/',
+  };
+}
+
+/** Window label from its length: 18000s is the 5h cap, 604800s the weekly one. */
+function windowKey(seconds) {
+  const s = Number(seconds) || 0;
+  if (s > 0 && s <= 6 * 3600) return '5h';
+  if (s > 0 && s <= 8 * 86400) return 'weekly';
+  if (s > 0) return 'monthly';
+  return 'credits-all';
+}
+
+/**
+ * The workspace id is discoverable, so the user only supplies a cookie.
+ * `/workspaces/current` already resolves to the default workspace.
+ */
+async function currentWorkspace(cookie) {
+  const res = await getJsonViaCurl(`${API}/workspaces/current`, { headers: headers(cookie) });
+  if (!res.ok) return { error: res.error };
+  const id = res.data && res.data.workspaceId;
+  return id ? { id } : { error: 'no workspaceId in response' };
+}
+
+export async function opendesign() {
+  const cookie = readRef('OPENDESIGN_SESSION_COOKIE');
+  if (!cookie) {
+    return {
+      kind: 'none',
+      provider: 'opendesign',
+      error: 'no OPENDESIGN_SESSION_COOKIE in ~/.dsh/.credentials.yaml',
+      setup: {
+        kind: 'session-cookie',
+        ref: 'OPENDESIGN_SESSION_COOKIE',
+        hint: 'Copy the __Secure-better-auth.session_token cookie from the Open Design cloud dashboard.',
+      },
+    };
+  }
+
+  const ws = await currentWorkspace(cookie);
+  if (ws.error) {
+    return {
+      kind: 'probe-failed',
+      provider: 'opendesign',
+      error: `workspace lookup failed: ${ws.error}`,
+      hint: 'The console session cookie has probably expired — copy a fresh one.',
+    };
+  }
+
+  const res = await getJsonViaCurl(
+    `${API}/workspaces/${ws.id}/billing/coding-plan-usage`,
+    { headers: headers(cookie), timeoutMs: 25000 },
+  );
+  if (!res.ok) {
+    return {
+      kind: 'probe-failed',
+      provider: 'opendesign',
+      error: `coding-plan-usage failed: ${res.error}`,
+      hint: res.error && res.error.includes('40')
+        ? 'The console session cookie has probably expired — copy a fresh one.'
+        : undefined,
+    };
+  }
+
+  const body = res.data || {};
+  const windows = [];
+  for (const w of body.windows || []) {
+    const limit = Number(w.limitCredits);
+    const remain = Number(w.remainingCredits);
+    if (!Number.isFinite(limit) || limit <= 0 || !Number.isFinite(remain)) continue;
+    windows.push({
+      key: windowKey(w.durationSeconds),
+      remainPct: round2((remain / limit) * 100),
+      resetAt: w.resetsAt || null,
+      credits: { remain: round2(remain), total: round2(limit), unit: 'credits' },
+    });
+  }
+
+  if (!windows.length) {
+    return {
+      kind: 'none',
+      provider: 'opendesign',
+      error: `coding-plan-usage returned no windows (tier ${body.tier || 'unknown'})`,
+    };
+  }
+
+  // The tightest window is what blocks the next request, but the list itself
+  // stays in canonical order (5h before weekly) so rows match every other
+  // provider instead of reshuffling as the numbers move.
+  const tight = windows.reduce((a, b) => (a.remainPct <= b.remainPct ? a : b));
+  const ORDER = { '5h': 0, weekly: 1, monthly: 2, 'credits-all': 3 };
+  windows.sort((a, b) => (ORDER[a.key] ?? 9) - (ORDER[b.key] ?? 9));
+  const products = {};
+  for (const w of windows) products[w.key] = round2(100 - w.remainPct);
+
+  return {
+    kind: 'subscription-quota',
+    provider: 'opendesign',
+    account: body.tier || null,
+    remainingPct: tight.remainPct,
+    usedPct: round2(100 - tight.remainPct),
+    window: tight.key,
+    resetAt: tight.resetAt,
+    products,
+    windows,
+    raw: { source: 'coding-plan-usage (console session)', tier: body.tier },
+  };
+}

package/src/server.js

@@ -25,6 +25,7 @@ import { xai, codex, agy } from './adapters-cliproxy.js';
 import { deepseek } from './adapters-deepseek.js';
 import { credentialSource, hasCliProxy, CLI_PROXY_DIR, CREDENTIALS_FILE } from './credentials.js';
 import { catalogProviderIds } from './catalog.js';
+import { opendesign } from './adapters-opendesign.js';
 
 const PORT = Number(process.env.QUOTA_PILL_PORT || 8319);
 const HOST = process.env.QUOTA_PILL_HOST || '127.0.0.1';
@@ -32,7 +33,7 @@ const CACHE_TTL_MS = Number(process.env.QUOTA_PILL_CACHE_TTL || 60) * 1000;
 
 // Order matters: the pill lists providers in this order, and the official
 // DeepSeek account is the one most people look for first.
-const ADAPTERS = { deepseek, kimi, opencode, commandcode, xai, codex, agy };
+const ADAPTERS = { deepseek, kimi, opencode, commandcode, xai, codex, agy, opendesign };
 
 /** Display names. Deliberately small: the table stays in sync with ADAPTERS. */
 const DISPLAY_NAMES = {
@@ -43,6 +44,7 @@ const DISPLAY_NAMES = {
   xai: 'xAI (Grok)',
   codex: 'Codex (ChatGPT Plus)',
   agy: 'Antigravity',
+  opendesign: 'Open Design',
 };
 
 /** Which DSH model prefixes map to which adapter. */
@@ -58,6 +60,7 @@ const PREFIX_ALIASES = {
   antigravity: 'agy',
   agy: 'agy',
   deepseek: 'deepseek',
+  opendesign: 'opendesign',
 };
 
 /** provider|model → { at, payload }. Keyed by model because readings differ per model. */
@@ -116,6 +119,7 @@ const CATALOG_ALIASES = {
   xai: ['xai'],
   codex: ['codex'],
   commandcode: ['commandcode'],
+  opendesign: ['opendesign'],
 };
 
 function inCatalog(provider, ids) {