feat(shared): 提取 Trump 共享模块 + SettingsPage 拆分

app/desktop/src/components/settings/cards/AgentMarketCard.tsx

@@ -0,0 +1,39 @@
+import { useTranslation } from 'react-i18next';
+import { Bot } from 'lucide-react';
+import type { CustomAgentMarketItem } from '../sections/AgentMarketSection';
+import { formatTimestamp } from '../utils';
+import styles from '../../SettingsPage.module.css';
+
+export default function AgentMarketCard({ agent }: { agent: CustomAgentMarketItem }) {
+  const { t } = useTranslation();
+  return (
+    <div className={styles.profileCard}>
+      <div className={styles.profileHeader}>
+        <div className={styles.profileIcon}>
+          <Bot size={17} />
+        </div>
+        <div>
+          <strong>{agent.name}</strong>
+          <span>{agent.systemPrompt || t('settings.marketProfileDefaultDesc')}</span>
+        </div>
+        <em className={`${styles.profileStatus} ${styles.profileStatus_available}`}>
+          {t('settings.statusReady')}
+        </em>
+      </div>
+      <div className={styles.profileMeta}>
+        <span>{t('settings.marketCustomAgentId')}: {agent.id}</span>
+        <span>{t('settings.marketAgentType')}: {agent.agentType}</span>
+        <span>{t('settings.marketInstallSource')}: {agent.source}</span>
+        <span>{t('settings.marketPublishStatus')}: {t('settings.statusReady')}</span>
+        {agent.updatedAt ? <span>{t('settings.marketUpdatedAt')}: {formatTimestamp(agent.updatedAt)}</span> : null}
+      </div>
+      <div className={styles.profileMeta}>
+        {agent.capabilities.length > 0 ? (
+          agent.capabilities.map((name) => <span key={name}>{name}</span>)
+        ) : (
+          <span>{t('settings.marketNoCapabilityTags')}</span>
+        )}
+      </div>
+    </div>
+  );
+}

app/desktop/src/components/settings/cards/AliasMappingRow.tsx

@@ -0,0 +1,91 @@
+import { useTranslation } from 'react-i18next';
+import Switch from '../primitives/Switch';
+import SelectControl from '../primitives/SelectControl';
+import type { ReasoningEffortPreference } from '@/stores/modelSettingsStore';
+import styles from '../../SettingsPage.module.css';
+
+const MODEL_OPTIONS = [
+  ['auto', 'Auto'],
+  ['claude-opus-4-7', 'claude-opus-4-7'],
+  ['claude-sonnet-4-6', 'claude-sonnet-4-6'],
+  ['claude-haiku-4-5', 'claude-haiku-4-5'],
+  ['gpt-5.5', 'gpt-5.5'],
+  ['glm-5.1', 'glm-5.1'],
+] as const;
+
+const PROVIDER_OPTIONS = [
+  ['tokendance-relay', 'TokenDance Relay'],
+  ['anthropic', 'Anthropic'],
+  ['openai', 'OpenAI'],
+  ['cc-switch-local', 'cc-switch local'],
+] as const;
+
+const REASONING_OPTIONS = [
+  ['low', 'Low'],
+  ['medium', 'Medium'],
+  ['high', 'High'],
+  ['max', 'Max'],
+] as const;
+
+interface AliasMappingRowProps {
+  alias: string;
+  model: string;
+  provider: string;
+  reasoningEffort: ReasoningEffortPreference;
+  enabled: boolean;
+  onToggle: () => void;
+  onModelChange: (model: string) => void;
+  onProviderChange: (provider: string) => void;
+  onReasoningChange: (reasoningEffort: ReasoningEffortPreference) => void;
+}
+
+export default function AliasMappingRow({
+  alias,
+  model,
+  provider,
+  reasoningEffort,
+  enabled,
+  onToggle,
+  onModelChange,
+  onProviderChange,
+  onReasoningChange,
+}: AliasMappingRowProps) {
+  const { t } = useTranslation();
+  return (
+    <div className={styles.modelAliasRow}>
+      <div className={styles.modelAliasHead}>
+        <div>
+          <strong>{alias}</strong>
+          <span>{t('settings.modelAliasRoute', { model, provider })}</span>
+        </div>
+        <Switch checked={enabled} onChange={onToggle} />
+      </div>
+      <div className={styles.modelAliasControls}>
+        <label>
+          <span>{t('settings.modelAliasModel')}</span>
+          <SelectControl
+            value={model}
+            options={MODEL_OPTIONS.filter(([value]) => value !== 'auto').map(([value, label]) => [value, label])}
+            onChange={onModelChange}
+          />
+        </label>
+        <label>
+          <span>{t('settings.modelAliasProvider')}</span>
+          <SelectControl
+            value={provider}
+            options={PROVIDER_OPTIONS.map(([value, label]) => [value, label])}
+            onChange={onProviderChange}
+          />
+        </label>
+        <label>
+          <span>{t('settings.modelAliasReasoning')}</span>
+          <SelectControl
+            value={reasoningEffort}
+            options={REASONING_OPTIONS.map(([value, label]) => [value, label])}
+            onChange={(value) => onReasoningChange(value as ReasoningEffortPreference)}
+          />
+        </label>
+      </div>
+    </div>
+  );
+}

