feat(ui): compact bot connection metadata

plugin-src/client/channels/shared/token-channel.js

@@ -10,6 +10,7 @@ import {
   EMPTY_AGENT_PRESET_CATALOG,
 } from '../../agent-preset.js';
 import { useWorkspaceSnapshotFence } from '../../workspace-snapshot-fence.js';
+import { BotStatusMeta, ChannelListHeading } from '../../channel-card-meta.js';
 
 const Button = React.forwardRef(function Button(
   { children, kind = 'secondary', className = '', ...props },
@@ -82,14 +83,14 @@ export function createTokenChannelSettings(definition) {
               h(LogoGlyph, { size: 29 })),
             h('div', { className: 'dim-botName' },
               h('h3', null, account.bot.name), h('p', null, identity))),
-          h('div', { className: 'ddt-health dim-botHealth' },
-            h('span', { className: 'ddt-dot dim-healthDot', 'data-tone': tone }),
-            h('span', null, stateLabel))),
-        h('dl', { className: 'ddt-metrics dim-botMetrics' },
-          h('div', { className: 'ddt-metric dim-botMetric' },
-            h('dt', null, '消息通道'), h('dd', null, account.connected ? connectionLabel : '离线')),
-          h('div', { className: 'ddt-metric dim-botMetric' },
-            h('dt', null, '最近检查'), h('dd', null, checkedTime(account.health.lastCheckedAt)))),
+          h(BotStatusMeta, {
+            className: 'ddt-health',
+            dotClassName: 'ddt-dot',
+            tone,
+            stateLabel,
+            lastCheckedAt: account.health.lastCheckedAt,
+            formatCheckedTime: checkedTime,
+          })),
         h(WorkspaceEditor, {
           workspace: account.workspace,
           disabled: Boolean(busy),
@@ -271,8 +272,11 @@ export function createTokenChannelSettings(definition) {
 
     const botList = model.bots.length > 0
       ? h('section', { className: 'dim-listSection' },
-          h('div', { className: 'ddt-listHeading dim-listHeading' },
-            h('h3', null, `已接入的 ${channel} 机器人`)),
+          h(ChannelListHeading, {
+            className: 'ddt-listHeading',
+            title: `已接入的 ${channel} 机器人`,
+            connectionLabel,
+          }),
           h('ul', { className: 'ddt-list dim-botList' }, model.bots.map((account) =>
             h('li', { key: account.botId }, h(AccountCard, {
               account,