dsh-cline-pass 0.2.9 → 0.2.10

package/README.en.md

@@ -22,7 +22,7 @@ Requires Node.js `>= 20.3.0`, dsh `>= 0.1.2-alpha.3 < 0.3.0`, and a valid Cline
 dsh plugin --profile web add dsh-cline-pass
 ```
 
-Restart dsh, open **Settings → Built-in Plugins → Cline Pass** to save and test your API key, then select a Cline Pass model in the model picker. Keys are stored in the dsh credential store and displayed only in masked form.
+Restart dsh, open **Settings → Cline Pass** to save and test your API key, then select a Cline Pass model in the model picker. Keys are stored in the dsh credential store and displayed only in masked form.
 
 Alternatively, configure the key through an environment variable:
 

package/README.md

@@ -22,7 +22,7 @@
 dsh plugin --profile web add dsh-cline-pass
 ```
 
-安装后重启 dsh，在 **设置 → 内置插件 → Cline Pass** 中保存并测试 API Key，然后在模型选择器中选择 Cline Pass 模型。Key 存入 dsh 凭据库，界面仅显示掩码。
+安装后重启 dsh，在 **设置 → Cline Pass** 中保存并测试 API Key，然后在模型选择器中选择 Cline Pass 模型。Key 存入 dsh 凭据库，界面仅显示掩码。
 
 也可以通过环境变量配置：
 

package/lib/client.js