app/desktop/src/components/settings/cards/HubFriendRequestRow.tsx

@@ -0,0 +1,26 @@
+import { useTranslation } from 'react-i18next';
+import { UserCircle } from 'lucide-react';
+import type { FriendRequestInfo } from '@/api/hubClient';
+import { formatTimestamp } from '../utils';
+import styles from '../../SettingsPage.module.css';
+
+export default function HubFriendRequestRow({ request }: { request: FriendRequestInfo }) {
+  const { t } = useTranslation();
+  return (
+    <div className={styles.taskRow}>
+      <div className={styles.connectionIcon}>
+        <UserCircle size={17} />
+      </div>
+      <div className={styles.settingCopy}>
+        <strong>{request.nickname || request.username || request.user_id}</strong>
+        <span>{request.message || t('settings.onlineImFriendRequestNoMessage')}</span>
+        <div className={styles.taskMeta}>
+          <span>{t('settings.onlineImFriendRequests')}</span>
+          <span>{request.user_id}</span>
+          <span>{formatTimestamp(request.created_at)}</span>
+        </div>
+      </div>
+      <span className={styles.statusPill}>{t('settings.readOnly')}</span>
+    </div>
+  );
+}

app/desktop/src/components/settings/cards/HubNotificationRow.tsx

@@ -0,0 +1,34 @@
+import { useTranslation } from 'react-i18next';
+import { Globe2 } from 'lucide-react';
+import type { HubNotification } from '@/api/hubClient';
+import { formatTimestamp, parseNotificationPayload } from '../utils';
+import styles from '../../SettingsPage.module.css';
+
+export default function HubNotificationRow({ notification }: { notification: HubNotification }) {
+  const { t } = useTranslation();
+  const payload = parseNotificationPayload(notification.payload);
+  const title = payload.title || payload.subject || notification.type || notification.id;
+  const body =
+    payload.content ||
+    payload.message ||
+    payload.text ||
+    payload.body ||
+    t('settings.onlineImNotificationNoBody');
+  return (
+    <div className={styles.taskRow}>
+      <div className={styles.connectionIcon}>
+        <Globe2 size={17} />
+      </div>
+      <div className={styles.settingCopy}>
+        <strong>{title}</strong>
+        <span>{body}</span>
+        <div className={styles.taskMeta}>
+          <span>{notification.read ? t('settings.onlineImNotificationRead') : t('settings.onlineImNotificationUnread')}</span>
+          <span>{notification.type || t('settings.onlineImNotifications')}</span>
+          <span>{formatTimestamp(notification.created_at)}</span>
+        </div>
+      </div>
+      <span className={styles.statusPill}>{t('settings.readOnly')}</span>
+    </div>
+  );
+}

app/desktop/src/components/settings/cards/HubSessionRow.tsx

