@opensumi/ide-ai-native 3.8.1-next-1740452092.0 → 3.8.1-next-1740463566.0

package/src/browser/ai-core.contribution.ts

@@ -72,6 +72,7 @@ import {
   AI_CHAT_LOGO_AVATAR_ID,
   AI_CHAT_VIEW_ID,
   AI_MENU_BAR_DEBUG_TOOLBAR,
+  BUILTIN_MCP_SERVER_NAME,
   ChatProxyServiceToken,
   IChatInternalService,
   IChatManagerService,
@@ -327,15 +328,23 @@ export class AINativeBrowserContribution
       }
 
       if (supportsMCP) {
-        // 初始化内置 MCP Server
-        this.sumiMCPServerBackendProxy.initBuiltinMCPServer();
-
         // 从 preferences 获取并初始化外部 MCP Servers
         const mcpServers = this.preferenceService.getValid<MCPServerDescription[]>(
           AINativeSettingSectionsId.MCPServers,
         );
+
+        // 查找内置 MCP Server 的配置
+        const builtinServer = mcpServers?.find((server) => server.name === BUILTIN_MCP_SERVER_NAME);
+
+        // 总是初始化内置服务器，根据配置决定是否启用
+        this.sumiMCPServerBackendProxy.initBuiltinMCPServer(builtinServer?.enabled ?? true);
+
+        // 初始化其他外部 MCP Servers
         if (mcpServers && mcpServers.length > 0) {
-          this.sumiMCPServerBackendProxy.initExternalMCPServers(mcpServers);
+          const externalServers = mcpServers.filter((server) => server.name !== BUILTIN_MCP_SERVER_NAME);
+          if (externalServers.length > 0) {
+            this.sumiMCPServerBackendProxy.initExternalMCPServers(externalServers);
+          }
         }
       }
     });

package/src/browser/chat/chat-manager.service.ts

