fix: resolve client icons for names with server suffix (e.g. "Claude Code (mcpmux)")

The client icon lookup used exact matching on the full client_name, so
clients like Claude Code that register as "Claude Code (mcpmux)" did
not get the Claude icon. Extract resolveKnownClientKey() with
prefix-aware matching into a dedicated utility and cover with 22 tests.

https://claude.ai/code/session_012WNYFCB7MMMdy6zCSMAUdQ

Author: claude

apps/desktop/src/features/clients/ClientsPage.tsx

@@ -4,6 +4,7 @@ import cursorIcon from '@/assets/client-icons/cursor.svg';
 import vscodeIcon from '@/assets/client-icons/vscode.png';
 import claudeIcon from '@/assets/client-icons/claude.svg';
 import windsurfIcon from '@/assets/client-icons/windsurf.svg';
+import { resolveKnownClientKey } from '@/lib/clientIcons';
 import {
   Laptop,
   Loader2,
@@ -79,21 +80,18 @@ const CONNECTION_MODES = [
   },
 ];
 
-// Bundled icons for well-known AI clients (matched by client_name)
-const KNOWN_CLIENT_ICONS: Record<string, string> = {
+// Bundled icons for well-known AI clients (resolved via icon key)
+const CLIENT_ICON_ASSETS: Record<string, string> = {
   cursor: cursorIcon,
-  'vs code': vscodeIcon,
   vscode: vscodeIcon,
-  'visual studio code': vscodeIcon,
-  'claude desktop': claudeIcon,
   claude: claudeIcon,
   windsurf: windsurfIcon,
-  codeium: windsurfIcon,
 };
 
 // Client icon component — uses bundled icon for known clients, falls back to logo_uri, then emoji
 function ClientIcon({ logo_uri, client_name }: { logo_uri?: string | null; client_name: string }) {
-  const iconUrl = KNOWN_CLIENT_ICONS[client_name.toLowerCase()] || logo_uri;
+  const knownKey = resolveKnownClientKey(client_name);
+  const iconUrl = (knownKey && CLIENT_ICON_ASSETS[knownKey]) || logo_uri;
   if (iconUrl) {
     return (
       <img

apps/desktop/src/lib/clientIcons.ts

@@ -0,0 +1,45 @@
+/**
+ * Known client name patterns mapped to icon keys.
+ * Sorted by specificity (longer patterns first) so that more specific
+ * names like "claude desktop" match before the shorter "claude".
+ */
+const KNOWN_CLIENT_PATTERNS: { pattern: string; iconKey: string }[] = [
+  { pattern: 'visual studio code', iconKey: 'vscode' },
+  { pattern: 'claude desktop', iconKey: 'claude' },
+  { pattern: 'claude code', iconKey: 'claude' },
+  { pattern: 'vs code', iconKey: 'vscode' },
+  { pattern: 'windsurf', iconKey: 'windsurf' },
+  { pattern: 'codeium', iconKey: 'windsurf' },
+  { pattern: 'cursor', iconKey: 'cursor' },
+  { pattern: 'vscode', iconKey: 'vscode' },
+  { pattern: 'claude', iconKey: 'claude' },
+];
+
+/**
+ * Resolves a client name to a known icon key.
+ *
+ * Handles exact matches ("Cursor") as well as names that include extra
+ * context such as "Claude Code (mcpmux)" — the parenthesised suffix
+ * is ignored as long as the prefix matches a known client pattern.
+ *
+ * Returns the icon key (e.g. "claude", "cursor") or null when the name
+ * is not recognised.
+ */
+export function resolveKnownClientKey(clientName: string): string | null {
+  const normalized = clientName.toLowerCase().trim();
+
+  for (const { pattern, iconKey } of KNOWN_CLIENT_PATTERNS) {
+    if (normalized === pattern) {
+      return iconKey;
+    }
+    // Accept prefix match only when followed by a word boundary (' ' or '(')
+    if (
+      normalized.startsWith(pattern) &&
+      (normalized[pattern.length] === ' ' || normalized[pattern.length] === '(')
+    ) {
+      return iconKey;
+    }
+  }
+
+  return null;
+}

tests/ts/lib/clientIcons.test.ts

@@ -0,0 +1,103 @@
+import { describe, it, expect } from 'vitest';
+import { resolveKnownClientKey } from '../../../apps/desktop/src/lib/clientIcons';
+
+describe('resolveKnownClientKey', () => {
+  describe('exact matches', () => {
+    it('should resolve "cursor" to cursor', () => {
+      expect(resolveKnownClientKey('cursor')).toBe('cursor');
+    });
+
+    it('should resolve "Cursor" (case-insensitive) to cursor', () => {
+      expect(resolveKnownClientKey('Cursor')).toBe('cursor');
+    });
+
+    it('should resolve "claude" to claude', () => {
+      expect(resolveKnownClientKey('claude')).toBe('claude');
+    });
+
+    it('should resolve "Claude Desktop" to claude', () => {
+      expect(resolveKnownClientKey('Claude Desktop')).toBe('claude');
+    });
+
+    it('should resolve "vs code" to vscode', () => {
+      expect(resolveKnownClientKey('vs code')).toBe('vscode');
+    });
+
+    it('should resolve "vscode" to vscode', () => {
+      expect(resolveKnownClientKey('vscode')).toBe('vscode');
+    });
+
+    it('should resolve "Visual Studio Code" to vscode', () => {
+      expect(resolveKnownClientKey('Visual Studio Code')).toBe('vscode');
+    });
+
+    it('should resolve "windsurf" to windsurf', () => {
+      expect(resolveKnownClientKey('windsurf')).toBe('windsurf');
+    });
+
+    it('should resolve "codeium" to windsurf', () => {
+      expect(resolveKnownClientKey('codeium')).toBe('windsurf');
+    });
+  });
+
+  describe('prefix matches with parenthesised suffix', () => {
+    it('should resolve "Claude Code (mcpmux)" to claude', () => {
+      expect(resolveKnownClientKey('Claude Code (mcpmux)')).toBe('claude');
+    });
+
+    it('should resolve "Claude Desktop (some-server)" to claude', () => {
+      expect(resolveKnownClientKey('Claude Desktop (some-server)')).toBe('claude');
+    });
+
+    it('should resolve "Cursor (my-project)" to cursor', () => {
+      expect(resolveKnownClientKey('Cursor (my-project)')).toBe('cursor');
+    });
+
+    it('should resolve "VS Code (workspace)" to vscode', () => {
+      expect(resolveKnownClientKey('VS Code (workspace)')).toBe('vscode');
+    });
+
+    it('should resolve "Windsurf (test)" to windsurf', () => {
+      expect(resolveKnownClientKey('Windsurf (test)')).toBe('windsurf');
+    });
+  });
+
+  describe('prefix matches with space-separated suffix', () => {
+    it('should resolve "Claude Code v2" to claude', () => {
+      expect(resolveKnownClientKey('Claude Code v2')).toBe('claude');
+    });
+
+    it('should resolve "Cursor beta" to cursor', () => {
+      expect(resolveKnownClientKey('Cursor beta')).toBe('cursor');
+    });
+  });
+
+  describe('non-matching names', () => {
+    it('should return null for unknown client names', () => {
+      expect(resolveKnownClientKey('unknown-client')).toBeNull();
+    });
+
+    it('should return null for empty string', () => {
+      expect(resolveKnownClientKey('')).toBeNull();
+    });
+
+    it('should not match partial names without word boundary', () => {
+      // "claudeXYZ" should NOT match "claude" — no word boundary
+      expect(resolveKnownClientKey('claudeXYZ')).toBeNull();
+    });
+
+    it('should not match "cursorify" (no word boundary)', () => {
+      expect(resolveKnownClientKey('cursorify')).toBeNull();
+    });
+  });
+
+  describe('whitespace handling', () => {
+    it('should trim leading/trailing whitespace', () => {
+      expect(resolveKnownClientKey('  Cursor  ')).toBe('cursor');
+    });
+
+    it('should handle whitespace with suffix', () => {
+      expect(resolveKnownClientKey('  Claude Code (mcpmux)  ')).toBe('claude');
+    });
+  });
+});