dsh-cline-pass 0.2.3 → 0.2.5

package/lib/adapter.js

@@ -249,31 +249,88 @@ function collectImageParts(blocks, images, target = []) {
 /**
  * Convert the harness conversation to wire messages.
  *
- * Tool results become standalone `{ role: 'tool' }` messages. A user message
- * carrying an image switches to the OpenAI content-part array; a text-only one
- * keeps the plain-string form.
+ * Tool results become standalone `{ role: 'tool' }` messages, in both harness
+ * shapes: the current one, where the result IS a `tool`-role message carrying
+ * `toolCallId`, and the one dsh < 0.2.0 produced, a user message wrapping a
+ * `tool-result` block. A user message carrying an image switches to the OpenAI
+ * content-part array; a text-only one keeps the plain-string form.
  *
  * An image nested in a tool result (read_image, a screenshot tool) has no
  * OpenAI `tool` wire spelling, so it rides a following user message instead —
- * the same shape the shipped adapters use.
+ * the same shape the shipped adapters use. Deferring that message until the
+ * next non-tool message keeps a parallel group's answers contiguous.
+ *
+ * `developer` becomes `system`. The harness uses that role for its own
+ * system-level notices — the tool-registry change it appends when the tool set
+ * moves — and the newer OpenAI spelling is not accepted by every
+ * OpenAI-compatible gateway, while `system` is. Sending it as a user turn (what
+ * an unhandled role fell through to) also misrepresents it as something the user
+ * said.
+ *
+ * The group guard below is the same rule stated once: an assistant message
+ * carrying `tool_calls` must be followed immediately by a `tool` message per id.
+ * Any other message that would land inside that run — a notice, a user turn, the
+ * image message a tool-result image needs — is held back until the group closes,
+ * because a gateway that validates the rule rejects the whole request with
+ * "insufficient tool messages following tool_calls message".
  */
 function serializeMessages(messages, images) {
   const wire = []
   let pendingToolImages = []
+  /** Call ids of the most recent assistant tool_calls still awaiting an answer. */
+  let awaiting = []
+  /** Messages held back so they cannot split the group; emitted in order. */
+  let deferred = []
+
+  const flushDeferred = () => {
+    if (deferred.length === 0) return
+    for (const held of deferred) wire.push(held)
+    deferred = []
+  }
+  /**
+   * Emit a non-tool message.
+   *
+   * A message that is not a tool answer cannot go out while a group is open, so
+   * it waits. With no group open this is a plain push, which is every ordinary
+   * conversation and keeps that output unchanged.
+   */
+  const emit = (message) => {
+    if (awaiting.length > 0) deferred.push(message)
+    else wire.push(message)
+  }
   const flushToolImages = () => {
     if (pendingToolImages.length === 0) return
-    wire.push({ role: 'user', content: [{ type: 'text', text: TOOL_RESULT_IMAGE_TEXT }, ...pendingToolImages] })
+    const message = { role: 'user', content: [{ type: 'text', text: TOOL_RESULT_IMAGE_TEXT }, ...pendingToolImages] }
     pendingToolImages = []
+    emit(message)
   }
+  /** A tool answer: it closes its own id, and the group when it was the last. */
+  const answer = (callId, content) => {
+    wire.push({ role: 'tool', tool_call_id: callId, content: flattenText(content) || '(no output)' })
+    collectImageParts(content, images, pendingToolImages)
+    awaiting = awaiting.filter((id) => id !== callId)
+    if (awaiting.length === 0) flushDeferred()
+  }
+
   for (const message of messages) {
-    if (message.role === 'system') {
+    if (message.role === 'system' || message.role === 'developer') {
       flushToolImages()
-      wire.push({ role: 'system', content: flattenText(message.content) })
+      emit({ role: 'system', content: flattenText(message.content) })
       continue
     }
     if (message.role === 'assistant') {
       flushToolImages()
+      // A turn boundary. Anything still held belongs before the new turn, and an
+      // unanswered group from the previous turn can no longer be answered.
+      flushDeferred()
       wire.push(serializeAssistant(message))
+      awaiting = (message.content ?? []).filter((block) => block.type === 'tool-call').map((block) => block.id)
+      continue
+    }
+    // A harness tool result: the call identity is on the message. No flush here,
+    // so the answers to one assistant message's parallel calls stay adjacent.
+    if (message.role === 'tool') {
+      answer(message.toolCallId, message.content)
       continue
     }
     const toolResults = (message.content ?? []).filter((block) => block.type === 'tool-result')
@@ -286,18 +343,16 @@ function serializeMessages(messages, images) {
     const text = parts.filter((part) => part.type === 'text').map((part) => part.text).join('')
     if (hasImage || text.length > 0 || toolResults.length === 0) {
       flushToolImages()
-      wire.push({ role: 'user', content: hasImage ? parts : text })
+      emit({ role: 'user', content: hasImage ? parts : text })
     }
     for (const result of toolResults) {
-      wire.push({
-        role: 'tool',
-        tool_call_id: result.toolCallId,
-        content: flattenText(result.content) || '(no output)',
-      })
-      collectImageParts(result.content, images, pendingToolImages)
+      answer(result.toolCallId, result.content)
     }
   }
   flushToolImages()
+  // A group the history never closed leaves nothing to wait for; whatever was
+  // held still belongs in the request, just after the answers that do exist.
+  flushDeferred()
   return wire
 }
 

package/lib/client.js

@@ -241,6 +241,25 @@ window.__ModuleLoader__.load({
       '.cp-usage-model-tokens{font-variant-numeric:tabular-nums;color:var(--dsw-alias-label-tertiary);min-width:52px;text-align:right}',
       '.cp-check{width:14px;height:14px;flex:none;cursor:pointer;accent-color:var(--dsw-alias-brand-primary)}',
       '.cp-tools-label{cursor:pointer;gap:8px}',
+      // The usage pill beside the model selector. It borrows the panel's ramp and
+      // track treatment so a reading looks the same in both places.
+      '.cp-pill{position:relative;display:flex;align-items:center;font-size:12px;line-height:1.4}',
+      '.cp-pill-btn{border:0.5px solid var(--dsw-alias-border-l2);background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-secondary);border-radius:999px;padding:2px 9px;font:inherit;font-size:11.5px;cursor:pointer;white-space:nowrap;font-variant-numeric:tabular-nums}',
+      '.cp-pill-btn:hover{background:var(--dsw-alias-bg-layer-3);color:var(--dsw-alias-label-primary)}',
+      '.cp-pill-btn[aria-expanded=true]{background:var(--dsw-alias-bg-layer-3);color:var(--dsw-alias-label-primary)}',
+      '.cp-pill-pop{position:absolute;bottom:calc(100% + 8px);right:0;z-index:40;min-width:236px}',
+      '.cp-pill-card{background:var(--dsw-alias-bg-layer-1);border:0.5px solid var(--dsw-alias-border-l2);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.16);padding:12px 14px;display:flex;flex-direction:column;gap:9px}',
+      '.cp-pill-title{font-size:12.5px;font-weight:600;color:var(--dsw-alias-label-primary)}',
+      '.cp-pill-row{display:flex;flex-direction:column;gap:4px}',
+      '.cp-pill-row-head{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;color:var(--dsw-alias-label-primary)}',
+      '.cp-pill-percent{font-variant-numeric:tabular-nums;font-weight:600}',
+      '.cp-pill-track{height:4px;border-radius:999px;background:var(--dsw-alias-bg-layer-3);overflow:hidden}',
+      '.cp-pill-fill{height:100%;border-radius:999px}',
+      '.cp-pill-note,.cp-pill-at{font-size:11px;color:var(--dsw-alias-label-tertiary)}',
+      '.cp-pill-at{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:0.5px solid var(--dsw-alias-border-l2);padding-top:8px}',
+      '.cp-pill-fail{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;color:var(--dsw-alias-label-tertiary)}',
+      '.cp-pill-retry{border:0;background:0 0;color:var(--dsw-alias-brand-primary);font:inherit;font-size:11.5px;cursor:pointer;padding:0}',
+      '.cp-pill-retry:hover{text-decoration:underline}',
       '.cp-model-hidden .cp-mono,.cp-model-hidden .cp-check{opacity:.55}',
     ].join('')
 
@@ -306,6 +325,12 @@ window.__ModuleLoader__.load({
       usageHours: '{n} 小时',
       usageMinutes: '{n} 分钟',
       usageRefresh: '刷新',
+      usagePillTitle: 'Cline Pass 用量',
+      usagePillUnavailable: '用量不可用',
+      usagePillRetry: '重试',
+      usagePillUpdatedAt: '更新于 {time}',
+      usagePillLabel: 'Pass',
+      usagePillWeekly: '周',
       usageLoading: '正在读取官方额度…',
       usageUnavailable: '暂时读不到官方额度。',
       usageEmpty: '官方未返回额度窗口。',
@@ -389,6 +414,12 @@ window.__ModuleLoader__.load({
       usageHours: '{n}h',
       usageMinutes: '{n}m',
       usageRefresh: 'Refresh',
+      usagePillTitle: 'Cline Pass usage',
+      usagePillUnavailable: 'Usage unavailable',
+      usagePillRetry: 'Retry',
+      usagePillUpdatedAt: 'Updated {time}',
+      usagePillLabel: 'Pass',
+      usagePillWeekly: 'wk',
       usageLoading: 'Reading the official quota…',
       usageUnavailable: 'The official quota is unavailable right now.',
       usageEmpty: 'The gateway reported no quota windows.',
@@ -1839,10 +1870,164 @@ window.__ModuleLoader__.load({
 
     //#endregion
 
+    //#region usage pill
+
+    /**
+     * The Cline Pass quota, next to the model selector.
+     *
+     * Only mounted while the selected model belongs to this provider: the
+     * decision the pill informs is "should I use this model right now, and how
+     * much of the window is left", and for any other model the reading is
+     * irrelevant and the request would be wasted. The gate is the whole reason
+     * this is a pill rather than a permanent widget.
+     */
+    function UsagePill(props) {
+      const state = React.useSyncExternalStore(props.directory.subscribe, props.directory.getSnapshot, props.directory.getSnapshot)
+      const current = state.current
+      if (current === null || current === undefined || String(current.provider) !== String(props.route())) return null
+      return h(UsagePillActive, props)
+    }
+
+    /** The pill itself: a compact reading, expanding into the window breakdown. */
+    function UsagePillActive(props) {
+      const t = props.t
+      const [snapshot, setSnapshot] = React.useState(null)
+      const [failed, setFailed] = React.useState(false)
+      const [open, setOpen] = React.useState(false)
+      const root = React.useRef(null)
+      // Kept across renders so the timer's callback always sees the latest one.
+      const read = React.useRef(() => {})
+
+      React.useEffect(() => {
+        let alive = true
+        let busy = false
+        /**
+         * One reading, shared by the first paint, the timer and the retry.
+         *
+         * A hidden tab is skipped rather than served: a background poll keeps a
+         * request alive for a number nobody is looking at, and the visibility
+         * handler below refreshes the moment the tab comes back.
+         */
+        const load = async (manual) => {
+          if (busy) return
+          if (manual !== true && typeof document !== 'undefined' && document.visibilityState === 'hidden') return
+          busy = true
+          try {
+            const value = await props.readUsage()
+            if (alive) { setSnapshot({ value, at: Date.now() }); setFailed(false) }
+          } catch {
+            // The last good reading stays on screen — a failed poll is not worth
+            // blanking a number that was true a minute ago.
+            if (alive) setFailed(true)
+          } finally {
+            busy = false
+          }
+        }
+        read.current = () => { void load(true) }
+        void load(true)
+        const timer = setInterval(() => { void load(false) }, 60000)
+        const onVisible = () => { if (document.visibilityState === 'visible') void load(false) }
+        document.addEventListener('visibilitychange', onVisible)
+        return () => {
+          alive = false
+          read.current = () => {}
+          clearInterval(timer)
+          document.removeEventListener('visibilitychange', onVisible)
+        }
+      }, [props.readUsage])
+
+      // A click anywhere else closes the popover, which is what a one-shot
+      // disclosure is expected to do; the listener only exists while it is open.
+      React.useEffect(() => {
+        if (!open) return undefined
+        const onDown = (event) => {
+          if (root.current !== null && event.target instanceof Node && !root.current.contains(event.target)) setOpen(false)
+        }
+        document.addEventListener('mousedown', onDown)
+        return () => document.removeEventListener('mousedown', onDown)
+      }, [open])
+
+      const accounts = snapshot?.value?.usage?.accounts ?? []
+      const account = accounts.find((entry) => entry.ok === true) ?? accounts[0]
+      const limits = account?.limits ?? []
+      const byType = new Map(limits.map((limit) => [String(limit.type), limit]))
+      const percentOf = (type) => {
+        const limit = byType.get(type)
+        return limit === undefined ? null : Math.max(0, Math.min(100, Math.round(Number(limit.percentUsed ?? 0))))
+      }
+      const five = percentOf('five_hour')
+      const weekly = percentOf('weekly')
+
+      // The collapsed reading names the two windows a user paces against; a
+      // missing one is dropped rather than shown as an empty slot.
+      const parts = []
+      if (five !== null) parts.push(`${t('usageFiveHour')} ${five}%`)
+      if (weekly !== null) parts.push(`${t('usagePillWeekly')} ${weekly}%`)
+      const summary = [t('usagePillLabel'), ...parts].join(' · ')
+
+      const rows = limits.length === 0 ? null : USAGE_WINDOWS
+        .map(([type, key]) => [type, key, byType.get(type)])
+        .filter(([, , limit]) => limit !== undefined)
+        .concat(limits
+          .filter((limit) => !USAGE_WINDOWS.some(([type]) => type === String(limit.type)))
+          .map((limit) => [String(limit.type), '', limit]))
+
+      const body = failed && snapshot === null
+        ? h('div', { key: 'fail', className: 'cp-pill-fail' }, [
+          h('span', { key: 'm' }, t('usagePillUnavailable')),
+          h('button', { key: 'r', type: 'button', className: 'cp-pill-retry', onClick: () => read.current() }, t('usagePillRetry')),
+        ])
+        : h('div', { key: 'card', className: 'cp-pill-card' }, [
+          h('div', { key: 'title', className: 'cp-pill-title' }, t('usagePillTitle')),
+          rows === null
+            ? h('div', { key: 'empty', className: 'cp-pill-fail' }, t('usagePillUnavailable'))
+            : rows.map(([type, key, limit]) => {
+              const percent = Math.max(0, Math.min(100, Number(limit.percentUsed ?? 0)))
+              const left = countdown(t, limit.resetsAt)
+              return h('div', { key: type, className: 'cp-pill-row' }, [
+                h('div', { key: 'head', className: 'cp-pill-row-head' }, [
+                  h('span', { key: 'l' }, key === '' ? type : t(key)),
+                  h('span', { key: 'v', className: 'cp-pill-percent' }, `${Math.round(percent)}%`),
+                ]),
+                h('div', { key: 'track', className: 'cp-pill-track' },
+                  h('div', { key: 'fill', className: 'cp-pill-fill', style: { width: `${percent}%`, background: usageColor(percent) } })),
+                left === '' ? null : h('div', { key: 'note', className: 'cp-pill-note' }, fill(t('usageResetsIn'), { t: left })),
+              ])
+            }),
+          snapshot === null ? null : h('div', { key: 'at', className: 'cp-pill-at' }, [
+            h('span', { key: 's' }, fill(t('usagePillUpdatedAt'), { time: stamp(snapshot.at) })),
+            h('button', { key: 'r', type: 'button', className: 'cp-pill-retry', onClick: () => read.current() }, t('usageRefresh')),
+          ]),
+        ])
+
+      return h('div', { key: 'pill', ref: root, className: 'cp-pill' }, [
+        h('button', {
+          key: 'btn',
+          type: 'button',
+          className: 'cp-pill-btn',
+          'aria-expanded': open,
+          onClick: () => setOpen((was) => !was),
+        }, snapshot === null ? t('usagePillTitle') : summary === '' ? t('usagePillTitle') : summary),
+        open ? h('div', { key: 'pop', className: 'cp-pill-pop' }, body) : null,
+      ])
+    }
+
+    /** A local timestamp, matching the panel's own reading of "updated at". */
+    function stamp(ms) {
+      const at = new Date(Number(ms ?? 0))
+      const pad = (n) => String(n).padStart(2, '0')
+      return `${at.getFullYear()}/${at.getMonth() + 1}/${at.getDate()} ${pad(at.getHours())}:${pad(at.getMinutes())}:${pad(at.getSeconds())}`
+    }
+
+    //#endregion
+
     //#region plugin
 
-    /** The slot registry and the browser RPC transport. */
-    const inject = ['slots', 'connection']
+    /**
+     * The slot registry, the browser RPC transport, and the model-selection
+     * directory the usage pill reads the selected provider from.
+     */
+    const inject = ['slots', 'connection', 'modelDirectories']
 
     /**
      * Mount the Cline Pass configuration surface.
@@ -1903,6 +2088,24 @@ window.__ModuleLoader__.load({
         inject: face,
       }, renderQuick))
 
+      // 3. The quota reading beside the model selector. It mounts for every
+      //    session but renders nothing unless the selected model is this
+      //    provider's, so no other model pays for a usage request.
+      ctx.slots.inject('conversation.input.right', () => ctx.slots.register({
+        name: 'conversation.input.right',
+        id: `${NS}-usage`,
+        order: 100,
+        inject: (sessionId) => ({
+          directory: ctx.modelDirectories.directoryFor(sessionId).store,
+          // The route name is configuration, so it is only known once a state
+          // read has landed. Read it at render time rather than capturing it:
+          // the pill can mount before the first read completes.
+          route: () => controller.store.getSnapshot().data?.provider ?? NS,
+          readUsage: async () => await controller.call('usage', {}),
+          t: translate,
+        }),
+      }, UsagePill))
+
       // The first read is lazy (each component asks for it), because the RPC
       // transport only exists once Connection has activated.
       void controller.refresh()

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-cline-pass",
-  "version": "0.2.3",
+  "version": "0.2.5",
   "description": "Self-contained Cline Pass provider for dsh: register Cline Pass subscription models on the harness LLM seam, enumerate and validate the upstream channels behind each model, pin or exclude them with failover, and drive an account pool. No proxy process and no external cline-pass-switcher install required.",
   "type": "module",
   "main": "lib/index.js",
@@ -52,7 +52,8 @@
       "platform": "web",
       "inject": [
         "@deepseek-ai/dsh-client-ui-settings",
-        "@deepseek-ai/dsh-client-connection"
+        "@deepseek-ai/dsh-client-connection",
+        "@deepseek-ai/dsh-client-ui-model-selection"
       ]
     },
     "compatibility": {