@opensumi/ide-editor 2.27.3-rc-1713515623.0 → 2.27.3-rc-1713838390.0

package/src/browser/editor-collection.service.ts

@@ -5,9 +5,11 @@ import { MonacoService } from '@opensumi/ide-core-browser/lib/monaco';
 import {
   Disposable,
   Emitter,
+  Event,
   Emitter as EventEmitter,
   ILineChange,
   ISelection,
+  LRUCache,
   OnEvent,
   URI,
   WithEventBus,
@@ -19,6 +21,7 @@ import { IConfigurationService } from '@opensumi/monaco-editor-core/esm/vs/platf
 
 import {
   CursorStatus,
+  DIFF_SCHEME,
   EditorCollectionService,
   EditorType,
   ICodeEditor,
@@ -559,6 +562,8 @@ export class BrowserDiffEditor extends WithEventBus implements IDiffEditor {
 
   private modifiedDocModelRef: IEditorDocumentModelRef | null;
 
+  private diffEditorModelCache = new LRUCache<string, monaco.editor.IDiffEditorViewModel>(100);
+
   get originalDocModel() {
     if (this.originalDocModelRef && !this.originalDocModelRef.disposed) {
       return this.originalDocModelRef.instance;
@@ -622,7 +627,7 @@ export class BrowserDiffEditor extends WithEventBus implements IDiffEditor {
       this.configurationService.onDidChangeConfiguration((e) => {
         const changedEditorKeys = Array.from(e.affectedKeys.values()).filter((key) => isDiffEditorOption(key));
         if (changedEditorKeys.length > 0) {
-          this.doUpdateDiffOptions();
+          this.updateDiffOptions();
         }
       }),
     );
@@ -642,16 +647,20 @@ export class BrowserDiffEditor extends WithEventBus implements IDiffEditor {
     }
     const original = this.originalDocModel.getMonacoModel();
     const modified = this.modifiedDocModel.getMonacoModel();
-    this.monacoDiffEditor.setModel({
-      original,
-      modified,
-    });
+    const key = `${original.uri.toString()}-${modified.uri.toString()}`;
+    let model = this.diffEditorModelCache.get(key);
+    if (!model) {
+      model = this.monacoDiffEditor.createViewModel({ original, modified });
+      this.diffEditorModelCache.set(key, model);
+    }
+
+    this.monacoDiffEditor.setModel(model);
 
     if (rawUri) {
       this.currentUri = rawUri;
     } else {
       this.currentUri = URI.from({
-        scheme: 'diff',
+        scheme: DIFF_SCHEME,
         query: URI.stringifyQuery({
           name,
           original: this.originalDocModel!.uri.toString(),
@@ -663,16 +672,15 @@ export class BrowserDiffEditor extends WithEventBus implements IDiffEditor {
     if (options.range || options.originalRange) {
       const range = (options.range || options.originalRange) as monaco.IRange;
       const currentEditor = options.range ? this.modifiedEditor.monacoEditor : this.originalEditor.monacoEditor;
-      // 必须使用 setTimeout, 因为两边的 editor 出现时机问题，diffEditor是异步显示和渲染
+      // 必须使用 setTimeout, 因为两边的 editor 出现时机问题，diffEditor 是异步显示和渲染
       setTimeout(() => {
         currentEditor.revealRangeInCenter(range);
         currentEditor.setSelection(range);
       });
-      // monaco diffEditor 在setModel后，计算diff完成后, 左侧 originalEditor 会发出一个异步的onScroll，
+      // monaco diffEditor 在 setModel 后，计算 diff 完成后, 左侧 originalEditor 会发出一个异步的onScroll，
       // 这个行为可能会带动右侧 modifiedEditor 进行滚动， 导致 revealRange 错位
-      // 此处 添加一个onDidUpdateDiff 监听
-      const disposer = this.monacoDiffEditor.onDidUpdateDiff(() => {
-        disposer.dispose();
+      // 此处 添加一个 onDidUpdateDiff 监听
+      Event.once(this.monacoDiffEditor.onDidUpdateDiff)(() => {
         currentEditor.setSelection(range);
         setTimeout(() => {
           currentEditor.revealRangeInCenter(range);
@@ -682,14 +690,15 @@ export class BrowserDiffEditor extends WithEventBus implements IDiffEditor {
       this.restoreState();
     }
     const enableHideUnchanged = this.preferenceService.get('diffEditor.hideUnchangedRegions.enabled');
+
     if (options.revealFirstDiff && !enableHideUnchanged) {
       // 仅在非折叠模式下自动滚动到第一个 Diff
       const diffs = this.monacoDiffEditor.getLineChanges();
       if (diffs && diffs.length > 0) {
-        this.showFirstDiff();
+        this.showFirstDiff(model);
       } else {
         const disposer = this.monacoDiffEditor.onDidUpdateDiff(() => {
-          this.showFirstDiff();
+          this.showFirstDiff(model);
           disposer.dispose();
         });
       }
@@ -698,13 +707,9 @@ export class BrowserDiffEditor extends WithEventBus implements IDiffEditor {
     this.diffResourceKeys.forEach((r) => r.set(this.currentUri));
   }
 
-  showFirstDiff() {
-    const diffs = this.monacoDiffEditor.getLineChanges();
-    if (diffs && diffs.length > 0) {
-      setTimeout(() => {
-        this.monacoDiffEditor.revealLineInCenter(diffs[0].modifiedStartLineNumber);
-      }, 0);
-    }
+  private async showFirstDiff(model?: monaco.editor.IDiffEditorViewModel) {
+    await model?.waitForDiff();
+    this.monacoDiffEditor.revealFirstDiff();
   }
 
   private async updateOptionsOnModelChange() {
@@ -741,8 +746,8 @@ export class BrowserDiffEditor extends WithEventBus implements IDiffEditor {
     }
   }
 
-  updateDiffOptions(options: Partial<monaco.editor.IDiffEditorOptions>) {
-    this.specialOptions = removeUndefined({ ...this.specialOptions, ...options });
+  updateDiffOptions() {
+    this.diffEditorModelCache.clear();
     this.doUpdateDiffOptions();
   }
 
@@ -812,6 +817,7 @@ export class BrowserDiffEditor extends WithEventBus implements IDiffEditor {
     super.dispose();
     this.collectionService.removeEditors([this.originalEditor, this.modifiedEditor]);
     this.collectionService.removeDiffEditors([this]);
+    this.diffEditorModelCache.clear();
     this.monacoDiffEditor.dispose();
     this._disposed = true;
   }

package/src/browser/editor.contribution.ts

@@ -56,6 +56,7 @@ import { ContextKeyExpr } from '@opensumi/monaco-editor-core/esm/vs/platform/con
 import { SyncDescriptor } from '@opensumi/monaco-editor-core/esm/vs/platform/instantiation/common/descriptors';
 
 import {
+  DIFF_SCHEME,
   Direction,
   EditorGroupSplitAction,
   IDocPersistentCacheProvider,
@@ -509,7 +510,7 @@ export class EditorContribution
         name = name || `${original.displayName} <=> ${modified.displayName}`;
         return this.workbenchEditorService.open(
           URI.from({
-            scheme: 'diff',
+            scheme: DIFF_SCHEME,
             query: URI.stringifyQuery({
               name,
               original,
@@ -881,7 +882,9 @@ export class EditorContribution
         }
 
         const uris =
-          resource.uri.scheme === 'diff' ? [resource.metadata.original, resource.metadata.modified] : [resource.uri];
+          resource.uri.scheme === DIFF_SCHEME
+            ? [resource.metadata.original, resource.metadata.modified]
+            : [resource.uri];
         uris.forEach((uri) => {
           this.editorDocumentModelService.changeModelOptions(uri, {
             encoding: selectedFileEncoding,

package/src/browser/editor.view.tsx

@@ -58,7 +58,7 @@ export const EditorView = () => {
   const rightWidgetInfo = componentRegistry.getComponentRegistryInfo('editor-widget-right');
   const RightWidget: React.ComponentType<any> | undefined = rightWidgetInfo && rightWidgetInfo.views[0].component;
   const [ready, setReady] = React.useState<boolean>(workbenchEditorService.gridReady);
-  const styles_kt_workbench_editor = useDesignStyles(styles.kt_workbench_editor);
+  const styles_kt_workbench_editor = useDesignStyles(styles.kt_workbench_editor, 'kt_workbench_editor');
 
   React.useEffect(() => {
     if (!ready) {
@@ -240,7 +240,7 @@ export const EditorGroupView = observer(({ group }: { group: EditorGroup }) => {
 
   const preferenceService = useInjectable(PreferenceService) as PreferenceService;
   const [isEmpty, setIsEmpty] = React.useState(group.resources.length === 0);
-  const styles_kt_editor_group = useDesignStyles(styles.kt_editor_group);
+  const styles_kt_editor_group = useDesignStyles(styles.kt_editor_group, 'kt_editor_group');
 
   const appConfig = useInjectable(AppConfig);
   const { editorBackgroundImage } = appConfig;
@@ -327,7 +327,7 @@ export const EditorGroupBody = observer(({ group }: { group: EditorGroup }) => {
   const editorBodyRef = React.useRef<HTMLDivElement>(null);
   const editorService = useInjectable(WorkbenchEditorService) as WorkbenchEditorServiceImpl;
   const eventBus = useInjectable(IEventBus) as IEventBus;
-  const styles_kt_editor_component = useDesignStyles(styles.kt_editor_component);
+  const styles_kt_editor_component = useDesignStyles(styles.kt_editor_component, 'kt_editor_component');
   const components: React.ReactNode[] = [];
   const codeEditorRef = React.useRef<HTMLDivElement>(null);
   const diffEditorRef = React.useRef<HTMLDivElement>(null);

package/src/browser/navigation.view.tsx

@@ -22,8 +22,8 @@ import { EditorGroup } from './workbench-editor.service';
 
 export const NavigationBar = ({ editorGroup }: { editorGroup: EditorGroup }) => {
   const breadCrumbService = useInjectable<IBreadCrumbService>(IBreadCrumbService);
-  const styles_navigation_container = useDesignStyles(styles.navigation_container);
-  const styles_navigation_icon = useDesignStyles(styles.navigation_icon);
+  const styles_navigation_container = useDesignStyles(styles.navigation_container, 'navigation_container');
+  const styles_navigation_icon = useDesignStyles(styles.navigation_icon, 'navigation_icon');
 
   useUpdateOnGroupTabChange(editorGroup);
 
@@ -74,7 +74,7 @@ export const NavigationItem = memo(({ part, editorGroup }: { part: IBreadCrumbPa
   const viewService = useInjectable<NavigationBarViewService>(NavigationBarViewService);
   const breadcrumbsMenuService = useInjectable<BreadCrumbsMenuService>(BreadCrumbsMenuService);
   const itemRef = useRef<HTMLSpanElement>();
-  const styles_navigation_part = useDesignStyles(styles['navigation-part']);
+  const styles_navigation_part = useDesignStyles(styles['navigation-part'], 'navigation-part');
 
   const onClick = useCallback(async () => {
     if (part.getSiblings && itemRef.current) {
@@ -117,8 +117,8 @@ export const NavigationMenu = observer(({ model }: { model: NavigationMenuModel
   }
 
   const scrollerContainer = useRef<HTMLDivElement | null>();
-  const styles_navigation_menu = useDesignStyles(styles.navigation_menu);
-  const styles_navigation_menu_item = useDesignStyles(styles.navigation_menu_item);
+  const styles_navigation_menu = useDesignStyles(styles.navigation_menu, 'navigation_menu');
+  const styles_navigation_menu_item = useDesignStyles(styles.navigation_menu_item, 'navigation_menu_item');
   const viewService = useInjectable(NavigationBarViewService) as NavigationBarViewService;
 
   const scrollToCurrent = useCallback(() => {

package/src/browser/preference/converter.ts

@@ -820,6 +820,17 @@ export const diffEditorOptionsConverters: Map<KaitianPreferenceKey, NoConverter
       }),
     },
   ],
+  [
+    'diffEditor.experimental.stickyScroll.enabled',
+    {
+      monaco: 'experimental',
+      convert: (value) => ({
+        stickyScroll: {
+          enabled: value,
+        },
+      }),
+    },
+  ],
 
   /**
    * Controls whether the diff editor shows unchanged regions.

package/src/browser/preference/schema.ts

@@ -256,6 +256,9 @@ export const DIFF_EDITOR_DEFAULTS = {
     showMoves: false,
     showEmptyDecorations: true,
     collapseUnchangedRegions: true,
+    stickyScroll: {
+      enable: false,
+    },
   },
 };
 
@@ -1452,6 +1455,10 @@ const monacoEditorSchema: PreferenceSchemaProperties = {
     type: 'boolean',
     default: DIFF_EDITOR_DEFAULTS.minimap,
   },
+  'diffEditor.experimental.stickyScroll.enabled': {
+    type: 'boolean',
+    default: DIFF_EDITOR_DEFAULTS.experimental.stickyScroll.enable,
+  },
 };
 
 const customEditorSchema: PreferenceSchemaProperties = {

package/src/browser/tab.view.tsx

@@ -72,18 +72,30 @@ export const Tabs = ({ group }: ITabsProps) => {
   const editorTabService = useInjectable<IEditorTabService>(IEditorTabService);
   const appConfig = useInjectable<AppConfig>(AppConfig);
 
-  const styles_tab_right = useDesignStyles(styles.tab_right);
-  const styles_close_tab = useDesignStyles(styles.close_tab);
-  const styles_kt_editor_close_icon = useDesignStyles(styles.kt_editor_close_icon);
-  const styles_kt_editor_tabs_content = useDesignStyles(styles.kt_editor_tabs_content);
-  const styles_kt_editor_tabs_current_last = useDesignStyles(styles.kt_editor_tabs_current_last);
-  const styles_kt_editor_tab = useDesignStyles(styles.kt_editor_tab);
-  const styles_kt_editor_tab_current_prev = useDesignStyles(styles.kt_editor_tab_current_prev);
-  const styles_kt_editor_tab_current_next = useDesignStyles(styles.kt_editor_tab_current_next);
-  const styles_kt_editor_tab_current = useDesignStyles(styles.kt_editor_tab_current);
-  const styles_kt_editor_tab_dirty = useDesignStyles(styles.kt_editor_tab_dirty);
-  const styles_kt_editor_tabs = useDesignStyles(styles.kt_editor_tabs);
-  const styles_kt_editor_tabs_scroll_wrapper = useDesignStyles(styles.kt_editor_tabs_scroll_wrapper);
+  const styles_tab_right = useDesignStyles(styles.tab_right, 'tab_right');
+  const styles_close_tab = useDesignStyles(styles.close_tab, 'close_tab');
+  const styles_kt_editor_close_icon = useDesignStyles(styles.kt_editor_close_icon, 'kt_editor_close_icon');
+  const styles_kt_editor_tabs_content = useDesignStyles(styles.kt_editor_tabs_content, 'kt_editor_tabs_content');
+  const styles_kt_editor_tabs_current_last = useDesignStyles(
+    styles.kt_editor_tabs_current_last,
+    'kt_editor_tabs_current_last',
+  );
+  const styles_kt_editor_tab = useDesignStyles(styles.kt_editor_tab, 'kt_editor_tab');
+  const styles_kt_editor_tab_current_prev = useDesignStyles(
+    styles.kt_editor_tab_current_prev,
+    'kt_editor_tab_current_prev',
+  );
+  const styles_kt_editor_tab_current_next = useDesignStyles(
+    styles.kt_editor_tab_current_next,
+    'kt_editor_tab_current_next',
+  );
+  const styles_kt_editor_tab_current = useDesignStyles(styles.kt_editor_tab_current, 'kt_editor_tab_current');
+  const styles_kt_editor_tab_dirty = useDesignStyles(styles.kt_editor_tab_dirty, 'kt_editor_tab_dirty');
+  const styles_kt_editor_tabs = useDesignStyles(styles.kt_editor_tabs, 'kt_editor_tabs');
+  const styles_kt_editor_tabs_scroll_wrapper = useDesignStyles(
+    styles.kt_editor_tabs_scroll_wrapper,
+    'kt_editor_tabs_scroll_wrapper',
+  );
 
   const [tabsLoadingMap, setTabsLoadingMap] = useState<{ [resource: string]: boolean }>({});
   const [wrapMode, setWrapMode] = useState<boolean>(!!preferenceService.get<boolean>('editor.wrapTab'));
@@ -500,7 +512,7 @@ export type IEditorActionsProps = IEditorActionsBaseProps & HTMLAttributes<HTMLD
 
 export const EditorActions = forwardRef<HTMLDivElement, IEditorActionsProps>(
   (props: IEditorActionsProps, ref: Ref<typeof EditorActions>) => {
-    const styles_editor_actions = useDesignStyles(styles.editor_actions);
+    const styles_editor_actions = useDesignStyles(styles.editor_actions, 'editor_actions');
     const { group, className } = props;
 
     const acquireArgs = useCallback(

package/src/browser/workbench-editor.service.ts

@@ -1530,9 +1530,7 @@ export class EditorGroup extends WithEventBus implements IGridEditorGroup {
 
   disposeDocumentRef(uri: URI) {
     if (uri.scheme === 'diff') {
-      const query = uri.getParsedQuery();
-      this.doDisposeDocRef(new URI(query.original));
-      this.doDisposeDocRef(new URI(query.modified));
+      // 针对 diff 编辑器，需要保留 DocumentModelRef，以保留实现对 DiffEditor 的状态恢复
     } else if (uri.scheme === 'mergeEditor') {
       this.mergeEditor.dispose();
     } else {