@yancyyu/openhermit 1.6.38 → 1.6.39

package/src/renderer/components/common/TerminalPane.tsx

@@ -0,0 +1,213 @@
+/**
+ * TerminalPane - Reusable xterm.js terminal pane.
+ *
+ * Extracted from SystemManagerView so any team or panel can embed
+ * a terminal connected to a PTY process.
+ *
+ * Lifecycle:
+ *  - Mount: creates Terminal + FitAddon, registers SSE listeners
+ *  - `spawn()` call or autoSpawn: starts a CLI process via the terminal API
+ *  - Unmount: kills PTY, disposes terminal
+ */
+import React, { useCallback, useEffect, useImperativeHandle, useRef } from 'react';
+import { FitAddon } from '@xterm/addon-fit';
+import { WebLinksAddon } from '@xterm/addon-web-links';
+import { Terminal } from '@xterm/xterm';
+
+import { api } from '@renderer/api';
+import { cn } from '@renderer/lib/utils';
+
+// =============================================================================
+// Types
+// =============================================================================
+
+export interface TerminalSpawnOptions {
+  command: string;
+  args: string[];
+  cwd: string;
+}
+
+interface TerminalPaneProps {
+  /** Extra class names for the container */
+  className?: string;
+  /** Called after a PTY is spawned successfully */
+  onSpawned?: (ptyId: string) => void;
+  /** Called when the PTY exits */
+  onExit?: (ptyId: string, exitCode: number) => void;
+  /** Auto-spawn config. When provided, auto-spawns on mount. */
+  autoSpawn?: TerminalSpawnOptions;
+}
+
+export interface TerminalPaneRef {
+  spawn: (options: TerminalSpawnOptions) => Promise<void>;
+}
+
+// =============================================================================
+// TerminalPane
+// =============================================================================
+
+export const TerminalPane = React.forwardRef<TerminalPaneRef, TerminalPaneProps>(
+  function TerminalPane({ className, onSpawned, onExit, autoSpawn }, ref) {
+    const hostRef = useRef<HTMLDivElement>(null);
+    const terminalRef = useRef<Terminal | null>(null);
+    const fitAddonRef = useRef<FitAddon | null>(null);
+    const ptyIdRef = useRef<string | null>(null);
+    const spawnedRef = useRef(false);
+
+    const fitTerminal = useCallback(() => {
+      try {
+        fitAddonRef.current?.fit();
+        if (ptyIdRef.current && terminalRef.current) {
+          api.terminal.resize(ptyIdRef.current, terminalRef.current.cols, terminalRef.current.rows);
+        }
+      } catch {
+        // xterm fit can throw when the element is not measurable yet
+      }
+    }, []);
+
+    // Expose spawn method via ref
+    useImperativeHandle(ref, () => ({
+      spawn: async (options: TerminalSpawnOptions) => {
+        // Kill existing PTY if any
+        if (ptyIdRef.current) {
+          try { await api.terminal.kill(ptyIdRef.current); } catch {}
+          ptyIdRef.current = null;
+        }
+        // Clear stale terminal content before spawning new process
+        terminalRef.current?.clear();
+        try {
+          const ptyId = await api.terminal.spawn(options);
+          ptyIdRef.current = ptyId;
+          spawnedRef.current = true;
+          fitTerminal();
+          onSpawned?.(ptyId);
+        } catch (err) {
+          terminalRef.current?.writeln(
+            `\x1b[31m[Failed to spawn: ${err instanceof Error ? err.message : String(err)}]\x1b[0m`
+          );
+        }
+      },
+    }), [fitTerminal, onSpawned]);
+
+    // Create terminal instance
+    useEffect(() => {
+      const host = hostRef.current;
+      if (!host) return;
+
+      const term = new Terminal({
+        cursorBlink: true,
+        convertEol: true,
+        fontFamily: 'JetBrains Mono, SFMono-Regular, Menlo, Monaco, Consolas, monospace',
+        fontSize: 13,
+        lineHeight: 1.28,
+        theme: {
+          background: 'var(--color-surface)',
+          foreground: 'var(--color-text)',
+          cursor: 'var(--color-text)',
+          selectionBackground: 'var(--color-border-emphasis)',
+          black: 'var(--color-surface-sidebar)',
+          red: '#f87171',
+          green: '#86efac',
+          yellow: '#fde68a',
+          blue: 'var(--color-accent)',
+          magenta: '#d8b4fe',
+          cyan: '#67e8f9',
+          white: 'var(--color-text)',
+        },
+      });
+
+      const fitAddon = new FitAddon();
+      term.loadAddon(fitAddon);
+      term.loadAddon(new WebLinksAddon());
+      term.open(host);
+      terminalRef.current = term;
+      fitAddonRef.current = fitAddon;
+      fitTerminal();
+
+      // SSE listeners
+      const dataDispose = api.terminal.onData((_event, ptyId, data) => {
+        if (ptyId === ptyIdRef.current) term.write(data);
+      });
+      const exitDispose = api.terminal.onExit((_event, ptyId, exitCode) => {
+        if (ptyId === ptyIdRef.current) {
+          term.writeln(`\r\n\x1b[90m[process exited with code ${exitCode}]\x1b[0m`);
+          onExit?.(ptyId, exitCode);
+          ptyIdRef.current = null;
+          spawnedRef.current = false;
+        }
+      });
+
+      // Input forwarding
+      const inputDispose = term.onData((data) => {
+        if (ptyIdRef.current) api.terminal.write(ptyIdRef.current, data);
+      });
+
+      // Resize observer
+      const resizeObserver = new ResizeObserver(() => fitTerminal());
+      resizeObserver.observe(host);
+
+      return () => {
+        dataDispose();
+        exitDispose();
+        inputDispose.dispose();
+        resizeObserver.disconnect();
+        if (ptyIdRef.current) {
+          void api.terminal.kill(ptyIdRef.current).catch(() => {});
+        }
+        term.dispose();
+        terminalRef.current = null;
+        fitAddonRef.current = null;
+        ptyIdRef.current = null;
+      };
+    }, [fitTerminal, onExit]);
+
+    // Auto-spawn
+    // Two issues combined to prevent the CLI from ever spawning:
+    //  1. React StrictMode mounts → unmounts → remounts. The first mount set
+    //     spawnedRef = true and started a 200ms timer; cleanup cleared the timer
+    //     but NOT the ref. The second mount saw spawnedRef === true → skipped.
+    //  2. The parent passes an inline object literal as autoSpawn, producing a
+    //     new reference each render. With the raw object in deps, every render
+    //     re-ran the effect, whose cleanup cleared the timeout. spawnedRef was
+    //     already true, so the retry path was blocked.
+    // Fix: reset spawnedRef in cleanup so StrictMode remount can retry, and use
+    // a stable string key derived from autoSpawn content instead of the object.
+    const autoSpawnKey = autoSpawn
+      ? `${autoSpawn.command}\0${autoSpawn.args.join(',')}\0${autoSpawn.cwd}`
+      : undefined;
+
+    useEffect(() => {
+      if (!autoSpawnKey || spawnedRef.current) return;
+      spawnedRef.current = true;
+
+      const spawnOpts = autoSpawn!;
+
+      const doSpawn = async () => {
+        try {
+          const ptyId = await api.terminal.spawn(spawnOpts);
+          ptyIdRef.current = ptyId;
+          fitTerminal();
+          onSpawned?.(ptyId);
+        } catch (err) {
+          terminalRef.current?.writeln(
+            `\x1b[31m[Failed to spawn: ${err instanceof Error ? err.message : String(err)}]\x1b[0m`
+          );
+        }
+      };
+
+      const timer = setTimeout(doSpawn, 200);
+      return () => {
+        clearTimeout(timer);
+        spawnedRef.current = false;
+      };
+      // autoSpawnKey is a stable primitive; autoSpawn is captured via closure.
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [autoSpawnKey, fitTerminal, onSpawned]);
+
+    return (
+      <div className={cn('size-full overflow-hidden', className)}>
+        <div ref={hostRef} className="size-full" />
+      </div>
+    );
+  }
+);

package/src/renderer/components/dashboard/DashboardView.tsx

@@ -7,7 +7,7 @@ import React from 'react';
 
 import { RecentProjectsSection } from '@features/recent-projects/renderer';
 import { useStore } from '@renderer/store';
-import { PlugZap, Sparkles, Users, Workflow } from 'lucide-react';
+import { Sparkles, Users, Workflow } from 'lucide-react';
 import { useShallow } from 'zustand/react/shallow';
 
 const HIGHLIGHT_HARNESSES = [
@@ -19,16 +19,6 @@ const HIGHLIGHT_HARNESSES = [
   'DeepSeek / IM',
 ];
 
-const HIGHLIGHT_CHANNELS = [
-  'Feishu',
-  'Slack',
-  'Discord',
-  'DingTalk',
-  'WeCom',
-  'Telegram',
-  'Webhook / API',
-];
-
 export const DashboardView = (): React.JSX.Element => {
   const { openTeamsTab, openSettingsTab, teams, teamsLoading } = useStore(
     useShallow((state) => ({
@@ -58,8 +48,7 @@ export const DashboardView = (): React.JSX.Element => {
               Hermit：一人公司的 AI 团队控制台
             </h1>
             <p className="mt-2 text-sm text-text-secondary">
-              几乎覆盖所有主流
-              Harness，支持全渠道接入，把团队编排、消息协作、任务推进和运行状态放在同一个工作台。
+              几乎覆盖所有主流 Harness，把团队编排、消息协作、任务推进和运行状态放在同一个工作台。
             </p>
           </div>
           <div className="grid gap-4 px-6 py-5 md:grid-cols-3">
@@ -82,21 +71,14 @@ export const DashboardView = (): React.JSX.Element => {
             </div>
             <div className="rounded-lg border border-border bg-surface px-4 py-3">
               <div className="mb-2 inline-flex items-center gap-1.5 text-xs font-medium text-text-secondary">
-                <PlugZap className="size-3.5" />
-                渠道接入
+                <Sparkles className="size-3.5" />
+                会话洞察
               </div>
               <p className="text-xs text-text-muted">
-                统一托管企业 IM、社区渠道和 Webhook/API，消息流和任务流自动对齐。
+                汇总本地会话、任务、消息和 Token 使用情况，帮助你判断团队执行状态。
               </p>
-              <div className="mt-3 flex flex-wrap gap-1.5">
-                {HIGHLIGHT_CHANNELS.map((channel) => (
-                  <span
-                    key={channel}
-                    className="rounded-md border border-border bg-surface-overlay px-2 py-1 text-[11px] text-text-secondary"
-                  >
-                    {channel}
-                  </span>
-                ))}
+              <div className="mt-3 rounded-md border border-border bg-surface-overlay px-2.5 py-2 text-[11px] text-text-muted">
+                会话记录 → 使用统计 → 身份识别 → 导出复盘
               </div>
             </div>
             <div className="rounded-lg border border-border bg-surface px-4 py-3">
@@ -130,7 +112,7 @@ export const DashboardView = (): React.JSX.Element => {
             <p className="mt-1 text-xs text-text-muted">
               首次使用会看到空白首页。按下面步骤配置后，就会出现团队和项目内容。
             </p>
-            <div className="mt-4 grid gap-3 md:grid-cols-3">
+            <div className="mt-4 grid gap-3 md:grid-cols-2">
               <button
                 type="button"
                 onClick={() => openSettingsTab('harness')}
@@ -140,21 +122,12 @@ export const DashboardView = (): React.JSX.Element => {
                 <p className="mt-1 text-sm font-medium text-text">配置 Harness</p>
                 <p className="mt-1 text-xs text-text-muted">连接 Claude/Codex/Gemini 等运行时</p>
               </button>
-              <button
-                type="button"
-                onClick={() => openSettingsTab('channels')}
-                className="rounded-lg border border-border bg-surface px-3 py-3 text-left transition-colors hover:bg-surface-overlay"
-              >
-                <p className="text-[11px] font-medium text-text-muted">第 2 步</p>
-                <p className="mt-1 text-sm font-medium text-text">配置渠道</p>
-                <p className="mt-1 text-xs text-text-muted">接入飞书/Slack/Telegram/Webhook</p>
-              </button>
               <button
                 type="button"
                 onClick={openTeamsTab}
                 className="rounded-lg border border-border bg-surface px-3 py-3 text-left transition-colors hover:bg-surface-overlay"
               >
-                <p className="text-[11px] font-medium text-text-muted">第 3 步</p>
+                <p className="text-[11px] font-medium text-text-muted">第 2 步</p>
                 <p className="mt-1 text-sm font-medium text-text">创建团队并启动</p>
                 <p className="mt-1 text-xs text-text-muted">设置工作目录后即可开始分发任务</p>
               </button>

package/src/renderer/components/extensions/ExtensionStoreView.tsx

@@ -31,25 +31,15 @@ import { useStore } from '@renderer/store';
 import { createLoadingMultimodelCliStatus } from '@renderer/store/slices/cliInstallerSlice';
 import {
   filterExtensionStoreProviders,
-  formatCliExtensionCapabilityStatus,
   getVisibleMultimodelProviders,
   isMultimodelRuntimeStatus,
 } from '@renderer/utils/multimodelProviderVisibility';
 import { resolveProjectPathById } from '@renderer/utils/projectLookup';
 import { refreshCliStatusForCurrentMode } from '@renderer/utils/refreshCliStatus';
 import { getRuntimeDisplayName } from '@renderer/utils/runtimeDisplayName';
-import { getCliProviderExtensionCapabilities } from '@shared/utils/providerExtensionCapabilities';
-import {
-  AlertTriangle,
-  Info,
-  Loader2,
-  Puzzle,
-  RefreshCw,
-  Sliders,
-} from 'lucide-react';
+import { AlertTriangle, Info, Loader2, Puzzle, RefreshCw } from 'lucide-react';
 import { useShallow } from 'zustand/react/shallow';
 
-import { EnvVarPanel } from './env/EnvVarPanel';
 import { PluginsPanel } from './plugins/PluginsPanel';
 import { StoreExtensionToast } from './common/ExtensionToast';
 import { ExtensionsSubTabTrigger } from './ExtensionsSubTabTrigger';
@@ -81,7 +71,7 @@ const ProviderCapabilityCardSkeleton = ({
       </Badge>
     </div>
     <div className="mt-2 flex flex-wrap gap-1.5">
-      {Array.from({ length: 3 }, (_, index) => (
+      {Array.from({ length: 4 }, (_, index) => (
         <span
           key={index}
           className="h-7 w-28 animate-pulse rounded-md border border-border bg-surface"
@@ -118,12 +108,6 @@ const EXTENSION_SUB_TABS = [
     icon: Puzzle,
     description: 'Claude Code 私有扩展，增强运行时的能力与集成。',
   },
-  {
-    value: 'env-vars' as const,
-    label: '环境变量',
-    icon: Sliders,
-    description: '管理运行时环境变量，启动 agent 时自动注入。',
-  },
 ] as const;
 
 export const ExtensionStoreView = (): React.JSX.Element => {
@@ -215,7 +199,6 @@ export const ExtensionStoreView = (): React.JSX.Element => {
     [extensionsTabProjectId, projects, repositoryGroups]
   );
   const projectPath = resolvedProject?.path ?? null;
-  const projectLabel = resolvedProject?.name ?? null;
   const subTabs = EXTENSION_SUB_TABS;
 
   useEffect(() => {
@@ -238,11 +221,7 @@ export const ExtensionStoreView = (): React.JSX.Element => {
       bootstrapCliStatus,
       fetchCliStatus,
     });
-  }, [
-    bootstrapCliStatus,
-    fetchCliStatus,
-    multimodelEnabled,
-  ]);
+  }, [bootstrapCliStatus, fetchCliStatus, multimodelEnabled]);
 
   const isRefreshing = effectiveCliStatusLoading;
   const cliStatusBanner = useMemo(() => {
@@ -264,7 +243,7 @@ export const ExtensionStoreView = (): React.JSX.Element => {
           <div>
             <p className="text-sm font-medium text-text">正在检查扩展运行时可用性</p>
             <p className="mt-0.5 text-xs text-text-muted">
-              扩展需要配置好的运行时来管理 MCP 服务器、技能和提供商连接。
+              扩展需要配置好的运行时来管理插件和提供商连接。
             </p>
           </div>
         </div>
@@ -321,101 +300,7 @@ export const ExtensionStoreView = (): React.JSX.Element => {
       );
     }
 
-    if (isMultimodel) {
-      return (
-        <div className="bg-surface/70 mx-4 mt-3 rounded-md border border-border px-4 py-3">
-          <div className="flex items-start gap-3">
-            <Info className="mt-0.5 size-4 shrink-0 text-text-secondary" />
-            <div className="min-w-0 flex-1">
-              <p className="text-sm font-medium text-text">多模型运行时能力</p>
-              <p className="mt-0.5 text-xs text-text-muted">
-                不同区域支持的提供商可能不同。只有运行时明确声明支持时，MCP 与技能能力才会显示。
-              </p>
-            </div>
-          </div>
-          {visibleProviders.length > 0 && (
-            <div className="mt-3 grid gap-2 md:grid-cols-2">
-              {visibleProviders.map((provider) => {
-                const providerLoading = cliProviderStatusLoading[provider.providerId] === true;
-                if (
-                  isProviderCapabilityCardLoading(provider, providerLoading) ||
-                  isCodexSnapshotPending(provider, codexSnapshotPending)
-                ) {
-                  return (
-                    <ProviderCapabilityCardSkeleton
-                      key={provider.providerId}
-                      providerId={provider.providerId}
-                      displayName={provider.displayName}
-                    />
-                  );
-                }
-
-                const statusTone = provider.authenticated
-                  ? 'border-emerald-500/30 bg-emerald-500/5 text-emerald-300'
-                  : provider.supported
-                    ? 'border-amber-500/30 bg-amber-500/5 text-amber-300'
-                    : 'border-border bg-surface-raised text-text-muted';
-                const statusLabel = provider.authenticated
-                  ? '已连接'
-                  : provider.supported
-                    ? '需要设置'
-                    : '不支持';
-                const extensionCapabilities = getCliProviderExtensionCapabilities(provider);
-
-                return (
-                  <div
-                    key={provider.providerId}
-                    className={`rounded-md border px-3 py-2 ${statusTone}`}
-                  >
-                    <div className="flex items-center justify-between gap-2">
-                      <div className="min-w-0">
-                        <p className="inline-flex items-center gap-2 text-sm font-medium">
-                          <ProviderBrandLogo
-                            providerId={provider.providerId}
-                            className="size-4 shrink-0"
-                          />
-                          <span>{provider.displayName}</span>
-                        </p>
-                        <p className="truncate text-[11px] text-text-muted">
-                          {provider.statusMessage ?? provider.backend?.label ?? '可配置'}
-                        </p>
-                      </div>
-                      <Badge variant="outline" className="shrink-0">
-                        {statusLabel}
-                      </Badge>
-                    </div>
-                    <div className="mt-2 flex flex-wrap gap-1.5 text-[11px]">
-                      <Badge variant="secondary">
-                        MCP: {formatCliExtensionCapabilityStatus(extensionCapabilities.mcp.status)}
-                      </Badge>
-                      <Badge variant="secondary">
-                        技能：{extensionCapabilities.skills.ownership}
-                      </Badge>
-                    </div>
-                  </div>
-                );
-              })}
-            </div>
-          )}
-        </div>
-      );
-    }
-
-    return (
-      <div className="mx-4 mt-3 flex items-start gap-3 rounded-md border border-emerald-500/30 bg-emerald-500/5 px-4 py-3">
-        <Info className="mt-0.5 size-4 shrink-0 text-emerald-300" />
-        <div>
-          <p className="text-sm font-medium text-emerald-300">{runtimeDisplayName} 已就绪</p>
-          <p className="mt-0.5 text-xs text-text-muted">
-            可以从此页面管理 MCP 服务器与技能
-            {effectiveCliStatus.installedVersion
-              ? `，使用 ${runtimeDisplayName} ${effectiveCliStatus.installedVersion}`
-              : ''}
-            .
-          </p>
-        </div>
-      </div>
-    );
+    return null;
   }, [
     cliProviderStatusLoading,
     codexSnapshotPending,
@@ -425,7 +310,7 @@ export const ExtensionStoreView = (): React.JSX.Element => {
   ]);
 
   // Browser mode guard
-  if (!api.plugins && !api.mcpRegistry && !api.skills) {
+  if (!api.plugins) {
     return (
       <div className="flex flex-1 items-center justify-center">
         <div className="text-center">
@@ -510,10 +395,6 @@ export const ExtensionStoreView = (): React.JSX.Element => {
                   cliStatusLoading={effectiveCliStatusLoading}
                 />
               </TabsContent>
-
-              <TabsContent value="env-vars" className="mt-0 pt-4">
-                <EnvVarPanel projectPath={projectPath} />
-              </TabsContent>
             </Tabs>
           </div>
         </div>

package/src/renderer/components/extensions/ExtensionsSubTabTrigger.tsx

@@ -5,7 +5,7 @@ import { Info } from 'lucide-react';
 import type { LucideIcon } from 'lucide-react';
 
 interface ExtensionsSubTabTriggerProps {
-  value: 'plugins' | 'mcp-servers' | 'skills' | 'env-vars';
+  value: 'plugins';
   label: string;
   description: string;
   icon: LucideIcon;