@@ -84,6 +84,17 @@ window.__ModuleLoader__.load({
       '.cp-dot{width:8px;height:8px;border-radius:50%;display:inline-block;flex:none}',
       '.cp-table{display:flex;flex-direction:column;gap:6px}',
       '.cp-model{border:0.5px solid var(--dsw-alias-border-l2);border-radius:8px;padding:8px;display:flex;flex-direction:column;gap:8px}',
+      // The bulk toolbar sits directly above the first row; the card's own 10px gap
+      // reads as none against two stacked borders, so this card opens it up.
+      '.cp-models{gap:14px}',
+      '.cp-models-body{flex-direction:column;gap:16px;display:flex}',
+      // One line per model. `.cp-row` wraps by default, which a long id plus a long
+      // pin order turns into a two-line row that reads as broken rather than dense;
+      // both texts ellipsis instead, and their full value stays in `title`.
+      '.cp-model-head{flex-wrap:nowrap;min-width:0}',
+      '.cp-model-head .cp-grow{min-width:0}',
+      '.cp-model-mode{flex:none;max-width:55%}',
+      '.cp-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}',
       // The account table is a real table for the same reason the history one
       // is: per-row grids size their `auto` tracks from their own content, so a
       // header cell never lines up with the data under it.
@@ -195,16 +206,10 @@ window.__ModuleLoader__.load({
       // Plugins-page card chrome, mirrored token for token from the host's own
       // `PluginCard`: that tab hands a plugin the whole card, so matching it —
       // rather than inventing a second look — is this bundle's job.
-      '.cp-set-card{border:0.5px solid var(--dsw-alias-border-l4);background:var(--dsw-alias-bg-layer-3);border-radius:16px;list-style:none;transition:border-color .16s,background .16s}',
-      '.cp-set-card:hover{border-color:var(--dsw-alias-label-dimmed)}',
-      '.cp-set-card-open{background:var(--dsw-alias-bg-layer-2);border-color:var(--dsw-alias-label-dimmed)}',
-      '.cp-set-header{appearance:none;width:100%;font:inherit;color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:12px;align-items:center;gap:12px;padding:14px 16px;display:flex}',
-      '.cp-set-header:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:-2px}',
-      '.cp-set-head-text{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}',
+      '.cp-set-card{border:0.5px solid var(--dsw-alias-border-l4);background:var(--dsw-alias-bg-layer-3);border-radius:16px;list-style:none}',
+      '.cp-set-head{flex-direction:column;gap:4px;display:flex;padding:14px 16px}',
       '.cp-set-name{color:var(--dsw-alias-label-primary);font-size:15px;font-weight:600;line-height:1.4}',
       '.cp-set-desc{color:var(--dsw-alias-label-tertiary);font-size:13px;line-height:1.5}',
-      '.cp-set-chevron{color:var(--dsw-alias-label-tertiary);flex:none;transition:transform .16s}',
-      '.cp-set-chevron-open{transform:rotate(180deg)}',
       '.cp-chevron{color:var(--dsw-alias-label-tertiary);flex:none;transition:transform .16s;display:inline-flex}',
       'details[open]>summary .cp-chevron{transform:rotate(180deg)}',
       // A summary laid out as a flex row keeps no native affordance, so the
@@ -288,8 +293,6 @@ window.__ModuleLoader__.load({
       title: 'Cline Pass',
       description: '订阅模型的渠道钉住与账号池配置',
       panelUnavailable: '浏览器通道不可用。',
-      expand: '展开设置',
-      collapse: '收起设置',
       keyOk: 'API Key 已配置',
       keyMissing: '尚未配置 API Key',
       keyValue: 'API Key',
@@ -317,9 +320,10 @@ window.__ModuleLoader__.load({
       active: '当前账号',
       addAccount: '添加',
       accountName: '账号名',
-      models: '订阅模型',
+      models: 'cline-pass',
       modelsCount: '{n} 个模型',
-      hiddenModels: '{n} 个已从选择列表隐藏',
+      hiddenModels: '{n} 隐藏',
+      hiddenModelsHint: '{n} 个已从选择列表隐藏',
       visible: '在模型选择列表中显示',
       hiddenTag: '已隐藏',
       selectAll: '全选',
@@ -360,6 +364,10 @@ window.__ModuleLoader__.load({
       noChannels: '未探测渠道',
       pinned: '已钉住',
       auto: '自动路由',
+      modeAuto: '智能路由',
+      modeStrict: '钉住',
+      modePreferred: '优先',
+      channelsCount: '{n} 个渠道',
       probe: '探测',
       validate: '校验',
       testPin: '测试',
@@ -377,8 +385,6 @@ window.__ModuleLoader__.load({
       title: 'Cline Pass',
       description: 'Channel pins and the account pool for the subscription models',
       panelUnavailable: 'The browser channel is unavailable.',
-      expand: 'Show settings',
-      collapse: 'Hide settings',
       keyOk: 'API key configured',
       keyMissing: 'No API key',
       keyValue: 'API key',
@@ -406,9 +412,10 @@ window.__ModuleLoader__.load({
       active: 'Active',
       addAccount: 'Add',
       accountName: 'Name',
-      models: 'Models',
+      models: 'cline-pass',
       modelsCount: '{n} model(s)',
-      hiddenModels: '{n} hidden from the pickers',
+      hiddenModels: '{n} hidden',
+      hiddenModelsHint: '{n} hidden from the model pickers',
       visible: 'Show in the model pickers',
       hiddenTag: 'Hidden',
       selectAll: 'Check all',
@@ -449,6 +456,10 @@ window.__ModuleLoader__.load({
       noChannels: 'No channels probed',
       pinned: 'Pinned',
       auto: 'Auto',
+      modeAuto: 'Smart routing',
+      modeStrict: 'Pinned',
+      modePreferred: 'Preferred',
+      channelsCount: '{n} channels',
       probe: 'Probe',
       validate: 'Validate',
       testPin: 'Test',
@@ -1170,12 +1181,29 @@ window.__ModuleLoader__.load({
       const { t, model, disabled, actions } = props
       const [open, setOpen] = React.useState(false)
       const hidden = model.hidden === true
-      const pinnedLabel = model.pinned.length === 0 ? t('auto') : model.pinned.join(' › ')
+      // What a request will actually do, readable without expanding the row. The
+      // old line read `已钉住: 自动路由` — claiming a pin while saying nothing is
+      // pinned, which is exactly how it was misread.
+      // Every row is this route, and the card header already names it, so the prefix
+      // is 11 characters of noise on each of nineteen rows. The full id stays in
+      // `title` for anything that needs to copy it.
+      const label = typeof model.displayName === 'string' && model.displayName !== ''
+        ? model.displayName
+        : String(model.id).replace(/^cline-pass\//, '')
+      const mode = model.pinned.length === 0
+        ? t('modeAuto')
+        : `${t(model.pinMode === 'preferred' ? 'modePreferred' : 'modeStrict')} · ${model.pinned.join(' › ')}`
+      // How many channels sit behind it and how many of those the order pins. After a
+      // probe only: before that the list is empty and a count would be a guess.
+      const channelCount = model.upstreams.length === 0 ? '' : fill(t('channelsCount'), { n: model.upstreams.length })
       const action = (key, label, run) => h('button', {
         key, type: 'button', className: 'cp-btn', disabled, onClick: () => run(model.id),
       }, label)
       return h('div', { className: `cp-model${hidden ? ' cp-model-hidden' : ''}` }, [
-        h('div', { key: 'head', className: 'cp-row' }, [
+        // One line, always. The id and the mode are long enough to collide on a
+        // narrow panel, so both ellipsis and keep their full text in `title`: a
+        // second line here reads as a broken row, not as more information.
+        h('div', { key: 'head', className: 'cp-row cp-model-head' }, [
           h('input', {
             key: 'vis',
             type: 'checkbox',
@@ -1186,11 +1214,12 @@ window.__ModuleLoader__.load({
             'aria-label': `${t('visible')}: ${model.id}`,
             onChange: (event) => actions.setModelVisible(model.id, event.target.checked),
           }),
-          h('span', { key: 'name', className: 'cp-mono cp-grow' }, model.id),
+          h('span', { key: 'name', className: 'cp-mono cp-grow cp-ellipsis', title: model.id }, label),
           hidden ? h('span', { key: 'off', className: 'cp-muted' }, t('hiddenTag')) : null,
-          h('span', { key: 'pin', className: 'cp-muted cp-mono' }, `${t('pinned')}: ${pinnedLabel}`),
+          h('span', { key: 'mode', className: 'cp-muted cp-mono cp-model-mode cp-ellipsis', title: mode }, mode),
           h('button', {
-            key: 'more', type: 'button', className: 'cp-btn', title: t('channels'),
+            key: 'more', type: 'button', className: 'cp-btn',
+            title: channelCount === '' ? t('channels') : `${t('channels')} · ${channelCount}`,
             onClick: () => setOpen(!open),
           }, open ? '▾' : '▸'),
         ]),
@@ -1392,8 +1421,8 @@ window.__ModuleLoader__.load({
      * which drops the browser's own disclosure marker — without it a folded
      * section looks like a plain card title, not something to open.
      */
-    function foldHeader(title) {
-      return h('summary', { key: 'sum', className: 'cp-card-title cp-fold' }, [
+    function foldHeader(title, hint) {
+      return h('summary', { key: 'sum', className: 'cp-card-title cp-fold', ...(hint === undefined || hint === '' ? {} : { title: hint }) }, [
         h('span', { key: 'l' }, title),
         h(Chevron, { key: 'chevron', className: 'cp-chevron' }),
       ])
@@ -1409,27 +1438,40 @@ window.__ModuleLoader__.load({
     function ModelsCard(props) {
       const { t, data, disabled, busy, actions } = props
       const hidden = Number(data.hiddenModels ?? 0)
-      return h('details', { className: 'cp-card' }, [
-        foldHeader(`${t('models')} · ${fill(t('modelsCount'), { n: data.models.length })}${hidden === 0 ? '' : ` · ${fill(t('hiddenModels'), { n: hidden })}`}`),
+      // Open by default: the pins are what this page is for, and a collapsed card
+      // makes a user click before they can see whether anything is pinned at all.
+      // The fold stays available for the days a pool has nineteen models in it.
+      return h('details', { className: 'cp-card cp-models', open: true }, [
+        // Short enough for a fold header; the long spelling is the tooltip.
+        foldHeader(
+          `${t('models')} · ${fill(t('modelsCount'), { n: data.models.length })}${hidden === 0 ? '' : ` · ${fill(t('hiddenModels'), { n: hidden })}`}`,
+          hidden === 0 ? '' : fill(t('hiddenModelsHint'), { n: hidden }),
+        ),
         // The refresh and the bulk checkbox actions sit in the body, not the
         // header: a button inside a summary would also toggle the fold.
-        h('div', { key: 'bar', className: 'cp-row' }, [
-          h('button', {
-            key: 'all', type: 'button', className: 'cp-btn', disabled,
-            onClick: () => actions.setModelsVisibility('all'),
-          }, t('selectAll')),
-          h('button', {
-            key: 'invert', type: 'button', className: 'cp-btn', disabled,
-            onClick: () => actions.setModelsVisibility('invert'),
-          }, t('invertSelection')),
-          h('button', {
-            key: 'r', type: 'button', className: 'cp-btn cp-grow-end', disabled,
-            onClick: () => actions.refreshModels(),
-          }, t('refresh')),
+        //
+        // `details` wraps everything after its summary, so the card's own flex gap
+        // stops at that wrapper and the toolbar sat flush against the first row. This
+        // grouping carries the spacing itself, whatever the engine's `details` layout.
+        h('div', { key: 'models', className: 'cp-models-body' }, [
+          h('div', { key: 'bar', className: 'cp-row' }, [
+            h('button', {
+              key: 'all', type: 'button', className: 'cp-btn', disabled,
+              onClick: () => actions.setModelsVisibility('all'),
+            }, t('selectAll')),
+            h('button', {
+              key: 'invert', type: 'button', className: 'cp-btn', disabled,
+              onClick: () => actions.setModelsVisibility('invert'),
+            }, t('invertSelection')),
+            h('button', {
+              key: 'r', type: 'button', className: 'cp-btn cp-grow-end', disabled,
+              onClick: () => actions.refreshModels(),
+            }, t('refresh')),
+          ]),
+          h('div', { key: 'rows', className: 'cp-table' }, data.models.map((model) => h(ModelRow, {
+            key: model.id, t, model, disabled, busy, actions,
+          }))),
         ]),
-        h('div', { key: 'rows', className: 'cp-table' }, data.models.map((model) => h(ModelRow, {
-          key: model.id, t, model, disabled, busy, actions,
-        }))),
       ])
     }
 
@@ -1837,31 +1879,21 @@ window.__ModuleLoader__.load({
      * host's own cards — and because the panel only mounts once opened, a folded
      * card costs no round trip.
      */
+    /**
+     * The section's page: the panel itself, under a static heading.
+     *
+     * It used to fold, because it lived inside the Plugins tab where a long panel
+     * had to stay out of the way. As a first-level page the fold only asks for a
+     * click on the thing the user just navigated to.
+     */
     function PluginSettingsCard(props) {
       const t = props.t
-      const [open, setOpen] = React.useState(false)
-      const title = t('title')
-      return h('div', { className: `cp-set-card${open ? ' cp-set-card-open' : ''}` }, [
-        h('button', {
-          key: 'head',
-          type: 'button',
-          className: 'cp-set-header',
-          'aria-expanded': open,
-          'aria-label': `${t(open ? 'collapse' : 'expand')}: ${title}`,
-          onClick: () => setOpen(!open),
-        }, [
-          h('span', { key: 'text', className: 'cp-set-head-text' }, [
-            h('span', { key: 'name', className: 'cp-set-name' }, title),
-            h('span', { key: 'desc', className: 'cp-set-desc' }, t('description')),
-          ]),
-          h(Chevron, {
-            key: 'chevron',
-            className: `cp-set-chevron${open ? ' cp-set-chevron-open' : ''}`,
-          }),
+      return h('div', { className: 'cp-set-card' }, [
+        h('div', { key: 'head', className: 'cp-set-head' }, [
+          h('span', { key: 'name', className: 'cp-set-name' }, t('title')),
+          h('span', { key: 'desc', className: 'cp-set-desc' }, t('description')),
         ]),
-        open
-          ? h('div', { key: 'body', className: 'cp-set-body' }, h(Panel, { ...props, hideTitle: true }))
-          : null,
+        h('div', { key: 'body', className: 'cp-set-body' }, h(Panel, { ...props, hideTitle: true })),
       ])
     }
 
@@ -2147,19 +2179,20 @@ window.__ModuleLoader__.load({
       const renderPluginCard = (props) => h(PluginSettingsCard, { ...props, ...face, t: translate })
       const renderQuick = (props) => h(QuickCard, { ...props, ...face, t: translate })
 
-      // 1. The one configuration surface: a tab inside the Plugins settings
-      //    section, which already enumerates this namespace. No
-      //    `settings.section` alongside it — a second page in the Settings nav
-      //    would only duplicate this panel, and the nav is for surfaces that are
-      //    not already listed there.
+      // 1. The one configuration surface: a first-level page in the Settings nav.
+      //
+      //    It used to be a tab under Plugins, which put the channel pins five or six
+      //    clicks deep — Settings, Plugins, the tab, the collapsed card, the model
+      //    list, the row. The pins are what this plugin is for, so they get the same
+      //    standing as the shell's own pages: `order: 12` sits between Models (10) and
+      //    Plugins (15), which is also where a reader looks for a provider's routing.
       //
-      //    `settings.plugins.tab` is a list slot: its key is `id`, its position
-      //    is `order` (the host's own inventory tab sits at 10), and its tab
-      //    label is a thunk so it follows the active locale.
-      ctx.slots.inject('settings.plugins.tab', () => ctx.slots.register({
-        name: 'settings.plugins.tab',
+      //    `settings.section` is a list slot: its key is `id`, its position is
+      //    `order`, and its nav label is a thunk so it follows the active locale.
+      ctx.slots.inject('settings.section', () => ctx.slots.register({
+        name: 'settings.section',
         id: NS,
-        order: 20,
+        order: 12,
         label: () => translate('title'),
         locale: NS,
         inject: face,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-cline-pass",
-  "version": "0.2.9",
+  "version": "0.2.10",
   "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",