@opensumi/ide-ai-native 3.7.1-next-1739252693.0 → 3.7.1-next-1739424847.0

package/src/browser/widget/inline-diff/inline-diff.controller.ts

@@ -6,12 +6,18 @@ import {
   Emitter,
   Event,
   IDisposable,
-  IEventBus,
   ReplyResponse,
 } from '@opensumi/ide-core-common';
-import { EditorGroupCloseEvent } from '@opensumi/ide-editor/lib/browser';
 import * as monaco from '@opensumi/ide-monaco';
 import { ICodeEditor } from '@opensumi/ide-monaco';
+import {
+  IObservable,
+  ISettableObservable,
+  autorun,
+  observableFromEvent,
+  observableValue,
+  transaction,
+} from '@opensumi/ide-monaco/lib/common/observable';
 
 import { BaseAIMonacoEditorController } from '../../contrib/base';
 import { EInlineDiffPreviewMode } from '../../preferences/schema';
@@ -27,6 +33,8 @@ import {
 } from './inline-diff-previewer';
 import { InlineDiffWidget } from './inline-diff-widget';
 
+type IInlineDiffPreviewer = BaseInlineDiffPreviewer<InlineDiffWidget | InlineStreamDiffHandler>;
+
 export class InlineDiffController extends BaseAIMonacoEditorController {
   public static readonly ID = 'editor.contrib.ai.inline.diff';
 
@@ -38,106 +46,68 @@ export class InlineDiffController extends BaseAIMonacoEditorController {
     return this.injector.get(PreferenceService);
   }
 
-  private get eventBus(): IEventBus {
-    return this.injector.get(IEventBus);
-  }
-
   private readonly _onMaxLineCount = new Emitter<number>();
   public readonly onMaxLineCount: Event<number> = this._onMaxLineCount.event;
 
-  private previewer: BaseInlineDiffPreviewer<InlineDiffWidget | InlineStreamDiffHandler> | undefined;
-  private _previewerNodeStore = new Map<string, InlineStreamDiffHandler | null>();
+  private previewerStore: Map<string, IInlineDiffPreviewer>;
+  private currentPreviewer: ISettableObservable<IInlineDiffPreviewer | undefined>;
+  private modelChangeObs: IObservable<monaco.editor.ITextModel, unknown>;
 
   mount(): IDisposable {
+    this.previewerStore = new Map();
+    this.currentPreviewer = observableValue(this, undefined);
+    this.modelChangeObs = observableFromEvent<monaco.editor.ITextModel>(
+      this,
+      this.monacoEditor.onDidChangeModel,
+      () => this.monacoEditor.getModel()!,
+    );
+
     this.featureDisposable.addDispose(
-      this.eventBus.on(EditorGroupCloseEvent, (e: EditorGroupCloseEvent) => {
-        const uriString = e.payload.resource.uri.toString();
-        const node = this.getStoredState(uriString);
+      autorun((reader) => {
+        const model = this.modelChangeObs.read(reader);
+        if (!model) {
+          return;
+        }
 
-        if (node && node.previewerOptions.disposeWhenEditorClosed) {
-          this.destroyPreviewer(uriString);
+        /**
+         * 切换到其他 model 且 previewer 未卸载时
+         * 保留 previewer 的实例，仅卸载 previewer 的渲染层
+         */
+        const id = model.id;
+        const previewer = this.currentPreviewer.read(reader);
+        if (previewer && previewer.modelId !== id && !previewer.disposed) {
+          previewer.hide();
         }
+
+        const storedPreview = this.previewerStore.get(model.id);
+        transaction((tx) => {
+          if (storedPreview && storedPreview.modelId === id) {
+            this.currentPreviewer.set(storedPreview, tx);
+            storedPreview.resume();
+          } else {
+            this.currentPreviewer.set(undefined, tx);
+          }
+        });
       }),
     );
 
-    this.registerInlineDiffFeature(this.monacoEditor);
-
     return this.featureDisposable;
   }
 
-  storeState(key: string) {
-    if (!this.previewer) {
-      return;
-    }
-
-    // 存储的是快照
-    const node = this.previewer.createNodeSnapshot();
-    if (node) {
-      this._previewerNodeStore.set(key, node as InlineStreamDiffHandler);
-    }
+  getPreviewer(): IInlineDiffPreviewer | undefined {
+    return this.currentPreviewer.get();
   }
 
-  tryRestoreState(monacoEditor: monaco.ICodeEditor, key: string) {
-    const node = this.getStoredState(key);
-    if (!node) {
-      return;
-    }
-
-    if (node.disposed) {
-      this.destroyPreviewer(key);
+  private renderDiff(previewer: IInlineDiffPreviewer, data: ReplyResponse) {
+    if (!previewer) {
       return;
     }
 
-    return this.restoreState(monacoEditor, node);
-  }
-
-  restoreState(monacoEditor: monaco.ICodeEditor, node: InlineStreamDiffHandler) {
-    const uri = monacoEditor.getModel()?.uri;
-
-    if (uri) {
-      this.previewer = this.injector.get(LiveInlineDiffPreviewer, [monacoEditor]);
-      this.previewer.attachNode(node);
-      this.listenPreviewer(this.previewer);
-
-      const dispose = this.previewer.onDispose(() => {
-        this.destroyPreviewer();
-        dispose.dispose();
-      });
-    }
-  }
-
-  registerInlineDiffFeature(monacoEditor: monaco.ICodeEditor): void {
-    const model = monacoEditor.getModel();
-
-    this.featureDisposable.addDispose(
-      monacoEditor.onWillChangeModel((e) => {
-        if (!e.oldModelUrl) {
-          return;
-        }
-
-        const urlString = e.oldModelUrl.toString();
-        this.storeState(urlString);
-
-        this.destroyPreviewer();
-      }),
-    );
-
-    this.featureDisposable.addDispose(
-      monacoEditor.onDidChangeModel((e) => {
-        if (!e.newModelUrl) {
-          return;
-        }
-        this.tryRestoreState(monacoEditor, e.newModelUrl.toString());
-      }),
-    );
+    previewer.onData(data);
 
-    if (model) {
-      this.featureDisposable.addDispose(
-        model.onWillDispose(() => {
-          const uriString = model.uri.toString();
-          this.destroyPreviewer(uriString);
-        }),
-      );
+    // 仅在当前 model 中进行流式渲染
+    if (this.modelChangeObs.get()?.id === previewer.modelId) {
+      previewer.render();
     }
   }
 
@@ -154,6 +124,10 @@ export class InlineDiffController extends BaseAIMonacoEditorController {
     const disposable = new Disposable();
 
     const previewer = this.createDiffPreviewer(monacoEditor, crossSelection, options.previewerOptions);
+    transaction((tx) => {
+      this.currentPreviewer.set(previewer, tx);
+      this.previewerStore.set(previewer.modelId, previewer);
+    });
 
     const onFinish = () => {
       previewer.layout();
@@ -168,7 +142,7 @@ export class InlineDiffController extends BaseAIMonacoEditorController {
           disposable.addDispose([
             controller.onData((data) => {
               if (ReplyResponse.is(data)) {
-                previewer.onData(data);
+                this.renderDiff(previewer, data);
               }
             }),
             controller.onError((error) => {
@@ -203,59 +177,61 @@ export class InlineDiffController extends BaseAIMonacoEditorController {
       EInlineDiffPreviewMode.inlineLive,
     );
 
-    this.destroyPreviewer();
+    let previewer: IInlineDiffPreviewer;
 
     if (inlineDiffMode === EInlineDiffPreviewMode.sideBySide) {
-      this.previewer = this.injector.get(SideBySideInlineDiffWidget, [monacoEditor]);
+      previewer = this.injector.get(SideBySideInlineDiffWidget, [monacoEditor]);
     } else {
-      this.previewer = this.injector.get(LiveInlineDiffPreviewer, [monacoEditor]);
+      previewer = this.injector.get(LiveInlineDiffPreviewer, [monacoEditor]);
     }
 
-    this.previewer.create(selection, options);
-    this.previewer.show(selection.startLineNumber - 1, selection.endLineNumber - selection.startLineNumber + 2);
+    previewer.create(selection, options);
+    previewer.show(selection.startLineNumber - 1, selection.endLineNumber - selection.startLineNumber + 2);
 
-    this.listenPreviewer(this.previewer);
+    previewer.addDispose(previewer.onLineCount((lineCount) => this._onMaxLineCount.fire(lineCount)));
 
-    return this.previewer;
+    previewer.addDispose(
+      Disposable.create(() => {
+        this.previewerStore.delete(previewer.modelId);
+      }),
+    );
+
+    return previewer;
   }
 
-  private listenPreviewer(previewer: BaseInlineDiffPreviewer<InlineDiffWidget | InlineStreamDiffHandler> | undefined) {
+  handleAction(action: EResultKind): void {
+    const previewer = this.getPreviewer();
     if (!previewer) {
       return;
     }
 
-    previewer.addDispose(previewer.onLineCount((lineCount) => this._onMaxLineCount.fire(lineCount)));
-  }
-
-  getPreviewer(): BaseInlineDiffPreviewer<InlineDiffWidget | InlineStreamDiffHandler> | undefined {
-    return this.previewer;
-  }
-
-  getStoredState(uri: string) {
-    return this._previewerNodeStore.get(uri);
-  }
-
-  handleAction(action: EResultKind): void {
-    this.previewer?.handleAction(action);
+    previewer.handleAction(action);
   }
 
   getModifyContent() {
-    return this.previewer?.getValue();
-  }
+    const previewer = this.getPreviewer();
+    if (!previewer) {
+      return;
+    }
 
-  getOriginContent() {
-    return this.previewer?.getOriginValue();
+    return previewer.getValue();
   }
 
-  destroyPreviewer(uriString?: string) {
-    this.previewer?.dispose();
-    this.previewer = undefined;
-    if (uriString) {
-      this._previewerNodeStore.delete(uriString);
+  getOriginContent() {
+    const previewer = this.getPreviewer();
+    if (!previewer) {
+      return;
     }
+
+    return previewer.getOriginValue();
   }
 
   revealFirstDiff() {
-    this.previewer?.revealFirstDiff();
+    const previewer = this.getPreviewer();
+    if (!previewer) {
+      return;
+    }
+
+    previewer.revealFirstDiff();
   }
 }

package/src/browser/widget/inline-input/inline-input.controller.ts

@@ -18,7 +18,6 @@ import { ICodeEditor } from '@opensumi/ide-monaco';
 import {
   IObservable,
   ISettableObservable,
-  autorun,
   observableFromEvent,
   observableValue,
 } from '@opensumi/ide-monaco/lib/common/observable';
@@ -101,7 +100,6 @@ export class InlineInputController extends BaseAIMonacoEditorController {
         const currentUri = this.monacoEditor.getModel()?.uri.toString();
 
         if (currentUri === resource) {
-          this.inlineDiffController.destroyPreviewer(currentUri);
           this.hideInput();
 
           const message = localize('aiNative.inline.chat.generating.canceled');
@@ -138,27 +136,6 @@ export class InlineInputController extends BaseAIMonacoEditorController {
       }),
     );
 
-    this.featureDisposable.addDispose(
-      autorun((reader) => {
-        const model = this.modelChangeObs.read(reader);
-        if (!model) {
-          return;
-        }
-
-        const storeData = this.inlineInputWidgetStore.get(model.id);
-        if (!storeData) {
-          this.hideInput();
-          return;
-        }
-
-        if (storeData instanceof InlineInputWidgetStoreInEmptyLine) {
-          this.showInputInEmptyLine(storeData.getPosition(), this.monacoEditor, storeData.getValue());
-        } else if (storeData instanceof InlineInputWidgetStoreInSelection) {
-          this.showInputInSelection(storeData.getSelection(), this.monacoEditor, storeData.getValue());
-        }
-      }),
-    );
-
     this.featureDisposable.addDispose(this.inputDisposable);
 
     return this.featureDisposable;
@@ -430,7 +407,6 @@ export class InlineInputController extends BaseAIMonacoEditorController {
     inlineInputWidget.show({ selection: decorationSelection });
 
     this.aiNativeContextKey.inlineInputWidgetIsVisible.set(true);
-    this.inlineDiffController.destroyPreviewer(monacoEditor.getModel()?.uri.toString());
 
     this.inputDisposable.addDispose(
       inlineInputWidget.onDispose(() => {
@@ -517,14 +493,14 @@ export class InlineInputController extends BaseAIMonacoEditorController {
               }),
             ]);
 
-            chatResponse.listen();
-
             const diffPreviewer = this.inlineDiffController.showPreviewerByStream(monacoEditor, {
               crossSelection: decorationSelection,
               chatResponse,
             });
 
-            diffPreviewer.mount(inlineInputWidget);
+            diffPreviewer.mountWidget(inlineInputWidget);
+
+            chatResponse.listen();
           }
         } else {
           decorationsCollection.clear();

package/src/browser/widget/inline-stream-diff/inline-stream-diff.handler.tsx

@@ -3,6 +3,7 @@ import { Disposable, Emitter, Event, FRAME_THREE, Schemes, Uri, randomString, sl
 import { ISingleEditOperation } from '@opensumi/ide-editor';
 import { ICodeEditor, ITextModel, Range, Selection } from '@opensumi/ide-monaco';
 import { StandaloneServices } from '@opensumi/ide-monaco/lib/browser/monaco-api/services';
+import { ISettableObservable, observableValue, transaction } from '@opensumi/ide-monaco/lib/common/observable';
 import { LineRange } from '@opensumi/monaco-editor-core/esm/vs/editor/common/core/lineRange';
 import { linesDiffComputers } from '@opensumi/monaco-editor-core/esm/vs/editor/common/diff/linesDiffComputers';
 import { DetailedLineRangeMapping } from '@opensumi/monaco-editor-core/esm/vs/editor/common/diff/rangeMapping';
@@ -15,7 +16,7 @@ import { IDiffPreviewerOptions, IInlineDiffPreviewerNode } from '../inline-diff/
 
 import { InlineStreamDiffComputer } from './inline-stream-diff-computer';
 import { IRemovedWidgetState } from './live-preview.component';
-import { ILivePreviewDiffDecorationSnapshotData, LivePreviewDiffDecorationModel } from './live-preview.decoration';
+import { LivePreviewDiffDecorationModel } from './live-preview.decoration';
 
 interface IRangeChangeData {
   removedTextLines: string[];
@@ -29,7 +30,7 @@ interface IRangeChangeData {
     | undefined;
 }
 
-interface IComputeDiffData {
+export interface IComputeDiffData {
   newFullRangeTextLines: string[];
   changes: IRangeChangeData[];
   activeLine: number;
@@ -41,14 +42,6 @@ export enum EComputerMode {
   default = 'default',
 }
 
-export interface IInlineStreamDiffSnapshotData {
-  rawOriginalTextLines: string[];
-  rawOriginalTextLinesTokens: LineTokens[];
-  undoRedoGroup: UndoRedoGroup;
-  decorationSnapshotData: ILivePreviewDiffDecorationSnapshotData;
-  previewerOptions: IDiffPreviewerOptions;
-}
-
 const inlineStreamDiffComputer = new InlineStreamDiffComputer();
 
 @Injectable({ multiple: true })
@@ -64,18 +57,21 @@ export class InlineStreamDiffHandler extends Disposable implements IInlineDiffPr
   private originalModel: ITextModel;
   private virtualModel: ITextModel;
 
-  // Parts that require snapshots
   private rawOriginalTextLines: string[];
   private rawOriginalTextLinesTokens: LineTokens[] = [];
-  private undoRedoGroup: UndoRedoGroup;
+  private undoRedoGroup: UndoRedoGroup = new UndoRedoGroup();
+
+  private readonly diffModel: ISettableObservable<IComputeDiffData | undefined> = observableValue(this, undefined);
+  private readonly finallyDiffModel: ISettableObservable<IComputeDiffData | undefined> = observableValue(
+    this,
+    undefined,
+  );
 
   public livePreviewDiffDecorationModel: LivePreviewDiffDecorationModel;
 
   constructor(private readonly monacoEditor: ICodeEditor) {
     super();
 
-    this.undoRedoGroup = new UndoRedoGroup();
-
     const modelService = StandaloneServices.get(IModelService);
     this.virtualModel = modelService.createModel(
       '',
@@ -136,44 +132,6 @@ export class InlineStreamDiffHandler extends Disposable implements IInlineDiffPr
     this.livePreviewDiffDecorationModel.initialize(zone);
   }
 
-  private _snapshotStore: IInlineStreamDiffSnapshotData | undefined;
-  restoreSnapshot(snapshot: IInlineStreamDiffSnapshotData): void {
-    this._snapshotStore = snapshot;
-    const {
-      rawOriginalTextLines,
-      rawOriginalTextLinesTokens,
-      undoRedoGroup,
-      decorationSnapshotData,
-      previewerOptions,
-    } = snapshot;
-
-    this.setPreviewerOptions(previewerOptions);
-
-    this.rawOriginalTextLines = rawOriginalTextLines;
-    this.rawOriginalTextLinesTokens = rawOriginalTextLinesTokens;
-    this.undoRedoGroup = undoRedoGroup;
-
-    this.livePreviewDiffDecorationModel.initialize(decorationSnapshotData.zone);
-  }
-
-  get currentSnapshotStore(): IInlineStreamDiffSnapshotData | undefined {
-    return this._snapshotStore;
-  }
-
-  restoreDecorationSnapshot(decorationSnapshotData: ILivePreviewDiffDecorationSnapshotData): void {
-    this.livePreviewDiffDecorationModel.restoreSnapshot(decorationSnapshotData);
-  }
-
-  createSnapshot(): IInlineStreamDiffSnapshotData {
-    return {
-      rawOriginalTextLines: this.rawOriginalTextLines,
-      rawOriginalTextLinesTokens: this.rawOriginalTextLinesTokens,
-      undoRedoGroup: this.undoRedoGroup,
-      decorationSnapshotData: this.livePreviewDiffDecorationModel.createSnapshot(),
-      previewerOptions: this.previewerOptions,
-    };
-  }
-
   getVirtualModelValue() {
     return this.virtualModel.getValue();
   }
@@ -345,7 +303,7 @@ export class InlineStreamDiffHandler extends Disposable implements IInlineDiffPr
     });
   }
 
-  private handleEdits(diffModel: IComputeDiffData): void {
+  private renderDiffEdits(diffModel: IComputeDiffData): void {
     const { activeLine, newFullRangeTextLines, pendingRange } = diffModel;
     const eol = this.originalModel.getEOL();
     const zone = this.getZone();
@@ -466,9 +424,8 @@ export class InlineStreamDiffHandler extends Disposable implements IInlineDiffPr
   }
 
   private currentEditLine = 0;
-  private finallyDiffModel: IComputeDiffData | null = null;
   private isEditing = false;
-  private async rateEditController(): Promise<void> {
+  public async rateRenderEditController(): Promise<void> {
     if (this.isEditing === false) {
       this.isEditing = true;
 
@@ -480,15 +437,22 @@ export class InlineStreamDiffHandler extends Disposable implements IInlineDiffPr
         const virtualTextLines = this.virtualModel.getLinesContent();
         const currentText = virtualTextLines.slice(0, this.currentEditLine);
         const currentDiffModel = this.computeDiff(this.rawOriginalTextLines, currentText);
-        this.handleEdits(currentDiffModel);
+        transaction((tx) => {
+          this.diffModel.set(currentDiffModel, tx);
+        });
+
+        if (this.originalModel.id === this.monacoEditor.getModel()?.id) {
+          this.renderDiffEdits(currentDiffModel);
+        }
 
         this.currentEditLine += 1;
 
         await sleep(FRAME_THREE);
       }
 
-      if (this.finallyDiffModel) {
-        this.finallyRender(this.finallyDiffModel);
+      const finallyDiffModel = this.finallyDiffModel.get();
+      if (finallyDiffModel) {
+        this.finallyRender(finallyDiffModel);
       }
 
       this.isEditing = false;
@@ -496,27 +460,50 @@ export class InlineStreamDiffHandler extends Disposable implements IInlineDiffPr
   }
 
   public addLinesToDiff(newText: string, computerMode: EComputerMode = EComputerMode.default): void {
-    this.recompute(computerMode, newText);
-    this.rateEditController();
+    const diffModel = this.recompute(computerMode, newText);
+    transaction((tx) => {
+      this.diffModel.set(diffModel, tx);
+    });
   }
 
   public pushRateFinallyDiffStack(diffModel: IComputeDiffData): void {
-    this.finallyDiffModel = diffModel;
-
-    // 可能存在 rate editr controller 处理完之后接口层流式才结束
-    if (this.isEditing === false) {
-      this.finallyRender(this.finallyDiffModel);
-    }
+    transaction((tx) => {
+      this.finallyDiffModel.set(diffModel, tx);
+      // 可能存在 rate editor controller 处理完之后接口层流式才结束
+      if (this.isEditing === false) {
+        this.finallyRender(diffModel);
+      }
+    });
   }
 
   public finallyRender(diffModel: IComputeDiffData): void {
-    // 流式结束后才会确定所有的 added range，再渲染 partial edit widgets
+    transaction((tx) => {
+      this.diffModel.set(diffModel, tx);
+    });
+
+    if (this.originalModel.id !== this.monacoEditor.getModel()?.id) {
+      return;
+    }
+
     this.renderPartialEditWidgets(diffModel);
-    this.handleEdits(diffModel);
+    this.renderDiffEdits(diffModel);
     this.pushStackElement();
     this.monacoEditor.focus();
   }
 
+  public hide(): void {
+    this.livePreviewDiffDecorationModel.hide();
+  }
+
+  public resume(): void {
+    const finallyDiffModel = this.finallyDiffModel.get();
+    if (!finallyDiffModel) {
+      this.rateRenderEditController();
+    }
+
+    this.livePreviewDiffDecorationModel.resume();
+  }
+
   acceptAll(): void {
     this.livePreviewDiffDecorationModel.acceptUnProcessed();
     this.dispose();

package/src/browser/widget/inline-stream-diff/live-preview.component.tsx

@@ -21,6 +21,11 @@ import { LineTokens } from '@opensumi/monaco-editor-core/esm/vs/editor/common/to
 import { IOptions, ZoneWidget } from '@opensumi/monaco-editor-core/esm/vs/editor/contrib/zoneWidget/browser/zoneWidget';
 import { UndoRedoGroup } from '@opensumi/monaco-editor-core/esm/vs/platform/undoRedo/common/undoRedo';
 
+import {
+  DeltaDecorations,
+  EnhanceDecorationsCollection,
+  IDeltaDecorationsOptions,
+} from '../../model/enhanceDecorationsCollection';
 import { renderLines } from '../ghost-text-widget/index';
 
 import styles from './inline-stream-diff.module.less';
@@ -34,7 +39,7 @@ interface IPartialEditWidgetComponent {
   discardSequence: string;
 }
 
-export type IWidgetStatus = 'accept' | 'discard' | 'pending';
+type IWidgetStatus = 'accept' | 'discard' | 'pending';
 
 export interface IRemovedWidgetState {
   textLines: ITextLinesTokens[];
@@ -141,7 +146,7 @@ export class AcceptPartialEditWidget extends ReactInlineContentWidget {
   private readonly keybindingRegistry: KeybindingRegistry;
 
   private _id: string;
-  private _decorationId: string;
+  private _addedRangeId: string;
 
   private readonly _onAccept = this.registerDispose(new Emitter<void>());
   public readonly onAccept: Event<void> = this._onAccept.event;
@@ -209,12 +214,12 @@ export class AcceptPartialEditWidget extends ReactInlineContentWidget {
     return styles.accept_partial_edit_widget_id;
   }
 
-  public recordDecorationId(id: string): void {
-    this._decorationId = id;
+  public recordAddedRangeId(id: string): void {
+    this._addedRangeId = id;
   }
 
-  public getDecorationId(): string {
-    return this._decorationId;
+  public getAddedRangeId(): string {
+    return this._addedRangeId;
   }
 
   public resume(): void {
@@ -314,6 +319,8 @@ export class RemovedZoneWidget extends ZoneWidget {
     return this._group;
   }
 
+  public status: IWidgetStatus = 'pending';
+
   constructor(editor: ICodeEditor, public readonly textLines: ITextLinesTokens[], options: IRemovedZoneWidgetOptions) {
     super(editor, options);
 
@@ -362,12 +369,23 @@ export class RemovedZoneWidget extends ZoneWidget {
     return this.position || this._recordPosition;
   }
 
+  accept(): void {
+    this.status = 'accept';
+    this.hide();
+  }
+
+  discard(): void {
+    this.status = 'discard';
+    super.hide();
+  }
+
   hide(): void {
     this._hidden = true;
     super.hide();
   }
 
   resume(): void {
+    this.status = 'pending';
     const position = this.getLastPosition();
     if (position) {
       this.show(position, this.height);
@@ -376,6 +394,7 @@ export class RemovedZoneWidget extends ZoneWidget {
 
   override show(pos: IPosition, heightInLines: number): void {
     this._hidden = false;
+    this.status = 'pending';
     super.show(pos, heightInLines);
   }
 
@@ -407,3 +426,23 @@ export class RemovedZoneWidget extends ZoneWidget {
     super.dispose();
   }
 }
+
+class AddedRangeDeltaDecorations extends DeltaDecorations {
+  public status: IWidgetStatus = 'pending';
+
+  accept(): void {
+    this.status = 'accept';
+    super.hide();
+  }
+
+  discard(): void {
+    this.status = 'discard';
+    super.hide();
+  }
+}
+
+export class AddedRangeDecorationsCollection extends EnhanceDecorationsCollection<AddedRangeDeltaDecorations> {
+  protected override createDecorations(metaData: IDeltaDecorationsOptions) {
+    return new AddedRangeDeltaDecorations(metaData);
+  }
+}