@opensumi/ide-ai-native 3.8.1-next-1740478950.0 → 3.8.1-next-1740556231.0

package/lib/browser/mcp/config/mcp-config.contribution.js

@@ -1,62 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MCPConfigContribution = exports.MCP_CONFIG_COMPONENTS_SCHEME_ID = void 0;
-const tslib_1 = require("tslib");
-const di_1 = require("@opensumi/di");
-const services_1 = require("@opensumi/ide-core-browser/lib/services");
-const ide_core_common_1 = require("@opensumi/ide-core-common");
-const types_1 = require("@opensumi/ide-editor/lib/browser/types");
-const browser_1 = require("@opensumi/ide-theme/lib/browser");
-const common_1 = require("@opensumi/ide-workspace/lib/common");
-const mcp_config_view_1 = require("./components/mcp-config.view");
-const COMPONENTS_ID = 'opensumi-mcp-config-viewer';
-exports.MCP_CONFIG_COMPONENTS_SCHEME_ID = 'mcp-config';
-let MCPConfigContribution = class MCPConfigContribution {
-    registerEditorComponent(registry) {
-        registry.registerEditorComponent({
-            uid: COMPONENTS_ID,
-            scheme: exports.MCP_CONFIG_COMPONENTS_SCHEME_ID,
-            component: mcp_config_view_1.MCPConfigView,
-            renderMode: types_1.EditorComponentRenderMode.ONE_PER_WORKBENCH,
-        });
-        registry.registerEditorComponentResolver(exports.MCP_CONFIG_COMPONENTS_SCHEME_ID, (resource, results) => {
-            results.push({
-                type: 'component',
-                componentId: COMPONENTS_ID,
-            });
-        });
-    }
-    registerResource(service) {
-        service.registerResourceProvider({
-            scheme: exports.MCP_CONFIG_COMPONENTS_SCHEME_ID,
-            provideResource: async (uri) => {
-                const { configType } = uri.getParsedQuery();
-                return {
-                    uri,
-                    name: 'MCP Configuration',
-                    icon: 'settings',
-                    metadata: {
-                        configType,
-                    },
-                };
-            },
-        });
-    }
-};
-exports.MCPConfigContribution = MCPConfigContribution;
-tslib_1.__decorate([
-    (0, di_1.Autowired)(common_1.IWorkspaceService),
-    tslib_1.__metadata("design:type", Object)
-], MCPConfigContribution.prototype, "workspaceService", void 0);
-tslib_1.__decorate([
-    (0, di_1.Autowired)(browser_1.IconService),
-    tslib_1.__metadata("design:type", browser_1.IconService)
-], MCPConfigContribution.prototype, "iconService", void 0);
-tslib_1.__decorate([
-    (0, di_1.Autowired)(),
-    tslib_1.__metadata("design:type", services_1.LabelService)
-], MCPConfigContribution.prototype, "labelService", void 0);
-exports.MCPConfigContribution = MCPConfigContribution = tslib_1.__decorate([
-    (0, ide_core_common_1.Domain)(types_1.BrowserEditorContribution)
-], MCPConfigContribution);
-//# sourceMappingURL=mcp-config.contribution.js.map

