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

package/src/browser/components/ChangeList.tsx

@@ -0,0 +1,131 @@
+import React, { useMemo, useState } from 'react';
+
+import { Button, Icon } from '@opensumi/ide-components';
+import { LabelService, URI, useInjectable } from '@opensumi/ide-core-browser';
+
+import { CodeBlockStatus } from '../../common/types';
+
+import { ApplyStatus } from './ApplyStatus';
+import styles from './change-list.module.less';
+
+export interface FileChange {
+  path: string;
+  additions: number;
+  deletions: number;
+  status: CodeBlockStatus;
+}
+
+interface FileListDisplayProps {
+  files: FileChange[];
+  onFileClick: (path: string) => void;
+  onRejectAll: () => void;
+  onAcceptAll: () => void;
+}
+
+export const FileListDisplay: React.FC<FileListDisplayProps> = (props) => {
+  const { files, onFileClick, onRejectAll, onAcceptAll } = props;
+  const [isExpanded, setIsExpanded] = useState(true);
+  const labelService = useInjectable<LabelService>(LabelService);
+  const fileIcons = useMemo(
+    () =>
+      files.map((file) => {
+        const uri = URI.parse(file.path);
+        const iconClass = labelService.getIcon(uri);
+        return <span className={iconClass}></span>;
+      }),
+    [files],
+  );
+
+  const totalFiles = files.length;
+  const totalChanges = files.reduce(
+    (acc, file) => ({
+      additions: acc.additions + file.additions,
+      deletions: acc.deletions + file.deletions,
+    }),
+    { additions: 0, deletions: 0 },
+  );
+
+  const handleToggle = () => {
+    setIsExpanded(!isExpanded);
+  };
+
+  const renderChangeStats = (additions: number, deletions: number) => {
+    const parts: React.ReactNode[] = [];
+
+    if (additions > 0) {
+      parts.push(
+        <span key='add' className={styles.additions}>
+          +{additions}
+        </span>,
+      );
+    }
+
+    if (deletions > 0) {
+      if (parts.length > 0) {
+        parts.push(' ');
+      }
+      parts.push(
+        <span key='del' className={styles.deletions}>
+          -{deletions}
+        </span>,
+      );
+    }
+
+    if (parts.length === 0) {
+      parts.push(
+        <span key='no-change' className={styles.noChange}>
+          No changes
+        </span>,
+      );
+    }
+
+    return parts;
+  };
+
+  return (
+    <div className={styles.container}>
+      <div className={styles.header} onClick={handleToggle}>
+        <span className={styles.title}>
+          <button className={styles.toggleButton}>{isExpanded ? <Icon icon='down' /> : <Icon icon='right' />}</button>
+          Changed Files ({totalFiles}) {renderChangeStats(totalChanges.additions, totalChanges.deletions)}
+        </span>
+        {files.some((file) => file.status === 'pending') && (
+          <div className={styles.actions}>
+            <Button
+              type='link'
+              size='small'
+              onClick={(e) => {
+                e.stopPropagation();
+                onRejectAll();
+              }}
+            >
+              Reject
+            </Button>
+            <Button
+              size='small'
+              onClick={(e) => {
+                e.stopPropagation();
+                onAcceptAll();
+              }}
+            >
+              Accept
+            </Button>
+          </div>
+        )}
+      </div>
+
+      <ul className={`${styles.fileList} ${!isExpanded ? styles.collapsed : ''}`}>
+        {files.map((file, index) => (
+          <li key={index} className={styles.fileItem} onClick={() => onFileClick(file.path)}>
+            <span className={styles.fileIcon}>{fileIcons[index] || '📄'}</span>
+            <div className={styles.fileInfo}>
+              <div className={styles.filePath}>{file.path}</div>
+              <div className={styles.fileStats}>{renderChangeStats(file.additions, file.deletions)}</div>
+              <ApplyStatus status={file.status} />
+            </div>
+          </li>
+        ))}
+      </ul>
+    </div>
+  );
+};

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

@@ -1,14 +1,14 @@
-.chat-tool-render {
+.chat_tool_render {
   margin: 8px 0;
   border: 1px solid var(--design-borderColor);
   border-radius: 6px;
   overflow: hidden;
 
-  .tool-header {
+  .tool_header {
     display: flex;
     align-items: center;
     justify-content: space-between;
-    padding: 8px 12px;
+    padding: 4px;
     background-color: var(--design-block-background);
     cursor: pointer;
     user-select: none;
@@ -18,14 +18,25 @@
     }
   }
 
-  .tool-name {
+  .tool_name {
+    font-size: 12px;
     display: flex;
     align-items: center;
     font-weight: 500;
     color: var(--design-text-foreground);
   }
 
-  .expand-icon {
+  .tool_icon {
+    font-size: 12px !important;
+  }
+
+  .tool_label {
+    margin-left: 5px;
+    font-size: 11px;
+    color: var(--descriptionForeground);
+  }
+
+  .expand_icon {
     display: inline-block;
     margin-right: 8px;
     transition: transform 0.2s;
@@ -36,29 +47,29 @@
     }
   }
 
-  .tool-state {
+  .tool_state {
     display: flex;
     align-items: center;
     font-size: 12px;
     color: var(--design-text-placeholderForeground);
   }
 
-  .state-icon {
+  .state_icon {
     display: flex;
     align-items: center;
     margin-right: 6px;
   }
 
-  .loading-icon {
+  .loading_icon {
     width: 12px;
     height: 12px;
   }
 
-  .state-label {
+  .state_label {
     margin-left: 4px;
   }
 
-  .tool-content {
+  .tool_content {
     max-height: 0;
     overflow: hidden;
     transition: max-height 0.3s ease-out;
@@ -69,18 +80,19 @@
     }
   }
 
-  .tool-arguments,
-  .tool-result {
-    padding: 12px;
+  .tool_arguments,
+  .tool_result {
+    font-size: 11px;
+    padding: 5px;
   }
 
-  .section-label {
+  .section_label {
     font-size: 12px;
     color: var(--design-text-placeholderForeground);
     margin-bottom: 8px;
   }
 
-  .tool-result {
+  .tool_result {
     border-top: 1px solid var(--design-borderColor);
   }
 }

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,