@opensumi/ide-editor 2.27.3-rc-1714116491.0 → 2.27.3-rc-1714982362.0

package/src/browser/editor.view.tsx

@@ -10,6 +10,7 @@ import {
   ComponentRegistry,
   ConfigContext,
   ConfigProvider,
+  DisposableStore,
   ErrorBoundary,
   IEventBus,
   MaybeNull,
@@ -27,10 +28,12 @@ import {
 } from '@opensumi/ide-core-browser/lib/components';
 import { VIEW_CONTAINERS } from '@opensumi/ide-core-browser/lib/layout/view-id';
 import { useInjectable, useUpdateOnEventBusEvent } from '@opensumi/ide-core-browser/lib/react-hooks';
+import { monaco } from '@opensumi/ide-monaco/lib/browser/monaco-api';
 
 import { IResource, WorkbenchEditorService } from '../common';
 
 import { EditorComponentRegistryImpl } from './component';
+import { EditorContext, IEditorContext, defaultEditorContext } from './editor.context';
 import styles from './editor.module.less';
 import { EditorGrid, SplitDirection } from './grid/grid.service';
 import { NavigationBar } from './navigation.view';
@@ -324,6 +327,8 @@ export const EditorGroupView = observer(({ group }: { group: EditorGroup }) => {
 });
 
 export const EditorGroupBody = observer(({ group }: { group: EditorGroup }) => {
+  const [context, setContext] = React.useState<IEditorContext>(defaultEditorContext);
+
   const editorBodyRef = React.useRef<HTMLDivElement>(null);
   const editorService = useInjectable(WorkbenchEditorService) as WorkbenchEditorServiceImpl;
   const eventBus = useInjectable(IEventBus) as IEventBus;
@@ -336,6 +341,14 @@ export const EditorGroupBody = observer(({ group }: { group: EditorGroup }) => {
   const forceUpdate = React.useCallback(() => updateState({}), []);
 
   React.useEffect(() => {
+    const disposables = new DisposableStore();
+
+    disposables.add(
+      group.onDidEditorGroupBodyChanged(() => {
+        forceUpdate();
+      }),
+    );
+
     if (codeEditorRef.current) {
       if (cachedEditor[group.name]) {
         cachedEditor[group.name].remove();
@@ -345,6 +358,20 @@ export const EditorGroupBody = observer(({ group }: { group: EditorGroup }) => {
         codeEditorRef.current.appendChild(container);
         cachedEditor[group.name] = container;
         group.createEditor(container);
+        const minimapWith = group.codeEditor.monacoEditor.getOption(monaco.editor.EditorOption.layoutInfo).minimap
+          .minimapWidth;
+        setContext({ minimapWidth: minimapWith });
+
+        disposables.add(
+          group.codeEditor.monacoEditor.onDidChangeConfiguration((e) => {
+            if (e.hasChanged(monaco.editor.EditorOption.layoutInfo)) {
+              setContext({
+                minimapWidth: group.codeEditor.monacoEditor.getOption(monaco.editor.EditorOption.layoutInfo).minimap
+                  .minimapWidth,
+              });
+            }
+          }),
+        );
       }
     }
 
@@ -354,15 +381,11 @@ export const EditorGroupBody = observer(({ group }: { group: EditorGroup }) => {
     if (mergeEditorRef.current) {
       group.attachMergeEditorDom(mergeEditorRef.current);
     }
-  }, [codeEditorRef.current, diffEditorRef.current, mergeEditorRef.current]);
 
-  useDisposable(
-    () =>
-      group.onDidEditorGroupBodyChanged(() => {
-        forceUpdate();
-      }),
-    [],
-  );
+    return () => {
+      disposables.dispose();
+    };
+  }, []);
 
   group.activeComponents.forEach((resources, component) => {
     const initialProps = group.activateComponentsProps.get(component);
@@ -410,79 +433,81 @@ export const EditorGroupBody = observer(({ group }: { group: EditorGroup }) => {
   });
 
   return (
-    <div
-      id={VIEW_CONTAINERS.EDITOR}
-      ref={editorBodyRef}
-      className={styles.kt_editor_body}
-      onDragOver={(e) => {
-        e.preventDefault();
-        if (editorBodyRef.current) {
-          const position = getDragOverPosition(e.nativeEvent, editorBodyRef.current);
-          decorateDragOverElement(editorBodyRef.current, position);
-        }
-      }}
-      onDragLeave={(e) => {
-        if (editorBodyRef.current) {
-          removeDecorationDragOverElement(editorBodyRef.current);
-        }
-      }}
-      onDrop={(e) => {
-        if (editorBodyRef.current) {
-          removeDecorationDragOverElement(editorBodyRef.current);
-          if (e.dataTransfer.getData('uri')) {
-            const uri = new URI(e.dataTransfer.getData('uri'));
-            let sourceGroup: EditorGroup | undefined;
-            if (e.dataTransfer.getData('uri-source-group')) {
-              sourceGroup = editorService.getEditorGroup(e.dataTransfer.getData('uri-source-group'));
-            }
-            group.dropUri(uri, getDragOverPosition(e.nativeEvent, editorBodyRef.current), sourceGroup);
+    <EditorContext.Provider value={context}>
+      <div
+        id={VIEW_CONTAINERS.EDITOR}
+        ref={editorBodyRef}
+        className={styles.kt_editor_body}
+        onDragOver={(e) => {
+          e.preventDefault();
+          if (editorBodyRef.current) {
+            const position = getDragOverPosition(e.nativeEvent, editorBodyRef.current);
+            decorateDragOverElement(editorBodyRef.current, position);
           }
-          if (e.dataTransfer.files.length > 0) {
-            eventBus.fire(
-              new EditorGroupFileDropEvent({
-                group,
-                files: e.dataTransfer.files,
-                position: getDragOverPosition(e.nativeEvent, editorBodyRef.current),
-              }),
-            );
+        }}
+        onDragLeave={(e) => {
+          if (editorBodyRef.current) {
+            removeDecorationDragOverElement(editorBodyRef.current);
           }
-        }
-      }}
-    >
-      {group.currentResource && <EditorSideView side={'top'} resource={group.currentResource}></EditorSideView>}
-      {!editorHasNoTab && <NavigationBar editorGroup={group} />}
-      <div className={styles.kt_editor_components}>
-        <div
-          className={cls({
-            [styles_kt_editor_component]: true,
-            [styles.kt_hidden]: !group.currentOpenType || group.currentOpenType.type !== EditorOpenType.component,
-          })}
-        >
-          {components}
+        }}
+        onDrop={(e) => {
+          if (editorBodyRef.current) {
+            removeDecorationDragOverElement(editorBodyRef.current);
+            if (e.dataTransfer.getData('uri')) {
+              const uri = new URI(e.dataTransfer.getData('uri'));
+              let sourceGroup: EditorGroup | undefined;
+              if (e.dataTransfer.getData('uri-source-group')) {
+                sourceGroup = editorService.getEditorGroup(e.dataTransfer.getData('uri-source-group'));
+              }
+              group.dropUri(uri, getDragOverPosition(e.nativeEvent, editorBodyRef.current), sourceGroup);
+            }
+            if (e.dataTransfer.files.length > 0) {
+              eventBus.fire(
+                new EditorGroupFileDropEvent({
+                  group,
+                  files: e.dataTransfer.files,
+                  position: getDragOverPosition(e.nativeEvent, editorBodyRef.current),
+                }),
+              );
+            }
+          }
+        }}
+      >
+        {group.currentResource && <EditorSideView side={'top'} resource={group.currentResource}></EditorSideView>}
+        {!editorHasNoTab && <NavigationBar editorGroup={group} />}
+        <div className={styles.kt_editor_components}>
+          <div
+            className={cls({
+              [styles_kt_editor_component]: true,
+              [styles.kt_hidden]: !group.currentOpenType || group.currentOpenType.type !== EditorOpenType.component,
+            })}
+          >
+            {components}
+          </div>
+          <div
+            className={cls({
+              [styles.kt_editor_code_editor]: true,
+              [styles_kt_editor_component]: true,
+              [styles.kt_hidden]: !group.currentOpenType || group.currentOpenType.type !== EditorOpenType.code,
+            })}
+            ref={codeEditorRef}
+          />
+          <div
+            className={cls(styles.kt_editor_diff_editor, styles_kt_editor_component, {
+              [styles.kt_hidden]: !group.currentOpenType || group.currentOpenType.type !== EditorOpenType.diff,
+            })}
+            ref={diffEditorRef}
+          />
+          <div
+            className={cls(styles.kt_editor_diff_3_editor, styles_kt_editor_component, {
+              [styles.kt_hidden]: !group.currentOpenType || group.currentOpenType.type !== EditorOpenType.mergeEditor,
+            })}
+            ref={mergeEditorRef}
+          />
         </div>
-        <div
-          className={cls({
-            [styles.kt_editor_code_editor]: true,
-            [styles_kt_editor_component]: true,
-            [styles.kt_hidden]: !group.currentOpenType || group.currentOpenType.type !== EditorOpenType.code,
-          })}
-          ref={codeEditorRef}
-        />
-        <div
-          className={cls(styles.kt_editor_diff_editor, styles_kt_editor_component, {
-            [styles.kt_hidden]: !group.currentOpenType || group.currentOpenType.type !== EditorOpenType.diff,
-          })}
-          ref={diffEditorRef}
-        />
-        <div
-          className={cls(styles.kt_editor_diff_3_editor, styles_kt_editor_component, {
-            [styles.kt_hidden]: !group.currentOpenType || group.currentOpenType.type !== EditorOpenType.mergeEditor,
-          })}
-          ref={mergeEditorRef}
-        />
+        {group.currentResource && <EditorSideView side={'bottom'} resource={group.currentResource}></EditorSideView>}
       </div>
-      {group.currentResource && <EditorSideView side={'bottom'} resource={group.currentResource}></EditorSideView>}
-    </div>
+    </EditorContext.Provider>
   );
 });
 

package/src/browser/hooks/useEditor.ts

@@ -0,0 +1,34 @@
+import { useEffect, useState } from 'react';
+
+import { URI, useInjectable } from '@opensumi/ide-core-browser';
+
+import { IEditorDocumentModelService } from '../doc-model/types';
+import { IEditorDocumentModelRef } from '../types';
+
+export function useEditorDocumentModelRef(uri: URI) {
+  const documentService: IEditorDocumentModelService = useInjectable(IEditorDocumentModelService);
+  const [ref, setRef] = useState<IEditorDocumentModelRef | null>(null);
+
+  useEffect(() => {
+    const run = () => {
+      const ref = documentService.getModelReference(uri);
+      if (ref) {
+        setRef(ref);
+      }
+    };
+
+    const toDispose = documentService.onDocumentModelCreated(uri.toString(), () => {
+      run();
+    });
+
+    run();
+    return () => {
+      toDispose.dispose();
+      if (ref) {
+        ref.dispose();
+      }
+    };
+  }, [uri]);
+
+  return ref;
+}

package/src/browser/hooks/useInMergeChanges.ts

@@ -0,0 +1,30 @@
+import { useEffect, useState } from 'react';
+
+import { IContextKeyService, useInjectable } from '@opensumi/ide-core-browser';
+
+const contextKey = 'git.mergeChangesObj';
+
+export const gitMergeChangesSet = new Set([contextKey]);
+
+export function useInMergeChanges(uriStr: string) {
+  const contextKeyService = useInjectable<IContextKeyService>(IContextKeyService);
+
+  const [inMergeChanges, setInMergeChanges] = useState(false);
+
+  useEffect(() => {
+    function run() {
+      const mergeChanges = contextKeyService.getValue<Record<string, boolean>>(contextKey) || {};
+      setInMergeChanges(mergeChanges[uriStr] || false);
+    }
+    run();
+
+    const disposed = contextKeyService.onDidChangeContext(({ payload }) => {
+      if (payload.affectsSome(gitMergeChangesSet)) {
+        run();
+      }
+    });
+    return () => disposed.dispose();
+  }, [uriStr]);
+
+  return inMergeChanges;
+}

package/src/browser/merge-conflict/conflict-parser.ts

@@ -0,0 +1,323 @@
+/* ---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+// Some code copied and modified from https://github.com/microsoft/vscode/blob/main/extensions/merge-conflict/src/mergeConflictParser.ts
+
+import { Injectable } from '@opensumi/di';
+import { Disposable, LRUCache, uuid } from '@opensumi/ide-core-common';
+import * as monaco from '@opensumi/ide-monaco';
+
+import { ICacheDocumentMergeConflict, IDocumentMergeConflictDescriptor, IMergeRegion } from './types';
+
+const startHeaderMarker = '<<<<<<<';
+const commonAncestorsMarker = '|||||||';
+const splitterMarker = '=======';
+const endFooterMarker = '>>>>>>>';
+
+interface IScanMergedConflict {
+  startHeader: TextLine;
+  commonAncestors: TextLine[];
+  splitter?: TextLine;
+  endFooter?: TextLine;
+}
+
+export interface IConflictCache {
+  id: string;
+  range: monaco.Range;
+  text: string;
+  isResolved: boolean;
+}
+
+export class TextLine {
+  lineNumber: number;
+  text: string;
+  range: monaco.Range;
+  rangeIncludingLineBreak: monaco.Range;
+  firstNonWhitespaceCharacterIndex: number;
+  isEmptyOrWhitespace: boolean;
+  constructor(document: monaco.editor.ITextModel, line: number) {
+    if (typeof line !== 'number' || line <= 0 || line > document.getLineCount()) {
+      throw new Error('Illegal value for `line`');
+    }
+    this.text = document.getLineContent(line);
+    this.firstNonWhitespaceCharacterIndex = /^(\s*)/.exec(this.text)![1].length;
+    this.range = new monaco.Range(line, 1, line, this.text.length + 1);
+    this.rangeIncludingLineBreak =
+      line <= document.getLineCount() ? new monaco.Range(line, 1, line + 1, 1) : this.range;
+    this.lineNumber = line;
+    this.isEmptyOrWhitespace = this.firstNonWhitespaceCharacterIndex === this.text.length;
+  }
+}
+
+@Injectable()
+export class MergeConflictParser extends Disposable {
+  cache = new LRUCache<string, DocumentMergeConflict[]>(100);
+
+  private _conflictTextCaches = new Map<string, string>();
+
+  private _conflictRangeCaches = new Map<string, IConflictCache[]>();
+
+  private static createCacheKey(document: monaco.editor.ITextModel) {
+    return `${document.uri.toString()}-${document.getAlternativeVersionId()}`;
+  }
+
+  scanDocument(document: monaco.editor.ITextModel) {
+    const cacheKey = MergeConflictParser.createCacheKey(document);
+    if (this.cache.has(cacheKey)) {
+      return this.cache.get(cacheKey)!;
+    }
+
+    // Scan each line in the document, we already know there is at least a <<<<<<< and
+    // >>>>>> marker within the document, we need to group these into conflict ranges.
+    // We initially build a scan match, that references the lines of the header, splitter
+    // and footer. This is then converted into a full descriptor containing all required
+    // ranges.
+
+    let currentConflict: IScanMergedConflict | null = null;
+    const conflictDescriptors: IDocumentMergeConflictDescriptor[] = [];
+    const cacheConflictDescriptors = this._conflictTextCaches.get(document.uri.toString());
+
+    for (let i = 0; i < document.getLineCount(); i++) {
+      const line = new TextLine(document, i + 1);
+      // Ignore empty lines
+      if (!line || line.isEmptyOrWhitespace) {
+        continue;
+      }
+
+      // Is this a start line? <<<<<<<
+      if (line.text.startsWith(startHeaderMarker)) {
+        if (currentConflict !== null) {
+          // Error, we should not see a startMarker before we've seen an endMarker
+          currentConflict = null;
+
+          // Give up parsing, anything matched up this to this point will be decorated
+          // anything after will not
+          break;
+        }
+
+        // Create a new conflict starting at this line
+        currentConflict = { startHeader: line, commonAncestors: [] };
+      }
+      // Are we within a conflict block and is this a common ancestors marker? |||||||
+      else if (currentConflict && !currentConflict.splitter && line.text.startsWith(commonAncestorsMarker)) {
+        currentConflict.commonAncestors.push(line);
+      }
+      // Are we within a conflict block and is this a splitter? =======
+      else if (currentConflict && !currentConflict.splitter && line.text === splitterMarker) {
+        currentConflict.splitter = line;
+      }
+      // Are we within a conflict block and is this a footer? >>>>>>>
+      else if (currentConflict && line.text.startsWith(endFooterMarker)) {
+        currentConflict.endFooter = line;
+
+        // Create a full descriptor from the lines that we matched. This can return
+        // null if the descriptor could not be completed.
+        const completeDescriptor = scanItemTolMergeConflictDescriptor(document, currentConflict);
+
+        if (completeDescriptor !== null) {
+          conflictDescriptors.push(completeDescriptor);
+        }
+
+        // Reset the current conflict to be empty, so we can match the next
+        // starting header marker.
+        currentConflict = null;
+      }
+    }
+    if (!cacheConflictDescriptors && conflictDescriptors.length) {
+      this._conflictTextCaches.set(document.uri.toString(), document.getValue());
+      const conflictRanges: IConflictCache[] = [];
+      conflictDescriptors.filter(Boolean).forEach((descriptor) => {
+        const range = descriptor.range;
+        conflictRanges.push({
+          id: uuid(),
+          range,
+          text: document.getValueInRange(range),
+          isResolved: false,
+        });
+      });
+      this._conflictRangeCaches.set(document.uri.toString(), conflictRanges);
+    }
+
+    const result = conflictDescriptors?.filter(Boolean).map((descriptor) => new DocumentMergeConflict(descriptor));
+    this.cache.set(cacheKey, result);
+
+    return result;
+  }
+  getConflictText(uri: string) {
+    return this._conflictTextCaches.get(uri);
+  }
+  getAllConflictsByUri(uri: string) {
+    return this._conflictRangeCaches.get(uri);
+  }
+
+  getAllConflicts() {
+    return this._conflictRangeCaches;
+  }
+
+  setConflictResolved(uri: string, id: string) {
+    const conflictRanges = this._conflictRangeCaches.get(uri);
+    if (conflictRanges) {
+      const conflictRange = conflictRanges.find((item) => item.id === id);
+      if (conflictRange) {
+        conflictRange.isResolved = true;
+      }
+    }
+  }
+
+  deleteConflictText(uri: string) {
+    this._conflictTextCaches.delete(uri);
+  }
+  dispose() {
+    this._conflictTextCaches.clear();
+    this._conflictRangeCaches.clear();
+  }
+}
+
+function scanItemTolMergeConflictDescriptor(
+  document: monaco.editor.ITextModel,
+  scanned: IScanMergedConflict,
+): IDocumentMergeConflictDescriptor | null {
+  // Validate we have all the required lines within the scan item.
+  if (!scanned.startHeader || !scanned.splitter || !scanned.endFooter) {
+    return null;
+  }
+
+  const tokenAfterCurrentBlock: TextLine = scanned.commonAncestors[0] || scanned.splitter;
+
+  // Assume that descriptor.current.header, descriptor.incoming.header and descriptor.splitter
+  // have valid ranges, fill in content and total ranges from these parts.
+  // NOTE: We need to shift the decorator range back one character so the splitter does not end up with
+  // two decoration colors (current and splitter), if we take the new line from the content into account
+  // the decorator will wrap to the next line.
+  return {
+    current: {
+      header: scanned.startHeader.range,
+      decoratorContent: new monaco.Range(
+        scanned.startHeader.rangeIncludingLineBreak.endLineNumber,
+        scanned.startHeader.rangeIncludingLineBreak.endColumn,
+        shiftBackOneCharacter(
+          document,
+          tokenAfterCurrentBlock.range.getStartPosition(),
+          scanned.startHeader.rangeIncludingLineBreak.getEndPosition(),
+        ).lineNumber,
+        shiftBackOneCharacter(
+          document,
+          tokenAfterCurrentBlock.range.getStartPosition(),
+          scanned.startHeader.rangeIncludingLineBreak.getEndPosition(),
+        ).column,
+      ),
+      // Current content is range between header (shifted for linebreak) and splitter or common ancestors mark start
+      content: new monaco.Range(
+        scanned.startHeader.rangeIncludingLineBreak.endLineNumber,
+        scanned.startHeader.rangeIncludingLineBreak.endColumn,
+        tokenAfterCurrentBlock.range.startLineNumber,
+        tokenAfterCurrentBlock.range.startColumn,
+      ),
+      name: scanned.startHeader.text.substring(startHeaderMarker.length + 1),
+    },
+    commonAncestors: scanned.commonAncestors.map((currentTokenLine, index, commonAncestors) => {
+      const nextTokenLine = commonAncestors[index + 1] || scanned.splitter;
+      return {
+        header: currentTokenLine.range,
+        decoratorContent: new monaco.Range(
+          currentTokenLine.rangeIncludingLineBreak.endLineNumber,
+          currentTokenLine.rangeIncludingLineBreak.endColumn,
+
+          shiftBackOneCharacter(
+            document,
+            nextTokenLine.range.getStartPosition(),
+            currentTokenLine.rangeIncludingLineBreak.getEndPosition(),
+          ).lineNumber,
+          shiftBackOneCharacter(
+            document,
+            nextTokenLine.range.getStartPosition(),
+            currentTokenLine.rangeIncludingLineBreak.getEndPosition(),
+          ).lineNumber,
+        ),
+        // Each common ancestors block is range between one common ancestors token
+        // (shifted for linebreak) and start of next common ancestors token or splitter
+        content: new monaco.Range(
+          currentTokenLine.rangeIncludingLineBreak.endLineNumber,
+          currentTokenLine.rangeIncludingLineBreak.endColumn,
+          nextTokenLine.range.startLineNumber,
+          nextTokenLine.range.startColumn,
+        ),
+        name: currentTokenLine.text.substring(commonAncestorsMarker.length + 1),
+      };
+    }),
+    splitter: scanned.splitter.range,
+    incoming: {
+      header: scanned.endFooter.range,
+      decoratorContent: new monaco.Range(
+        scanned.splitter.rangeIncludingLineBreak.endLineNumber,
+        scanned.splitter.rangeIncludingLineBreak.endColumn,
+        shiftBackOneCharacter(
+          document,
+          scanned.endFooter.range.getStartPosition(),
+          scanned.splitter.rangeIncludingLineBreak.getEndPosition(),
+        ).lineNumber,
+        shiftBackOneCharacter(
+          document,
+          scanned.endFooter.range.getStartPosition(),
+          scanned.splitter.rangeIncludingLineBreak.getEndPosition(),
+        ).column,
+      ),
+      // Incoming content is range between splitter (shifted for linebreak) and footer start
+      content: new monaco.Range(
+        scanned.splitter.rangeIncludingLineBreak.endLineNumber,
+        scanned.splitter.rangeIncludingLineBreak.endColumn,
+        scanned.endFooter.range.startLineNumber,
+        scanned.endFooter.range.startColumn,
+      ),
+      name: scanned.endFooter.text.substring(endFooterMarker.length + 1),
+    },
+    // Entire range is between current header start and incoming header end (including line break)
+    range: new monaco.Range(
+      scanned.startHeader.range.startLineNumber,
+      scanned.startHeader.range.startColumn,
+      scanned.endFooter.range.endLineNumber,
+      scanned.endFooter.range.endColumn,
+    ),
+  };
+}
+
+function shiftBackOneCharacter(
+  document: monaco.editor.ITextModel,
+  range: monaco.Position,
+  unlessEqual: monaco.Position,
+): monaco.Position {
+  if (range.equals(unlessEqual)) {
+    return range;
+  }
+
+  let line = range.lineNumber;
+  let character = range.column - 1;
+
+  if (character < 0) {
+    line--;
+    character = new TextLine(document, line).range.endColumn;
+  }
+  return new monaco.Position(line, character);
+}
+
+export class DocumentMergeConflict implements ICacheDocumentMergeConflict {
+  public range: monaco.Range;
+  public current: IMergeRegion;
+  public incoming: IMergeRegion;
+  public commonAncestors: IMergeRegion[];
+  public splitter: monaco.Range;
+  public incomingContent: string;
+  public currentContent: string;
+  public bothContent: string;
+  public aiContent?: string;
+  public defaultContent: string;
+  private applied = false;
+  constructor(descriptor: IDocumentMergeConflictDescriptor) {
+    this.range = descriptor.range;
+    this.current = descriptor.current;
+    this.incoming = descriptor.incoming;
+    this.commonAncestors = descriptor.commonAncestors;
+    this.splitter = descriptor.splitter;
+  }
+}

package/src/browser/merge-conflict/index.ts

@@ -0,0 +1,2 @@
+export * from './conflict-parser';
+export * from './types';