refactor: simplify plugin branding

plugin-src/client/build.mjs

@@ -1,4 +1,4 @@
-import { mkdir, readFile, writeFile } from 'node:fs/promises';
+import { mkdir, writeFile } from 'node:fs/promises';
 import { dirname, resolve } from 'node:path';
 import { fileURLToPath } from 'node:url';
 
@@ -8,8 +8,6 @@ const sourceDirectory = dirname(fileURLToPath(import.meta.url));
 const packageRoot = resolve(sourceDirectory, '../..');
 const outputPath = resolve(packageRoot, 'lib/client.js');
 const loaderId = process.env.DSH_IM_CLIENT_ID ?? '@xmanrui/dsh-im';
-const logoPath = resolve(packageRoot, 'assets/logo-plugin-phone.png');
-const logoDataUrl = `data:image/png;base64,${(await readFile(logoPath)).toString('base64')}`;
 
 const result = await build({
   entryPoints: [resolve(sourceDirectory, 'index.js')],
@@ -18,9 +16,6 @@ const result = await build({
   platform: 'browser',
   target: ['chrome100'],
   external: ['react', 'react-dom'],
-  define: {
-    'globalThis.__DSH_IM_LOGO_DATA_URL__': JSON.stringify(logoDataUrl),
-  },
   write: false,
   minify: process.env.NODE_ENV === 'production',
   legalComments: 'none',

plugin-src/client/index.js

@@ -44,8 +44,6 @@ import { WorkspaceDirectoryPickerContext } from './workspace-editor.js';
 export const name = 'im-settings';
 export const inject = ['slots', 'connection', 'locale', 'workspaces'];
 
-const IM_PLUGIN_LOGO_URL = globalThis.__DSH_IM_LOGO_DATA_URL__ ?? 'assets/logo-plugin-phone.png';
-
 const CHANNELS = Object.freeze([
   { id: 'weixin', label: '微信' },
   { id: 'feishu', label: '飞书' },
@@ -132,13 +130,7 @@ export function IMSettingsTab({
     h('section', { className: 'dim-page', 'aria-label': 'IM机器人设置' },
     h('header', { className: 'dim-title' },
       h('div', { className: 'dim-brand' },
-        h('img', {
-          className: 'dim-brandLogo',
-          src: IM_PLUGIN_LOGO_URL,
-          alt: 'dsh-im',
-          width: 48,
-          height: 48,
-        }),
+        h('strong', { className: 'dim-brandName' }, 'DSH-IM'),
         h('p', null, '让 DeepSeek Harness 触手可及')),
       h('span', { className: 'dim-githubAction' },
         h('a', {

plugin-src/client/styles.js

@@ -12,9 +12,9 @@ const CSS = String.raw`
 }
 .dim-page *, .dim-page *::before, .dim-page *::after { box-sizing: border-box; }
 .dim-title { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0 0 18px; }
-.dim-brand { min-width: 0; display: flex; align-items: center; gap: 12px; }
-.dim-brandLogo { width: 48px; height: 48px; flex: 0 0 48px; display: block; object-fit: contain; }
-.dim-title p { margin: 0; color: var(--dsw-alias-label-primary, #1f2329); font-size: 14px; line-height: 20px; font-weight: 600; white-space: nowrap; }
+.dim-brand { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 1px; }
+.dim-brandName { color: var(--dsw-alias-label-primary, #1f2329); font-size: 20px; line-height: 24px; font-weight: 800; letter-spacing: .04em; }
+.dim-title p { margin: 0; color: var(--dsw-alias-label-secondary, #646a73); font-size: 12px; line-height: 18px; font-weight: 500; white-space: nowrap; }
 .dim-githubAction { position: relative; display: inline-flex; flex: none; }
 .dim-githubLink { min-height: 30px; display: inline-flex; align-items: center; gap: 5px; flex: none; padding: 0 10px; border: 1px solid var(--dsw-alias-border-l2, #dfe1e5); border-radius: 8px; color: var(--dsw-alias-label-secondary, #646a73); background: var(--dsw-alias-bg-layer-1, #fff); font-size: 12px; line-height: normal; font-weight: 560; text-decoration: none; transition: border-color .15s ease, color .15s ease, background .15s ease; }
 .dim-githubLink:hover { border-color: #aeb3bb; color: var(--dsw-alias-label-primary, #1f2329); background: var(--dsw-alias-interactive-bg-hover, #f7f8fa); }

test/client-ui.test.mjs

@@ -113,7 +113,8 @@ test('IM settings renders nine compact logo channel tabs without enable switches
   assert.match(markup, /IM机器人/);
   assert.match(markup, /让 DeepSeek Harness 触手可及/);
   assert.match(markup, /class="dim-brand"/);
-  assert.match(markup, /<img class="dim-brandLogo" src="assets\/logo-plugin-phone\.png" alt="dsh-im" width="48" height="48"\/>/);
+  assert.match(markup, /<strong class="dim-brandName">DSH-IM<\/strong>/);
+  assert.doesNotMatch(markup, /dim-brandLogo|<img/);
   assert.match(markup, /href="https:\/\/github\.com\/xmanrui\/dsh-im"/);
   assert.match(markup, /target="_blank"/);
   assert.match(markup, /rel="noopener noreferrer"/);
@@ -121,10 +122,10 @@ test('IM settings renders nine compact logo channel tabs without enable switches
   assert.match(markup, /aria-describedby="[^"]+"/);
   assert.match(markup, /role="tooltip"[^>]*>帮助与反馈 · 前往 GitHub</);
   assert.match(styles, /\.dim-title \{[^}]*margin: 0 0 18px;/);
-  assert.match(styles, /\.dim-title p \{[^}]*color: var\(--dsw-alias-label-primary, #1f2329\);[^}]*font-size: 14px;[^}]*font-weight: 600;/);
-  assert.match(styles, /\.dim-brand \{[^}]*display: flex;[^}]*align-items: center;[^}]*gap: 12px;/);
-  assert.match(styles, /\.dim-brandLogo \{[^}]*width: 48px;[^}]*height: 48px;[^}]*object-fit: contain;/);
-  assert.doesNotMatch(styles, /\.dim-brandLogo \{[^}]*filter:/);
+  assert.match(styles, /\.dim-title p \{[^}]*color: var\(--dsw-alias-label-secondary, #646a73\);[^}]*font-size: 12px;[^}]*font-weight: 500;/);
+  assert.match(styles, /\.dim-brand \{[^}]*display: flex;[^}]*flex-direction: column;[^}]*align-items: flex-start;[^}]*gap: 1px;/);
+  assert.match(styles, /\.dim-brandName \{[^}]*font-size: 20px;[^}]*font-weight: 800;[^}]*letter-spacing: \.04em;/);
+  assert.doesNotMatch(styles, /\.dim-brandLogo/);
   assert.match(styles, /\.dim-githubLink \{[^}]*border: 1px solid var\(--dsw-alias-border-l2, #dfe1e5\);[^}]*text-decoration: none;/);
   assert.match(styles, /\.dim-githubTooltip \{[^}]*bottom: calc\(100% \+ 8px\);[^}]*transform: translateY\(3px\);/);
   assert.match(styles, /\.dim-githubAction:hover \.dim-githubTooltip, \.dim-githubAction:focus-within \.dim-githubTooltip \{[^}]*opacity: 1;[^}]*visibility: visible;/);