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

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

@@ -1,16 +1,19 @@
 import { Autowired, INJECTOR_TOKEN, Injectable, Injector } from '@opensumi/di';
+import { PreferenceService } from '@opensumi/ide-core-browser';
 import {
+  AINativeSettingSectionsId,
   CancellationToken,
   CancellationTokenSource,
   Disposable,
   DisposableMap,
   Emitter,
   IChatProgress,
+  IDisposable,
   IStorage,
+  LRUCache,
   STORAGE_NAMESPACE,
   StorageProvider,
   debounce,
-  formatLocalize,
 } from '@opensumi/ide-core-common';
 import { IHistoryChatMessage } from '@opensumi/ide-core-common/lib/types/ai-native';
 
@@ -38,9 +41,26 @@ interface ISessionModel {
 
 const MAX_SESSION_COUNT = 20;
 
+class DisposableLRUCache<K, V extends IDisposable = IDisposable> extends LRUCache<K, V> implements IDisposable {
+  disposeKey(key: K): void {
+    const disposable = this.get(key);
+    if (disposable) {
+      disposable.dispose();
+    }
+    this.delete(key);
+  }
+
+  dispose(): void {
+    this.forEach((disposable) => {
+      disposable.dispose();
+    });
+    this.clear();
+  }
+}
+
 @Injectable()
 export class ChatManagerService extends Disposable {
-  #sessionModels = this.registerDispose(new DisposableMap<string, ChatModel>());
+  #sessionModels = this.registerDispose(new DisposableLRUCache<string, ChatModel>(MAX_SESSION_COUNT));
   #pendingRequests = this.registerDispose(new DisposableMap<string, CancellationTokenSource>());
   private storageInitEmitter = new Emitter<void>();
   public onStorageInit = this.storageInitEmitter.event;
@@ -54,35 +74,39 @@ export class ChatManagerService extends Disposable {
   @Autowired(StorageProvider)
   private storageProvider: StorageProvider;
 
+  @Autowired(PreferenceService)
+  private preferenceService: PreferenceService;
+
   private _chatStorage: IStorage;
 
   protected fromJSON(data: ISessionModel[]) {
-    // TODO: 支持ApplyService恢复
-    return data.map((item) => {
-      const model = new ChatModel({
-        sessionId: item.sessionId,
-        history: new MsgHistoryManager(item.history),
+    return data
+      .filter((item) => item.history.messages.length > 0)
+      .map((item) => {
+        const model = new ChatModel({
+          sessionId: item.sessionId,
+          history: new MsgHistoryManager(item.history),
+        });
+        const requests = item.requests.map(
+          (request) =>
+            new ChatRequestModel(
+              request.requestId,
+              model,
+              request.message,
+              new ChatResponseModel(request.requestId, model, request.message.agentId, {
+                responseContents: request.response.responseContents,
+                isComplete: true,
+                responseText: request.response.responseText,
+                responseParts: request.response.responseParts,
+                errorDetails: request.response.errorDetails,
+                followups: request.response.followups,
+                isCanceled: request.response.isCanceled,
+              }),
+            ),
+        );
+        model.restoreRequests(requests);
+        return model;
       });
-      const requests = item.requests.map(
-        (request) =>
-          new ChatRequestModel(
-            request.requestId,
-            model,
-            request.message,
-            new ChatResponseModel(request.requestId, model, request.message.agentId, {
-              responseContents: request.response.responseContents,
-              isComplete: true,
-              responseText: request.response.responseText,
-              responseParts: request.response.responseParts,
-              errorDetails: request.response.errorDetails,
-              followups: request.response.followups,
-              isCanceled: request.response.isCanceled,
-            }),
-          ),
-      );
-      model.restoreRequests(requests);
-      return model;
-    });
   }
 
   constructor() {
@@ -105,9 +129,6 @@ export class ChatManagerService extends Disposable {
   }
 
   startSession() {
-    if (this.#sessionModels.size >= MAX_SESSION_COUNT) {
-      throw new Error(formatLocalize('aiNative.chat.session.max', MAX_SESSION_COUNT.toString()));
-    }
     const model = new ChatModel();
     this.#sessionModels.set(model.sessionId, model);
     this.listenSession(model);
@@ -155,7 +176,8 @@ export class ChatManagerService extends Disposable {
       request.response.cancel();
     });
 
-    const history = model.messageHistory;
+    const contextWindow = this.preferenceService.get<number>(AINativeSettingSectionsId.ContextWindow);
+    const history = model.getMessageHistory(contextWindow);
 
     try {
       const progressCallback = (progress: IChatProgress) => {

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

@@ -276,15 +276,12 @@ export class ChatRequestModel implements IChatRequestModel {
 }
 
 export class ChatModel extends Disposable implements IChatModel {
-  private static requestIdPool = 0;
+  private requestIdPool = 0;
 
-  constructor(initParams?: { sessionId?: string; history?: MsgHistoryManager; requests?: ChatRequestModel[] }) {
+  constructor(initParams?: { sessionId?: string; history?: MsgHistoryManager }) {
     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]));
-    }
   }
 
   #sessionId: string;
@@ -299,11 +296,18 @@ export class ChatModel extends Disposable implements IChatModel {
 
   restoreRequests(requests: ChatRequestModel[]): void {
     this.#requests = new Map(requests.map((r) => [r.requestId, r]));
+    this.requestIdPool = requests.length;
   }
 
   readonly history: MsgHistoryManager;
 
-  get messageHistory() {
+  #slicedMessageCount = 0;
+
+  public get slicedMessageCount() {
+    return this.#slicedMessageCount;
+  }
+
+  getMessageHistory(contextWindow?: number) {
     const history: CoreMessage[] = [];
     for (const request of this.requests) {
       if (!request.response.isComplete) {
@@ -352,13 +356,23 @@ export class ChatModel extends Disposable implements IChatModel {
         }
       }
     }
-    return history;
+    if (contextWindow) {
+      while (this.#slicedMessageCount < history.length) {
+        // 简单的使用 JSON.stringify 计算 token 数量
+        const tokenCount = JSON.stringify(history.slice(this.#slicedMessageCount)).length / 3;
+        if (tokenCount <= contextWindow) {
+          break;
+        }
+        this.#slicedMessageCount++;
+      }
+    }
+    return history.slice(this.#slicedMessageCount);
   }
 
   addRequest(message: IChatRequestMessage): ChatRequestModel {
     const msg = message;
 
-    const requestId = `${this.sessionId}_request_${ChatModel.requestIdPool++}`;
+    const requestId = `${this.sessionId}_request_${this.requestIdPool++}`;
     const response = new ChatResponseModel(requestId, this, msg.agentId);
     const request = new ChatRequestModel(requestId, this, msg, response);
 

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

@@ -92,6 +92,7 @@ export class ChatProxyService extends Disposable {
       apiKey = this.preferenceService.get<string>(AINativeSettingSectionsId.OpenaiApiKey, '');
       baseURL = this.preferenceService.get<string>(AINativeSettingSectionsId.OpenaiBaseURL, '');
     }
+    const maxTokens = this.preferenceService.get<number>(AINativeSettingSectionsId.MaxTokens);
     const agent = this.chatAgentService.getAgent(ChatProxyService.AGENT_ID);
     return {
       clientId: this.applicationService.clientId,
@@ -99,6 +100,7 @@ export class ChatProxyService extends Disposable {
       modelId,
       apiKey,
       baseURL,
+      maxTokens,
       system: agent?.metadata.systemPrompt,
     };
   }

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

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { MessageList } from 'react-chat-elements';
 
-import { getIcon, useInjectable, useUpdateOnEvent } from '@opensumi/ide-core-browser';
+import { AppConfig, getIcon, useInjectable, useUpdateOnEvent } from '@opensumi/ide-core-browser';
 import { Popover, PopoverPosition } from '@opensumi/ide-core-browser/lib/components';
 import { EnhanceIcon } from '@opensumi/ide-core-browser/lib/components/ai-native';
 import {
@@ -19,15 +19,20 @@ import {
   IAIReporter,
   IChatComponent,
   IChatContent,
+  URI,
   formatLocalize,
   localize,
+  path,
   uuid,
 } from '@opensumi/ide-core-common';
+import { WorkbenchEditorService } from '@opensumi/ide-editor';
 import { IMainLayoutService } from '@opensumi/ide-main-layout';
 import { IMessageService } from '@opensumi/ide-overlay';
 
 import 'react-chat-elements/dist/main.css';
 import { AI_CHAT_VIEW_ID, IChatAgentService, IChatInternalService, IChatMessageStructure } from '../../common';
+import { CodeBlockData } from '../../common/types';
+import { FileChange, FileListDisplay } from '../components/ChangeList';
 import { ChatContext } from '../components/ChatContext';
 import { CodeBlockWrapperInput } from '../components/ChatEditor';
 import ChatHistory, { IChatHistoryItem } from '../components/ChatHistory';
@@ -37,6 +42,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 { BaseApplyService } from '../mcp/base-apply.service';
 import { ChatViewHeaderRender, IMCPServerRegistry, TSlashCommandCustomRender, TokenMCPServerRegistry } from '../types';
 
 import { ChatRequestModel, ChatSlashCommandItemModel } from './chat-model';
@@ -56,6 +62,41 @@ interface TDispatchAction {
 
 const MAX_TITLE_LENGTH = 100;
 
+const getFileChanges = (codeBlocks: CodeBlockData[]) =>
+  codeBlocks
+    .map((block) => {
+      const rangesFromDiffHunk =
+        block.applyResult?.diff.split('\n').reduce(
+          ([del, add], line) => {
+            if (line.startsWith('-')) {
+              del += 1;
+            } else if (line.startsWith('+')) {
+              add += 1;
+            }
+            return [del, add];
+          },
+          [0, 0],
+        ) || [];
+      return {
+        path: block.relativePath,
+        additions: rangesFromDiffHunk[1],
+        deletions: rangesFromDiffHunk[0],
+        status: block.status,
+      };
+    })
+    .reduce((acc, curr) => {
+      const existingFile = acc.find((file) => file.path === curr.path);
+      if (existingFile) {
+        existingFile.additions += curr.additions;
+        existingFile.deletions += curr.deletions;
+        // 使用最新的状态
+        existingFile.status = curr.status;
+      } else {
+        acc.push(curr);
+      }
+      return acc;
+    }, [] as FileChange[]);
+
 export const AIChatView = () => {
   const aiChatService = useInjectable<ChatInternalService>(IChatInternalService);
   const chatApiService = useInjectable<ChatService>(ChatServiceToken);
@@ -70,9 +111,13 @@ export const AIChatView = () => {
   const containerRef = React.useRef<HTMLDivElement>(null);
   const autoScroll = React.useRef<boolean>(true);
   const chatInputRef = React.useRef<{ setInputValue: (v: string) => void } | null>(null);
-
+  const editorService = useInjectable<WorkbenchEditorService>(WorkbenchEditorService);
+  const appConfig = useInjectable<AppConfig>(AppConfig);
+  const applyService = useInjectable<BaseApplyService>(BaseApplyService);
   const [shortcutCommands, setShortcutCommands] = React.useState<ChatSlashCommandItemModel[]>([]);
 
+  const [changeList, setChangeList] = React.useState<FileChange[]>(getFileChanges(applyService.getSessionCodeBlocks()));
+
   const [messageListData, dispatchMessage] = React.useReducer((state: MessageData[], action: TDispatchAction) => {
     switch (action.type) {
       case 'add':
@@ -92,6 +137,18 @@ export const AIChatView = () => {
   const [command, setCommand] = React.useState('');
   const [theme, setTheme] = React.useState<string | null>(null);
 
+  React.useEffect(() => {
+    const disposer = new Disposable();
+    const doUpdate = () => {
+      const fileChanges = getFileChanges(applyService.getSessionCodeBlocks());
+      setChangeList(fileChanges);
+    };
+    disposer.addDispose(aiChatService.onChangeSession(doUpdate));
+    // TODO: 全量获取性能不好
+    disposer.addDispose(applyService.onCodeBlockUpdate(doUpdate));
+    return () => disposer.dispose();
+  }, []);
+
   React.useEffect(() => {
     const featureSlashCommands = chatFeatureRegistry.getAllShortcutSlashCommand();
 
@@ -691,10 +748,13 @@ export const AIChatView = () => {
               dataSource={messageListData}
             />
           </div>
-          {msgHistoryManager.slicedMessageCount ? (
+          {aiChatService.sessionModel.slicedMessageCount ? (
             <div className={styles.chat_tips_text}>
               <div className={styles.chat_tips_container}>
-                {formatLocalize('aiNative.chat.ai.assistant.limit.message', msgHistoryManager.slicedMessageCount)}
+                {formatLocalize(
+                  'aiNative.chat.ai.assistant.limit.message',
+                  aiChatService.sessionModel.slicedMessageCount,
+                )}
               </div>
             </div>
           ) : null}
@@ -715,6 +775,20 @@ export const AIChatView = () => {
                 ))}
               </div>
             </div>
+            {changeList.length > 0 && (
+              <FileListDisplay
+                files={changeList}
+                onFileClick={(filePath) => {
+                  editorService.open(URI.file(path.join(appConfig.workspaceDir, filePath)));
+                }}
+                onRejectAll={() => {
+                  applyService.processAll('reject');
+                }}
+                onAcceptAll={() => {
+                  applyService.processAll('accept');
+                }}
+              />
+            )}
             <ChatInputWrapperRender
               onSend={(value, agentId, command) =>
                 handleSend({
@@ -782,11 +856,8 @@ export function DefaultChatViewHeader({
   React.useEffect(() => {
     const getHistoryList = () => {
       const currentMessages = aiChatService.sessionModel.history.getMessages();
-      setCurrentTitle(
-        currentMessages.length > 0
-          ? currentMessages[currentMessages.length - 1].content.slice(0, MAX_TITLE_LENGTH)
-          : '',
-      );
+      const latestUserMessage = currentMessages.findLast((m) => m.role === ChatMessageRole.User);
+      setCurrentTitle(latestUserMessage ? latestUserMessage.content.slice(0, MAX_TITLE_LENGTH) : '');
       setHistoryList(
         aiChatService.getSessions().map((session) => {
           const history = session.history;

package/src/browser/components/ApplyStatus.tsx

@@ -0,0 +1,44 @@
+import React from 'react';
+
+import { Icon, Loading, Popover } from '@opensumi/ide-components';
+
+import { CodeBlockStatus } from '../../common/types';
+
+import styles from './components.module.less';
+
+export const ApplyStatus = ({ status, error }: { status: CodeBlockStatus; error?: string }) => {
+  const renderStatus = () => {
+    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-pass' />
+          </Popover>
+        );
+      case 'failed':
+        return (
+          <Popover title={`Failed (${error || 'Unknown error'})`} id={'edit-file-tool-status-failed'}>
+            <Icon iconClass='codicon codicon-error' />
+          </Popover>
+        );
+      case 'cancelled':
+        return (
+          <Popover title='Cancelled' id={'edit-file-tool-status-cancelled'}>
+            <Icon iconClass='codicon codicon-circle-slash' style={{ color: 'var(--input-placeholderForeground)' }} />
+          </Popover>
+        );
+      default:
+        return null;
+    }
+  };
+
+  return <span className={styles.status}>{renderStatus()}</span>;
+};

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);
   }
 }