@opensumi/ide-ai-native 3.8.2-next-1741622293.0 → 3.8.3-next-1741661270.0

package/src/browser/components/ChatToolRender.tsx

@@ -5,6 +5,7 @@ import { useInjectable } from '@opensumi/ide-core-browser';
 import { Icon } from '@opensumi/ide-core-browser/lib/components';
 import { Loading } from '@opensumi/ide-core-browser/lib/components/ai-native';
 import { IChatToolContent, uuid } from '@opensumi/ide-core-common';
+import { localize } from '@opensumi/ide-core-common/lib/localize';
 
 import { IMCPServerRegistry, TokenMCPServerRegistry } from '../types';
 
@@ -64,28 +65,29 @@ export const ChatToolRender = (props: { value: IChatToolContent['content']; mess
       toolCallId={value.id}
     />
   ) : (
-    <div className={styles['chat-tool-render']}>
-      <div className={styles['tool-header']} onClick={toggleExpand}>
-        <div className={styles['tool-name']}>
-          <Icon iconClass={`codicon codicon-triangle-${isExpanded ? 'down' : 'right'}`} />
-          {label}
+    <div className={styles.chat_tool_render}>
+      <div className={styles.tool_header} onClick={toggleExpand}>
+        <div className={styles.tool_name}>
+          <Icon iconClass={`codicon codicon-chevron-${isExpanded ? 'down' : 'right'}`} />
+          <Icon size='small' iconClass={cls('codicon codicon-tools', styles.tool_icon)} />
+          <span className={styles.tool_label}>{label}</span>
         </div>
         {value.state && (
-          <div className={styles['tool-state']}>
-            <span className={styles['state-icon']}>{stateInfo.icon}</span>
+          <div className={styles.tool_state}>
+            <span className={styles.state_icon}>{stateInfo.icon}</span>
           </div>
         )}
       </div>
-      <div className={cls(styles['tool-content'], { [styles.expanded]: isExpanded })}>
+      <div className={cls(styles.tool_content, { [styles.expanded]: isExpanded })}>
         {value?.function?.arguments && (
-          <div className={styles['tool-arguments']}>
-            <div className={styles['section-label']}>Arguments</div>
+          <div className={styles.tool_arguments}>
+            <div className={styles.section_label}>{localize('ai.native.mcp.tool.arguments')}:</div>
             <CodeEditorWithHighlight input={value?.function?.arguments} language={'json'} relationId={uuid(4)} />
           </div>
         )}
         {value?.result && (
-          <div className={styles['tool-result']}>
-            <div className={styles['section-label']}>Result</div>
+          <div className={styles.tool_result}>
+            <div className={styles.section_label}>{localize('ai.native.mcp.tool.results')}:</div>
             <CodeEditorWithHighlight input={value.result} language={'json'} relationId={uuid(4)} />
           </div>
         )}

package/src/browser/components/change-list.module.less

@@ -0,0 +1,126 @@
+.container {
+  margin: 0 12px;
+  background: var(--design-chatInput-background);
+  border-radius: 9px 9px 0 0;
+  border: 1px solid var(--kt-input-border);
+  border-bottom: none;
+  overflow: hidden;
+  padding-bottom: 6px;
+}
+
+.header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 8px 12px 2px 12px;
+  background-color: transparent;
+  cursor: pointer;
+  user-select: none;
+  font-size: 12px;
+  color: var(--descriptionForeground);
+}
+
+.title:hover {
+  color: var(--design-text-highlightForeground);
+  .toggleButton :global(.kt-icon) {
+    color: var(--design-text-highlightForeground);
+    transition: color 0.2s ease-in-out;
+  }
+}
+
+.toggleButton {
+  background: none;
+  border: none;
+  cursor: pointer;
+  padding: 0;
+  width: 16px;
+  height: 16px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 12px;
+}
+
+.title {
+  gap: 6px;
+  transition: color 0.2s ease-in-out;
+  display: flex;
+}
+
+.fileList {
+  list-style: none;
+  margin: 0;
+  padding: 0 12px;
+}
+
+.fileItem {
+  display: flex;
+  align-items: center;
+  padding: 4px 0;
+  cursor: pointer;
+  border: none;
+  font-size: 13px;
+  color: var(--descriptionForeground);
+}
+
+.fileItem:hover {
+  background-color: var(--design-block-hoverBackground);
+}
+
+.fileIcon {
+  margin-right: 6px;
+  width: 16px;
+  height: 16px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.fileInfo {
+  flex: 1;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  overflow: hidden;
+  :global(.kt-popover-trigger) {
+    margin-left: 8px;
+  }
+  :global(.codicon) {
+    font-size: 12px !important;
+    position: relative;
+    top: 1px;
+  }
+}
+
+.filePath {
+  font-size: 12px;
+  margin: 0;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.fileStats {
+  font-size: 12px;
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+
+.additions {
+  color: #52c41a;
+}
+
+.deletions {
+  color: var(--debugConsole-errorForeground);
+}
+
+.noChange {
+  color: #6a737d;
+  font-style: italic;
+  white-space: nowrap;
+}
+
+.collapsed {
+  display: none;
+}

package/src/browser/components/chat-history.module.less

@@ -78,7 +78,7 @@
   .dm-chat-history-list {
     overflow: auto;
     max-height: 400px;
-    max-width: 400px;
+    width: 300px;
     margin-top: 4px;
     font-size: 13px;
   }

package/src/browser/components/components.module.less

@@ -527,3 +527,17 @@
     align-items: center;
   }
 }
+
+.status {
+  :global {
+    .codicon-pass {
+      color: #52c41a;
+    }
+    .codicon-error {
+      color: var(--debugConsole-errorForeground);
+    }
+    .codicon-circle-slash {
+      color: var(--input-placeholderForeground);
+    }
+  }
+}

package/src/browser/contrib/inline-completions/prompt/matcher.ts

@@ -244,8 +244,8 @@ export abstract class WindowedMatcher {
         tokens.slice(startLine, endLine).forEach((token) => token.forEach((word) => size.add(word)));
         cache.push(size);
       }
-      const target = cache[index];
-      const score = this.similarityScore(target, this.referenceTokens);
+      const traget = cache[index];
+      const score = this.similarityScore(traget, this.referenceTokens);
       snippets.push({
         score,
         startLine,

package/src/browser/contrib/inline-completions/prompt/similarSnippets.ts

@@ -15,9 +15,9 @@ import {
 import { MAX_NEIGHBOR_AGGREGATE_LENGTH } from './const';
 import { FixedWindowSizeJaccardMatcher } from './jaccardMatcher';
 
-export const getOpenedTabFileList = (documents: IEditorDocumentModel[]) => {
+export const getOpenedTabFileList = (docuemnts: IEditorDocumentModel[]) => {
   // 过滤超大文档
-  const recentFiles = documents.filter((document) => isDocumentValid(document));
+  const recentFiles = docuemnts.filter((document) => isDocumentValid(document));
   return recentFiles;
 };
 

package/src/browser/contrib/intelligent-completions/view/default.ts

@@ -29,6 +29,7 @@ import {
 
 import { CodeEditsResultValue, ICodeEdit, ICodeEditsResult } from '../index';
 
+
 import { BaseCodeEditsView } from './base';
 
 /**

package/src/browser/index.ts

@@ -25,6 +25,7 @@ import {
   IChatAgentService,
   IChatInternalService,
   IChatManagerService,
+  InlineDiffServiceToken,
   SumiMCPServerProxyServicePath,
   TokenMCPServerProxyService,
 } from '../common';
@@ -193,14 +194,14 @@ export class AINativeModule extends BrowserModule {
       token: IAIInlineCompletionsProvider,
       useClass: AIInlineCompletionsProvider,
     },
-    {
-      token: InlineDiffService,
-      useClass: InlineDiffService,
-    },
     {
       token: ChatAgentPromptProvider,
       useClass: DefaultChatAgentPromptProvider,
     },
+    {
+      token: InlineDiffServiceToken,
+      useClass: InlineDiffService,
+    },
     {
       token: BaseApplyService,
       useClass: ApplyService,

package/src/browser/mcp/base-apply.service.ts

@@ -26,17 +26,13 @@ import { Deferred, DisposableMap, Emitter, IDisposable, URI, path } from '@opens
 import { SumiReadableStream } from '@opensumi/ide-utils/lib/stream';
 import { EditOperation } from '@opensumi/monaco-editor-core/esm/vs/editor/common/core/editOperation';
 
-import { IChatInternalService } from '../../common';
+import { IChatInternalService, IInlineDiffService, InlineDiffServiceToken } from '../../common';
 import { CodeBlockData, CodeBlockStatus } from '../../common/types';
 import { ChatInternalService } from '../chat/chat.internal.service';
 import { InlineChatController } from '../widget/inline-chat/inline-chat-controller';
-import {
-  BaseInlineDiffPreviewer,
-  InlineDiffController,
-  InlineDiffService,
-  LiveInlineDiffPreviewer,
-} from '../widget/inline-diff';
-import { BaseInlineStreamDiffHandler } from '../widget/inline-stream-diff/inline-stream-diff.handler';
+import { BaseInlineDiffPreviewer, InlineDiffController, LiveInlineDiffPreviewer } from '../widget/inline-diff';
+
+import type { BaseInlineStreamDiffHandler } from '../widget/inline-stream-diff/inline-stream-diff.handler';
 
 export abstract class BaseApplyService extends WithEventBus {
   @Autowired(IChatInternalService)
@@ -48,8 +44,8 @@ export abstract class BaseApplyService extends WithEventBus {
   @Autowired(WorkbenchEditorService)
   protected readonly editorService: WorkbenchEditorService;
 
-  @Autowired(InlineDiffService)
-  private readonly inlineDiffService: InlineDiffService;
+  @Autowired(InlineDiffServiceToken)
+  private readonly inlineDiffService: IInlineDiffService;
 
   @Autowired(IMarkerService)
   private readonly markerService: IMarkerService;
@@ -155,7 +151,7 @@ export abstract class BaseApplyService extends WithEventBus {
     // 使用最后一个版本内容渲染 apply 内容
     if (filePendingApplies.length > 0 && filePendingApplies[0].updatedCode) {
       const editor = event.payload.group.codeEditor.monacoEditor;
-      this.renderApplyResult(editor, filePendingApplies[0], filePendingApplies[0].updatedCode);
+      await this.renderApplyResult(editor, filePendingApplies[0], filePendingApplies[0].updatedCode);
     }
   }
 
@@ -183,9 +179,10 @@ export abstract class BaseApplyService extends WithEventBus {
     return sessionCodeBlocks.filter((block) => block.status === 'pending').map((block) => block.relativePath);
   }
 
-  protected getSessionCodeBlocks(sessionId?: string) {
-    sessionId = sessionId || this.chatInternalService.sessionModel.sessionId;
-    const sessionModel = this.chatInternalService.getSession(sessionId);
+  getSessionCodeBlocks(sessionId?: string) {
+    const sessionModel = sessionId
+      ? this.chatInternalService.getSession(sessionId)
+      : this.chatInternalService.sessionModel;
     if (!sessionModel) {
       throw new Error(`Session ${sessionId} not found`);
     }
@@ -301,22 +298,17 @@ export abstract class BaseApplyService extends WithEventBus {
       if (!result) {
         throw new Error('Failed to open file');
       }
-      if (typeof fastApplyFileResult.result === 'string') {
-        codeBlock.updatedCode = fastApplyFileResult.result;
-        codeBlock.status = 'pending';
-        this.updateCodeBlock(codeBlock);
-      }
-      const applyResult = await this.renderApplyResult(
+      const res = await this.renderApplyResult(
         result.group.codeEditor.monacoEditor,
         codeBlock,
         (fastApplyFileResult.result || fastApplyFileResult.stream)!,
         fastApplyFileResult.range,
       );
-      if (applyResult) {
-        // 用户实际接受的 apply 结果
-        codeBlock.applyResult = applyResult;
-        this.updateCodeBlock(codeBlock);
-      }
+      codeBlock.updatedCode = res.updatedCode;
+      codeBlock.status = 'pending';
+      // 用户实际接受的 apply 结果
+      codeBlock.applyResult = res.result;
+      this.updateCodeBlock(codeBlock);
 
       return codeBlock;
     } catch (err) {
@@ -328,31 +320,33 @@ export abstract class BaseApplyService extends WithEventBus {
     }
   }
 
+  /**
+   * 渲染apply结果（支持流式和直接输出结果）
+   * 副作用：渲染时会添加accept、reject操作监听器，监听到结果时会自动更新codeBlock的result
+   */
   async renderApplyResult(
     editor: ICodeEditor,
     codeBlock: CodeBlockData,
     updatedContentOrStream: string | SumiReadableStream<IChatProgress>,
     range?: Range,
-  ): Promise<{ diff: string; diagnosticInfos: IMarker[] } | undefined> {
-    const deferred = new Deferred<{ diff: string; diagnosticInfos: IMarker[] }>();
+  ): Promise<{ result?: { diff: string; diagnosticInfos: IMarker[] }; updatedCode: string }> {
+    const deferred = new Deferred<{ result?: { diff: string; diagnosticInfos: IMarker[] }; updatedCode: string }>();
     const inlineDiffController = InlineDiffController.get(editor)!;
     range = range || editor.getModel()!.getFullModelRange();
 
     if (typeof updatedContentOrStream === 'string') {
+      const updatedContent = updatedContentOrStream;
       const editorCurrentContent = editor.getModel()!.getValue();
       const uri = URI.file(path.join(this.appConfig.workspaceDir, codeBlock.relativePath));
       const document = this.editorDocumentModelService.getModelReference(uri);
-      if (editorCurrentContent !== updatedContentOrStream || document?.instance.dirty) {
-        editor.getModel()?.pushEditOperations([], [EditOperation.replace(range, updatedContentOrStream)], () => null);
+      if (editorCurrentContent !== updatedContent || document?.instance.dirty) {
+        editor.getModel()?.pushEditOperations([], [EditOperation.replace(range, updatedContent)], () => null);
         await this.editorService.save(uri);
       }
       const uriPendingCodeBlocks = this.getUriCodeBlocks(uri)?.filter((block) => block.status === 'pending');
       const earlistPendingCodeBlock = uriPendingCodeBlocks?.[uriPendingCodeBlocks.length - 1];
-      if ((earlistPendingCodeBlock?.originalCode || codeBlock.originalCode) === updatedContentOrStream) {
-        codeBlock.status = 'cancelled';
-        this.updateCodeBlock(codeBlock);
-        deferred.resolve();
-        return;
+      if ((earlistPendingCodeBlock || codeBlock)?.originalCode === updatedContent) {
+        throw new Error('No changes applied');
       }
       // Create diff previewer
       const previewer = inlineDiffController.createDiffPreviewer(
@@ -380,13 +374,16 @@ export abstract class BaseApplyService extends WithEventBus {
 
       const { diff, rangesFromDiffHunk } = this.getDiffResult(
         codeBlock.originalCode,
-        codeBlock.updatedCode || updatedContentOrStream,
+        updatedContent,
         codeBlock.relativePath,
       );
       const diagnosticInfos = this.getDiagnosticInfos(editor.getModel()!.uri.toString(), rangesFromDiffHunk);
       deferred.resolve({
-        diff,
-        diagnosticInfos,
+        result: {
+          diff,
+          diagnosticInfos,
+        },
+        updatedCode: updatedContent,
       });
     } else {
       const controller = new InlineChatController();
@@ -414,21 +411,21 @@ export abstract class BaseApplyService extends WithEventBus {
       this.addDispose(
         // 流式输出结束后，转为直接输出逻辑
         previewer.getNode()!.onDiffFinished(async (diffModel) => {
-          codeBlock.updatedCode = diffModel.newFullRangeTextLines.join('\n');
           // TODO: 添加 reapply
+          const updatedCode = diffModel.newFullRangeTextLines.join('\n');
           // 实际应用结果为空，则取消
-          if (codeBlock.updatedCode === codeBlock.originalCode) {
-            codeBlock.status = 'failed';
-            this.updateCodeBlock(codeBlock);
+          if (codeBlock.originalCode === updatedCode) {
             previewer.dispose();
             deferred.reject(new Error('no changes applied'));
             return;
           }
-          codeBlock.status = 'pending';
-          this.updateCodeBlock(codeBlock);
           previewer.dispose();
-          const result = await this.renderApplyResult(editor, codeBlock, codeBlock.updatedCode);
-          deferred.resolve(result);
+          try {
+            const res = await this.renderApplyResult(editor, codeBlock, updatedCode);
+            deferred.resolve(res);
+          } catch (err) {
+            deferred.reject(err);
+          }
         }),
       );
       this.activePreviewerMap.set(codeBlock.relativePath, previewer);
@@ -483,14 +480,36 @@ export abstract class BaseApplyService extends WithEventBus {
     }
   }
 
-  processAll(uri: URI, type: 'accept' | 'reject'): void {
-    const codeBlocks = this.getUriCodeBlocks(uri)?.filter((block) => block.status === 'pending');
+  processAll(type: 'accept' | 'reject', uri?: URI): void {
+    const codeBlocks = uri
+      ? this.getUriCodeBlocks(uri)?.filter((block) => block.status === 'pending')
+      : this.getSessionCodeBlocks().filter((block) => block.status === 'pending');
     if (!codeBlocks?.length) {
       throw new Error('No pending code block found');
     }
-    const decorationModel = this.activePreviewerMap
-      .get(codeBlocks[0].relativePath)
-      ?.getNode()?.livePreviewDiffDecorationModel;
+    const relativePaths = uri
+      ? [codeBlocks[0].relativePath]
+      : codeBlocks
+          .map((block) => block.relativePath)
+          .reduce((acc, cur) => {
+            if (acc.includes(cur)) {
+              return acc;
+            }
+            acc.push(cur);
+            return acc;
+          }, [] as string[]);
+    relativePaths.forEach((relativePath) => {
+      this.doProcess(type, relativePath);
+    });
+    codeBlocks.forEach((codeBlock) => {
+      codeBlock.status = type === 'accept' ? 'success' : 'cancelled';
+      // TODO: 批量更新
+      this.updateCodeBlock(codeBlock);
+    });
+  }
+
+  protected doProcess(type: 'accept' | 'reject', relativePath: string) {
+    const decorationModel = this.activePreviewerMap.get(relativePath)?.getNode()?.livePreviewDiffDecorationModel;
     if (!decorationModel) {
       throw new Error('No active previewer found');
     }
@@ -499,19 +518,13 @@ export abstract class BaseApplyService extends WithEventBus {
     } else {
       decorationModel.discardUnProcessed();
     }
-    this.editorService.save(uri);
-    codeBlocks.forEach((codeBlock) => {
-      codeBlock.status = type === 'accept' ? 'success' : 'cancelled';
-      // TODO: 批量更新
-      this.updateCodeBlock(codeBlock);
-    });
+    this.editorService.save(URI.file(path.join(this.appConfig.workspaceDir, relativePath)));
   }
 
   protected listenPartialEdit(model: ITextModel, codeBlock: CodeBlockData) {
     const deferred = new Deferred<{ diff: string; diagnosticInfos: IMarker[] }>();
     const uriString = model.uri.toString();
     const toDispose = this.inlineDiffService.onPartialEdit((event) => {
-      // TODO 支持自动保存
       if (
         event.totalPartialEditCount === event.resolvedPartialEditCount &&
         event.uri.path === model.uri.path.toString()
@@ -532,11 +545,19 @@ export abstract class BaseApplyService extends WithEventBus {
             actionSource: ActionSourceEnum.Chat,
             sessionId: this.chatInternalService.sessionModel.sessionId,
             isReceive: true,
-            isDrop: false,
-            code: codeBlock.codeEdit,
+            // 是否有丢弃部分代码
+            isDrop: event.acceptPartialEditCount !== event.totalPartialEditCount,
+            code: appliedResult,
+            originCode: codeBlock.originalCode,
             message: JSON.stringify({
               diff,
               diagnosticInfos,
+              instructions: codeBlock.instructions,
+              codeEdit: codeBlock.codeEdit,
+              partialEditCount: event.totalPartialEditCount,
+              acceptPartialEditCount: event.acceptPartialEditCount,
+              addedLinesCount: event.totalAddedLinesCount,
+              deletedLinesCount: event.totalDeletedLinesCount,
             }),
           });
           deferred.resolve({
@@ -554,8 +575,11 @@ export abstract class BaseApplyService extends WithEventBus {
             sessionId: this.chatInternalService.sessionModel.sessionId,
             isReceive: false,
             isDrop: true,
-            code: codeBlock.codeEdit,
             originCode: codeBlock.originalCode,
+            message: JSON.stringify({
+              instructions: codeBlock.instructions,
+              codeEdit: codeBlock.codeEdit,
+            }),
           });
         }
         this.editorListenerMap.disposeKey(uriString);
@@ -593,8 +617,6 @@ export abstract class BaseApplyService extends WithEventBus {
     result?: string;
   }>;
 
-  // FIXME: 貌似筛选逻辑不太对，需要重构
-  // TODO: 支持使用内存中的document获取诊断信息，实现并行apply accept
   protected getDiagnosticInfos(uri: string, ranges: Range[]) {
     const markers = this.markerService.getManager().getMarkers({ resource: uri });
     return markers.filter(

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

@@ -5,6 +5,7 @@ import { Badge } from '@opensumi/ide-components';
 import { AINativeSettingSectionsId, ILogger, useInjectable } from '@opensumi/ide-core-browser';
 import { PreferenceService } from '@opensumi/ide-core-browser/lib/preferences';
 import { localize } from '@opensumi/ide-core-common';
+import { IMessageService } from '@opensumi/ide-overlay/lib/common';
 
 import { BUILTIN_MCP_SERVER_NAME, ISumiMCPServerBackend, SumiMCPServerProxyServicePath } from '../../../../common';
 import { MCPServerDescription } from '../../../../common/mcp-server-manager';
@@ -19,6 +20,7 @@ export const MCPConfigView: React.FC = () => {
   const preferenceService = useInjectable<PreferenceService>(PreferenceService);
   const sumiMCPServerBackendProxy = useInjectable<ISumiMCPServerBackend>(SumiMCPServerProxyServicePath);
   const logger = useInjectable<ILogger>(ILogger);
+  const messageService = useInjectable<IMessageService>(IMessageService);
   const [servers, setServers] = React.useState<MCPServer[]>([]);
   const [formVisible, setFormVisible] = React.useState(false);
   const [editingServer, setEditingServer] = React.useState<MCPServerFormData | undefined>();
@@ -88,7 +90,9 @@ export const MCPConfigView: React.FC = () => {
         await preferenceService.set(AINativeSettingSectionsId.MCPServers, updatedServers);
         await loadServers();
       } catch (error) {
+        const msg = error.message || error;
         logger.error(`Failed to ${start ? 'start' : 'stop'} server ${serverName}:`, error);
+        messageService.error(`Failed to ${start ? 'start' : 'stop'} server ${serverName}:` + msg);
       }
     },
     [mcpServerProxyService, preferenceService, sumiMCPServerBackendProxy, loadServers],

package/src/browser/mcp/config/mcp-config.contribution.ts

@@ -1,6 +1,6 @@
 import { Autowired } from '@opensumi/di';
 import { LabelService } from '@opensumi/ide-core-browser/lib/services';
-import { Domain, Schemes, URI } from '@opensumi/ide-core-common';
+import { Domain, URI } from '@opensumi/ide-core-common';
 import {
   BrowserEditorContribution,
   EditorComponentRegistry,

package/src/browser/mcp/mcp-server.feature.registry.ts

@@ -60,7 +60,7 @@ export class MCPServerRegistry implements IMCPServerRegistry {
   }
 
   getMCPTools(): MCPToolDefinition[] {
-    return this.tools;
+    return this.tools.sort((a, b) => (a.order ?? Infinity) - (b.order ?? Infinity));
   }
 
   async callMCPTool(

package/src/browser/mcp/tools/components/EditFile.tsx

@@ -12,13 +12,13 @@ import {
   path,
   useInjectable,
 } from '@opensumi/ide-core-browser';
-import { Loading } from '@opensumi/ide-core-browser/lib/components/ai-native';
 import { WorkbenchEditorService } from '@opensumi/ide-editor';
 import { ILanguageService } from '@opensumi/monaco-editor-core/esm/vs/editor/common/languages/language';
 import { IModelService } from '@opensumi/monaco-editor-core/esm/vs/editor/common/services/model';
 import { StandaloneServices } from '@opensumi/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneServices';
 
 import { CodeBlockData } from '../../../../common/types';
+import { ApplyStatus } from '../../../components/ApplyStatus';
 import { ChatMarkdown } from '../../../components/ChatMarkdown';
 import { IMCPServerToolComponentProps } from '../../../types';
 import { BaseApplyService } from '../../base-apply.service';
@@ -76,7 +76,7 @@ export const EditFileToolComponent = (props: IMCPServerToolComponentProps) => {
   }
 
   return [
-    instructions && <p>{instructions}</p>,
+    instructions && <p key={'edit-file-tool-instructions'}>{instructions}</p>,
     <div className={styles['edit-file-tool']} key={'edit-file-tool'}>
       <div
         className={cls(styles['edit-file-tool-header'], {
@@ -96,7 +96,7 @@ export const EditFileToolComponent = (props: IMCPServerToolComponentProps) => {
           {codeBlockData.iterationCount > 1 && (
             <span className={styles['edit-file-tool-iteration-count']}>{codeBlockData.iterationCount}/3</span>
           )}
-          {renderStatus(codeBlockData, props.result)}
+          <ApplyStatus status={codeBlockData.status} error={props.result} />
         </div>
         <div className={styles.right}>
           <Popover title={'Show Code'} id={'edit-file-tool-show-code'}>
@@ -137,37 +137,3 @@ export const EditFileToolComponent = (props: IMCPServerToolComponentProps) => {
     ),
   ];
 };
-
-const renderStatus = (codeBlockData: CodeBlockData, error?: string) => {
-  const status = codeBlockData.status;
-  switch (status) {
-    case 'generating':
-      return <Loading />;
-    case 'pending':
-      return (
-        <Popover title='Pending' id={'edit-file-tool-status-pending'}>
-          <Icon iconClass='codicon codicon-circle-large' />
-        </Popover>
-      );
-    case 'success':
-      return (
-        <Popover title='Success' id={'edit-file-tool-status-success'}>
-          <Icon iconClass='codicon codicon-check-all' />
-        </Popover>
-      );
-    case 'failed':
-      return (
-        <Popover title={`Failed (${error})`} id={'edit-file-tool-status-failed'}>
-          <Icon iconClass='codicon codicon-error' style={{ color: 'var(--debugConsole-errorForeground)' }} />
-        </Popover>
-      );
-    case 'cancelled':
-      return (
-        <Popover title='Cancelled' id={'edit-file-tool-status-cancelled'}>
-          <Icon iconClass='codicon codicon-close' style={{ color: 'var(--input-placeholderForeground)' }} />
-        </Popover>
-      );
-    default:
-      return null;
-  }
-};