dsh-link-pulse 0.1.0 → 0.1.3

package/CHANGELOG.md

@@ -1,9 +1,27 @@
 # Changelog
 
+## [0.1.3] - 2026-08-25
+
+### Fixed
+- 修复内外延迟显示不一致问题：引入全局单例状态存储与后端 25 秒探测缓存（支持 `?refresh=1` 强制刷新），确保侧栏按钮、Hover 悬浮小卡片与点击全屏大看板的延迟数据 100% 同步同源。
+
+## [0.1.2] - 2026-08-25
+
+### Changed
+- 去除 Provider 链路对比列表中的当前主力通道重复展示：当前主力已在顶部重点呈现，下方列表聚焦展示「其它可用 Provider」的测速对比（Hover 浮层与全屏看板同步生效）。
+
+## [0.1.1] - 2026-08-25
+
+### Fixed
+- 主动清理模型选择器文本中夹带的「default / 推理等级 / 模型」等 UI 标签残留，让长模型 ID（如 `opencode minimax-m3`）能正确识别为单个 token。
+
+### Added
+- 恢复并改写侧边栏条目 hover 悬浮预览：220ms 悬停延迟后在按钮上方弹出小卡片，展示当前模型 / 供应商 / 实时延迟以及全部 Provider 链路测速对比。
+
 ## [0.1.0] - 2026-08-25
 
 ### Added
 - 初始版本发布：支持从 `settings.yaml` 动态读取 Providers。
 - 侧边栏常驻条目与当前会话模型动态感知。
 - 多通道实时测速浮层看板。
-- 遵循 Cordis@4 扁平依赖注入规范。
+- 遵循 Cordis@4 扁平依赖注入规范。

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-link-pulse",
-  "version": "0.1.0",
+  "version": "0.1.3",
   "description": "Dynamic LLM provider gateway latency and health pulse probe for DeepSeek Harness",
   "type": "module",
   "license": "Apache-2.0",

package/src/client.js