@@ -0,0 +1,34 @@
+import { useTranslation } from 'react-i18next';
+import { MessageSquareText } from 'lucide-react';
+import type { Session } from '@/api/hubClient';
+import { shortId, formatTimestamp } from '../utils';
+import styles from '../../SettingsPage.module.css';
+
+function sessionIdOfSettings(session: Session) {
+  return session.session_id ?? session.id ?? 'session';
+}
+
+export default function HubSessionRow({ session }: { session: Session }) {
+  const { t } = useTranslation();
+  const sessionId = sessionIdOfSettings(session);
+  const timestamp = session.last_message_at ?? session.updated_at ?? session.created_at;
+  return (
+    <div className={styles.taskRow}>
+      <div className={styles.connectionIcon}>
+        <MessageSquareText size={17} />
+      </div>
+      <div className={styles.settingCopy}>
+        <strong>{session.name || shortId(sessionId)}</strong>
+        <span>{sessionId}</span>
+        <div className={styles.taskMeta}>
+          <span>{session.type}</span>
+          <span>{t('settings.memberCount', { count: session.member_count ?? session.members?.length ?? 0 })}</span>
+          <span>{formatTimestamp(timestamp)}</span>
+        </div>
+      </div>
+      <span className={`${styles.statusPill} ${styles.statusPillOn}`}>
+        {t('settings.enabled')}
+      </span>
+    </div>
+  );
+}

app/desktop/src/components/settings/cards/HubTaskRow.tsx

@@ -0,0 +1,27 @@
+import { useTranslation } from 'react-i18next';
+import { ClipboardList } from 'lucide-react';
+import type { AgentTask } from '@/stores/taskBridgeStore';
+import { isActiveBridgeTask, shortId } from '../utils';
+import styles from '../../SettingsPage.module.css';
+
+export default function HubTaskRow({ task }: { task: AgentTask }) {
+  const { t } = useTranslation();
+  return (
+    <div className={styles.taskRow}>
+      <div className={styles.connectionIcon}>
+        <ClipboardList size={17} />
+      </div>
+      <div className={styles.settingCopy}>
+        <strong>{shortId(task.taskId)}</strong>
+        <span>{task.prompt}</span>
+        <div className={styles.taskMeta}>
+          <span>{task.agentId}</span>
+          <span>{task.runId ? shortId(task.runId) : t('settings.taskUnbound')}</span>
+        </div>
+      </div>
+      <span className={`${styles.statusPill} ${isActiveBridgeTask(task) ? styles.statusPillOn : ''}`}>
+        {t(`settings.taskStatus.${task.status}`, { defaultValue: task.status })}
+      </span>
+    </div>
+  );
+}

app/desktop/src/components/settings/cards/LocalAgentProfileCard.tsx

@@ -0,0 +1,42 @@
+import { useTranslation } from 'react-i18next';
+import { Bot } from 'lucide-react';
+import type { AgentInfo } from '@shared/types';
+import type { ResolvedRunModelSettings } from '@/stores/modelSettingsStore';
+import styles from '../../SettingsPage.module.css';
+
+interface LocalAgentProfileCardProps {
+  agent: AgentInfo;
+  alias?: string;
+  route: ResolvedRunModelSettings;
+  edgeOnline: boolean;
+}
+
+export default function LocalAgentProfileCard({ agent, alias, route, edgeOnline }: LocalAgentProfileCardProps) {
+  const { t } = useTranslation();
+  const profileReady = edgeOnline && agent.status === 'available';
+  return (
+    <div className={styles.profileCard}>
+      <div className={styles.profileHeader}>
+        <div className={styles.profileIcon}>
+          <Bot size={17} />
+        </div>
+        <div>
+          <strong>{t('settings.localProfileName', { runtime: agent.name })}</strong>
+          <span>{t('settings.localProfileDesc')}</span>
+        </div>
+        <em className={`${styles.profileStatus} ${profileReady ? styles.profileStatus_available : styles.profileStatus_configuring}`}>
+          {profileReady ? t('settings.enabled') : t('settings.notConfigured')}
+        </em>
+      </div>
+      <div className={styles.profileMeta}>
+        <span>{t('settings.profileRuntime')}: {agent.id}</span>
+        <span>{t('settings.profileModel')}: {route.model ?? t('prompt.routeAuto')}</span>
+        <span>{t('settings.modelAliasProvider')}: {route.provider ?? t('prompt.routeAuto')}</span>
+        <span>{t('settings.modelAliasReasoning')}: {route.reasoningEffort ?? t('prompt.routeAuto')}</span>
+        {alias ? <span>{t('settings.profileAlias')}: {alias}</span> : null}
+        <span>{t('settings.executionTargets')}: {t('settings.targetLocalEdge')}</span>
+        <span>{t('settings.profileConfigSource')}: AGENTS.md / memory / skills</span>
+      </div>
+    </div>
+  );
+}