package/lib/browser/mcp/config/mcp-config.contribution.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"mcp-config.contribution.js","sourceRoot":"","sources":["../../../../src/browser/mcp/config/mcp-config.contribution.ts"],"names":[],"mappings":";;;;AAAA,qCAAyC;AACzC,sEAAuE;AACvE,+DAAiE;AACjE,kEAMgD;AAChD,6DAA8D;AAC9D,+DAAuE;AAEvE,kEAA6D;AAE7D,MAAM,aAAa,GAAG,4BAA4B,CAAC;AACtC,QAAA,+BAA+B,GAAG,YAAY,CAAC;AAKrD,IAAM,qBAAqB,GAA3B,MAAM,qBAAqB;IAUhC,uBAAuB,CAAC,QAAiC;QACvD,QAAQ,CAAC,uBAAuB,CAAC;YAC/B,GAAG,EAAE,aAAa;YAClB,MAAM,EAAE,uCAA+B;YACvC,SAAS,EAAE,+BAAa;YACxB,UAAU,EAAE,iCAAyB,CAAC,iBAAiB;SACxD,CAAC,CAAC;QAEH,QAAQ,CAAC,+BAA+B,CAAC,uCAA+B,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE;YAC9F,OAAO,CAAC,IAAI,CAAC;gBACX,IAAI,EAAE,WAAW;gBACjB,WAAW,EAAE,aAAa;aAC3B,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IACL,CAAC;IAED,gBAAgB,CAAC,OAAwB;QACvC,OAAO,CAAC,wBAAwB,CAAC;YAC/B,MAAM,EAAE,uCAA+B;YACvC,eAAe,EAAE,KAAK,EAAE,GAAQ,EAA+B,EAAE;gBAC/D,MAAM,EAAE,UAAU,EAAE,GAAG,GAAG,CAAC,cAAc,EAAE,CAAC;gBAE5C,OAAO;oBACL,GAAG;oBACH,IAAI,EAAE,mBAAmB;oBACzB,IAAI,EAAE,UAAU;oBAChB,QAAQ,EAAE;wBACR,UAAU;qBACX;iBACF,CAAC;YACJ,CAAC;SACF,CAAC,CAAC;IACL,CAAC;CACF,CAAA;AA3CY,sDAAqB;AAEb;IADlB,IAAA,cAAS,EAAC,0BAAiB,CAAC;;+DAC0B;AAGpC;IADlB,IAAA,cAAS,EAAC,qBAAW,CAAC;sCACS,qBAAW;0DAAC;AAG5C;IADC,IAAA,cAAS,GAAE;sCACE,uBAAY;2DAAC;gCARhB,qBAAqB;IADjC,IAAA,wBAAM,EAAC,iCAAyB,CAAC;GACrB,qBAAqB,CA2CjC"}

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

@@ -1,178 +0,0 @@
-.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

@@ -1,215 +0,0 @@
-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>
-  );
-};

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

@@ -1,78 +0,0 @@
-.form {
-  padding: 16px;
-}
-
-.formItem {
-  margin-bottom: 16px;
-
-  label {
-    display: block;
-    margin-bottom: 8px;
-    color: var(--foreground);
-    font-size: 13px;
-  }
-
-  input,
-  textarea {
-    width: 100%;
-    padding: 8px;
-    border: 1px solid var(--input-border);
-    border-radius: 4px;
-    background-color: var(--input-background);
-    color: var(--input-foreground);
-    font-size: 13px;
-    font-family: var(--monaco-monospace-font);
-
-    &:focus {
-      border-color: var(--focusBorder);
-      outline: none;
-    }
-
-    &::placeholder {
-      color: var(--descriptionForeground);
-      opacity: 0.6;
-    }
-  }
-
-  textarea {
-    resize: vertical;
-    min-height: 60px;
-  }
-}
-
-.formActions {
-  display: flex;
-  justify-content: flex-end;
-  gap: 8px;
-  margin-top: 24px;
-  padding-top: 16px;
-  border-top: 1px solid var(--border-color);
-}
-
-.cancelButton {
-  padding: 6px 12px;
-  border: 1px solid var(--button-border);
-  border-radius: 4px;
-  background-color: var(--button-secondary-background);
-  color: var(--button-secondary-foreground);
-  cursor: pointer;
-  font-size: 13px;
-
-  &:hover {
-    background-color: var(--button-secondary-hover-background);
-  }
-}
-
-.submitButton {
-  padding: 6px 12px;
-  border: none;
-  border-radius: 4px;
-  background-color: var(--button-primary-background);
-  color: var(--button-primary-foreground);
-  cursor: pointer;
-  font-size: 13px;
-
-  &:hover {
-    background-color: var(--button-primary-hover-background);
-  }
-}

package/src/browser/mcp/config/components/mcp-server-form.tsx

