@opensumi/ide-ai-native 3.7.2-next-1740107209.0 → 3.7.2-next-1740365741.0

package/src/browser/components/ChatHistory.tsx

@@ -0,0 +1,292 @@
+import cls from 'classnames';
+import React, { FC, memo, useCallback, useEffect, useRef, useState } from 'react';
+
+import { Icon, Input, Loading, Popover, PopoverPosition, PopoverTriggerType, getIcon } from '@opensumi/ide-components';
+import './chat-history.css';
+import { localize } from '@opensumi/ide-core-browser';
+import { EnhanceIcon } from '@opensumi/ide-core-browser/lib/components/ai-native';
+
+export interface IChatHistoryItem {
+  id: string;
+  title: string;
+  updatedAt: number;
+  loading: boolean;
+}
+
+export interface IChatHistoryProps {
+  title: string;
+  historyList: IChatHistoryItem[];
+  currentId?: string;
+  className?: string;
+  onNewChat: () => void;
+  onHistoryItemSelect: (item: IChatHistoryItem) => void;
+  onHistoryItemDelete: (item: IChatHistoryItem) => void;
+  onHistoryItemChange: (item: IChatHistoryItem, title: string) => void;
+}
+
+// 最大历史记录数
+const MAX_HISTORY_LIST = 100;
+
+const ChatHistory: FC<IChatHistoryProps> = memo(
+  ({
+    title,
+    historyList,
+    currentId,
+    onNewChat,
+    onHistoryItemSelect,
+    onHistoryItemChange,
+    onHistoryItemDelete,
+    className,
+  }) => {
+    const [historyTitleEditable, setHistoryTitleEditable] = useState<{
+      [key: string]: boolean;
+    } | null>(null);
+    const [searchValue, setSearchValue] = useState('');
+    const inputRef = useRef<any>(null);
+
+    // 处理搜索输入变化
+    const handleSearchChange = useCallback(
+      (event: React.ChangeEvent<HTMLInputElement>) => {
+        setSearchValue(event.target.value);
+      },
+      [searchValue],
+    );
+
+    // 处理历史记录项选择
+    const handleHistoryItemSelect = useCallback(
+      (item: IChatHistoryItem) => {
+        onHistoryItemSelect(item);
+        setSearchValue('');
+      },
+      [onHistoryItemSelect, searchValue],
+    );
+
+    // 处理标题编辑
+    const handleTitleEdit = useCallback(
+      (item: IChatHistoryItem) => {
+        setHistoryTitleEditable({
+          [item.id]: true,
+        });
+      },
+      [historyTitleEditable],
+    );
+
+    // 处理标题编辑完成
+    const handleTitleEditComplete = useCallback(
+      (item: IChatHistoryItem, newTitle: string) => {
+        setHistoryTitleEditable({
+          [item.id]: false,
+        });
+        onHistoryItemChange(item, newTitle);
+      },
+      [onHistoryItemChange, historyTitleEditable],
+    );
+
+    // 处理标题编辑取消
+    const handleTitleEditCancel = useCallback(
+      (item: IChatHistoryItem) => {
+        setHistoryTitleEditable({
+          [item.id]: false,
+        });
+      },
+      [historyTitleEditable],
+    );
+
+    // 处理新建聊天
+    const handleNewChat = useCallback(() => {
+      onNewChat();
+    }, [onNewChat]);
+
+    useEffect(() => {
+      if (historyTitleEditable) {
+        inputRef.current?.focus({ cursor: 'end' });
+      }
+    }, [historyTitleEditable]);
+
+    // 处理删除历史记录
+    const handleHistoryItemDelete = useCallback(
+      (item: IChatHistoryItem) => {
+        onHistoryItemDelete(item);
+      },
+      [onHistoryItemDelete],
+    );
+
+    // 获取时间标签
+    const getTimeKey = useCallback((diff: number): string => {
+      if (diff < 60 * 60 * 1000) {
+        const minutes = Math.floor(diff / (60 * 1000));
+        return minutes === 0 ? 'Just now' : `${minutes}m ago`;
+      } else if (diff < 24 * 60 * 60 * 1000) {
+        const hours = Math.floor(diff / (60 * 60 * 1000));
+        return `${hours}h ago`;
+      } else if (diff < 7 * 24 * 60 * 60 * 1000) {
+        const days = Math.floor(diff / (24 * 60 * 60 * 1000));
+        return `${days}d ago`;
+      } else if (diff < 30 * 24 * 60 * 60 * 1000) {
+        const weeks = Math.floor(diff / (7 * 24 * 60 * 60 * 1000));
+        return `${weeks}w ago`;
+      } else if (diff < 365 * 24 * 60 * 60 * 1000) {
+        const months = Math.floor(diff / (30 * 24 * 60 * 60 * 1000));
+        return `${months}mo ago`;
+      }
+      const years = Math.floor(diff / (365 * 24 * 60 * 60 * 1000));
+      return `${years}y ago`;
+    }, []);
+
+    // 格式化历史记录
+    const formatHistory = useCallback(
+      (list: IChatHistoryItem[]) => {
+        const now = new Date();
+        const result = [] as { key: string; items: typeof list }[];
+
+        list.forEach((item: IChatHistoryItem) => {
+          const updatedAt = new Date(item.updatedAt);
+          const diff = now.getTime() - updatedAt.getTime();
+          const key = getTimeKey(diff);
+
+          const existingGroup = result.find((group) => group.key === key);
+          if (existingGroup) {
+            existingGroup.items.push(item);
+          } else {
+            result.push({ key, items: [item] });
+          }
+        });
+
+        return result;
+      },
+      [getTimeKey],
+    );
+
+    // 渲染历史记录项
+    const renderHistoryItem = useCallback(
+      (item: IChatHistoryItem) => (
+        <div
+          key={item.id}
+          className={cls('dm-chat-history-item', item.id === currentId ? 'dm-chat-history-item-selected' : '')}
+          onClick={() => handleHistoryItemSelect(item)}
+        >
+          <div className='dm-chat-history-item-content'>
+            {item.loading ? (
+              <Loading />
+            ) : (
+              <Icon icon='message' style={{ width: '16px', height: '16px', marginRight: 4 }} />
+            )}
+            {!historyTitleEditable?.[item.id] ? (
+              <span id={`dm-chat-history-item-title-${item.id}`} className='dm-chat-history-item-title'>
+                {item.title}
+              </span>
+            ) : (
+              <Input
+                className='dm-chat-history-item-title'
+                defaultValue={item.title}
+                ref={inputRef}
+                onPressEnter={(e: any) => {
+                  handleTitleEditComplete(item, e.target.value);
+                }}
+                onBlur={() => handleTitleEditCancel(item)}
+              />
+            )}
+          </div>
+          <div className='dm-chat-history-item-actions'>
+            {/* <EditOutlined
+              title={localize('aiNative.operate.chatHistory.edit')}
+              style={{ marginRight: 8 }}
+              onClick={(e) => {
+                e.preventDefault();
+                e.stopPropagation();
+                handleTitleEdit(item);
+              }}
+            /> */}
+            <EnhanceIcon
+              className={cls('dm-chat-history-item-actions-delete', getIcon('delete'))}
+              onClick={(e) => {
+                e.preventDefault();
+                e.stopPropagation();
+                handleHistoryItemDelete(item);
+              }}
+              ariaLabel={localize('aiNative.operate.chatHistory.delete')}
+            />
+          </div>
+        </div>
+      ),
+      [
+        historyTitleEditable,
+        handleHistoryItemSelect,
+        handleTitleEditComplete,
+        handleTitleEditCancel,
+        handleTitleEdit,
+        handleHistoryItemDelete,
+        currentId,
+        inputRef,
+      ],
+    );
+
+    // 渲染历史记录列表
+    const renderHistory = useCallback(() => {
+      const filteredList = historyList
+        .slice(0, MAX_HISTORY_LIST)
+        .filter((item) => item.title && item.title.includes(searchValue));
+
+      const groupedHistoryList = formatHistory(filteredList);
+
+      return (
+        <div>
+          <Input
+            placeholder={localize('aiNative.operate.chatHistory.searchPlaceholder')}
+            style={{ width: '100%', maxWidth: '100%' }}
+            value={searchValue}
+            onChange={handleSearchChange}
+          />
+          <div className='dm-chat-history-list'>
+            {groupedHistoryList.map((group) => (
+              <div key={group.key} style={{ padding: '4px' }}>
+                <div className='dm-chat-history-time'>{group.key}</div>
+                {group.items.map(renderHistoryItem)}
+              </div>
+            ))}
+          </div>
+        </div>
+      );
+    }, [historyList, searchValue, formatHistory, handleSearchChange, renderHistoryItem]);
+
+    // getPopupContainer 处理函数
+    const getPopupContainer = useCallback((triggerNode: HTMLElement) => triggerNode.parentElement!, []);
+
+    return (
+      <div className={cls('dm-chat-history-header', className)}>
+        <div className='dm-chat-history-header-title'>
+          <span>{title}</span>
+        </div>
+        <div className='dm-chat-history-header-actions'>
+          <Popover
+            id='dm-chat-history-header-actions-history'
+            content={renderHistory()}
+            trigger={PopoverTriggerType.click}
+            position={PopoverPosition.bottomRight}
+            title={localize('aiNative.operate.chatHistory.title')}
+            getPopupContainer={getPopupContainer}
+          >
+            <div
+              className='dm-chat-history-header-actions-history'
+              title={localize('aiNative.operate.chatHistory.title')}
+            >
+              <EnhanceIcon className={cls('dm-chat-history-header-actions-history', 'codicon codicon-history')} />
+            </div>
+          </Popover>
+          <Popover
+            id={'ai-chat-header-close'}
+            position={PopoverPosition.top}
+            title={localize('aiNative.operate.newChat.title')}
+          >
+            <EnhanceIcon
+              className={cls('dm-chat-history-header-actions-new', getIcon('plus'))}
+              onClick={handleNewChat}
+            />
+          </Popover>
+        </div>
+      </div>
+    );
+  },
+);
+
+export default ChatHistory;