@@ -62,11 +62,42 @@ window.__ModuleLoader__.load({
       whiteSpace: 'nowrap',
     }
 
-    let overlayOpen = false
-    const listeners = new Set()
-    function setOverlay(val) {
-      overlayOpen = val
-      listeners.forEach((fn) => fn(val))
+    // ---------- 全局单例共享状态（确保内外完全同源同步） ----------
+    const store = {
+      state: {
+        data: null,
+        loading: false,
+        open: false,
+      },
+      listeners: new Set(),
+      set(patch) {
+        store.state = { ...store.state, ...patch }
+        for (const fn of store.listeners) fn()
+      },
+      subscribe(fn) {
+        store.listeners.add(fn)
+        return () => store.listeners.delete(fn)
+      },
+    }
+
+    function useStore() {
+      return React.useSyncExternalStore(store.subscribe, () => store.state)
+    }
+
+    async function fetchStatus(force = false) {
+      if (store.state.loading && !force) return
+      try {
+        store.set({ loading: true })
+        const res = await fetch(`/api/link-pulse/status${force ? '?refresh=1' : ''}`)
+        if (res.ok) {
+          const json = await res.json()
+          store.set({ data: json, loading: false })
+        } else {
+          store.set({ loading: false })
+        }
+      } catch {
+        store.set({ loading: false })
+      }
     }
 
     function getQualityColor(quality, latencyMs) {
@@ -107,8 +138,13 @@ window.__ModuleLoader__.load({
               '[data-slot="conversation.input.model"], button[class*="modelSelect"], div[class*="modelSelector"]',
             )
             if (modelButton && modelButton.textContent) {
-              const text = modelButton.textContent.trim()
-              if (text && text.length < 30) {
+              let text = modelButton.textContent.trim()
+              // 剥离「default」「推理等级」「模型」等 UI 标签
+              text = text
+                .split(/[\n|·•]/)[0]
+                .replace(/\s*(default|推理等级|模型|model)\s*/gi, '')
+                .trim()
+              if (text && text.length < 30 && /[a-zA-Z0-9\-_.]/.test(text)) {
                 setActiveModel(text)
                 return
               }
@@ -127,34 +163,17 @@ window.__ModuleLoader__.load({
 
     function FooterEntry(props) {
       const { wide } = props
-      const [isOpen, setIsOpen] = useState(overlayOpen)
-      const [data, setData] = useState(null)
-      const [loading, setLoading] = useState(false)
+      const state = useStore()
+      const [hovering, setHovering] = useState(false)
+      const hoverTimerRef = React.useRef(null)
 
       useEffect(() => {
-        listeners.add(setIsOpen)
-        return () => listeners.delete(setIsOpen)
-      }, [])
-
-      const fetchData = useCallback(async () => {
-        try {
-          setLoading(true)
-          const res = await fetch('/api/link-pulse/status')
-          if (res.ok) {
-            const json = await res.json()
-            setData(json)
-          }
-        } catch {} finally {
-          setLoading(false)
-        }
-      }, [])
-
-      useEffect(() => {
-        fetchData()
-        const timer = setInterval(fetchData, 45_000)
+        fetchStatus(false)
+        const timer = setInterval(() => fetchStatus(false), 45_000)
         return () => clearInterval(timer)
-      }, [fetchData])
+      }, [])
 
+      const data = state.data
       const defaultModel = data?.defaultModelConfig?.model || 'gemini-3.7-flash-high'
       const activeModel = useActiveModel(defaultModel)
 
@@ -171,32 +190,30 @@ window.__ModuleLoader__.load({
       const providerDisplayName = activeProviderInfo?.name || 'CPA'
       const modelShortName = formatModelShortName(activeModel)
 
-      const tooltipText = useMemo(() => {
-        if (!data?.providers) return '链路测速中...'
-        const lines = [`🎯 当前对话模型: ${activeModel}`]
-        lines.push(`🏢 归属供应商: ${providerDisplayName}`)
-        lines.push(`⚡ 实时往返延迟: ${currentLatency > 0 ? currentLatency + ' ms' : '检测中'}`)
-        lines.push('────────────────────────')
-        lines.push('🌐 已接入 Provider 链路一览:')
-        for (const p of data.providers) {
-          const lat = p.probe?.latencyMs > 0 ? `${p.probe.latencyMs}ms` : '离线'
-          lines.push(`• ${p.name}: ${lat}`)
-        }
-        return lines.join('\n')
-      }, [data, activeModel, providerDisplayName, currentLatency])
+      const onMouseEnter = useCallback(() => {
+        clearTimeout(hoverTimerRef.current)
+        hoverTimerRef.current = setTimeout(() => setHovering(true), 220)
+      }, [])
+      const onMouseLeave = useCallback(() => {
+        clearTimeout(hoverTimerRef.current)
+        setHovering(false)
+      }, [])
 
-      return h(
+      const otherProviders = (data?.providers || []).filter((p) => p.id !== activeProviderInfo?.id)
+
+      const node = h(
         'button',
         {
           className: 'pulse-btn',
-          onClick: () => setOverlay(!isOpen),
-          title: tooltipText,
+          onClick: () => store.set({ open: !state.open }),
+          onMouseEnter: onMouseEnter,
+          onMouseLeave: onMouseLeave,
           style: {
             ...btnBase,
             width: '100%',
             justifyContent: wide ? 'flex-start' : 'center',
-            borderColor: isOpen ? T.brand : T.border,
-            background: isOpen ? 'var(--dsw-alias-interactive-bg-hover, rgba(59,130,246,.12))' : 'transparent',
+            borderColor: state.open ? T.brand : T.border,
+            background: state.open ? 'var(--dsw-alias-interactive-bg-hover, rgba(59,130,246,.12))' : 'transparent',
           },
         },
         h('span', {
@@ -246,34 +263,109 @@ window.__ModuleLoader__.load({
             ),
           ),
       )
-    }
-
-    function OverlayPanel() {
-      const [isOpen, setIsOpen] = useState(overlayOpen)
-      const [data, setData] = useState(null)
-      const [loading, setLoading] = useState(false)
 
-      useEffect(() => {
-        listeners.add(setIsOpen)
-        return () => listeners.delete(setIsOpen)
-      }, [])
+      if (!hovering || state.open) return node
 
-      const fetchData = useCallback(async () => {
-        try {
-          setLoading(true)
-          const res = await fetch('/api/link-pulse/status')
-          if (res.ok) {
-            const json = await res.json()
-            setData(json)
-          }
-        } catch {} finally {
-          setLoading(false)
-        }
-      }, [])
+      return h(
+        'div',
+        {
+          style: { position: 'relative', width: '100%' },
+          onMouseEnter: onMouseEnter,
+          onMouseLeave: onMouseLeave,
+        },
+        node,
+        h(
+          'div',
+          {
+            className: 'pulse-panel-enter',
+            style: {
+              position: 'absolute',
+              left: 0,
+              right: 0,
+              bottom: 'calc(100% + 6px)',
+              background: T.bg,
+              border: `1px solid ${T.border2}`,
+              borderRadius: '10px',
+              boxShadow: '0 8px 24px rgba(0,0,0,.18)',
+              padding: '10px 12px',
+              fontSize: '11px',
+              lineHeight: '17px',
+              color: T.label,
+              whiteSpace: 'pre',
+              zIndex: 100,
+              fontFamily: 'system-ui, -apple-system, sans-serif',
+            },
+          },
+          h('div', { style: { fontWeight: 600, fontSize: '12px', marginBottom: 4 } }, `🎯 ${activeModel}`),
+          h('div', { style: { color: T.secondary } }, `🏢 ${providerDisplayName}`),
+          h(
+            'div',
+            {
+              style: {
+                color: statusColor,
+                fontWeight: 600,
+                marginTop: 2,
+                marginBottom: otherProviders.length > 0 ? 6 : 0,
+              },
+            },
+            `⚡ ${currentLatency > 0 ? currentLatency + ' ms' : '检测中'}`,
+          ),
+          otherProviders.length > 0 &&
+            h(
+              'div',
+              {
+                style: {
+                  borderTop: `1px dashed ${T.border}`,
+                  paddingTop: 6,
+                  color: T.secondary,
+                },
+              },
+              '🌐 其它 Provider 链路',
+            ),
+          otherProviders.map((p, i) =>
+            h(
+              'div',
+              {
+                key: i,
+                style: {
+                  display: 'flex',
+                  justifyContent: 'space-between',
+                  gap: 12,
+                },
+              },
+              h(
+                'span',
+                { style: { display: 'flex', alignItems: 'center', gap: 4 } },
+                h('span', {
+                  style: {
+                    ...dotStyle(getQualityColor(p.probe?.quality, p.probe?.latencyMs)),
+                    width: 5,
+                    height: 5,
+                  },
+                }),
+                p.name,
+              ),
+              h(
+                'span',
+                {
+                  style: {
+                    color: getQualityColor(p.probe?.quality, p.probe?.latencyMs),
+                    fontWeight: 600,
+                  },
+                },
+                p.probe?.latencyMs > 0 ? `${p.probe.latencyMs} ms` : '离线',
+              ),
+            ),
+          ),
+        ),
+      )
+    }
 
-      useEffect(() => {
-        if (isOpen) fetchData()
-      }, [isOpen, fetchData])
+    function OverlayPanel() {
+      const state = useStore()
+      const isOpen = state.open
+      const data = state.data
+      const loading = state.loading
 
       const defaultModel = data?.defaultModelConfig?.model || 'gemini-3.7-flash-high'
       const activeModel = useActiveModel(defaultModel)
@@ -291,6 +383,7 @@ window.__ModuleLoader__.load({
       const currentLatency = activeProviderInfo?.probe?.latencyMs ?? -1
       const currentQuality = activeProviderInfo?.probe?.quality || 'offline'
       const statusColor = getQualityColor(currentQuality, currentLatency)
+      const otherProviders = providers.filter((p) => p.id !== activeProviderInfo?.id)
 
       return h(
         'div',
@@ -306,7 +399,7 @@ window.__ModuleLoader__.load({
             backdropFilter: 'blur(4px)',
           },
           onClick: (e) => {
-            if (e.target === e.currentTarget) setOverlay(false)
+            if (e.target === e.currentTarget) store.set({ open: false })
           },
         },
         h(
@@ -358,7 +451,7 @@ window.__ModuleLoader__.load({
                 'button',
                 {
                   className: 'pulse-btn',
-                  onClick: fetchData,
+                  onClick: () => fetchStatus(true),
                   disabled: loading,
                   style: {
                     display: 'flex',
@@ -380,7 +473,7 @@ window.__ModuleLoader__.load({
                 'button',
                 {
                   className: 'pulse-btn',
-                  onClick: () => setOverlay(false),
+                  onClick: () => store.set({ open: false }),
                   style: {
                     padding: '4px 8px',
                     borderRadius: '6px',
@@ -483,75 +576,79 @@ window.__ModuleLoader__.load({
                     marginBottom: '10px',
                   },
                 },
-                '🌐 已接入 Provider 链路测速对比',
+                '🌐 其它可用 Provider 链路测速',
               ),
-              h(
-                'div',
-                { style: { display: 'flex', flexDirection: 'column', gap: '8px' } },
-                providers.map((p, idx) => {
-                  const lat = p.probe?.latencyMs ?? -1
-                  const qual = p.probe?.quality || 'offline'
-                  const col = getQualityColor(qual, lat)
-                  const isCurrent = activeProviderInfo?.id === p.id
-
+              (() => {
+                if (otherProviders.length === 0) {
                   return h(
                     'div',
                     {
-                      key: idx,
                       style: {
-                        display: 'flex',
-                        justifyContent: 'space-between',
-                        alignItems: 'center',
-                        padding: '8px 10px',
-                        borderRadius: '8px',
-                        background: isCurrent ? 'rgba(59,130,246,.08)' : 'rgba(0,0,0,.03)',
-                        border: `1px solid ${isCurrent ? 'rgba(59,130,246,.3)' : 'transparent'}`,
+                        fontSize: '11px',
+                        color: T.secondary,
+                        textAlign: 'center',
+                        padding: '12px 0',
                       },
                     },
-                    h(
-                      'div',
-                      null,
-                      h(
-                        'div',
-                        { style: { display: 'flex', alignItems: 'center', gap: '6px' } },
-                        h('span', { style: dotStyle(col) }),
-                        h('span', { style: { fontWeight: 600, fontSize: '12px' } }, p.name),
-                        isCurrent &&
-                          h(
-                            'span',
-                            {
-                              style: {
-                                fontSize: '9px',
-                                color: T.brand,
-                                fontWeight: 600,
-                              },
-                            },
-                            '● 当前主力',
-                          ),
-                      ),
-                      h(
-                        'div',
-                        { style: { fontSize: '10px', color: T.secondary, marginTop: '2px' } },
-                        p.baseURL || '官方内置通道',
-                      ),
-                    ),
-                    h(
+                    '暂无其它已接入的 Provider',
+                  )
+                }
+
+                return h(
+                  'div',
+                  { style: { display: 'flex', flexDirection: 'column', gap: '8px' } },
+                  otherProviders.map((p, idx) => {
+                    const lat = p.probe?.latencyMs ?? -1
+                    const qual = p.probe?.quality || 'offline'
+                    const col = getQualityColor(qual, lat)
+
+                    return h(
                       'div',
-                      { style: { textAlign: 'right' } },
+                      {
+                        key: idx,
+                        style: {
+                          display: 'flex',
+                          justifyContent: 'space-between',
+                          alignItems: 'center',
+                          padding: '8px 10px',
+                          borderRadius: '8px',
+                          background: 'rgba(0,0,0,.03)',
+                          border: `1px solid transparent`,
+                        },
+                      },
                       h(
                         'div',
-                        { style: { fontWeight: 700, fontSize: '13px', color: col } },
-                        lat > 0 ? `${lat} ms` : '超时/离线',
+                        null,
+                        h(
+                          'div',
+                          { style: { display: 'flex', alignItems: 'center', gap: '6px' } },
+                          h('span', { style: dotStyle(col) }),
+                          h('span', { style: { fontWeight: 600, fontSize: '12px' } }, p.name),
+                        ),
+                        h(
+                          'div',
+                          { style: { fontSize: '10px', color: T.secondary, marginTop: '2px' } },
+                          p.baseURL || '官方内置通道',
+                        ),
                       ),
                       h(
                         'div',
-                        { style: { fontSize: '9px', color: T.secondary } },
-                        lat > 0 ? (lat < 200 ? '极佳' : '良好') : '不可达',
+                        { style: { textAlign: 'right' } },
+                        h(
+                          'div',
+                          { style: { fontWeight: 700, fontSize: '13px', color: col } },
+                          lat > 0 ? `${lat} ms` : '超时/离线',
+                        ),
+                        h(
+                          'div',
+                          { style: { fontSize: '9px', color: T.secondary } },
+                          lat > 0 ? (lat < 200 ? '极佳' : '良好') : '不可达',
+                        ),
                       ),
-                    ),
-                  )
-                }),
-              ),
+                    )
+                  }),
+                )
+              })(),
             ),
           ),
         ),

package/src/index.js

@@ -137,6 +137,9 @@ function sendJson(res, statusCode, data) {
   res.end(JSON.stringify(data))
 }
 
+let cachedData = null
+let lastProbeAt = 0
+
 export function apply(ctx) {
   ctx.effect(() =>
     ctx.webServer.register({
@@ -148,6 +151,12 @@ export function apply(ctx) {
         }
 
         try {
+          const isForce = req.url && req.url.includes('refresh=1')
+          const now = Date.now()
+          if (!isForce && cachedData && now - lastProbeAt < 25_000) {
+            return sendJson(res, 200, cachedData)
+          }
+
           const { providers, defaultModelConfig, modelToProviderMap } = loadDynamicProviders()
 
           const probePromises = providers.map(async (p) => {
@@ -160,12 +169,15 @@ export function apply(ctx) {
 
           const probedProviders = await Promise.all(probePromises)
 
-          sendJson(res, 200, {
+          cachedData = {
             defaultModelConfig,
             modelToProviderMap,
             providers: probedProviders,
             timestamp: Date.now(),
-          })
+          }
+          lastProbeAt = Date.now()
+
+          sendJson(res, 200, cachedData)
         } catch (err) {
           sendJson(res, 500, { error: String(err && err.message ? err.message : err) })
         }