app/desktop/src/components/settings/cards/McpRuntimeCard.tsx

@@ -0,0 +1,31 @@
+import { useTranslation } from 'react-i18next';
+import { Plug } from 'lucide-react';
+import type { AgentInfo } from '@shared/types';
+import styles from '../../SettingsPage.module.css';
+
+export default function McpRuntimeCard({ agent }: { agent: AgentInfo }) {
+  const { t } = useTranslation();
+  const { mcpIntegration, permissionHooks, subAgentSpawn } = agent.capabilities;
+  return (
+    <div className={styles.profileCard}>
+      <div className={styles.profileHeader}>
+        <div className={styles.profileIcon}>
+          <Plug size={17} />
+        </div>
+        <div>
+          <strong>{agent.name}</strong>
+          <span>{agent.description || t('settings.mcpRuntimeDefaultDesc')}</span>
+        </div>
+        <em className={`${styles.profileStatus} ${mcpIntegration ? styles.profileStatus_available : styles.profileStatus_configuring}`}>
+          {mcpIntegration ? t('settings.statusReady') : t('settings.notConfigured')}
+        </em>
+      </div>
+      <div className={styles.profileMeta}>
+        <span>{t('settings.profileRuntime')}: {agent.id}</span>
+        <span>{t('settings.mcpIntegration')}: {mcpIntegration ? t('settings.enabled') : t('settings.notConfigured')}</span>
+        <span>{t('settings.mcpPermissionHooks')}: {permissionHooks ? t('settings.enabled') : t('settings.notConfigured')}</span>
+        <span>{t('settings.mcpSubAgentSpawn')}: {subAgentSpawn ? t('settings.enabled') : t('settings.notConfigured')}</span>
+      </div>
+    </div>
+  );
+}

app/desktop/src/components/settings/cards/ProjectSkillCard.tsx

@@ -0,0 +1,29 @@
+import { useTranslation } from 'react-i18next';
+import { Code2 } from 'lucide-react';
+import type { ProjectSkill } from '../sections/SkillsSection';
+import styles from '../../SettingsPage.module.css';
+
+export default function ProjectSkillCard({ skill }: { skill: ProjectSkill }) {
+  const { t } = useTranslation();
+  return (
+    <div className={styles.profileCard}>
+      <div className={styles.profileHeader}>
+        <div className={styles.profileIcon}>
+          <Code2 size={17} />
+        </div>
+        <div>
+          <strong>{skill.title}</strong>
+          <span>{t(skill.descriptionKey)}</span>
+        </div>
+        <em className={`${styles.profileStatus} ${skill.status === 'ready' ? styles.profileStatus_available : styles.profileStatus_configuring}`}>
+          {skill.status === 'ready' ? t('settings.statusReady') : t('settings.statusInProgress')}
+        </em>
+      </div>
+      <div className={styles.profileMeta}>
+        <span>{t('settings.skillLocalRegistry')}: .agents/skills/{skill.id}</span>
+        <span>{t('settings.skillScripts')}: {skill.hasScripts ? t('settings.enabled') : t('settings.notConfigured')}</span>
+        <span>{t('settings.skillReferences')}: {skill.hasReferences ? t('settings.enabled') : t('settings.notConfigured')}</span>
+      </div>
+    </div>
+  );
+}