package/src/browser/components/ChatReply.tsx

@@ -360,7 +360,11 @@ export const ChatReply = (props: IChatReplyProps) => {
 
   return (
     <ChatThinkingResult
-      hasMessage={request.response.responseParts.length > 0 || !!request.response.errorDetails?.message}
+      hasMessage={
+        request.response.responseParts.length > 0 ||
+        request.response.responseContents.length > 0 ||
+        !!request.response.errorDetails?.message
+      }
       onRegenerate={handleRegenerate}
       requestId={request.requestId}
     >

package/src/browser/components/ChatThinking.tsx

@@ -118,7 +118,7 @@ export const ChatThinkingResult = ({
 
   const isRenderRegenerate = useMemo(() => {
     if (isUndefined(showRegenerate)) {
-      return latestRequestId === requestId;
+      return latestRequestId === requestId && !!requestId;
     }
 
     return !!showRegenerate;

package/src/browser/components/ChatToolRender.tsx

@@ -54,8 +54,17 @@ export const ChatToolRender = (props: { value: IChatToolContent['content']; mess
 
   const stateInfo = getStateInfo(value.state);
 
-  return [
-    <div className={styles['chat-tool-render']} key='chat-tool-render'>
+  return ToolComponent && (value.state === 'complete' || value.state === 'result') ? (
+    <ToolComponent
+      state={value.state}
+      args={getParsedArgs()}
+      result={value.result}
+      index={value.index}
+      messageId={messageId}
+      toolCallId={value.id}
+    />
+  ) : (
+    <div className={styles['chat-tool-render']}>
       <div className={styles['tool-header']} onClick={toggleExpand}>
         <div className={styles['tool-name']}>
           <span className={cls(styles['expand-icon'], { [styles.expanded]: isExpanded })}>▶</span>
@@ -82,17 +91,6 @@ export const ChatToolRender = (props: { value: IChatToolContent['content']; mess
           </div>
         )}
       </div>
-    </div>,
-    ToolComponent && (
-      <ToolComponent
-        key='tool-component'
-        state={value.state}
-        args={getParsedArgs()}
-        result={value.result}
-        index={value.index}
-        messageId={messageId}
-        toolCallId={value.id}
-      />
-    ),
-  ];
+    </div>
+  );
 };

package/src/browser/components/chat-history.css

@@ -0,0 +1,139 @@
+.dm-chat-history-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 13px;
+  padding: 0 4px 0 12px;
+  color: var(--editor-foreground);
+  text-overflow: ellipsis;
+  white-space: nowrap;
+
+  .dm-chat-history-header-title {
+    opacity: 0.6;
+    display: flex;
+    align-items: center;
+    overflow: hidden;
+    span {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      max-width: calc(100vw - 80px);
+      display: inline-block;
+      white-space: nowrap;
+    }
+  }
+
+  .dm-chat-history-header-actions {
+    display: flex;
+    align-items: center;
+    font-size: 12px;
+
+    .dm-chat-history-header-actions-history {
+      cursor: pointer;
+    }
+
+    .dm-chat-history-header-actions-new {
+      margin-left: 2px;
+      cursor: pointer;
+    }
+
+    .kt-popover-title {
+      margin-bottom: 8px;
+    }
+  }
+
+  .kt-popover {
+    .kt-popover-content {
+      width: 300px;
+    }
+    .kt-popover-content {
+      color: var(--editor-foreground);
+      background-color: var(--editor-background);
+      padding: 12px 12px;
+      border-radius: 3px;
+      box-shadow: 0 0 8px 2px var(--widget-shadow);
+    }
+    .kt-popover-title {
+      color: var(--editor-foreground);
+      font-size: 13px;
+    }
+    .kt-input {
+      color: var(--input-foreground);
+      background: var(--input-background);
+      border: 1px solid var(--input-border);
+      text-align: left;
+      height: 24px;
+      font-size: 13px;
+      border-radius: 4px;
+      &:focus {
+        border-color: var(--inputValidation-infoBorder);
+      }
+
+      &::placeholder {
+        color: var(--input-placeholderForeground);
+        opacity: 0.6;
+      }
+    }
+  }
+
+  .dm-chat-history-list {
+    overflow: auto;
+    max-height: 400px;
+    margin-top: 4px;
+    font-size: 13px;
+  }
+
+  .dm-chat-history-time {
+    opacity: 0.6;
+    padding-left: 4px;
+  }
+
+  .dm-chat-history-item {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    cursor: pointer;
+    padding: 4px;
+    margin-top: 2px;
+    border-radius: 3px;
+
+    .dm-chat-history-item-content {
+      display: flex;
+      align-items: center;
+      width: 100%;
+      max-width: 100%;
+      height: 24px;
+    }
+
+    .dm-chat-history-item-title {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      display: inline-block;
+      white-space: nowrap;
+    }
+
+    .dm-chat-history-item-actions {
+      display: none;
+    }
+
+    .dm-chat-history-item-selected {
+      background: var(--textPreformat-background);
+    }
+
+    &:hover {
+      background: var(--textPreformat-background);
+
+      .dm-chat-history-item-actions {
+        display: block;
+      }
+      .dm-chat-history-item-content {
+        max-width: calc(100% - 50px);
+      }
+    }
+  }
+
+  svg {
+    path {
+      fill: var(--foreground);
+    }
+  }
+}

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

@@ -35,7 +35,7 @@
 }
 
 .thinking_text {
-  font-size: 14px;
+  font-size: 12px;
 }
 
 .bottom_container {
@@ -480,7 +480,7 @@
 * welcome
 */
 .chat_welcome_head {
-  font-size: 14px;
+  font-size: 12px;
   line-height: 22px;
   a {
     color: #3c8dff;

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

@@ -27,32 +27,40 @@ export class LLMContextServiceImpl extends WithEventBus implements LLMContextSer
 
   private isAutoCollecting = false;
 
-  private contextFiles: Map<string, FileContext> = new Map();
+  private contextFiles: FileContext[] = [];
+
+  private maxFiles: number = 10; // 上下文的最大长度限制
 
   private onDidContextFilesChangeEmitter = new Emitter<FileContext[]>();
   onDidContextFilesChangeEvent = this.onDidContextFilesChangeEmitter.event;
 
   addFileToContext(uri: URI, selection?: [number, number], isManual = true): void {
-    this.contextFiles.set(uri.toString(), {
-      uri,
-      selection,
-      isManual,
-    });
+    this.removeFileFromContext(uri);
+
+    this.contextFiles.push({ uri, selection, isManual });
+
+    if (this.contextFiles.length > this.maxFiles) {
+      this.contextFiles.shift();
+    }
+
     this.onDidContextFilesChangeEmitter.fire(this.getAllContextFiles());
   }
 
   cleanFileContext() {
-    this.contextFiles.clear();
+    this.contextFiles = [];
     this.onDidContextFilesChangeEmitter.fire(this.getAllContextFiles());
   }
 
   private getAllContextFiles() {
-    return Array.from(this.contextFiles.values());
+    return [...this.contextFiles];
   }
 
   removeFileFromContext(uri: URI): void {
-    this.contextFiles.delete(uri.toString());
-    this.onDidContextFilesChangeEmitter.fire(this.getAllContextFiles());
+    const index = this.contextFiles.findIndex((file) => file.uri.toString() === uri.toString());
+    if (index > -1) {
+      this.contextFiles.splice(index, 1);
+      this.onDidContextFilesChangeEmitter.fire(this.getAllContextFiles());
+    }
   }
 
   startAutoCollection(): void {
@@ -65,18 +73,16 @@ export class LLMContextServiceImpl extends WithEventBus implements LLMContextSer
   }
 
   private startAutoCollectionInternal(): void {
-    // 文件打开
     this.disposables.push(
       this.eventBus.on(EditorDocumentModelCreationEvent, (event) => {
         if (event.payload.uri.scheme !== 'file') {
           return;
         }
-        // TODO: 是否自动添加文件到上下文？
+        // FIXME: 暂时不自动添加
         // this.addFileToContext(event.payload.uri);
       }),
     );
 
-    // 删除
     this.disposables.push(
       this.eventBus.on(EditorDocumentModelRemovalEvent, (event) => {
         if (event.payload.scheme !== 'file') {
@@ -85,16 +91,15 @@ export class LLMContextServiceImpl extends WithEventBus implements LLMContextSer
       }),
     );
 
-    // 保存
     this.disposables.push(
       this.eventBus.on(EditorDocumentModelSavedEvent, (event) => {
         if (event.payload.scheme !== 'file') {
           return;
         }
+        // TODO: 保存文件的逻辑
       }),
     );
 
-    // 光标选中
     this.disposables.push(
       this.eventBus.on(EditorSelectionChangeEvent, (event) => {
         if (event.payload.selections.length > 0) {
@@ -102,9 +107,9 @@ export class LLMContextServiceImpl extends WithEventBus implements LLMContextSer
             event.payload.selections[0].selectionStartLineNumber,
             event.payload.selections[0].positionLineNumber,
           ].sort() as [number, number];
+
           if (selection[0] === selection[1]) {
-            // TODO: 是否自动添加文件到上下文？
-            // this.addFileToContext(event.payload.editorUri, undefined);
+            this.addFileToContext(event.payload.editorUri, undefined);
           } else {
             this.addFileToContext(
               event.payload.editorUri,
@@ -124,8 +129,15 @@ export class LLMContextServiceImpl extends WithEventBus implements LLMContextSer
     const files = this.getAllContextFiles();
     const recentlyViewFiles = files
       .filter((v) => !v.selection)
-      .map((file) => URI.file(this.appConfig.workspaceDir).relative(file.uri)!.toString())
+      .map((file) => {
+        const relativePath = URI.file(this.appConfig.workspaceDir).relative(file.uri);
+        if (relativePath) {
+          return relativePath.toString();
+        }
+        return file.uri.parent.toString();
+      })
       .filter(Boolean);
+
     const attachedFiles = files
       .filter((v) => v.selection)
       .map((file) => {

package/src/browser/index.ts

@@ -59,16 +59,12 @@ import { MCPServerProxyService } from './mcp/mcp-server-proxy.service';
 import { MCPServerRegistry } from './mcp/mcp-server.feature.registry';
 import { CreateNewFileWithTextTool } from './mcp/tools/createNewFileWithText';
 import { EditFileTool } from './mcp/tools/editFile';
-import { FindFilesByNameSubstringTool } from './mcp/tools/findFilesByNameSubstring';
-import { GetCurrentFilePathTool } from './mcp/tools/getCurrentFilePath';
+import { FileSearchTool } from './mcp/tools/fileSearch';
 import { GetDiagnosticsByPathTool } from './mcp/tools/getDiagnosticsByPath';
-import { GetFileTextByPathTool } from './mcp/tools/getFileTextByPath';
 import { GetOpenEditorFileDiagnosticsTool } from './mcp/tools/getOpenEditorFileDiagnostics';
-import { GetOpenEditorFileTextTool } from './mcp/tools/getOpenEditorFileText';
-import { GetSelectedTextTool } from './mcp/tools/getSelectedText';
+import { GrepSearchTool } from './mcp/tools/grepSearch';
 import { ListDirTool } from './mcp/tools/listDir';
 import { ReadFileTool } from './mcp/tools/readFile';
-import { ReplaceOpenEditorFileByDiffPreviewerTool } from './mcp/tools/replaceOpenEditorFileByDiffPreviewer';
 import { RunTerminalCommandTool } from './mcp/tools/runTerminalCmd';
 import { AINativePreferencesContribution } from './preferences';
 import { AINativeCoreContribution, MCPServerContribution, TokenMCPServerRegistry } from './types';
@@ -101,15 +97,11 @@ export class AINativeModule extends BrowserModule {
     ReadFileTool,
     EditFileTool,
     CreateNewFileWithTextTool,
-    GetSelectedTextTool,
     GetOpenEditorFileDiagnosticsTool,
-    GetOpenEditorFileTextTool,
-    GetFileTextByPathTool,
-    GetCurrentFilePathTool,
-    FindFilesByNameSubstringTool,
+    FileSearchTool,
+    GrepSearchTool,
     GetDiagnosticsByPathTool,
     RunTerminalCommandTool,
-    ReplaceOpenEditorFileByDiffPreviewerTool,
     // MCP Server Contributions END
 
     // Context Service
@@ -201,7 +193,7 @@ export class AINativeModule extends BrowserModule {
     },
     {
       token: ChatAgentPromptProvider,
-      useValue: DefaultChatAgentPromptProvider,
+      useClass: DefaultChatAgentPromptProvider,
     },
   ];
 

package/src/browser/layout/layout.module.less

@@ -23,7 +23,7 @@
     .rce-mbox-text {
       line-height: 18px;
       width: inherit;
-      font-size: 14px;
+      font-size: 12px;
     }
 
     .rce-smsg {

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

@@ -62,8 +62,9 @@ export class MCPServerRegistry implements IMCPServerRegistry {
         throw new Error(`MCP tool ${name} not found`);
       }
       // 统一校验并转换
+      const toolCallId = args.toolCallId;
       args = tool.inputSchema.parse(args);
-      return await tool.handler(args, this.logger);
+      return await tool.handler({ ...args, toolCallId }, this.logger);
     } catch (error) {
       // eslint-disable-next-line no-console
       console.error('callMCPTool error:', error);