opencode-go-usage-tui 1.3.1 → 1.3.3

package/src/index.tsx

@@ -1,878 +1,1029 @@
-/** @jsxImportSource @opentui/solid */
-
-import type {
-  TuiPlugin,
-  TuiPluginApi,
-  TuiSlotContext,
-  TuiSlotPlugin,
-  TuiPluginModule,
-  TuiThemeCurrent,
-} from "@opencode-ai/plugin/tui"
-import { createSignal, createEffect, onMount, onCleanup, Show } from "solid-js"
-import type { JSX } from "@opentui/solid"
-import { readFileSync, writeFileSync, mkdirSync, renameSync, existsSync } from "node:fs"
-import { join, dirname } from "node:path"
-import { createCipheriv, createDecipheriv, randomBytes } from "node:crypto"
-import { createT, detectLang, LANG_META } from "./i18n"
-import type { LangCode } from "./i18n"
-import { fetchPricing, comparePricing, loadPricingStore, updatePricingStore } from "./pricing"
-import type { ModelPrice, PricingData, PricingStore } from "./pricing"
-
-declare const process: { env: Record<string, string | undefined> } | undefined
-
-const VERSION: string = __PLUGIN_VERSION__
-const CHECK_INTERVAL = Number(process?.env?.OPENCODE_GO_CHECK_INTERVAL ?? 60000)
-const WARN_THRESHOLD = Number(process?.env?.OPENCODE_GO_WARN_THRESHOLD ?? 0.8)
-const CONFIG_DIR = process?.env?.OPENCODE_CONFIG_DIR
-  || (process?.env?.USERPROFILE ? `${process.env.USERPROFILE}\\.config\\opencode` : "")
-  || process?.env?.HOME + "/.config/opencode"
-const CONFIG_FILE = join(CONFIG_DIR, "go-usage-config.json")
-const COOKIE_ENC_FILE = join(CONFIG_DIR, "go-auth-cookie.enc")
-const KEY_FILE = join(CONFIG_DIR, ".encryption-key")
-const COOKIE_PLAIN_FILE = `${CONFIG_DIR}\\go-auth-cookie.txt`
-const KV_PREFIX = "go-usage"
-
-// ── AES-256-GCM 加密存储 ────────────────────────────────
-// cookie 以密文存 go-auth-cookie.enc，密钥存 .encryption-key。
-// 注意：Windows 无 Unix 权限位，mode 0o600 仅对 macOS/Linux 生效；
-// Windows 上密钥与密文同目录，防护重点是"被动泄露"（备份/云同步/日志），
-// 无法抵御能读取该目录的本地恶意程序。
-function loadEncryptionKey(): Buffer {
-  try {
-    const hex = readFileSync(KEY_FILE, "utf8").trim()
-    if (hex) return Buffer.from(hex, "hex")
-  } catch { /* 无密钥则新建 */ }
-  const key = randomBytes(32)
-  mkdirSync(dirname(KEY_FILE), { recursive: true })
-  writeFileSync(KEY_FILE, key.toString("hex"), { encoding: "utf8", mode: 0o600 })
-  return key
-}
-
-function encryptText(text: string): string {
-  const key = loadEncryptionKey()
-  const iv = randomBytes(16)
-  const cipher = createCipheriv("aes-256-gcm", key, iv)
-  const data = cipher.update(text, "utf8", "hex") + cipher.final("hex")
-  return JSON.stringify({ v: 1, iv: iv.toString("hex"), data, tag: cipher.getAuthTag().toString("hex") })
-}
-
-function decryptText(encJson: string): string {
-  const { iv, data, tag } = JSON.parse(encJson)
-  const key = loadEncryptionKey()
-  const decipher = createDecipheriv("aes-256-gcm", key, Buffer.from(iv, "hex"))
-  decipher.setAuthTag(Buffer.from(tag, "hex"))
-  return decipher.update(data, "hex", "utf8") + decipher.final("utf8")
-}
-
-function readJsonFile<T>(file: string): T | null {
-  try { return JSON.parse(readFileSync(file, "utf8")) as T } catch { return null }
-}
-
-interface ConfigFile { workspace_id?: string; cookie?: string; auth_cookie?: string; cookie_file?: string; ui?: { usage_panel?: boolean; price_panel?: boolean }; focus_models?: string[]; refresh_interval_sec?: number; pricing_interval_sec?: number }
-
-interface LoadedConfig { workspaceId: string; authCookie: string; usagePanel: boolean; pricePanel: boolean; focusModels: string[]; refreshIntervalMs: number; pricingIntervalMs: number }
-
-function loadConfig(): LoadedConfig {
-  const env = process?.env ?? {}
-  const fileCfg = readJsonFile<ConfigFile>(CONFIG_FILE) ?? {}
-
-  // 1. 环境变量优先
-  if (env.OPENCODE_GO_AUTH_COOKIE) {
-    return {
-      workspaceId: env.OPENCODE_GO_WORKSPACE_ID || fileCfg.workspace_id || "", authCookie: env.OPENCODE_GO_AUTH_COOKIE,
-      usagePanel: fileCfg.ui?.usage_panel ?? true, pricePanel: fileCfg.ui?.price_panel ?? true,
-      focusModels: fileCfg.focus_models ?? [], refreshIntervalMs: (fileCfg.refresh_interval_sec ?? Math.round(CHECK_INTERVAL / 1000)) * 1000,
-      pricingIntervalMs: (fileCfg.pricing_interval_sec ?? Math.round((CHECK_INTERVAL / 1000) * 30)) * 1000,
-    }
-  }
-
-  // 2. 加密存储
-  try {
-    if (existsSync(COOKIE_ENC_FILE)) {
-      const cookie = decryptText(readFileSync(COOKIE_ENC_FILE, "utf8"))
-      if (cookie) {
-        return {
-          workspaceId: env.OPENCODE_GO_WORKSPACE_ID || fileCfg.workspace_id || "", authCookie: cookie,
-          usagePanel: fileCfg.ui?.usage_panel ?? true, pricePanel: fileCfg.ui?.price_panel ?? true,
-          focusModels: fileCfg.focus_models ?? [], refreshIntervalMs: (fileCfg.refresh_interval_sec ?? Math.round(CHECK_INTERVAL / 1000)) * 1000,
-          pricingIntervalMs: (fileCfg.pricing_interval_sec ?? Math.round((CHECK_INTERVAL / 1000) * 30)) * 1000,
-        }
-      }
-    }
-  } catch { /* 密文损坏时回退到明文迁移 */ }
-
-  // 3. 兼容旧明文（config.json 内嵌 cookie / auth_cookie / 独立 txt 文件）——自动迁移
-  const legacyCookie = fileCfg.auth_cookie || fileCfg.cookie || (() => {
-    try { return readFileSync(COOKIE_PLAIN_FILE, "utf8").trim() } catch { return "" }
-  })()
-  if (legacyCookie) {
-    const enc = encryptText(legacyCookie)
-    mkdirSync(CONFIG_DIR, { recursive: true })
-    writeFileSync(COOKIE_ENC_FILE, enc, "utf8")
-    // 清理旧明文
-    const cleanCfg: ConfigFile = { ...fileCfg }
-    delete cleanCfg.cookie
-    delete cleanCfg.auth_cookie
-    try { writeFileSync(CONFIG_FILE, JSON.stringify(cleanCfg, null, 2), "utf8") } catch { /* 忽略 */ }
-    try { if (existsSync(COOKIE_PLAIN_FILE)) renameSync(COOKIE_PLAIN_FILE, COOKIE_PLAIN_FILE + ".bak") } catch { /* 忽略 */ }
-    return {
-      workspaceId: env.OPENCODE_GO_WORKSPACE_ID || fileCfg.workspace_id || "", authCookie: legacyCookie,
-      usagePanel: fileCfg.ui?.usage_panel ?? true, pricePanel: fileCfg.ui?.price_panel ?? true,
-      focusModels: fileCfg.focus_models ?? [], refreshIntervalMs: (fileCfg.refresh_interval_sec ?? Math.round(CHECK_INTERVAL / 1000)) * 1000,
-      pricingIntervalMs: (fileCfg.pricing_interval_sec ?? Math.round((CHECK_INTERVAL / 1000) * 30)) * 1000,
-    }
-  }
-
-  return {
-    workspaceId: env.OPENCODE_GO_WORKSPACE_ID || fileCfg.workspace_id || "", authCookie: "",
-    usagePanel: fileCfg.ui?.usage_panel ?? true, pricePanel: fileCfg.ui?.price_panel ?? true,
-    focusModels: fileCfg.focus_models ?? [], refreshIntervalMs: (fileCfg.refresh_interval_sec ?? Math.round(CHECK_INTERVAL / 1000)) * 1000,
-    pricingIntervalMs: (fileCfg.pricing_interval_sec ?? Math.round((CHECK_INTERVAL / 1000) * 30)) * 1000,
-  }
-}
-
-function saveConfig(patch: { workspace_id?: string; cookie?: string; ui?: { usage_panel?: boolean; price_panel?: boolean }; focus_models?: string[]; refresh_interval_sec?: number; pricing_interval_sec?: number }): void {
-  const fileCfg = readJsonFile<ConfigFile>(CONFIG_FILE) ?? {}
-  if (patch.workspace_id !== undefined) fileCfg.workspace_id = patch.workspace_id
-  if (patch.cookie !== undefined) {
-    // cookie 改为加密存储，不再写明文到 config.json
-    if (patch.cookie) {
-      mkdirSync(CONFIG_DIR, { recursive: true })
-      writeFileSync(COOKIE_ENC_FILE, encryptText(patch.cookie), "utf8")
-      delete fileCfg.cookie
-      delete fileCfg.auth_cookie
-      // 清理可能存在的旧明文 txt
-      try { if (existsSync(COOKIE_PLAIN_FILE)) renameSync(COOKIE_PLAIN_FILE, COOKIE_PLAIN_FILE + ".bak") } catch { /* 忽略 */ }
-    } else {
-      try { if (existsSync(COOKIE_ENC_FILE)) renameSync(COOKIE_ENC_FILE, COOKIE_ENC_FILE + ".bak") } catch { /* 忽略 */ }
-    }
-  }
-  if (patch.ui !== undefined) {
-    fileCfg.ui = { ...(fileCfg.ui ?? {}), ...patch.ui }
-  }
-  if (patch.focus_models !== undefined) fileCfg.focus_models = patch.focus_models
-  if (patch.refresh_interval_sec !== undefined) fileCfg.refresh_interval_sec = patch.refresh_interval_sec
-  if (patch.pricing_interval_sec !== undefined) fileCfg.pricing_interval_sec = patch.pricing_interval_sec
-  try {
-    mkdirSync(dirname(CONFIG_FILE), { recursive: true })
-    writeFileSync(CONFIG_FILE, JSON.stringify(fileCfg, null, 2), "utf8")
-  } catch { /* 写入失败忽略 */ }
-}
-
-// 模块级共享信号：/go-config 保存配置后递增，面板监听它立即刷新
-const [configTick, setConfigTick] = createSignal(0)
-
-// 模块级共享语言信号：/go-lang 或首次引导切换后，面板和命令实时响应
-const [langCode, setLangCode] = createSignal<LangCode>(detectLang())
-const t = createT(() => langCode())
-
-// 模块级共享价格数据：PricePanel 抓取后写入，/go-settings 设置关注模型时读取
-const [sharedPricing, setSharedPricing] = createSignal<PricingData | null>(null)
-
-function kvTryGet(api: TuiPluginApi, key: string): string | undefined {
-  try { return api.kv.get<string>(key) } catch { return undefined }
-}
-function kvTrySet(api: TuiPluginApi, key: string, val: unknown): void {
-  try { api.kv.set(key, val) } catch { /* 忽略 */ }
-}
-
-interface Usage {
-  rollingUsage: { usagePercent: number; resetInSec: number }
-  weeklyUsage: { usagePercent: number; resetInSec: number }
-  monthlyUsage: { usagePercent: number; resetInSec: number }
-  error?: string
-}
-
-const REQUEST_TIMEOUT = 10000
-
-async function fetchUsage(workspaceId: string, authCookie: string, signal?: AbortSignal): Promise<Usage | null> {
-  if (!workspaceId || !authCookie) return { error: "not_configured" } as Usage
-  try {
-    const res = await fetch("https://opencode.ai/_server", {
-      method: "POST",
-      headers: {
-        "content-type": "application/json",
-        "x-server-id": "c7389bd0e731f80f49593e5ee53835475f4e28594dd6bd83eb229bab753498cd",
-        "x-server-instance": "go-usage-tui",
-        "cookie": `auth=${authCookie}`,
-        "user-agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64)",
-      },
-      body: JSON.stringify({
-        t: { t: 9, i: 0, l: 1, a: [{ t: 1, s: workspaceId }], o: 0 },
-        f: 31,
-        m: [],
-      }),
-      signal,
-    })
-    if (!res.ok) {
-      if (res.status === 302) return { error: "cookie_expired" } as Usage
-      return null
-    }
-    const text = await res.text()
-    if (text.includes("/auth/authorize") || text.includes("location")) {
-      return { error: "cookie_expired" } as Usage
-    }
-    const extract = (key: string): { resetInSec: number; usagePercent: number } | null => {
-      const m = text.match(new RegExp(`${key}:[^}]*?\\{status:"[^"]*",resetInSec:(\\d+),usagePercent:(\\d+)\\}`))
-      if (!m) return null
-      return { resetInSec: Number(m[1]), usagePercent: Number(m[2]) }
-    }
-    const rollingUsage = extract("rollingUsage")
-    const weeklyUsage = extract("weeklyUsage")
-    const monthlyUsage = extract("monthlyUsage")
-    if (!rollingUsage || !weeklyUsage || !monthlyUsage) return null
-    return { rollingUsage, weeklyUsage, monthlyUsage }
-  } catch {
-    return null
-  }
-}
-
-function formatReset(sec: number): string {
-  if (sec <= 0) return t("resetDone")
-  const d = Math.floor(sec / 86400)
-  const h = Math.floor((sec % 86400) / 3600)
-  const m = Math.floor((sec % 3600) / 60)
-  if (d > 0) return t("dayHour", { d, h })
-  if (h > 0) return t("hourMin", { h, m })
-  return t("minute", { m })
-}
-
-function progressBar(percent: number, width: number): string {
-  const clamped = Math.max(0, Math.min(100, percent))
-  const filled = Math.round((clamped / 100) * width)
-  const empty = Math.max(0, width - filled)
-  return "\u2588".repeat(filled) + "\u2591".repeat(empty)
-}
-
-function visualWidth(s: string): number {
-  let w = 0
-  for (const c of s) {
-    const code = c.codePointAt(0) ?? 0
-    w += (code >= 0x1100 && code <= 0x115F) ||
-         (code >= 0x2E80 && code <= 0xA4CF) ||
-         (code >= 0xAC00 && code <= 0xD7A3) ||
-         (code >= 0xF900 && code <= 0xFAFF) ||
-         (code >= 0xFF01 && code <= 0xFF60) ||
-         (code >= 0xFFE0 && code <= 0xFFE6) ? 2 : 1
-  }
-  return w
-}
-
-const FALLBACK = {
-  primary: "#8B9DAF",
-  text: "#C5C5BB",
-  muted: "#7A7A72",
-  success: "#9CAF8B",
-  warning: "#C5B88D",
-  error: "#B08A8A",
-  border: "#6B6B63",
-} as const
-
-function hex(raw: any): string {
-  if (typeof raw === "string" && raw.startsWith("#") && raw.length >= 7) return raw
-  if (raw && typeof raw === "object" && typeof raw.r === "number") {
-    const r = Math.round(raw.r * 255), g = Math.round(raw.g * 255), b = Math.round(raw.b * 255)
-    return "#" + [r, g, b].map(v => v.toString(16).padStart(2, "0")).join("")
-  }
-  return ""
-}
-
-function GoUsagePanel(props: { theme: TuiThemeCurrent; api: TuiPluginApi }): JSX.Element {
-  const [usage, setUsage] = createSignal<Usage | null>(null)
-  const [open, setOpen] = createSignal(true)
-  const [error, setError] = createSignal("")
-  const [configured, setConfigured] = createSignal(true)
-  const [lastUpdated, setLastUpdated] = createSignal("")
-  const [panelWidth, setPanelWidth] = createSignal(24)
-  const [cfg, setCfg] = createSignal<LoadedConfig>(loadConfig())
-  createEffect(() => { void configTick(); setCfg(loadConfig()) })
-  let boxEl: any
-  let abortController: AbortController | null = null
-  let timeoutId: ReturnType<typeof setTimeout> | null = null
-  let isRefreshing = false
-  let resizeTimeout: ReturnType<typeof setTimeout> | null = null
-
-  function cleanupPendingRequest() {
-    if (timeoutId) { clearTimeout(timeoutId); timeoutId = null }
-    if (abortController) { abortController.abort(); abortController = null }
-  }
-
-  async function refresh() {
-    if (isRefreshing) return
-    const cfg = loadConfig()
-    if (!cfg.workspaceId || !cfg.authCookie) {
-      setConfigured(false)
-      setUsage(null)
-      setError("")
-      return
-    }
-    setConfigured(true)
-    cleanupPendingRequest()
-    abortController = new AbortController()
-    const signal = abortController.signal
-    timeoutId = setTimeout(() => abortController?.abort(), REQUEST_TIMEOUT)
-    isRefreshing = true
-    try {
-      const u = await fetchUsage(cfg.workspaceId, cfg.authCookie, signal)
-      if (signal.aborted) return
-      if (u === null) { setError(t("queryFailed")); return }
-      if (u.error === "cookie_expired") { setError(t("cookieExpired")); return }
-      if (u.error === "not_configured") { setConfigured(false); return }
-      setUsage(u)
-      setLastUpdated(new Date().toLocaleTimeString())
-      setError("")
-    } finally {
-      if (timeoutId) { clearTimeout(timeoutId); timeoutId = null }
-      isRefreshing = false
-    }
-  }
-
-  onMount(() => {
-    refresh()
-    const timer = setInterval(refresh, loadConfig().refreshIntervalMs)
-    const stopWatch = createEffect(() => {
-      void configTick()
-      refresh()
-    })
-    onCleanup(() => {
-      clearInterval(timer)
-      stopWatch()
-      cleanupPendingRequest()
-      if (resizeTimeout) { clearTimeout(resizeTimeout); resizeTimeout = null }
-    })
-  })
-
-  const [pal, setPal] = createSignal<Record<string, string>>({ ...FALLBACK })
-  createEffect(() => {
-    const th = props.theme as any
-    const p: Record<string, string> = { ...FALLBACK }
-    for (const k of Object.keys(FALLBACK)) {
-      const h = hex(th?.[k])
-      if (h) p[k] = h
-    }
-    setPal(p)
-  })
-  const colors = () => pal()
-
-  const barW = () => Math.max(4, Math.min(12, panelWidth() - 34))
-
-  const colorFor = (percent: number) => {
-    const c = colors()
-    if (percent >= WARN_THRESHOLD * 100) return c.error
-    if (percent >= 50) return c.warning
-    return c.success
-  }
-
-  const renderRow = (label: string, u: { usagePercent: number; resetInSec: number }) => {
-    const labelW = visualWidth(label)
-    const pad = Math.max(0, 9 - labelW)
-    return (
-      <text>
-        <span style={{ fg: colors().text }}>{label}</span>
-        <span>{" ".repeat(pad + 1)}</span>
-        <span style={{ fg: colorFor(u.usagePercent) }}>
-          {progressBar(u.usagePercent, barW())}
-        </span>
-        <span>{" "}</span>
-        <span style={{ fg: colorFor(u.usagePercent) }}>{u.usagePercent}%</span>
-        <span style={{ fg: colors().muted }}> {formatReset(u.resetInSec)}</span>
-      </text>
-    )
-  }
-
-  const sep = () => "\u2500".repeat(Math.max(1, panelWidth() - 4))
-
-  return (
-    <box
-      border
-      borderColor={colors().border}
-      paddingLeft={1}
-      paddingRight={1}
-      flexDirection="column"
-      gap={0}
-      ref={boxEl}
-        onSizeChange={() => {
-          if (resizeTimeout) clearTimeout(resizeTimeout)
-          resizeTimeout = setTimeout(() => {
-            const w = boxEl ? Math.max(20, boxEl.width ?? 24) : 24
-            setPanelWidth(w)
-          }, 100)
-        }}
-      >
-        <text onMouseUp={() => setOpen(o => !o)}>
-          <span style={{ fg: colors().muted }}>{open() ? "\u25bc " : "\u25b6 "}</span>
-          <span style={{ fg: colors().primary }}><b>{t("panelTitle")}</b></span>
-          <span style={{ fg: colors().muted }}> v{VERSION}</span>
-          <Show when={!open() && usage()}>
-            <span style={{ fg: colorFor(usage()!.weeklyUsage.usagePercent) }}>
-              {" ".repeat(2)}{t("weeklyShort")} {usage()!.weeklyUsage.usagePercent}%
-            </span>
-          </Show>
-        </text>
-
-        <Show when={open()}>
-          <text fg={colors().muted}>{sep()}</text>
-
-          <Show when={!configured()}>
-            <text fg={colors().warning}>{t("notConfigured")}</text>
-            <text fg={colors().muted}>{t("notConfiguredHint")}</text>
-          </Show>
-
-          <Show when={configured() && error()} fallback={
-            <Show when={configured() && usage()} fallback={
-              <Show when={configured()}><text fg={colors().muted}>{t("loading")}</text></Show>
-            }>
-              {renderRow(t("rowRolling"), usage()!.rollingUsage)}
-              {renderRow(t("rowWeekly"), usage()!.weeklyUsage)}
-              {renderRow(t("rowMonthly"), usage()!.monthlyUsage)}
-              <text>
-                <span style={{ fg: colors().muted }}>{t("updatedAt")} </span>
-                <span style={{ fg: colors().muted }}>{lastUpdated()}</span>
-              </text>
-            </Show>
-          }>
-            <text fg={colors().error}>{error()}</text>
-            <text fg={colors().muted}>{t("reconfigureHint")}</text>
-          </Show>
-        </Show>
-      </box>
-    )
-  }
-
-function PricePanel(props: { theme: TuiThemeCurrent; api: TuiPluginApi }): JSX.Element {
-  const [open, setOpen] = createSignal(true)
-  const [pricingStore, setPricingStore] = createSignal<PricingStore | null>(null)
-  const [priceError, setPriceError] = createSignal("")
-  const [priceLoading, setPriceLoading] = createSignal(false)
-  const [panelWidth, setPanelWidth] = createSignal(24)
-  const [cfg, setCfg] = createSignal<LoadedConfig>(loadConfig())
-  createEffect(() => { void configTick(); setCfg(loadConfig()) })
-  let boxEl: any
-  let priceController: AbortController | null = null
-
-  // 强制同步 panelWidth 与 box 真实宽度（visual-cache 模式，避免首次不触发 onSizeChange）
-  createEffect(() => {
-    if (boxEl && typeof boxEl.width === "number" && boxEl.width > 0) {
-      setPanelWidth(Math.max(20, boxEl.width))
-    }
-  })
-
-  async function refreshPricing() {
-    if (priceLoading()) return
-    setPriceLoading(true)
-    setPriceError("")
-    priceController?.abort()
-    priceController = new AbortController()
-    try {
-      const data = await fetchPricing()
-      const store = updatePricingStore(data)
-      setSharedPricing(data)
-      setPricingStore(store)
-      const prev = store.previous
-      if (prev && prev.fetchTime !== data.fetchTime) {
-        const diff = comparePricing(prev, data)
-        if (diff.hasChanges) {
-          props.api.toast({
-            variant: "info",
-            title: t("priceChanged"),
-            message: t("priceChangesSummary", {
-              t: diff.summary.total,
-              a: diff.summary.added,
-              r: diff.summary.removed,
-              p: diff.summary.priceChanges,
-              l: diff.summary.limitChanges,
-            }),
-          })
-        }
-      }
-    } catch {
-      setPriceError(t("priceError"))
-    } finally {
-      setPriceLoading(false)
-      priceController = null
-    }
-  }
-
-  function formatCount(n: number): string {
-    if (n >= 1000) return (n / 1000).toFixed(1).replace(/\.0$/, "") + "k"
-    return String(n)
-  }
-
-  function visualPadEnd(s: string, w: number): string {
-    const cur = visualWidth(s)
-    if (cur >= w) return s
-    return s + " ".repeat(w - cur)
-  }
-
-  function abbreviateName(name: string, maxLen: number): string {
-    if (visualWidth(name) <= maxLen) return name
-    let out = ""
-    let w = 0
-    for (const c of name) {
-      const cw = visualWidth(c)
-      if (w + cw > maxLen - 1) break
-      out += c
-      w += cw
-    }
-    return out + "…"
-  }
-
-  // visual-cache 风格：左标签 + 自动填充 + 右值
-  // 直接读取 boxEl 实时宽度（避免 panelWidth 信号滞后）
-  function justify(label: string, value: string): string {
-    const outer = boxEl && typeof boxEl.width === "number" && boxEl.width > 0 ? boxEl.width : panelWidth()
-    const gauge = Math.max(10, outer - 4)
-    const used = visualWidth(label) + visualWidth(value)
-    const gap = Math.max(1, gauge - used)
-    return label + " ".repeat(gap) + value
-  }
-
-  function renderLimitRow(m: ModelPrice) {
-    const name = abbreviateName(m.name, 18)
-    const req = `${formatCount(m.limits.fiveHour)}/${formatCount(m.limits.weekly)}/${formatCount(m.limits.monthly)}`
-    return (
-      <text>
-        <span style={{ fg: colors().text }}>{justify(name, req)}</span>
-      </text>
-    )
-  }
-
-  const [pal, setPal] = createSignal<Record<string, string>>({ ...FALLBACK })
-  createEffect(() => {
-    const th = props.theme as any
-    const p: Record<string, string> = { ...FALLBACK }
-    for (const k of Object.keys(FALLBACK)) {
-      const h = hex(th?.[k])
-      if (h) p[k] = h
-    }
-    setPal(p)
-  })
-  const colors = () => pal()
-
-  const sep = () => {
-    const outer = boxEl && typeof boxEl.width === "number" && boxEl.width > 0 ? boxEl.width : panelWidth()
-    return "\u2500".repeat(Math.max(1, outer - 4))
-  }
-
-  setTimeout(() => {
-    const store = loadPricingStore()
-    if (store.current.models.length > 0) {
-      setSharedPricing(store.current)
-      setPricingStore(store)
-    }
-    refreshPricing()
-    setInterval(() => refreshPricing(), loadConfig().pricingIntervalMs)
-  }, 2000)
-
-  return (
-    <box
-      border
-      borderColor={colors().border}
-      paddingLeft={1}
-      paddingRight={1}
-      flexDirection="column"
-      gap={0}
-      ref={boxEl}
-      onSizeChange={() => {
-        if (resizeTimeout) clearTimeout(resizeTimeout)
-        resizeTimeout = setTimeout(() => {
-            const w = boxEl ? Math.max(20, boxEl.width ?? 24) : 24
-            setPanelWidth(w)
-          }, 100)
-        }}
-      >
-      <text onMouseUp={() => setOpen(o => !o)}>
-        <span style={{ fg: colors().muted }}>{open() ? "\u25bc " : "\u25b6 "}</span>
-        <span style={{ fg: colors().primary }}><b>{t("priceTitle")}</b></span>
-        <Show when={sharedPricing()}>
-          <span style={{ fg: colors().muted }}> ({sharedPricing()!.models.length})</span>
-        </Show>
-        <span style={{ fg: colors().muted }}>{sep().slice(visualWidth((open() ? "\u25bc " : "\u25b6 ") + t("priceTitle") + (sharedPricing() ? ` (${sharedPricing()!.models.length})` : "")))}</span>
-      </text>
-
-      <Show when={open()}>
-        <text fg={colors().muted}>
-          {justify(t("priceModelCol"), t("priceReqs"))}
-        </text>
-        <text fg={colors().muted}>{sep()}</text>
-
-        <Show when={priceLoading() || !sharedPricing()} fallback={
-          <Show when={sharedPricing()} fallback={
-            <text fg={colors().muted}>{t("priceLoading")}</text>
-          }>
-            {sharedPricing()!.models.filter((m) => {
-              return cfg().focusModels.length === 0 || cfg().focusModels.includes(m.id)
-            }).map((m) => renderLimitRow(m))}
-            <text fg={colors().muted}>
-              {justify(t("priceUpdated"), new Date(sharedPricing()!.fetchTime).toLocaleTimeString())}
-            </text>
-            <Show when={pricingStore() && pricingStore()!.history.length > 0}>
-              <text fg={colors().warning}>
-                {t("priceChangesSummary", {
-                  t: pricingStore()!.history[0].summary.total,
-                  a: pricingStore()!.history[0].summary.added,
-                  r: pricingStore()!.history[0].summary.removed,
-                  p: pricingStore()!.history[0].summary.priceChanges,
-                  l: pricingStore()!.history[0].summary.limitChanges,
-                })}
-              </text>
-            </Show>
-          </Show>
-        }>
-          <text fg={colors().muted}>{t("priceLoading")}</text>
-        </Show>
-      </Show>
-    </box>
-  )
-}
-
-
-function createSidebarSlot(api: TuiPluginApi): TuiSlotPlugin {
-  return {
-    order: 60,
-    slots: {
-      sidebar_content(ctx: TuiSlotContext, _input: { session_id: string }): JSX.Element {
-        return <GoUsagePanel theme={ctx.theme.current} api={api} />
-      },
-    },
-  }
-}
-
-function createPricingSlot(api: TuiPluginApi): TuiSlotPlugin {
-  return {
-    order: 61,
-    slots: {
-      sidebar_content(ctx: TuiSlotContext, _input: { session_id: string }): JSX.Element {
-        return <PricePanel theme={ctx.theme.current} api={api} />
-      },
-    },
-  }
-}
-
-function runConfigDialog(api: TuiPluginApi, dialog: any): void {
-  dialog?.replace(() => (
-    <api.ui.DialogPrompt
-      title={t("wsPromptTitle")}
-      description={() => (
-        <text>{t("wsPromptDesc")}</text>
-      )}
-      placeholder={t("wsPlaceholder")}
-      onConfirm={(value) => {
-        const wsId = value.trim()
-        if (!wsId) { dialog?.clear(); return }
-        saveConfig({ workspace_id: wsId })
-        dialog?.replace(() => (
-          <api.ui.DialogPrompt
-            title={t("cookiePromptTitle")}
-            description={() => (
-              <text>{t("cookiePromptDesc")}</text>
-            )}
-            placeholder={t("cookiePlaceholder")}
-            onConfirm={(val) => {
-              const cookie = val.trim()
-              if (!cookie) { dialog?.clear(); return }
-              saveConfig({ cookie })
-              setConfigTick((v) => v + 1)
-              api.ui.toast({ variant: "success", message: t("configSaved") })
-              dialog?.clear()
-            }}
-            onCancel={() => dialog?.clear()}
-          />
-        ))
-      }}
-      onCancel={() => dialog?.clear()}
-    />
-  ))
-}
-
-function runLangDialog(api: TuiPluginApi, dialog: any): void {
-  dialog?.replace(() => (
-    <api.ui.DialogSelect
-      title={t("langTitle")}
-      options={LANG_META.map((m) => ({
-        title: `${m.label}${langCode() === m.code ? " \u2713" : ""}`,
-        value: m.code,
-      }))}
-      onSelect={(opt) => {
-        const code = opt.value as LangCode
-        setLangCode(code)
-        kvTrySet(api, `${KV_PREFIX}.lang`, code)
-        api.ui.toast({ message: code === "zh" ? t("langSwitchedZh") : t("langSwitchedEn") })
-        // 语言选择后：若无配置则继续引导配置账号
-        const cfg = loadConfig()
-        if (!cfg.workspaceId || !cfg.authCookie) {
-          runConfigDialog(api, dialog)
-        } else {
-          dialog?.clear()
-        }
-      }}
-      onCancel={() => dialog?.clear()}
-    />
-  ))
-}
-
-function runSettingsDialog(api: TuiPluginApi, dialog: any): void {
-  let lastSelected: string | undefined
-  const renderSettingsDialog = (dialog2: any) => {
-    const cfg = loadConfig()
-    const options = [
-      {
-        title: `${t("settingsFocus")} (${cfg.focusModels.length} 个)`,
-        value: "focus-models",
-      },
-      {
-        title: `${t("settingsRefreshUsage")} (${Math.round(cfg.refreshIntervalMs / 1000)}s)`,
-        value: "refresh-usage",
-      },
-      {
-        title: `${t("settingsRefreshPricing")} (${Math.round(cfg.pricingIntervalMs / 1000)}s)`,
-        value: "refresh-pricing",
-      },
-    ]
-    dialog2?.replace(() => (
-      <api.ui.DialogSelect
-        title={t("settingsTitle")}
-        options={options}
-        onSelect={(opt) => {
-          const value = opt.value
-          if (value === "focus-models") {
-            const renderFocusDialog = (dialog3: any) => {
-              const cur = loadConfig().focusModels
-              const allModels = sharedPricing()?.models ?? []
-              const modelOptions = allModels.map((m) => ({
-                title: `${cur.includes(m.id) ? "\u2611" : "\u2610"} ${m.name} (${m.pricing.input ?? "-"}/${m.pricing.output ?? "-"})`,
-                value: m.id,
-              }))
-              const focusOptions = [
-                ...modelOptions,
-                { title: `${t("focusAll")} (${cur.length} 个已选)`, value: "select-all" },
-                { title: t("focusNone"), value: "clear-all" },
-                { title: `${t("focusDone")} (${t("focusSelected", { n: cur.length })})`, value: "done" },
-              ]
-              dialog3?.replace(() => (
-                <api.ui.DialogSelect
-                  title={t("settingsFocus")}
-                  options={focusOptions}
-                  current={lastSelected}
-                  onSelect={(opt2) => {
-                    const v2 = opt2.value
-                    if (v2 === "done") {
-                      dialog3?.clear()
-                      renderSettingsDialog(dialog2)
-                    } else if (v2 === "select-all") {
-                      const all = allModels.map((m) => m.id)
-                      saveConfig({ focus_models: all })
-                      setConfigTick((v) => v + 1)
-                      api.ui.toast({ variant: "success", message: t("settingsSaved") })
-                      renderFocusDialog(dialog3)
-                    } else if (v2 === "clear-all") {
-                      saveConfig({ focus_models: [] })
-                      setConfigTick((v) => v + 1)
-                      api.ui.toast({ variant: "success", message: t("settingsSaved") })
-                      renderFocusDialog(dialog3)
-                    } else {
-                      const next = cur.includes(v2) ? cur.filter((id) => id !== v2) : [...cur, v2]
-                      saveConfig({ focus_models: next })
-                      setConfigTick((v) => v + 1)
-                      lastSelected = v2
-                      renderFocusDialog(dialog3)
-                    }
-                  }}
-                  onCancel={() => dialog3?.clear()}
-                />
-              ))
-            }
-            renderFocusDialog(dialog2)
-          } else if (value === "refresh-usage") {
-            dialog2?.replace(() => (
-              <api.ui.DialogPrompt
-                title={t("settingsRefreshUsage")}
-                description={() => <text>{"输入秒数（默认 60）"}</text>}
-                placeholder="60"
-                onConfirm={(val) => {
-                  const sec = Number(val.trim())
-                  if (!sec || sec <= 0) { dialog2?.clear(); return }
-                  saveConfig({ refresh_interval_sec: sec })
-                  setConfigTick((v) => v + 1)
-                  api.ui.toast({ variant: "success", message: t("settingsSaved") })
-                  renderSettingsDialog(dialog2)
-                }}
-                onCancel={() => dialog2?.clear()}
-              />
-            ))
-          } else if (value === "refresh-pricing") {
-            dialog2?.replace(() => (
-              <api.ui.DialogPrompt
-                title={t("settingsRefreshPricing")}
-                description={() => <text>{"输入秒数（默认 1800）"}</text>}
-                placeholder="1800"
-                onConfirm={(val) => {
-                  const sec = Number(val.trim())
-                  if (!sec || sec <= 0) { dialog2?.clear(); return }
-                  saveConfig({ pricing_interval_sec: sec })
-                  setConfigTick((v) => v + 1)
-                  api.ui.toast({ variant: "success", message: t("settingsSaved") })
-                  renderSettingsDialog(dialog2)
-                }}
-                onCancel={() => dialog2?.clear()}
-              />
-            ))
-          }
-        }}
-        onCancel={() => dialog2?.clear()}
-      />
-    ))
-  }
-  renderSettingsDialog(dialog)
-}
-
-const tui: TuiPlugin = async (api: TuiPluginApi) => {
-  api.slots.register(createSidebarSlot(api))
-  api.slots.register(createPricingSlot(api))
-
-  // 恢复已保存的语言；若无则按系统检测
-  const savedLang = kvTryGet(api, `${KV_PREFIX}.lang`) as LangCode | undefined
-  if (savedLang === "zh" || savedLang === "en") setLangCode(savedLang)
-  else setLangCode(detectLang())
-
-  // 首次启动引导：已引导过则跳过（用 kv 标记）
-  const onboarded = kvTryGet(api, `${KV_PREFIX}.onboarded`)
-  if (!onboarded) {
-    kvTrySet(api, `${KV_PREFIX}.onboarded`, "1")
-    setTimeout(() => {
-      // 通过 trigger 触发语言选择命令，命令 onSelect 会拿到 dialog 栈并弹窗
-      try { api.command.trigger("go-usage.lang") } catch { /* 命令未就绪时忽略 */ }
-    }, 1500)
-  }
-
-  api.command?.register(() => [
-    {
-      title: t("cmdTitle"),
-      value: "go-usage.config",
-      description: t("cmdDesc"),
-      slash: { name: "go-config" },
-      onSelect: (dialog) => runConfigDialog(api, dialog),
-    },
-    {
-      title: t("langCmdTitle"),
-      value: "go-usage.lang",
-      description: t("langCmdDesc"),
-      slash: { name: "go-lang" },
-      onSelect: (dialog) => runLangDialog(api, dialog),
-    },
-    {
-      title: t("settingsTitle"),
-      value: "go-usage.settings",
-      description: t("settingsDesc"),
-      slash: { name: "go-settings" },
-      onSelect: (dialog) => runSettingsDialog(api, dialog),
-    },
-  ])
-}
-
-const mod: TuiPluginModule & { id: string } = {
-  id: "opencode-go-usage-tui",
-  tui,
-}
-
+/** @jsxImportSource @opentui/solid */
+
+import type {
+  TuiPlugin,
+  TuiPluginApi,
+  TuiSlotContext,
+  TuiSlotPlugin,
+  TuiPluginModule,
+  TuiThemeCurrent,
+} from "@opencode-ai/plugin/tui"
+import { createSignal, createEffect, onMount, onCleanup, Show } from "solid-js"
+import type { JSX } from "@opentui/solid"
+import { readFileSync, writeFileSync, mkdirSync, renameSync, existsSync } from "node:fs"
+import { join, dirname } from "node:path"
+import { createCipheriv, createDecipheriv, randomBytes } from "node:crypto"
+import { createT, detectLang, LANG_META } from "./i18n"
+import type { LangCode } from "./i18n"
+import { fetchPricing, comparePricing, loadPricingStore, updatePricingStore } from "./pricing"
+import type { ModelPrice, PricingData, PricingStore } from "./pricing"
+
+declare const process: { env: Record<string, string | undefined> } | undefined
+
+const VERSION: string = __PLUGIN_VERSION__
+const CHECK_INTERVAL = Number(process?.env?.OPENCODE_GO_CHECK_INTERVAL ?? 60000)
+const WARN_THRESHOLD = Number(process?.env?.OPENCODE_GO_WARN_THRESHOLD ?? 0.8)
+const CONFIG_DIR = process?.env?.OPENCODE_CONFIG_DIR
+  || (process?.env?.USERPROFILE ? `${process.env.USERPROFILE}\\.config\\opencode` : "")
+  || process?.env?.HOME + "/.config/opencode"
+const CONFIG_FILE = join(CONFIG_DIR, "go-usage-config.json")
+const COOKIE_ENC_FILE = join(CONFIG_DIR, "go-auth-cookie.enc")
+const KEY_FILE = join(CONFIG_DIR, ".encryption-key")
+const COOKIE_PLAIN_FILE = `${CONFIG_DIR}\\go-auth-cookie.txt`
+const KV_PREFIX = "go-usage"
+
+// ── AES-256-GCM 加密存储 ────────────────────────────────
+// cookie 以密文存 go-auth-cookie.enc，密钥存 .encryption-key。
+// 注意：Windows 无 Unix 权限位，mode 0o600 仅对 macOS/Linux 生效；
+// Windows 上密钥与密文同目录，防护重点是"被动泄露"（备份/云同步/日志），
+// 无法抵御能读取该目录的本地恶意程序。
+function loadEncryptionKey(): Buffer {
+  try {
+    const hex = readFileSync(KEY_FILE, "utf8").trim()
+    if (hex) return Buffer.from(hex, "hex")
+  } catch { /* 无密钥则新建 */ }
+  const key = randomBytes(32)
+  mkdirSync(dirname(KEY_FILE), { recursive: true })
+  writeFileSync(KEY_FILE, key.toString("hex"), { encoding: "utf8", mode: 0o600 })
+  return key
+}
+
+function encryptText(text: string): string {
+  const key = loadEncryptionKey()
+  const iv = randomBytes(16)
+  const cipher = createCipheriv("aes-256-gcm", key, iv)
+  const data = cipher.update(text, "utf8", "hex") + cipher.final("hex")
+  return JSON.stringify({ v: 1, iv: iv.toString("hex"), data, tag: cipher.getAuthTag().toString("hex") })
+}
+
+function decryptText(encJson: string): string {
+  const { iv, data, tag } = JSON.parse(encJson)
+  const key = loadEncryptionKey()
+  const decipher = createDecipheriv("aes-256-gcm", key, Buffer.from(iv, "hex"))
+  decipher.setAuthTag(Buffer.from(tag, "hex"))
+  return decipher.update(data, "hex", "utf8") + decipher.final("utf8")
+}
+
+function readJsonFile<T>(file: string): T | null {
+  try { return JSON.parse(readFileSync(file, "utf8")) as T } catch { return null }
+}
+
+interface ConfigFile { workspace_id?: string; cookie?: string; auth_cookie?: string; cookie_file?: string; ui?: { usage_panel?: boolean; price_panel?: boolean }; focus_models?: string[]; refresh_interval_sec?: number; pricing_interval_sec?: number }
+
+interface LoadedConfig { workspaceId: string; authCookie: string; usagePanel: boolean; pricePanel: boolean; focusModels: string[]; refreshIntervalMs: number; pricingIntervalMs: number }
+
+function loadConfig(): LoadedConfig {
+  const env = process?.env ?? {}
+  const fileCfg = readJsonFile<ConfigFile>(CONFIG_FILE) ?? {}
+
+  // 1. 环境变量优先
+  if (env.OPENCODE_GO_AUTH_COOKIE) {
+    return {
+      workspaceId: env.OPENCODE_GO_WORKSPACE_ID || fileCfg.workspace_id || "", authCookie: env.OPENCODE_GO_AUTH_COOKIE,
+      usagePanel: fileCfg.ui?.usage_panel ?? true, pricePanel: fileCfg.ui?.price_panel ?? true,
+      focusModels: fileCfg.focus_models ?? [], refreshIntervalMs: (fileCfg.refresh_interval_sec ?? Math.round(CHECK_INTERVAL / 1000)) * 1000,
+      pricingIntervalMs: (fileCfg.pricing_interval_sec ?? Math.round((CHECK_INTERVAL / 1000) * 30)) * 1000,
+    }
+  }
+
+  // 2. 加密存储
+  try {
+    if (existsSync(COOKIE_ENC_FILE)) {
+      const cookie = decryptText(readFileSync(COOKIE_ENC_FILE, "utf8"))
+      if (cookie) {
+        return {
+          workspaceId: env.OPENCODE_GO_WORKSPACE_ID || fileCfg.workspace_id || "", authCookie: cookie,
+          usagePanel: fileCfg.ui?.usage_panel ?? true, pricePanel: fileCfg.ui?.price_panel ?? true,
+          focusModels: fileCfg.focus_models ?? [], refreshIntervalMs: (fileCfg.refresh_interval_sec ?? Math.round(CHECK_INTERVAL / 1000)) * 1000,
+          pricingIntervalMs: (fileCfg.pricing_interval_sec ?? Math.round((CHECK_INTERVAL / 1000) * 30)) * 1000,
+        }
+      }
+    }
+  } catch { /* 密文损坏时回退到明文迁移 */ }
+
+  // 3. 兼容旧明文（config.json 内嵌 cookie / auth_cookie / 独立 txt 文件）——自动迁移
+  const legacyCookie = fileCfg.auth_cookie || fileCfg.cookie || (() => {
+    try { return readFileSync(COOKIE_PLAIN_FILE, "utf8").trim() } catch { return "" }
+  })()
+  if (legacyCookie) {
+    const enc = encryptText(legacyCookie)
+    mkdirSync(CONFIG_DIR, { recursive: true })
+    writeFileSync(COOKIE_ENC_FILE, enc, "utf8")
+    // 清理旧明文
+    const cleanCfg: ConfigFile = { ...fileCfg }
+    delete cleanCfg.cookie
+    delete cleanCfg.auth_cookie
+    try { writeFileSync(CONFIG_FILE, JSON.stringify(cleanCfg, null, 2), "utf8") } catch { /* 忽略 */ }
+    try { if (existsSync(COOKIE_PLAIN_FILE)) renameSync(COOKIE_PLAIN_FILE, COOKIE_PLAIN_FILE + ".bak") } catch { /* 忽略 */ }
+    return {
+      workspaceId: env.OPENCODE_GO_WORKSPACE_ID || fileCfg.workspace_id || "", authCookie: legacyCookie,
+      usagePanel: fileCfg.ui?.usage_panel ?? true, pricePanel: fileCfg.ui?.price_panel ?? true,
+      focusModels: fileCfg.focus_models ?? [], refreshIntervalMs: (fileCfg.refresh_interval_sec ?? Math.round(CHECK_INTERVAL / 1000)) * 1000,
+      pricingIntervalMs: (fileCfg.pricing_interval_sec ?? Math.round((CHECK_INTERVAL / 1000) * 30)) * 1000,
+    }
+  }
+
+  return {
+    workspaceId: env.OPENCODE_GO_WORKSPACE_ID || fileCfg.workspace_id || "", authCookie: "",
+    usagePanel: fileCfg.ui?.usage_panel ?? true, pricePanel: fileCfg.ui?.price_panel ?? true,
+    focusModels: fileCfg.focus_models ?? [], refreshIntervalMs: (fileCfg.refresh_interval_sec ?? Math.round(CHECK_INTERVAL / 1000)) * 1000,
+    pricingIntervalMs: (fileCfg.pricing_interval_sec ?? Math.round((CHECK_INTERVAL / 1000) * 30)) * 1000,
+  }
+}
+
+function saveConfig(patch: { workspace_id?: string; cookie?: string; ui?: { usage_panel?: boolean; price_panel?: boolean }; focus_models?: string[]; refresh_interval_sec?: number; pricing_interval_sec?: number }): void {
+  const fileCfg = readJsonFile<ConfigFile>(CONFIG_FILE) ?? {}
+  if (patch.workspace_id !== undefined) fileCfg.workspace_id = patch.workspace_id
+  if (patch.cookie !== undefined) {
+    // cookie 改为加密存储，不再写明文到 config.json
+    if (patch.cookie) {
+      mkdirSync(CONFIG_DIR, { recursive: true })
+      writeFileSync(COOKIE_ENC_FILE, encryptText(patch.cookie), "utf8")
+      delete fileCfg.cookie
+      delete fileCfg.auth_cookie
+      // 清理可能存在的旧明文 txt
+      try { if (existsSync(COOKIE_PLAIN_FILE)) renameSync(COOKIE_PLAIN_FILE, COOKIE_PLAIN_FILE + ".bak") } catch { /* 忽略 */ }
+    } else {
+      try { if (existsSync(COOKIE_ENC_FILE)) renameSync(COOKIE_ENC_FILE, COOKIE_ENC_FILE + ".bak") } catch { /* 忽略 */ }
+    }
+  }
+  if (patch.ui !== undefined) {
+    fileCfg.ui = { ...(fileCfg.ui ?? {}), ...patch.ui }
+  }
+  if (patch.focus_models !== undefined) fileCfg.focus_models = patch.focus_models
+  if (patch.refresh_interval_sec !== undefined) fileCfg.refresh_interval_sec = patch.refresh_interval_sec
+  if (patch.pricing_interval_sec !== undefined) fileCfg.pricing_interval_sec = patch.pricing_interval_sec
+  try {
+    mkdirSync(dirname(CONFIG_FILE), { recursive: true })
+    writeFileSync(CONFIG_FILE, JSON.stringify(fileCfg, null, 2), "utf8")
+  } catch { /* 写入失败忽略 */ }
+}
+
+// 模块级共享信号：/go-config 保存配置后递增，面板监听它立即刷新
+const [configTick, setConfigTick] = createSignal(0)
+
+// 模块级共享语言信号：/go-lang 或首次引导切换后，面板和命令实时响应
+const [langCode, setLangCode] = createSignal<LangCode>(detectLang())
+const t = createT(() => langCode())
+
+// 模块级共享价格数据：PricePanel 抓取后写入，/go-settings 设置关注模型时读取
+const [sharedPricing, setSharedPricing] = createSignal<PricingData | null>(null)
+
+function kvTryGet(api: TuiPluginApi, key: string): string | undefined {
+  try { return api.kv.get<string>(key) } catch { return undefined }
+}
+function kvTrySet(api: TuiPluginApi, key: string, val: unknown): void {
+  try { api.kv.set(key, val) } catch { /* 忽略 */ }
+}
+
+interface Usage {
+  rollingUsage: { usagePercent: number; resetInSec: number }
+  weeklyUsage: { usagePercent: number; resetInSec: number }
+  monthlyUsage: { usagePercent: number; resetInSec: number }
+  error?: string
+}
+
+const REQUEST_TIMEOUT = 10000
+
+async function fetchUsage(workspaceId: string, authCookie: string, signal?: AbortSignal): Promise<Usage | null> {
+  if (!workspaceId || !authCookie) return { error: "not_configured" } as Usage
+  try {
+    const res = await fetch("https://opencode.ai/_server", {
+      method: "POST",
+      headers: {
+        "content-type": "application/json",
+        "x-server-id": "c7389bd0e731f80f49593e5ee53835475f4e28594dd6bd83eb229bab753498cd",
+        "x-server-instance": "go-usage-tui",
+        "cookie": `auth=${authCookie}`,
+        "user-agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64)",
+      },
+      body: JSON.stringify({
+        t: { t: 9, i: 0, l: 1, a: [{ t: 1, s: workspaceId }], o: 0 },
+        f: 31,
+        m: [],
+      }),
+      signal,
+    })
+    if (!res.ok) {
+      if (res.status === 302) return { error: "cookie_expired" } as Usage
+      return null
+    }
+    const text = await res.text()
+    if (text.includes("/auth/authorize") || text.includes("location")) {
+      return { error: "cookie_expired" } as Usage
+    }
+    const extract = (key: string): { resetInSec: number; usagePercent: number } | null => {
+      const m = text.match(new RegExp(`${key}:[^}]*?\\{status:"[^"]*",resetInSec:(\\d+),usagePercent:(\\d+)\\}`))
+      if (!m) return null
+      return { resetInSec: Number(m[1]), usagePercent: Number(m[2]) }
+    }
+    const rollingUsage = extract("rollingUsage")
+    const weeklyUsage = extract("weeklyUsage")
+    const monthlyUsage = extract("monthlyUsage")
+    if (!rollingUsage || !weeklyUsage || !monthlyUsage) return null
+    return { rollingUsage, weeklyUsage, monthlyUsage }
+  } catch {
+    return null
+  }
+}
+
+function formatReset(sec: number): string {
+  if (sec <= 0) return t("resetDone")
+  const d = Math.floor(sec / 86400)
+  const h = Math.floor((sec % 86400) / 3600)
+  const m = Math.floor((sec % 3600) / 60)
+  if (d > 0) return t("dayHour", { d, h })
+  if (h > 0) return t("hourMin", { h, m })
+  return t("minute", { m })
+}
+
+function progressBar(percent: number, width: number): string {
+  const clamped = Math.max(0, Math.min(100, percent))
+  const filled = Math.round((clamped / 100) * width)
+  const empty = Math.max(0, width - filled)
+  return "\u2588".repeat(filled) + "\u2591".repeat(empty)
+}
+
+function visualWidth(s: string): number {
+  let w = 0
+  for (const c of s) {
+    const code = c.codePointAt(0) ?? 0
+    w += (code >= 0x1100 && code <= 0x115F) ||
+         (code >= 0x2E80 && code <= 0xA4CF) ||
+         (code >= 0xAC00 && code <= 0xD7A3) ||
+         (code >= 0xF900 && code <= 0xFAFF) ||
+         (code >= 0xFF01 && code <= 0xFF60) ||
+         (code >= 0xFFE0 && code <= 0xFFE6) ? 2 : 1
+  }
+  return w
+}
+
+const FALLBACK = {
+  primary: "#8B9DAF",
+  text: "#C5C5BB",
+  muted: "#7A7A72",
+  success: "#9CAF8B",
+  warning: "#C5B88D",
+  error: "#B08A8A",
+  border: "#6B6B63",
+} as const
+
+function hex(raw: any): string {
+  if (typeof raw === "string" && raw.startsWith("#") && raw.length >= 7) return raw
+  if (raw && typeof raw === "object" && typeof raw.r === "number") {
+    const r = Math.round(raw.r * 255), g = Math.round(raw.g * 255), b = Math.round(raw.b * 255)
+    return "#" + [r, g, b].map(v => v.toString(16).padStart(2, "0")).join("")
+  }
+  return ""
+}
+
+function GoUsagePanel(props: { theme: TuiThemeCurrent; api: TuiPluginApi }): JSX.Element {
+  const [usage, setUsage] = createSignal<Usage | null>(null)
+  const [open, setOpen] = createSignal(true)
+  const [error, setError] = createSignal("")
+  const [configured, setConfigured] = createSignal(true)
+  const [lastUpdated, setLastUpdated] = createSignal("")
+  const [panelWidth, setPanelWidth] = createSignal(24)
+  const [cfg, setCfg] = createSignal<LoadedConfig>(loadConfig())
+  createEffect(() => { void configTick(); setCfg(loadConfig()) })
+  let boxEl: any
+  let abortController: AbortController | null = null
+  let timeoutId: ReturnType<typeof setTimeout> | null = null
+  let isRefreshing = false
+  let resizeTimeout: ReturnType<typeof setTimeout> | null = null
+
+  function cleanupPendingRequest() {
+    if (timeoutId) { clearTimeout(timeoutId); timeoutId = null }
+    if (abortController) { abortController.abort(); abortController = null }
+  }
+
+  async function refresh() {
+    if (isRefreshing) return
+    const cfg = loadConfig()
+    if (!cfg.workspaceId || !cfg.authCookie) {
+      setConfigured(false)
+      setUsage(null)
+      setError("")
+      return
+    }
+    setConfigured(true)
+    cleanupPendingRequest()
+    abortController = new AbortController()
+    const signal = abortController.signal
+    timeoutId = setTimeout(() => abortController?.abort(), REQUEST_TIMEOUT)
+    isRefreshing = true
+    try {
+      const u = await fetchUsage(cfg.workspaceId, cfg.authCookie, signal)
+      if (signal.aborted) return
+      if (u === null) { setError(t("queryFailed")); return }
+      if (u.error === "cookie_expired") { setError(t("cookieExpired")); return }
+      if (u.error === "not_configured") { setConfigured(false); return }
+      setUsage(u)
+      setLastUpdated(new Date().toLocaleTimeString())
+      setError("")
+    } finally {
+      if (timeoutId) { clearTimeout(timeoutId); timeoutId = null }
+      isRefreshing = false
+    }
+  }
+
+  onMount(() => {
+    refresh()
+    const timer = setInterval(refresh, loadConfig().refreshIntervalMs)
+    const stopWatch = createEffect(() => {
+      void configTick()
+      refresh()
+    })
+    onCleanup(() => {
+      clearInterval(timer)
+      stopWatch()
+      cleanupPendingRequest()
+      if (resizeTimeout) { clearTimeout(resizeTimeout); resizeTimeout = null }
+    })
+  })
+
+  const [pal, setPal] = createSignal<Record<string, string>>({ ...FALLBACK })
+  createEffect(() => {
+    const th = props.theme as any
+    const p: Record<string, string> = { ...FALLBACK }
+    for (const k of Object.keys(FALLBACK)) {
+      const h = hex(th?.[k])
+      if (h) p[k] = h
+    }
+    setPal(p)
+  })
+  const colors = () => pal()
+
+  const barW = () => Math.max(4, Math.min(12, panelWidth() - 34))
+
+  const colorFor = (percent: number) => {
+    const c = colors()
+    if (percent >= WARN_THRESHOLD * 100) return c.error
+    if (percent >= 50) return c.warning
+    return c.success
+  }
+
+  const renderRow = (label: string, u: { usagePercent: number; resetInSec: number }) => {
+    const labelW = visualWidth(label)
+    const pad = Math.max(0, 9 - labelW)
+    return (
+      <text>
+        <span style={{ fg: colors().text }}>{label}</span>
+        <span>{" ".repeat(pad + 1)}</span>
+        <span style={{ fg: colorFor(u.usagePercent) }}>
+          {progressBar(u.usagePercent, barW())}
+        </span>
+        <span>{" "}</span>
+        <span style={{ fg: colorFor(u.usagePercent) }}>{u.usagePercent}%</span>
+        <span style={{ fg: colors().muted }}> {formatReset(u.resetInSec)}</span>
+      </text>
+    )
+  }
+
+  const sep = () => "\u2500".repeat(Math.max(1, panelWidth() - 4))
+
+  return (
+    <box
+      border
+      borderColor={colors().border}
+      paddingLeft={1}
+      paddingRight={1}
+      flexDirection="column"
+      gap={0}
+      ref={boxEl}
+        onSizeChange={() => {
+          if (resizeTimeout) clearTimeout(resizeTimeout)
+          resizeTimeout = setTimeout(() => {
+            const w = boxEl ? Math.max(20, boxEl.width ?? 24) : 24
+            setPanelWidth(w)
+          }, 100)
+        }}
+      >
+      <text selectable={false} onMouseUp={(e) => { e.preventDefault(); setOpen(o => !o) }}>
+          <span style={{ fg: colors().muted }}>{open() ? "\u25bc " : "\u25b6 "}</span>
+          <span style={{ fg: colors().primary }}><b>{t("panelTitle")}</b></span>
+          <span style={{ fg: colors().muted }}> v{VERSION}</span>
+          <Show when={!open() && usage()}>
+            <span style={{ fg: colorFor(usage()!.weeklyUsage.usagePercent) }}>
+              {" ".repeat(2)}{t("weeklyShort")} {usage()!.weeklyUsage.usagePercent}%
+            </span>
+          </Show>
+        </text>
+
+        <Show when={open()}>
+          <text fg={colors().muted}>{sep()}</text>
+
+          <Show when={!configured()}>
+            <text fg={colors().warning}>{t("notConfigured")}</text>
+            <text fg={colors().muted}>{t("notConfiguredHint")}</text>
+          </Show>
+
+          <Show when={configured() && error()} fallback={
+            <Show when={configured() && usage()} fallback={
+              <Show when={configured()}><text fg={colors().muted}>{t("loading")}</text></Show>
+            }>
+              {renderRow(t("rowRolling"), usage()!.rollingUsage)}
+              {renderRow(t("rowWeekly"), usage()!.weeklyUsage)}
+              {renderRow(t("rowMonthly"), usage()!.monthlyUsage)}
+              <text>
+                <span style={{ fg: colors().muted }}>{t("updatedAt")} </span>
+                <span style={{ fg: colors().muted }}>{lastUpdated()}</span>
+              </text>
+            </Show>
+          }>
+            <text fg={colors().error}>{error()}</text>
+            <text fg={colors().muted}>{t("reconfigureHint")}</text>
+          </Show>
+        </Show>
+      </box>
+    )
+  }
+
+function PricePanel(props: { theme: TuiThemeCurrent; api: TuiPluginApi }): JSX.Element {
+  const [open, setOpen] = createSignal(true)
+  const [pricingStore, setPricingStore] = createSignal<PricingStore | null>(null)
+  const [priceError, setPriceError] = createSignal("")
+  const [priceLoading, setPriceLoading] = createSignal(false)
+  const [panelWidth, setPanelWidth] = createSignal(24)
+  // 渲染强制刷新计数：列表首帧常在数据到达使面板变高的瞬时布局中测量，留下
+  // "模型间空行"；该残留不会随盒子变宽自愈，但会在一次额外重渲染（重新测量文本
+  // 高度）后消失。故列表就绪后级联触发若干次 renderTick，强制重新测量每行高度。
+  const [renderTick, setRenderTick] = createSignal(0)
+  // 列表就绪标记：sharedPricing 数据到达那帧盒子常在重布局（数据使面板内容变高），
+  // 直接渲染列表会命中"未稳定测量"。故数据到达后延迟一帧再创建列表文本
+  const [listReady, setListReady] = createSignal(false)
+  createEffect(() => {
+    const p = sharedPricing()
+    if (p && p.models.length > 0) {
+      const id = setTimeout(() => setListReady(true), 150)
+      onCleanup(() => clearTimeout(id))
+    } else {
+      setListReady(false)
+    }
+  })
+  // 列表首帧常在"数据到达使面板变高"的瞬时布局中测量，留下"模型间空行"；
+  // 该残留不会随盒子变宽自愈，但会在一次额外重渲染（重新测量文本高度）后消失
+  // —— 即用户观察到的"展开任意行后空行消失"现象。故在列表就绪后再强制若干次
+  // 重渲染，让 @opentui 在稳定布局下重新测量每行高度，自愈空行。
+  createEffect(() => {
+    if (!(listReady() && sharedPricing())) return
+    const t1 = setTimeout(() => setRenderTick((v) => v + 1), 250)
+    const t2 = setTimeout(() => setRenderTick((v) => v + 1), 600)
+    const t3 = setTimeout(() => setRenderTick((v) => v + 1), 1000)
+    onCleanup(() => { clearTimeout(t1); clearTimeout(t2); clearTimeout(t3) })
+  })
+  // 记录变化的模型：modelId -> 变化类别集合（added/pricing/limits），用于行高亮与颜色区分
+  const [changedModels, setChangedModels] = createSignal<Map<string, Set<string>>>(new Map<string, Set<string>>())
+  // 行内展开：当前展开的模型 id（单选 accordion）
+  const [expandedId, setExpandedId] = createSignal<string | null>(null)
+  const [cfg, setCfg] = createSignal<LoadedConfig>(loadConfig())
+  createEffect(() => { void configTick(); setCfg(loadConfig()) })
+  let boxEl: any
+  let priceController: AbortController | null = null
+
+  // 轮询等待布局就绪：首帧 boxEl.width 尚未测量（为 0）时文本会按临时窄宽度折行，
+// 产生"模型间空行"。单次延时可能早于布局完成而浪费唯一机会，故循环重试，
+  // 宽度就绪那一刻强制重渲染自愈（上限 50 次 × 80ms 防泄漏）
+  let widthSyncTimer: ReturnType<typeof setTimeout> | null = null
+  onMount(() => {
+    let tries = 0
+    const syncWidth = () => {
+      tries++
+      if (boxEl && typeof boxEl.width === "number" && boxEl.width > 0) {
+        setPanelWidth(Math.max(20, boxEl.width))
+        setRenderTick((v) => v + 1)
+        // 补一次延迟 tick：覆盖 onSizeChange 防抖窗口结束后的稳定态
+        widthSyncTimer = setTimeout(() => setRenderTick((v) => v + 1), 150)
+        return
+      }
+      if (tries < 50) widthSyncTimer = setTimeout(syncWidth, 80)
+    }
+    widthSyncTimer = setTimeout(syncWidth, 30)
+  })
+  onCleanup(() => { if (widthSyncTimer) clearTimeout(widthSyncTimer) })
+
+  async function refreshPricing() {
+    if (priceLoading()) return
+    setPriceLoading(true)
+    setPriceError("")
+    priceController?.abort()
+    priceController = new AbortController()
+    try {
+      const data = await fetchPricing()
+      const store = updatePricingStore(data)
+      setSharedPricing(data)
+      setPricingStore(store)
+      const prev = store.previous
+      if (prev && prev.fetchTime !== data.fetchTime) {
+        const diff = comparePricing(prev, data)
+        if (diff.hasChanges) {
+          const m = new Map<string, Set<string>>()
+          for (const c of diff.changes) {
+            if (c.type === "removed") continue
+            const cat = c.type === "added" ? "added" : c.type === "pricing" ? "pricing" : "limits"
+            if (!m.has(c.modelId)) m.set(c.modelId, new Set())
+            m.get(c.modelId)!.add(cat)
+          }
+          setChangedModels(m)
+          props.api.toast({
+            variant: "info",
+            title: t("priceChanged"),
+            message: t("priceChangesSummary", {
+              t: diff.summary.total,
+              a: diff.summary.added,
+              r: diff.summary.removed,
+              l: diff.summary.limitChanges,
+            }),
+          })
+        } else {
+          setChangedModels(new Map<string, Set<string>>())
+        }
+      } else {
+        setChangedModels(new Map<string, Set<string>>())
+      }
+    } catch {
+      setPriceError(t("priceError"))
+    } finally {
+      setPriceLoading(false)
+      priceController = null
+    }
+  }
+
+  function visualPadEnd(s: string, w: number): string {
+    const cur = visualWidth(s)
+    if (cur >= w) return s
+    return s + " ".repeat(w - cur)
+  }
+
+  function abbreviateName(name: string, maxLen: number): string {
+    if (visualWidth(name) <= maxLen) return name
+    let out = ""
+    let w = 0
+    for (const c of name) {
+      const cw = visualWidth(c)
+      if (w + cw > maxLen - 1) break
+      out += c
+      w += cw
+    }
+    return out + "…"
+  }
+
+  // visual-cache 风格：左标签 + 自动填充 + 右值
+  // 直接读取 boxEl 实时宽度（避免 panelWidth 信号滞后）
+  function justify(label: string, value: string): string {
+    void renderTick()
+    const outer = boxEl && typeof boxEl.width === "number" && boxEl.width > 0 ? boxEl.width : panelWidth()
+    const gauge = Math.max(10, outer - 4)
+    const used = visualWidth(label) + visualWidth(value)
+    const gap = Math.max(1, gauge - used)
+    return label + " ".repeat(gap) + value
+  }
+
+  function renderLimitRow(m: ModelPrice) {
+    const cats = changedModels().get(m.id)
+    const expanded = expandedId() === m.id
+    const name = abbreviateName(m.name, 18)
+    const req = m.usageLimit != null ? `$${m.usageLimit}` : "\u2014"
+    // 仅用颜色区分，不改缩进，名称始终与表头对齐
+    // 新增=绿色；价格变化=主色；限额/用量上限变化=橙色；普通行=常规色
+    const fg = cats?.has("added") ? colors().success
+      : cats?.has("pricing") ? colors().primary
+      : cats?.has("limits") ? colors().warning
+      : colors().text
+    // 行尾展开指示符（右对齐，不挤占名称列）
+    const ind = expanded ? " \u25be" : " \u25b8"
+    const row = (
+      <text fg={fg} onMouseUp={(e) => { e.preventDefault(); setExpandedId(expanded ? null : m.id) }}>
+        {justify(name, req + ind)}
+      </text>
+    )
+    if (!expanded) return row
+    return <>{row}{renderPriceDetail(m)}</>
+  }
+
+  // 行内展开的价格+元数据详情（垂直清单，字段含涨跌箭头）
+  // 多档模型按档位逐块展示；单档模型维持紧凑四行
+  function renderPriceDetail(m: ModelPrice): JSX.Element[] {
+    const prev = pricingStore()?.previous?.models.find((x) => x.id === m.id)
+    const prevVariants = prev?.variants
+    const arrow = (cur: number | null, old: number | null) => {
+      if (old == null || cur == null || old === cur) return ""
+      return cur > old ? " \u2191" : " \u2193"
+    }
+    const fmt = (cur: number | null, old: number | null) =>
+      (cur == null ? "-" : `$${cur} /MTok${arrow(cur, old)}`)
+    const pad13 = (s: string) => visualPadEnd(s, 13)
+    const lines: JSX.Element[] = []
+    const tiers = m.variants
+    const hasTiers = tiers.length > 1
+
+    if (hasTiers) {
+      tiers.forEach((v, ti) => {
+        const isLastTier = ti === tiers.length - 1
+        lines.push(<text fg={colors().muted}>{`  \u251c ${t("priceTier")}: ${v.label}`}</text>)
+        const inner = isLastTier ? " " : "\u2502"
+        const prevV = prevVariants?.find((p) => p.label === v.label) ?? prevVariants?.[ti]
+        const fields: [string, string][] = [
+          [t("priceInput"), fmt(v.pricing.input, prevV?.pricing.input)],
+          [t("priceOutput"), fmt(v.pricing.output, prevV?.pricing.output)],
+          [t("priceCacheRead"), fmt(v.pricing.cachedRead, prevV?.pricing.cachedRead)],
+          [t("priceCacheWrite"), fmt(v.pricing.cachedWrite, prevV?.pricing.cachedWrite)],
+        ]
+        for (const [fl, fv] of fields) {
+          lines.push(<text fg={colors().muted}>{pad13(`  ${inner} ${fl}:`) + fv}</text>)
+        }
+      })
+    } else {
+      const v = tiers[0]
+      const fields: [string, string][] = [
+        [t("priceInput"), fmt(v.pricing.input, prev?.pricing.input)],
+        [t("priceOutput"), fmt(v.pricing.output, prev?.pricing.output)],
+        [t("priceCacheRead"), fmt(v.pricing.cachedRead, prev?.pricing.cachedRead)],
+        [t("priceCacheWrite"), fmt(v.pricing.cachedWrite, prev?.pricing.cachedWrite)],
+      ]
+      for (const [fl, fv] of fields) {
+        lines.push(<text fg={colors().muted}>{pad13(`  \u251c ${fl}:`) + fv}</text>)
+      }
+    }
+
+    const fmtFull = (n: number) => (n > 0 ? n.toLocaleString("en-US") : "\u2014")
+    const limitFields: [string, string][] = [
+      [t("priceReq5h"), fmtFull(m.limits.fiveHour)],
+      [t("priceReqWeek"), fmtFull(m.limits.weekly)],
+      [t("priceReqMonth"), fmtFull(m.limits.monthly)],
+    ]
+    for (const [fl, fv] of limitFields) {
+      lines.push(<text fg={colors().muted}>{pad13(`  \u251c ${fl}:`) + fv}</text>)
+    }
+
+    const meta: [string, string][] = [
+      [t("priceSdk"), m.sdk || "-"],
+      [t("priceRetention"), m.retention || "-"],
+      [t("priceTraining"), m.training || "-"],
+    ]
+    meta.forEach(([ml, mv], i) => {
+      const conn = i < meta.length - 1 ? "\u251c" : "\u2514"
+      lines.push(<text fg={colors().muted}>{pad13(`  ${conn} ${ml}:`) + mv}</text>)
+    })
+    return lines
+  }
+
+  const [pal, setPal] = createSignal<Record<string, string>>({ ...FALLBACK })
+  createEffect(() => {
+    const th = props.theme as any
+    const p: Record<string, string> = { ...FALLBACK }
+    for (const k of Object.keys(FALLBACK)) {
+      const h = hex(th?.[k])
+      if (h) p[k] = h
+    }
+    setPal(p)
+  })
+  const colors = () => pal()
+
+  const sep = () => {
+    void renderTick()
+    const outer = boxEl && typeof boxEl.width === "number" && boxEl.width > 0 ? boxEl.width : panelWidth()
+    return "\u2500".repeat(Math.max(1, outer - 4))
+  }
+
+  setTimeout(() => {
+    const store = loadPricingStore()
+    if (store.current.models.length > 0) {
+      setSharedPricing(store.current)
+      setPricingStore(store)
+    }
+    refreshPricing()
+    setInterval(() => refreshPricing(), loadConfig().pricingIntervalMs)
+  }, 2000)
+
+  return (
+    <box
+      border
+      borderColor={colors().border}
+      paddingLeft={1}
+      paddingRight={1}
+      flexDirection="column"
+      gap={0}
+      ref={boxEl}
+      onSizeChange={() => {
+        if (resizeTimeout) clearTimeout(resizeTimeout)
+        resizeTimeout = setTimeout(() => {
+            const w = boxEl ? Math.max(20, boxEl.width ?? 24) : 24
+            setPanelWidth(w)
+            setRenderTick((v) => v + 1)
+          }, 100)
+        }}
+      >
+      <text onMouseUp={() => setOpen(o => !o)}>
+        <span style={{ fg: colors().muted }}>{open() ? "\u25bc " : "\u25b6 "}</span>
+        <span style={{ fg: colors().primary }}><b>{t("priceTitle")}</b></span>
+        <Show when={sharedPricing()}>
+          <span style={{ fg: colors().muted }}> ({sharedPricing()!.models.length})</span>
+        </Show>
+        <span style={{ fg: colors().muted }}>{sep().slice(visualWidth((open() ? "\u25bc " : "\u25b6 ") + t("priceTitle") + (sharedPricing() ? ` (${sharedPricing()!.models.length})` : "")))}</span>
+      </text>
+
+      <Show when={open()}>
+        <text fg={colors().muted}>
+          {justify(t("priceModelCol"), t("priceReqs"))}
+        </text>
+        <text fg={colors().muted}>{sep()}</text>
+
+        <Show when={priceLoading() || !sharedPricing()} fallback={
+          <Show when={sharedPricing()} fallback={
+            <text fg={colors().muted}>{t("priceLoading")}</text>
+          }>
+            {listReady() ? sharedPricing()!.models.filter((m) => {
+              return cfg().focusModels.length === 0 || cfg().focusModels.includes(m.id)
+            }).map((m) => renderLimitRow(m)) : null}
+            <text fg={colors().muted}>
+              {justify(t("priceUpdated"), new Date(sharedPricing()!.fetchTime).toLocaleTimeString())}
+            </text>
+            <Show when={pricingStore() && pricingStore()!.history.length > 0}>
+              <text fg={colors().warning}>
+                {t("priceChangesSummary", {
+                  t: pricingStore()!.history[0].summary.total,
+                  a: pricingStore()!.history[0].summary.added,
+                  r: pricingStore()!.history[0].summary.removed,
+                  l: pricingStore()!.history[0].summary.limitChanges,
+                })}
+              </text>
+            </Show>
+            <Show when={changedModels().size > 0}>
+              <text fg={colors().muted}>{"绿=新增 蓝=价格 橙=限额·点击展开"}</text>
+            </Show>
+            <Show when={pricingStore() && pricingStore()!.history.length > 0 && pricingStore()!.history[0].summary.total > 0}>
+              <text fg={colors().muted}>
+                {`${t("changelogTitle")} (${new Date(pricingStore()!.history[0].fetchTime).toLocaleTimeString()})`}
+              </text>
+              {pricingStore()!.history[0].changes.slice(0, 12).map((c) => {
+                const label = c.type === "added" ? t("typeAdded")
+                  : c.type === "removed" ? t("typeRemoved")
+                  : c.type === "pricing" ? t("typePricing")
+                  : t("typeLimits")
+                const fg = c.type === "added" ? colors().success
+                  : c.type === "removed" ? colors().error
+                  : c.type === "pricing" ? colors().primary
+                  : colors().warning
+                return <text fg={fg}>{`  ${label} ${abbreviateName(c.modelName, 20)}`}</text>
+              })}
+            </Show>
+          </Show>
+        }>
+          <text fg={colors().muted}>{t("priceLoading")}</text>
+        </Show>
+      </Show>
+    </box>
+  )
+}
+
+
+function createSidebarSlot(api: TuiPluginApi): TuiSlotPlugin {
+  return {
+    order: 60,
+    slots: {
+      sidebar_content(ctx: TuiSlotContext, _input: { session_id: string }): JSX.Element {
+        return <GoUsagePanel theme={ctx.theme.current} api={api} />
+      },
+    },
+  }
+}
+
+function createPricingSlot(api: TuiPluginApi): TuiSlotPlugin {
+  return {
+    order: 61,
+    slots: {
+      sidebar_content(ctx: TuiSlotContext, _input: { session_id: string }): JSX.Element {
+        return <PricePanel theme={ctx.theme.current} api={api} />
+      },
+    },
+  }
+}
+
+function runConfigDialog(api: TuiPluginApi, dialog: any): void {
+  dialog?.replace(() => (
+    <api.ui.DialogPrompt
+      title={t("wsPromptTitle")}
+      description={() => (
+        <text>{t("wsPromptDesc")}</text>
+      )}
+      placeholder={t("wsPlaceholder")}
+      onConfirm={(value) => {
+        const wsId = value.trim()
+        if (!wsId) { dialog?.clear(); return }
+        saveConfig({ workspace_id: wsId })
+        dialog?.replace(() => (
+          <api.ui.DialogPrompt
+            title={t("cookiePromptTitle")}
+            description={() => (
+              <text>{t("cookiePromptDesc")}</text>
+            )}
+            placeholder={t("cookiePlaceholder")}
+            onConfirm={(val) => {
+              const cookie = val.trim()
+              if (!cookie) { dialog?.clear(); return }
+              saveConfig({ cookie })
+              setConfigTick((v) => v + 1)
+              api.ui.toast({ variant: "success", message: t("configSaved") })
+              dialog?.clear()
+            }}
+            onCancel={() => dialog?.clear()}
+          />
+        ))
+      }}
+      onCancel={() => dialog?.clear()}
+    />
+  ))
+}
+
+function runLangDialog(api: TuiPluginApi, dialog: any): void {
+  dialog?.replace(() => (
+    <api.ui.DialogSelect
+      title={t("langTitle")}
+      options={LANG_META.map((m) => ({
+        title: `${m.label}${langCode() === m.code ? " \u2713" : ""}`,
+        value: m.code,
+      }))}
+      onSelect={(opt) => {
+        const code = opt.value as LangCode
+        setLangCode(code)
+        kvTrySet(api, `${KV_PREFIX}.lang`, code)
+        api.ui.toast({ message: code === "zh" ? t("langSwitchedZh") : t("langSwitchedEn") })
+        // 语言选择后：若无配置则继续引导配置账号
+        const cfg = loadConfig()
+        if (!cfg.workspaceId || !cfg.authCookie) {
+          runConfigDialog(api, dialog)
+        } else {
+          dialog?.clear()
+        }
+      }}
+      onCancel={() => dialog?.clear()}
+    />
+  ))
+}
+
+function runSettingsDialog(api: TuiPluginApi, dialog: any): void {
+  let lastSelected: string | undefined
+  const renderSettingsDialog = (dialog2: any) => {
+    const cfg = loadConfig()
+    const options = [
+      {
+        title: `${t("settingsFocus")} (${cfg.focusModels.length} 个)`,
+        value: "focus-models",
+      },
+      {
+        title: `${t("settingsRefreshUsage")} (${Math.round(cfg.refreshIntervalMs / 1000)}s)`,
+        value: "refresh-usage",
+      },
+      {
+        title: `${t("settingsRefreshPricing")} (${Math.round(cfg.pricingIntervalMs / 1000)}s)`,
+        value: "refresh-pricing",
+      },
+    ]
+    dialog2?.replace(() => (
+      <api.ui.DialogSelect
+        title={t("settingsTitle")}
+        options={options}
+        onSelect={(opt) => {
+          const value = opt.value
+          if (value === "focus-models") {
+            const renderFocusDialog = (dialog3: any) => {
+              const cur = loadConfig().focusModels
+              const allModels = sharedPricing()?.models ?? []
+              const modelOptions = allModels.map((m) => ({
+                title: `${cur.includes(m.id) ? "\u2611" : "\u2610"} ${m.name} (${m.pricing.input ?? "-"}/${m.pricing.output ?? "-"})`,
+                value: m.id,
+              }))
+              const focusOptions = [
+                ...modelOptions,
+                { title: `${t("focusAll")} (${cur.length} 个已选)`, value: "select-all" },
+                { title: t("focusNone"), value: "clear-all" },
+                { title: `${t("focusDone")} (${t("focusSelected", { n: cur.length })})`, value: "done" },
+              ]
+              dialog3?.replace(() => (
+                <api.ui.DialogSelect
+                  title={t("settingsFocus")}
+                  options={focusOptions}
+                  current={lastSelected}
+                  onSelect={(opt2) => {
+                    const v2 = opt2.value
+                    if (v2 === "done") {
+                      dialog3?.clear()
+                      renderSettingsDialog(dialog2)
+                    } else if (v2 === "select-all") {
+                      const all = allModels.map((m) => m.id)
+                      saveConfig({ focus_models: all })
+                      setConfigTick((v) => v + 1)
+                      api.ui.toast({ variant: "success", message: t("settingsSaved") })
+                      renderFocusDialog(dialog3)
+                    } else if (v2 === "clear-all") {
+                      saveConfig({ focus_models: [] })
+                      setConfigTick((v) => v + 1)
+                      api.ui.toast({ variant: "success", message: t("settingsSaved") })
+                      renderFocusDialog(dialog3)
+                    } else {
+                      const next = cur.includes(v2) ? cur.filter((id) => id !== v2) : [...cur, v2]
+                      saveConfig({ focus_models: next })
+                      setConfigTick((v) => v + 1)
+                      lastSelected = v2
+                      renderFocusDialog(dialog3)
+                    }
+                  }}
+                  onCancel={() => dialog3?.clear()}
+                />
+              ))
+            }
+            renderFocusDialog(dialog2)
+          } else if (value === "refresh-usage") {
+            dialog2?.replace(() => (
+              <api.ui.DialogPrompt
+                title={t("settingsRefreshUsage")}
+                description={() => <text>{"输入秒数（默认 60）"}</text>}
+                placeholder="60"
+                onConfirm={(val) => {
+                  const sec = Number(val.trim())
+                  if (!sec || sec <= 0) { dialog2?.clear(); return }
+                  saveConfig({ refresh_interval_sec: sec })
+                  setConfigTick((v) => v + 1)
+                  api.ui.toast({ variant: "success", message: t("settingsSaved") })
+                  renderSettingsDialog(dialog2)
+                }}
+                onCancel={() => dialog2?.clear()}
+              />
+            ))
+          } else if (value === "refresh-pricing") {
+            dialog2?.replace(() => (
+              <api.ui.DialogPrompt
+                title={t("settingsRefreshPricing")}
+                description={() => <text>{"输入秒数（默认 1800）"}</text>}
+                placeholder="1800"
+                onConfirm={(val) => {
+                  const sec = Number(val.trim())
+                  if (!sec || sec <= 0) { dialog2?.clear(); return }
+                  saveConfig({ pricing_interval_sec: sec })
+                  setConfigTick((v) => v + 1)
+                  api.ui.toast({ variant: "success", message: t("settingsSaved") })
+                  renderSettingsDialog(dialog2)
+                }}
+                onCancel={() => dialog2?.clear()}
+              />
+            ))
+          }
+        }}
+        onCancel={() => dialog2?.clear()}
+      />
+    ))
+  }
+  renderSettingsDialog(dialog)
+}
+
+const tui: TuiPlugin = async (api: TuiPluginApi) => {
+  api.slots.register(createSidebarSlot(api))
+  api.slots.register(createPricingSlot(api))
+
+  // 恢复已保存的语言；若无则按系统检测
+  const savedLang = kvTryGet(api, `${KV_PREFIX}.lang`) as LangCode | undefined
+  if (savedLang === "zh" || savedLang === "en") setLangCode(savedLang)
+  else setLangCode(detectLang())
+
+  // 首次启动引导：已引导过则跳过（用 kv 标记）
+  const onboarded = kvTryGet(api, `${KV_PREFIX}.onboarded`)
+  if (!onboarded) {
+    kvTrySet(api, `${KV_PREFIX}.onboarded`, "1")
+    setTimeout(() => {
+      // 通过 trigger 触发语言选择命令，命令 onSelect 会拿到 dialog 栈并弹窗
+      try { api.command.trigger("go-usage.lang") } catch { /* 命令未就绪时忽略 */ }
+    }, 1500)
+  }
+
+  api.command?.register(() => [
+    {
+      title: t("cmdTitle"),
+      value: "go-usage.config",
+      description: t("cmdDesc"),
+      slash: { name: "go-config" },
+      onSelect: (dialog) => runConfigDialog(api, dialog),
+    },
+    {
+      title: t("langCmdTitle"),
+      value: "go-usage.lang",
+      description: t("langCmdDesc"),
+      slash: { name: "go-lang" },
+      onSelect: (dialog) => runLangDialog(api, dialog),
+    },
+    {
+      title: t("settingsTitle"),
+      value: "go-usage.settings",
+      description: t("settingsDesc"),
+      slash: { name: "go-settings" },
+      onSelect: (dialog) => runSettingsDialog(api, dialog),
+    },
+  ])
+}
+
+const mod: TuiPluginModule & { id: string } = {
+  id: "opencode-go-usage-tui",
+  tui,
+}
+
 export default mod