@@ -13,6 +13,8 @@ import {
 import { ChatMessageRole, IChatMessage, IHistoryChatMessage } from '@opensumi/ide-core-common/lib/types/ai-native';
 
 import { IChatAgentService, IChatFollowup, IChatRequestMessage, IChatResponseErrorDetails } from '../../common';
+import { LLMContextService, LLMContextServiceToken } from '../../common/llm-context';
+import { ChatAgentPromptProvider } from '../../common/prompts/context-prompt-provider';
 import { MsgHistoryManager } from '../model/msg-history-manager';
 
 import { ChatModel, ChatRequestModel, ChatResponseModel, IChatProgressResponseContent } from './chat-model';
@@ -49,6 +51,12 @@ export class ChatManagerService extends Disposable {
   @Autowired(StorageProvider)
   private storageProvider: StorageProvider;
 
+  @Autowired(ChatAgentPromptProvider)
+  protected readonly promptProvider: ChatAgentPromptProvider;
+
+  @Autowired(LLMContextServiceToken)
+  protected readonly contextService: LLMContextService;
+
   private _chatStorage: IStorage;
 
   protected fromJSON(data: ISessionModel[]) {
@@ -98,11 +106,19 @@ export class ChatManagerService extends Disposable {
   }
 
   startSession() {
-    const model = new ChatModel();
+    const model = new ChatModel({
+      provideContext: this.provideContextPrompt.bind(this),
+    });
     this.#sessionModels.set(model.sessionId, model);
     return model;
   }
 
+  private provideContextPrompt(message: string) {
+    const context = this.contextService.serialize();
+    const fullMessage = this.promptProvider.provideContextPrompt(context, message);
+    return fullMessage;
+  }
+
   getSession(sessionId: string): ChatModel | undefined {
     return this.#sessionModels.get(sessionId);
   }

package/src/browser/chat/chat-model.ts

@@ -274,13 +274,22 @@ export class ChatRequestModel implements IChatRequestModel {
 export class ChatModel extends Disposable implements IChatModel {
   private static requestIdPool = 0;
 
-  constructor(initParams?: { sessionId?: string; history?: MsgHistoryManager; requests?: ChatRequestModel[] }) {
+  private provideContextPrompt?: (string) => string;
+
+  constructor(initParams?: {
+    sessionId?: string;
+    history?: MsgHistoryManager;
+    requests?: ChatRequestModel[];
+    provideContext?: (msg: string) => string;
+  }) {
     super();
     this.#sessionId = initParams?.sessionId ?? uuid();
     this.history = initParams?.history ?? new MsgHistoryManager();
     if (initParams?.requests) {
       this.#requests = new Map(initParams.requests.map((r) => [r.requestId, r]));
     }
+
+    this.provideContextPrompt = initParams?.provideContext;
   }
 
   #sessionId: string;
@@ -300,9 +309,15 @@ export class ChatModel extends Disposable implements IChatModel {
   readonly history: MsgHistoryManager;
 
   addRequest(message: IChatRequestMessage): ChatRequestModel {
+    const msg = message;
+    // first msg
+    if (ChatModel.requestIdPool === 0 && this.provideContextPrompt) {
+      msg.prompt = this.provideContextPrompt(msg.prompt);
+    }
+
     const requestId = `${this.sessionId}_request_${ChatModel.requestIdPool++}`;
-    const response = new ChatResponseModel(requestId, this, message.agentId);
-    const request = new ChatRequestModel(requestId, this, message, response);
+    const response = new ChatResponseModel(requestId, this, msg.agentId);
+    const request = new ChatRequestModel(requestId, this, msg, response);
 
     this.#requests.set(requestId, request);
     return request;

package/src/browser/chat/chat.view.tsx

@@ -3,6 +3,7 @@ import { MessageList } from 'react-chat-elements';
 
 import {
   AINativeConfigService,
+  CommandService,
   getIcon,
   useEventEffect,
   useInjectable,
@@ -41,8 +42,6 @@ import {
   IChatMessageStructure,
   TokenMCPServerProxyService,
 } from '../../common';
-import { LLMContextService, LLMContextServiceToken } from '../../common/llm-context';
-import { ChatAgentPromptProvider } from '../../common/prompts/context-prompt-provider';
 import { ChatContext } from '../components/ChatContext';
 import { CodeBlockWrapperInput } from '../components/ChatEditor';
 import ChatHistory, { IChatHistoryItem } from '../components/ChatHistory';
@@ -52,6 +51,7 @@ import { ChatNotify, ChatReply } from '../components/ChatReply';
 import { SlashCustomRender } from '../components/SlashCustomRender';
 import { MessageData, createMessageByAI, createMessageByUser } from '../components/utils';
 import { WelcomeMessage } from '../components/WelcomeMsg';
+import { OPEN_MCP_CONFIG_COMMAND } from '../mcp/config/mcp-config.commands';
 import { MCPServerProxyService } from '../mcp/mcp-server-proxy.service';
 import { MCPToolsDialog } from '../mcp/mcp-tools-dialog.view';
 import { ChatViewHeaderRender, TSlashCommandCustomRender } from '../types';
@@ -63,6 +63,7 @@ import { ChatFeatureRegistry } from './chat.feature.registry';
 import { ChatInternalService } from './chat.internal.service';
 import styles from './chat.module.less';
 import { ChatRenderRegistry } from './chat.render.registry';
+
 const SCROLL_CLASSNAME = 'chat_scroll';
 
 interface TDispatchAction {
@@ -79,13 +80,15 @@ export const AIChatView = () => {
   const chatAgentService = useInjectable<IChatAgentService>(IChatAgentService);
   const chatFeatureRegistry = useInjectable<ChatFeatureRegistry>(ChatFeatureRegistryToken);
   const chatRenderRegistry = useInjectable<ChatRenderRegistry>(ChatRenderRegistryToken);
-  const contextService = useInjectable<LLMContextService>(LLMContextServiceToken);
-  const promptProvider = useInjectable<ChatAgentPromptProvider>(ChatAgentPromptProvider);
+  const mcpServerProxyService = useInjectable<MCPServerProxyService>(TokenMCPServerProxyService);
 
   const layoutService = useInjectable<IMainLayoutService>(IMainLayoutService);
   const msgHistoryManager = aiChatService.sessionModel.history;
   const containerRef = React.useRef<HTMLDivElement>(null);
   const chatInputRef = React.useRef<{ setInputValue: (v: string) => void } | null>(null);
+  const dialogService = useInjectable<IDialogService>(IDialogService);
+  const aiNativeConfigService = useInjectable<AINativeConfigService>(AINativeConfigService);
+  const commandService = useInjectable<CommandService>(CommandService);
 
   const [shortcutCommands, setShortcutCommands] = React.useState<ChatSlashCommandItemModel[]>([]);
 
@@ -107,6 +110,8 @@ export const AIChatView = () => {
   const [defaultAgentId, setDefaultAgentId] = React.useState<string>('');
   const [command, setCommand] = React.useState('');
   const [theme, setTheme] = React.useState<string | null>(null);
+  const [mcpToolsCount, setMcpToolsCount] = React.useState<number>(0);
+  const [mcpServersCount, setMcpServersCount] = React.useState<number>(0);
 
   React.useEffect(() => {
     const featureSlashCommands = chatFeatureRegistry.getAllShortcutSlashCommand();
@@ -506,10 +511,7 @@ export const AIChatView = () => {
       const { message, agentId, command, reportExtra } = value;
       const { actionType, actionSource } = reportExtra || {};
 
-      const context = contextService.serialize();
-      const fullMessage = await promptProvider.provideContextPrompt(context, message);
-
-      const request = aiChatService.createRequest(fullMessage, agentId!, command);
+      const request = aiChatService.createRequest(message, agentId!, command);
       if (!request) {
         return;
       }
@@ -658,6 +660,32 @@ export const AIChatView = () => {
     };
   }, [aiChatService.sessionModel]);
 
+  useEventEffect(
+    mcpServerProxyService.onChangeMCPServers,
+    () => {
+      mcpServerProxyService.getAllMCPTools().then((tools) => {
+        setMcpToolsCount(tools.length);
+      });
+      mcpServerProxyService.$getServers().then((servers) => {
+        setMcpServersCount(servers.length);
+      });
+    },
+    [mcpServerProxyService],
+  );
+
+  const handleShowMCPTools = React.useCallback(async () => {
+    const tools = await mcpServerProxyService.getAllMCPTools();
+    dialogService.open({
+      message: <MCPToolsDialog tools={tools} />,
+      type: MessageType.Empty,
+      buttons: ['关闭'],
+    });
+  }, [mcpServerProxyService, dialogService]);
+
+  const handleShowMCPConfig = React.useCallback(() => {
+    commandService.executeCommand(OPEN_MCP_CONFIG_COMMAND.id);
+  }, [commandService]);
+
   return (
     <div id={styles.ai_chat_view}>
       <div className={styles.header_container}>
@@ -697,6 +725,18 @@ export const AIChatView = () => {
                   </Popover>
                 ))}
               </div>
+              <div className={styles.header_operate_right}>
+                {aiNativeConfigService.capabilities.supportsMCP && (
+                  <>
+                    <div className={styles.tag} onClick={handleShowMCPConfig}>
+                      {`MCP Servers: ${mcpServersCount}`}
+                    </div>
+                    <div className={styles.tag} onClick={handleShowMCPTools}>
+                      {`MCP Tools: ${mcpToolsCount}`}
+                    </div>
+                  </>
+                )}
+              </div>
             </div>
             <ChatInputWrapperRender
               onSend={(value, agentId, command) =>

package/src/browser/context/llm-context.service.ts

@@ -55,6 +55,10 @@ export class LLMContextServiceImpl extends WithEventBus implements LLMContextSer
     const targetList = isManual ? this.attachedFiles : this.recentlyViewFiles;
     const maxLimit = isManual ? this.maxAttachFilesLimit : this.maxViewFilesLimit;
 
+    if (isManual) {
+      this.docModelManager.createModelReference(uri);
+    }
+
     this.addFileToList(file, targetList, maxLimit);
     this.notifyContextChange();
   }

package/src/browser/index.ts

@@ -55,6 +55,8 @@ import { RenameCandidatesProviderRegistry } from './contrib/rename/rename.featur
 import { TerminalAIContribution } from './contrib/terminal/terminal-ai.contributon';
 import { TerminalFeatureRegistry } from './contrib/terminal/terminal.feature.registry';
 import { LanguageParserService } from './languages/service';
+import { MCPConfigCommandContribution } from './mcp/config/mcp-config.commands';
+import { MCPConfigContribution } from './mcp/config/mcp-config.contribution';
 import { MCPServerProxyService } from './mcp/mcp-server-proxy.service';
 import { MCPServerRegistry } from './mcp/mcp-server.feature.registry';
 import { CreateNewFileWithTextTool } from './mcp/tools/createNewFileWithText';
@@ -91,6 +93,8 @@ export class AINativeModule extends BrowserModule {
     AICodeActionContribution,
     AINativePreferencesContribution,
     IntelligentCompletionsContribution,
+    MCPConfigContribution,
+    MCPConfigCommandContribution,
 
     // MCP Server Contributions START
     ListDirTool,

package/src/browser/mcp/config/components/mcp-config.module.less

@@ -0,0 +1,178 @@
+.container {
+  padding: 20px;
+  color: var(--foreground);
+}
+
+.header {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  margin-bottom: 24px;
+}
+
+.title {
+  margin: 0 0 8px 0;
+  font-size: 24px;
+  font-weight: 600;
+}
+
+.description {
+  margin: 0;
+  color: var(--descriptionForeground);
+  font-size: 14px;
+}
+
+.addButton {
+  padding: 8px 16px;
+  border-radius: 4px;
+  background-color: var(--button-primary-background);
+  color: var(--button-primary-foreground);
+  border: none;
+  cursor: pointer;
+  font-size: 13px;
+
+  &:hover {
+    background-color: var(--button-primary-hover-background);
+  }
+}
+
+.serversList {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.serverItem {
+  padding: 16px;
+  border-radius: 8px;
+  background-color: var(--editorWidget-background);
+  border: 1px solid var(--border-color);
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+  transition: all 0.2s ease;
+
+  &:hover {
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+    border-color: var(--focusBorder);
+  }
+}
+
+.serverHeader {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 12px;
+}
+
+.serverTitleRow {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.serverName {
+  margin: 0;
+  font-size: 14px;
+  font-weight: 500;
+}
+
+.serverStatus,
+.serverType {
+  font-size: 12px;
+  padding: 2px 8px;
+  border-radius: 12px;
+  font-weight: 500;
+  display: inline-flex;
+  align-items: center;
+}
+
+.serverType {
+  background-color: var(--editor-background);
+  color: var(--descriptionForeground);
+}
+
+.running {
+  background-color: var(--notification-info-background);
+  color: var(--notification-info-foreground);
+}
+
+.stopped {
+  background-color: var(--notification-error-background);
+  color: var(--notification-error-foreground);
+}
+
+.serverActions {
+  display: flex;
+  gap: 4px;
+}
+
+.iconButton {
+  padding: 4px;
+  border: none;
+  background: none;
+  color: var(--icon-foreground);
+  cursor: pointer;
+  border-radius: 4px;
+
+  &:hover {
+    background-color: var(--list-hover-background);
+  }
+}
+
+.serverDetail {
+  margin-top: 12px;
+  padding: 12px;
+  border-radius: 6px;
+  background-color: var(--editor-background);
+  font-size: 13px;
+
+  &:not(:last-child) {
+    margin-bottom: 8px;
+  }
+}
+
+.detailRow {
+  display: flex;
+  gap: 8px;
+  margin-bottom: 4px;
+  align-items: center;
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+}
+
+.detailLabel {
+  color: var(--descriptionForeground);
+  min-width: 70px;
+  height: 24px;
+  display: flex;
+  align-items: center;
+}
+
+.detailContent {
+  color: var(--foreground);
+  word-break: break-all;
+  flex: 1;
+  background-color: var(--editor-background);
+  padding: 4px 8px;
+  border-radius: 4px;
+  font-family: var(--monaco-monospace-font);
+  min-height: 24px;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-wrap: wrap;
+}
+
+.toolTag {
+  display: inline-flex;
+  align-items: center;
+  padding: 2px 8px;
+  background-color: var(--editorWidget-background);
+  color: var(--button-secondary-foreground);
+  border-radius: 12px;
+  font-size: 12px;
+  font-weight: 500;
+  transition: all 0.2s ease;
+  border: 1px solid var(--border-color);
+}

package/src/browser/mcp/config/components/mcp-config.view.tsx

@@ -0,0 +1,215 @@
+import React from 'react';
+
+import { AINativeSettingSectionsId, ILogger, useInjectable } from '@opensumi/ide-core-browser';
+import { PreferenceService } from '@opensumi/ide-core-browser/lib/preferences';
+
+import { BUILTIN_MCP_SERVER_NAME } from '../../../../common';
+import { MCPServerDescription } from '../../../../common/mcp-server-manager';
+import { MCPServerProxyService } from '../../mcp-server-proxy.service';
+
+import styles from './mcp-config.module.less';
+import { MCPServerForm, MCPServerFormData } from './mcp-server-form';
+
+interface MCPServer {
+  name: string;
+  isStarted: boolean;
+  tools?: string[];
+  command?: string;
+  type?: string;
+}
+
+export const MCPConfigView: React.FC = () => {
+  const mcpServerProxyService = useInjectable<MCPServerProxyService>(MCPServerProxyService);
+  const preferenceService = useInjectable<PreferenceService>(PreferenceService);
+  const logger = useInjectable<ILogger>(ILogger);
+  const [servers, setServers] = React.useState<MCPServer[]>([]);
+  const [formVisible, setFormVisible] = React.useState(false);
+  const [editingServer, setEditingServer] = React.useState<MCPServerFormData | undefined>();
+
+  const loadServers = React.useCallback(async () => {
+    const allServers = await mcpServerProxyService.$getServers();
+    setServers(allServers);
+  }, [mcpServerProxyService]);
+
+  React.useEffect(() => {
+    loadServers();
+    const disposer = mcpServerProxyService.onChangeMCPServers(() => {
+      loadServers();
+    });
+
+    return () => {
+      disposer.dispose();
+    };
+  }, [mcpServerProxyService, loadServers]);
+
+  const handleServerControl = async (serverName: string, start: boolean) => {
+    try {
+      if (start) {
+        await mcpServerProxyService.$startServer(serverName);
+      } else {
+        await mcpServerProxyService.$stopServer(serverName);
+      }
+
+      // Update enabled state in preferences
+      const servers = preferenceService.get<MCPServerDescription[]>(AINativeSettingSectionsId.MCPServers, []);
+      let updatedServers = servers;
+
+      // 处理内置服务器的特殊情况
+      if (serverName === BUILTIN_MCP_SERVER_NAME) {
+        const builtinServerExists = servers.some((server) => server.name === BUILTIN_MCP_SERVER_NAME);
+        if (!builtinServerExists && !start) {
+          // 如果是停止内置服务器且之前没有配置，添加一个新的配置项
+          // 内置服务器不需要 command，因为它是直接集成在 IDE 中的
+          updatedServers = [
+            ...servers,
+            {
+              name: BUILTIN_MCP_SERVER_NAME,
+              enabled: false,
+              command: '', // 内置服务器的 command 为空字符串
+            },
+          ];
+        } else {
+          // 如果已经存在配置，更新 enabled 状态
+          updatedServers = servers.map((server) => {
+            if (server.name === BUILTIN_MCP_SERVER_NAME) {
+              return { ...server, enabled: start };
+            }
+            return server;
+          });
+        }
+      } else {
+        // 处理其他外部服务器
+        updatedServers = servers.map((server) => {
+          if (server.name === serverName) {
+            return { ...server, enabled: start };
+          }
+          return server;
+        });
+      }
+
+      await preferenceService.set(AINativeSettingSectionsId.MCPServers, updatedServers);
+      await loadServers();
+    } catch (error) {
+      logger.error(`Failed to ${start ? 'start' : 'stop'} server ${serverName}:`, error);
+    }
+  };
+
+  const handleAddServer = () => {
+    setEditingServer(undefined);
+    setFormVisible(true);
+  };
+
+  const handleEditServer = (server: MCPServer) => {
+    const servers = preferenceService.get<MCPServerFormData[]>(AINativeSettingSectionsId.MCPServers, []);
+    const serverConfig = servers.find((s) => s.name === server.name);
+
+    if (serverConfig) {
+      setEditingServer(serverConfig);
+      setFormVisible(true);
+    }
+  };
+
+  const handleDeleteServer = async (serverName: string) => {
+    const servers = preferenceService.get<MCPServerFormData[]>(AINativeSettingSectionsId.MCPServers, []);
+    const updatedServers = servers.filter((s) => s.name !== serverName);
+    await preferenceService.set(AINativeSettingSectionsId.MCPServers, updatedServers);
+    await loadServers();
+  };
+
+  const handleSaveServer = async (data: MCPServerFormData) => {
+    const servers = preferenceService.get<MCPServerFormData[]>(AINativeSettingSectionsId.MCPServers, []);
+    const existingIndex = servers.findIndex((s) => s.name === data.name);
+
+    if (existingIndex >= 0) {
+      servers[existingIndex] = data;
+    } else {
+      servers.push(data);
+    }
+
+    await preferenceService.set(AINativeSettingSectionsId.MCPServers, servers);
+    setFormVisible(false);
+    await loadServers();
+  };
+
+  return (
+    <div className={styles.container}>
+      <div className={styles.header}>
+        <div>
+          <h2 className={styles.title}>MCP Servers</h2>
+          <p className={styles.description}>Manage your MCP server connections.</p>
+        </div>
+        <button className={styles.addButton} onClick={handleAddServer}>
+          + Add new MCP server
+        </button>
+      </div>
+      <div className={styles.serversList}>
+        {servers.map((server) => (
+          <div key={server.name} className={styles.serverItem}>
+            <div className={styles.serverHeader}>
+              <div className={styles.serverTitleRow}>
+                <h3 className={styles.serverName}>{server.name}</h3>
+              </div>
+              <div className={styles.serverActions}>
+                <button className={styles.iconButton} title='Edit' onClick={() => handleEditServer(server)}>
+                  <i className='codicon codicon-edit' />
+                </button>
+                <button
+                  className={styles.iconButton}
+                  title={server.isStarted ? 'Stop' : 'Start'}
+                  onClick={() => handleServerControl(server.name, !server.isStarted)}
+                >
+                  <i className={`codicon ${server.isStarted ? 'codicon-debug-stop' : 'codicon-debug-start'}`} />
+                </button>
+                <button className={styles.iconButton} title='Delete' onClick={() => handleDeleteServer(server.name)}>
+                  <i className='codicon codicon-trash' />
+                </button>
+              </div>
+            </div>
+            <div className={styles.serverDetail}>
+              <div className={styles.detailRow}>
+                <span className={styles.detailLabel}>Status:</span>
+                <span className={`${styles.serverStatus} ${server.isStarted ? styles.running : styles.stopped}`}>
+                  {server.isStarted ? 'Running' : 'Stopped'}
+                </span>
+              </div>
+              {server.type && (
+                <div className={styles.detailRow}>
+                  <span className={styles.detailLabel}>Type:</span>
+                  <span className={styles.serverType}>{server.type}</span>
+                </div>
+              )}
+            </div>
+            {server.tools && server.tools.length > 0 && (
+              <div className={styles.serverDetail}>
+                <div className={styles.detailRow}>
+                  <span className={styles.detailLabel}>Tools:</span>
+                  <span className={styles.detailContent}>
+                    {server.tools.map((tool, index) => (
+                      <span key={index} className={styles.toolTag}>
+                        {tool}
+                      </span>
+                    ))}
+                  </span>
+                </div>
+              </div>
+            )}
+            {server.command && (
+              <div className={styles.serverDetail}>
+                <div className={styles.detailRow}>
+                  <span className={styles.detailLabel}>Command:</span>
+                  <span className={styles.detailContent}>{server.command}</span>
+                </div>
+              </div>
+            )}
+          </div>
+        ))}
+      </div>
+      <MCPServerForm
+        visible={formVisible}
+        initialData={editingServer}
+        onSave={handleSaveServer}
+        onCancel={() => setFormVisible(false)}
+      />
+    </div>
+  );
+};