@@ -1,144 +0,0 @@
-import React from 'react';
-
-import { Button } from '@opensumi/ide-components/lib/button';
-import { Modal } from '@opensumi/ide-components/lib/modal';
-
-import styles from './mcp-server-form.module.less';
-
-export interface MCPServerFormData {
-  name: string;
-  command: string;
-  args: string[];
-  env?: Record<string, string>;
-}
-
-interface Props {
-  visible: boolean;
-  initialData?: MCPServerFormData;
-  onSave: (data: MCPServerFormData) => void;
-  onCancel: () => void;
-}
-
-export const MCPServerForm: React.FC<Props> = ({ visible, initialData, onSave, onCancel }) => {
-  const [formData, setFormData] = React.useState<MCPServerFormData>(() => ({
-    name: '',
-    command: '',
-    args: [],
-    env: {},
-    type: 'stdio', // TODO: 支持 SSE
-    ...initialData,
-  }));
-
-  const [argsText, setArgsText] = React.useState(() => initialData?.args?.join(' ') || '');
-  const [envText, setEnvText] = React.useState(() => {
-    if (!initialData?.env) {
-      return '';
-    }
-    return Object.entries(initialData.env)
-      .map(([key, value]) => `${key}=${value}`)
-      .join('\n');
-  });
-
-  // Update form data when initialData changes
-  React.useEffect(() => {
-    setFormData({
-      name: '',
-      command: '',
-      args: [],
-      env: {},
-      ...initialData,
-    });
-    setArgsText(initialData?.args?.join(' ') || '');
-    setEnvText(
-      initialData?.env
-        ? Object.entries(initialData.env)
-            .map(([key, value]) => `${key}=${value}`)
-            .join('\n')
-        : '',
-    );
-  }, [initialData]);
-
-  const handleSubmit = (e: React.FormEvent) => {
-    e.preventDefault();
-    const args = argsText.split(' ').filter(Boolean);
-    const env = envText
-      .split('\n')
-      .filter(Boolean)
-      .reduce((acc, line) => {
-        const [key, value] = line.split('=');
-        if (key && value) {
-          acc[key.trim()] = value.trim();
-        }
-        return acc;
-      }, {} as Record<string, string>);
-
-    onSave({
-      ...formData,
-      args,
-      env,
-    });
-  };
-
-  return (
-    <Modal
-      title={initialData ? 'Edit MCP Server' : 'Add New MCP Server'}
-      visible={visible}
-      onCancel={onCancel}
-      centered
-      width={600}
-      footer={null}
-      style={{
-        background: 'var(--editor-background)',
-      }}
-    >
-      <form className={styles.form} onSubmit={(e) => e.preventDefault()}>
-        <div className={styles.formItem}>
-          <label>Name:</label>
-          <input
-            type='text'
-            value={formData.name}
-            onChange={(e) => setFormData({ ...formData, name: e.target.value })}
-            placeholder='Enter server name'
-            required
-          />
-        </div>
-        <div className={styles.formItem}>
-          <label>Command:</label>
-          <input
-            type='text'
-            value={formData.command}
-            onChange={(e) => setFormData({ ...formData, command: e.target.value })}
-            placeholder='Enter command (e.g., npx)'
-            required
-          />
-        </div>
-        <div className={styles.formItem}>
-          <label>Arguments:</label>
-          <textarea
-            value={argsText}
-            onChange={(e) => setArgsText(e.target.value)}
-            placeholder='Enter arguments separated by space'
-            rows={3}
-          />
-        </div>
-        <div className={styles.formItem}>
-          <label>Environment Variables:</label>
-          <textarea
-            value={envText}
-            onChange={(e) => setEnvText(e.target.value)}
-            placeholder='KEY=value (one per line)'
-            rows={3}
-          />
-        </div>
-        <div className={styles.formActions}>
-          <Button onClick={onCancel} type='secondary'>
-            Cancel
-          </Button>
-          <Button onClick={handleSubmit} type='primary'>
-            Save
-          </Button>
-        </div>
-      </form>
-    </Modal>
-  );
-};