@theia/scm 1.64.0-next.28 → 1.64.0

package/src/browser/merge-editor/view/merge-editor-scroll-sync.ts

@@ -0,0 +1,241 @@
+// *****************************************************************************
+// Copyright (C) 2025 1C-Soft LLC and others.
+//
+// This program and the accompanying materials are made available under the
+// terms of the Eclipse Public License v. 2.0 which is available at
+// http://www.eclipse.org/legal/epl-2.0.
+//
+// This Source Code may also be made available under the following Secondary
+// Licenses when the conditions for such availability set forth in the Eclipse
+// Public License v. 2.0 are satisfied: GNU General Public License, version 2
+// with the GNU Classpath Exception which is available at
+// https://www.gnu.org/software/classpath/license.html.
+//
+// SPDX-License-Identifier: EPL-2.0 OR GPL-2.0-only WITH Classpath-exception-2.0
+// *****************************************************************************
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+// copied and modified from https://github.com/microsoft/vscode/blob/1.96.3/src/vs/workbench/contrib/mergeEditor/browser/view/scrollSynchronizer.ts
+
+import { Disposable, DisposableCollection } from '@theia/core';
+import { MonacoEditor } from '@theia/monaco/lib/browser/monaco-editor';
+import { MergeEditor } from '../merge-editor';
+import { DocumentLineRangeMap } from '../model/range-mapping';
+
+export class MergeEditorScrollSync implements Disposable {
+
+    protected readonly toDispose = new DisposableCollection();
+    protected isSyncing = false;
+
+    constructor(protected readonly mergeEditor: MergeEditor) {
+        const { side1Pane, side2Pane, resultPane, basePane } = mergeEditor;
+
+        const syncingHandler = <T>(handler: (event: T) => void) => (event: T) => {
+            if (this.isSyncing) {
+                return;
+            }
+            this.isSyncing = true;
+            try {
+                handler(event);
+            } finally {
+                this.isSyncing = false;
+            }
+        };
+
+        this.toDispose.push(side1Pane.editor.getControl().onDidScrollChange(syncingHandler(event => {
+            if (event.scrollTopChanged) {
+                this.handleSide1ScrollTopChanged(event.scrollTop);
+            }
+            if (event.scrollLeftChanged) {
+                basePane.editor.getControl().setScrollLeft(event.scrollLeft);
+                side2Pane.editor.getControl().setScrollLeft(event.scrollLeft);
+                resultPane.editor.getControl().setScrollLeft(event.scrollLeft);
+            }
+        })));
+
+        this.toDispose.push(side2Pane.editor.getControl().onDidScrollChange(syncingHandler(event => {
+            if (event.scrollTopChanged) {
+                this.handleSide2ScrollTopChanged(event.scrollTop);
+            }
+            if (event.scrollLeftChanged) {
+                basePane.editor.getControl().setScrollLeft(event.scrollLeft);
+                side1Pane.editor.getControl().setScrollLeft(event.scrollLeft);
+                resultPane.editor.getControl().setScrollLeft(event.scrollLeft);
+            }
+        })));
+
+        this.toDispose.push(resultPane.editor.getControl().onDidScrollChange(syncingHandler(event => {
+            if (event.scrollTopChanged) {
+                this.handleResultScrollTopChanged(event.scrollTop);
+            }
+            if (event.scrollLeftChanged) {
+                basePane.editor.getControl().setScrollLeft(event.scrollLeft);
+                side1Pane.editor.getControl().setScrollLeft(event.scrollLeft);
+                side2Pane.editor.getControl().setScrollLeft(event.scrollLeft);
+            }
+        })));
+
+        this.toDispose.push(basePane.editor.getControl().onDidScrollChange(syncingHandler(event => {
+            if (event.scrollTopChanged) {
+                this.handleBaseScrollTopChanged(event.scrollTop);
+            }
+            if (event.scrollLeftChanged) {
+                side1Pane.editor.getControl().setScrollLeft(event.scrollLeft);
+                side2Pane.editor.getControl().setScrollLeft(event.scrollLeft);
+                resultPane.editor.getControl().setScrollLeft(event.scrollLeft);
+            }
+        })));
+    }
+
+    dispose(): void {
+        this.toDispose.dispose();
+    }
+
+    storeScrollState(): unknown {
+        return this.mergeEditor.side1Pane.editor.getControl().getScrollTop();
+    }
+
+    restoreScrollState(state: unknown): void {
+        if (typeof state === 'number') {
+            const scrollTop = this.mergeEditor.side1Pane.editor.getControl().getScrollTop();
+            if (state !== scrollTop) {
+                this.mergeEditor.side1Pane.editor.getControl().setScrollTop(state);
+            } else {
+                this.update();
+            }
+        }
+    }
+
+    update(): void {
+        if (this.isSyncing) {
+            return;
+        }
+        this.isSyncing = true;
+        try {
+            const scrollTop = this.mergeEditor.side1Pane.editor.getControl().getScrollTop();
+            this.handleSide1ScrollTopChanged(scrollTop);
+        } finally {
+            this.isSyncing = false;
+        }
+    }
+
+    protected handleSide1ScrollTopChanged(scrollTop: number): void {
+        const { side1Pane, side2Pane, resultPane, basePane, shouldAlignBase, shouldAlignResult, model } = this.mergeEditor;
+
+        side2Pane.editor.getControl().setScrollTop(scrollTop);
+
+        if (shouldAlignResult) {
+            resultPane.editor.getControl().setScrollTop(scrollTop);
+        } else {
+            const targetScrollTop = this.computeTargetScrollTop(side1Pane.editor, resultPane.editor, model.side1ToResultLineRangeMap);
+            resultPane.editor.getControl().setScrollTop(targetScrollTop);
+        }
+
+        if (shouldAlignBase) {
+            basePane.editor.getControl().setScrollTop(scrollTop);
+        } else {
+            const targetScrollTop = this.computeTargetScrollTop(side1Pane.editor, basePane.editor, model.side1ToBaseLineRangeMap);
+            basePane.editor.getControl().setScrollTop(targetScrollTop);
+        }
+    }
+
+    protected handleSide2ScrollTopChanged(scrollTop: number): void {
+        const { side1Pane, side2Pane, resultPane, basePane, shouldAlignBase, shouldAlignResult, model } = this.mergeEditor;
+
+        side1Pane.editor.getControl().setScrollTop(scrollTop);
+
+        if (shouldAlignResult) {
+            resultPane.editor.getControl().setScrollTop(scrollTop);
+        } else {
+            const targetScrollTop = this.computeTargetScrollTop(side2Pane.editor, resultPane.editor, model.side2ToResultLineRangeMap);
+            resultPane.editor.getControl().setScrollTop(targetScrollTop);
+        }
+
+        if (shouldAlignBase) {
+            basePane.editor.getControl().setScrollTop(scrollTop);
+        } else {
+            const targetScrollTop = this.computeTargetScrollTop(side2Pane.editor, basePane.editor, model.side2ToBaseLineRangeMap);
+            basePane.editor.getControl().setScrollTop(targetScrollTop);
+        }
+    }
+
+    protected handleResultScrollTopChanged(scrollTop: number): void {
+        const { side1Pane, side2Pane, resultPane, basePane, shouldAlignBase, shouldAlignResult, model } = this.mergeEditor;
+
+        if (shouldAlignResult) {
+            side1Pane.editor.getControl().setScrollTop(scrollTop);
+            side2Pane.editor.getControl().setScrollTop(scrollTop);
+        } else {
+            const targetScrollTop = this.computeTargetScrollTop(resultPane.editor, side1Pane.editor, model.resultToSide1LineRangeMap);
+            side1Pane.editor.getControl().setScrollTop(targetScrollTop);
+            side2Pane.editor.getControl().setScrollTop(targetScrollTop);
+            if (shouldAlignBase) {
+                basePane.editor.getControl().setScrollTop(targetScrollTop);
+            }
+        }
+
+        if (!shouldAlignBase) {
+            const targetScrollTop = this.computeTargetScrollTop(resultPane.editor, basePane.editor, model.resultToBaseLineRangeMap);
+            basePane.editor.getControl().setScrollTop(targetScrollTop);
+        }
+    }
+
+    protected handleBaseScrollTopChanged(scrollTop: number): void {
+        const { side1Pane, side2Pane, resultPane, basePane, shouldAlignBase, shouldAlignResult, model } = this.mergeEditor;
+
+        if (shouldAlignBase) {
+            side1Pane.editor.getControl().setScrollTop(scrollTop);
+            side2Pane.editor.getControl().setScrollTop(scrollTop);
+        } else {
+            const targetScrollTop = this.computeTargetScrollTop(basePane.editor, side1Pane.editor, model.baseToSide1LineRangeMap);
+            side1Pane.editor.getControl().setScrollTop(targetScrollTop);
+            side2Pane.editor.getControl().setScrollTop(targetScrollTop);
+            if (shouldAlignResult) {
+                resultPane.editor.getControl().setScrollTop(targetScrollTop);
+            }
+        }
+
+        if (!shouldAlignResult) {
+            const targetScrollTop = this.computeTargetScrollTop(basePane.editor, resultPane.editor, model.baseToResultLineRangeMap);
+            resultPane.editor.getControl().setScrollTop(targetScrollTop);
+        }
+    }
+
+    protected computeTargetScrollTop(sourceEditor: MonacoEditor, targetEditor: MonacoEditor, lineRangeMap: DocumentLineRangeMap): number {
+        const visibleRanges = sourceEditor.getVisibleRanges();
+        if (visibleRanges.length === 0) {
+            return 0;
+        }
+
+        const topLineNumber = visibleRanges[0].start.line;
+        const scrollTop = sourceEditor.getControl().getScrollTop();
+
+        let sourceStartTopPx: number;
+        let sourceEndPx: number;
+        let targetStartTopPx: number;
+        let targetEndPx: number;
+
+        if (topLineNumber === 0 && scrollTop <= sourceEditor.getControl().getTopForLineNumber(1)) { // special case: scrollTop is before or at the top of the first line
+            sourceStartTopPx = 0;
+            sourceEndPx = sourceEditor.getControl().getTopForLineNumber(1);
+
+            targetStartTopPx = 0;
+            targetEndPx = targetEditor.getControl().getTopForLineNumber(1);
+        } else {
+            const { originalRange: sourceRange, modifiedRange: targetRange } = lineRangeMap.projectLine(Math.max(topLineNumber - 1, 0));
+
+            sourceStartTopPx = sourceEditor.getControl().getTopForLineNumber(sourceRange.startLineNumber + 1);
+            sourceEndPx = sourceEditor.getControl().getTopForLineNumber(sourceRange.endLineNumberExclusive + 1);
+
+            targetStartTopPx = targetEditor.getControl().getTopForLineNumber(targetRange.startLineNumber + 1);
+            targetEndPx = targetEditor.getControl().getTopForLineNumber(targetRange.endLineNumberExclusive + 1);
+        }
+
+        const factor = Math.min(sourceEndPx === sourceStartTopPx ? 0 : (scrollTop - sourceStartTopPx) / (sourceEndPx - sourceStartTopPx), 1);
+        const targetScrollTop = targetStartTopPx + (targetEndPx - targetStartTopPx) * factor;
+
+        return targetScrollTop;
+    }
+}

package/src/browser/merge-editor/view/merge-editor-view-zones.ts

@@ -0,0 +1,264 @@
+// *****************************************************************************
+// Copyright (C) 2025 1C-Soft LLC and others.
+//
+// This program and the accompanying materials are made available under the
+// terms of the Eclipse Public License v. 2.0 which is available at
+// http://www.eclipse.org/legal/epl-2.0.
+//
+// This Source Code may also be made available under the following Secondary
+// Licenses when the conditions for such availability set forth in the Eclipse
+// Public License v. 2.0 are satisfied: GNU General Public License, version 2
+// with the GNU Classpath Exception which is available at
+// https://www.gnu.org/software/classpath/license.html.
+//
+// SPDX-License-Identifier: EPL-2.0 OR GPL-2.0-only WITH Classpath-exception-2.0
+// *****************************************************************************
+
+import { inject, injectable } from '@theia/core/shared/inversify';
+import { Disposable } from '@theia/core';
+import { Autorun, Observable } from '@theia/core/lib/common/observable';
+import * as monaco from '@theia/monaco-editor-core';
+import { MonacoEditorViewZone } from '@theia/monaco/lib/browser/monaco-editor-zone-widget';
+import { MergeEditor } from '../merge-editor';
+import { MergeRange } from '../model/merge-range';
+import { MergeRangeAction, MergeRangeActions } from './merge-range-actions';
+import { MergeEditorPane } from './merge-editor-panes';
+import { DiffSpacers, DiffSpacerService } from './diff-spacers';
+
+export interface MergeEditorViewZone {
+    create(ctx: MergeEditorViewZone.CreationContext): void;
+}
+
+export namespace MergeEditorViewZone {
+    export interface CreationContext {
+        createViewZone(viewZone: Omit<MonacoEditorViewZone, 'id'>): void;
+        register(disposable: Disposable): void;
+    }
+}
+
+export interface MergeEditorViewZones {
+    readonly baseViewZones: readonly MergeEditorViewZone[];
+    readonly side1ViewZones: readonly MergeEditorViewZone[];
+    readonly side2ViewZones: readonly MergeEditorViewZone[];
+    readonly resultViewZones: readonly MergeEditorViewZone[];
+}
+
+@injectable()
+export class MergeEditorViewZoneComputer {
+
+    @inject(DiffSpacerService)
+    protected readonly diffSpacerService: DiffSpacerService;
+
+    computeViewZones(mergeEditor: MergeEditor): MergeEditorViewZones {
+
+        const baseViewZones: MergeEditorViewZone[] = [];
+        const side1ViewZones: MergeEditorViewZone[] = [];
+        const side2ViewZones: MergeEditorViewZone[] = [];
+        const resultViewZones: MergeEditorViewZone[] = [];
+
+        const { model, shouldAlignResult, shouldAlignBase } = mergeEditor;
+
+        for (const mergeRange of model.mergeRanges) {
+            const { side1Pane, side2Pane, resultPane } = mergeEditor;
+
+            const actions = this.newMergeRangeActions(mergeEditor, mergeRange);
+
+            let resultActionZoneHeight = this.getActionZoneMinHeight(resultPane);
+            if (actions.hasSideActions || (shouldAlignResult && actions.hasResultActions)) {
+                let actionZoneHeight = Math.max(this.getActionZoneMinHeight(side1Pane), this.getActionZoneMinHeight(side2Pane));
+                if (shouldAlignResult) {
+                    resultActionZoneHeight = actionZoneHeight = Math.max(actionZoneHeight, resultActionZoneHeight);
+                }
+                side1ViewZones.push(this.newActionZone(side1Pane, actions.side1ActionsObservable, mergeRange.side1Range.startLineNumber - 1, actionZoneHeight));
+                side2ViewZones.push(this.newActionZone(side2Pane, actions.side2ActionsObservable, mergeRange.side2Range.startLineNumber - 1, actionZoneHeight));
+                if (shouldAlignBase) {
+                    baseViewZones.push(this.newActionZonePlaceholder(mergeRange.baseRange.startLineNumber - 1, actionZoneHeight));
+                }
+            }
+            if (actions.hasResultActions) {
+                resultViewZones.push(
+                    this.newActionZone(resultPane, actions.resultActionsObservable, model.getLineRangeInResult(mergeRange).startLineNumber - 1, resultActionZoneHeight)
+                );
+            } else if (shouldAlignResult && actions.hasSideActions) {
+                resultViewZones.push(this.newActionZonePlaceholder(model.getLineRangeInResult(mergeRange).startLineNumber - 1, resultActionZoneHeight));
+            }
+        }
+
+        const baseLineCount = model.baseDocument.lineCount;
+        const multiDiffSpacers: DiffSpacers[] = [];
+
+        multiDiffSpacers.push(this.diffSpacerService.computeDiffSpacers(model.side1Changes, baseLineCount));
+        multiDiffSpacers.push(this.diffSpacerService.computeDiffSpacers(model.side2Changes, baseLineCount));
+
+        if (shouldAlignResult) {
+            multiDiffSpacers.push(this.diffSpacerService.computeDiffSpacers(model.resultChanges, baseLineCount));
+        }
+
+        const combinedMultiDiffSpacers = this.diffSpacerService.combineMultiDiffSpacers(multiDiffSpacers);
+
+        if (shouldAlignBase) {
+            this.createSpacerZones(combinedMultiDiffSpacers.originalSpacers, baseViewZones);
+        }
+
+        const { modifiedSides } = shouldAlignBase ? combinedMultiDiffSpacers : this.diffSpacerService.excludeOriginalSide(combinedMultiDiffSpacers);
+
+        this.createSpacerZones(modifiedSides[0].modifiedSpacers, side1ViewZones);
+        this.createSpacerZones(modifiedSides[1].modifiedSpacers, side2ViewZones);
+
+        if (shouldAlignResult) {
+            this.createSpacerZones(modifiedSides[2].modifiedSpacers, resultViewZones);
+        }
+
+        return { baseViewZones, side1ViewZones, side2ViewZones, resultViewZones };
+    }
+
+    protected createSpacerZones(spacers: number[], viewZones: MergeEditorViewZone[]): void {
+        const lineNumbers = Object.keys(spacers).map(Number); // note: spacers is a sparse array
+        for (const lineNumber of lineNumbers) {
+            const heightInLines = spacers[lineNumber];
+            if (heightInLines) {
+                viewZones.push(this.newSpacerZone(lineNumber - 1, heightInLines));
+            }
+        }
+    }
+
+    protected newMergeRangeActions(mergeEditor: MergeEditor, mergeRange: MergeRange): MergeRangeActions {
+        return new MergeRangeActions(mergeEditor, mergeRange);
+    }
+
+    protected getActionZoneMinHeight(pane: MergeEditorPane): number {
+        return pane.editor.getControl().getOption(monaco.editor.EditorOption.lineHeight);
+    }
+
+    protected newActionZone(pane: MergeEditorPane, actions: Observable<readonly MergeRangeAction[]>, afterLineNumber: number, heightInPx: number): MergeEditorViewZone {
+        return new MergeEditorActionZone(pane, actions, afterLineNumber, heightInPx);
+    }
+
+    protected newActionZonePlaceholder(afterLineNumber: number, heightInPx: number): MergeEditorViewZone {
+        return new MergeEditorActionZonePlaceholder(afterLineNumber, heightInPx);
+    }
+
+    protected newSpacerZone(afterLineNumber: number, heightInLines: number): MergeEditorViewZone {
+        return new MergeEditorSpacerZone(afterLineNumber, heightInLines);
+    }
+}
+
+export class MergeEditorActionZone implements MergeEditorViewZone {
+
+    protected static counter = 0;
+
+    constructor(
+        protected readonly pane: MergeEditorPane,
+        protected readonly actionsObservable: Observable<readonly MergeRangeAction[]>,
+        protected readonly afterLineNumber: number,
+        protected readonly heightInPx: number
+    ) {}
+
+    create(ctx: MergeEditorViewZone.CreationContext): void {
+        const overlayWidgetNode = document.createElement('div');
+        overlayWidgetNode.className = 'action-zone';
+
+        ctx.createViewZone({
+            domNode: document.createElement('div'),
+            afterLineNumber: this.afterLineNumber + 1, // + 1, since line numbers in Monaco are 1-based
+            heightInPx: this.heightInPx,
+            onComputedHeight: height => overlayWidgetNode.style.height = `${height}px`,
+            onDomNodeTop: top => overlayWidgetNode.style.top = `${top}px`
+        });
+
+        const editor = this.pane.editor.getControl();
+        const setLeftPosition = () => overlayWidgetNode.style.left = editor.getLayoutInfo().contentLeft + 'px';
+        setLeftPosition();
+        ctx.register(editor.onDidLayoutChange(setLeftPosition));
+
+        const overlayWidgetId = `mergeEditorActionZone${MergeEditorActionZone.counter++}`;
+        const overlayWidget = {
+            getId: () => overlayWidgetId,
+            getDomNode: () => overlayWidgetNode,
+            // eslint-disable-next-line no-null/no-null
+            getPosition: () => null
+        };
+        editor.addOverlayWidget(overlayWidget);
+        ctx.register(Disposable.create(() => {
+            editor.removeOverlayWidget(overlayWidget);
+        }));
+
+        const actionContainer = document.createElement('div');
+        actionContainer.className = 'codelens-decoration';
+        overlayWidgetNode.appendChild(actionContainer);
+
+        ctx.register(Autorun.create(() => this.renderActions(actionContainer, this.actionsObservable.get())));
+    };
+
+    protected renderActions(parent: HTMLElement, actions: readonly MergeRangeAction[]): void {
+        const children: HTMLElement[] = [];
+        let isFirst = true;
+        for (const action of actions) {
+            if (isFirst) {
+                isFirst = false;
+            } else {
+                const actionSeparator = document.createElement('span');
+                actionSeparator.append('\u00a0|\u00a0');
+                children.push(actionSeparator);
+            }
+            const title = this.getActionTitle(action);
+            if (action.run) {
+                const actionLink = document.createElement('a');
+                actionLink.role = 'button';
+                actionLink.onclick = () => action.run!();
+                if (action.tooltip) {
+                    actionLink.title = action.tooltip;
+                }
+                actionLink.append(title);
+                children.push(actionLink);
+            } else {
+                const actionLabel = document.createElement('span');
+                if (action.tooltip) {
+                    actionLabel.title = action.tooltip;
+                }
+                actionLabel.append(title);
+                children.push(actionLabel);
+            }
+        }
+        parent.innerText = ''; // reset children
+        parent.append(...children);
+    }
+
+    protected getActionTitle(action: MergeRangeAction): string {
+        return action.text;
+    }
+}
+
+export class MergeEditorActionZonePlaceholder implements MergeEditorViewZone {
+    constructor(
+        protected readonly afterLineNumber: number,
+        protected readonly heightInPx: number
+    ) {}
+
+    create(ctx: MergeEditorViewZone.CreationContext): void {
+        const domNode = document.createElement('div');
+        domNode.className = 'action-zone-placeholder';
+        ctx.createViewZone({
+            afterLineNumber: this.afterLineNumber + 1, // + 1, since line numbers in Monaco are 1-based
+            heightInPx: this.heightInPx,
+            domNode
+        });
+    }
+}
+
+export class MergeEditorSpacerZone implements MergeEditorViewZone {
+    constructor(
+        protected readonly afterLineNumber: number,
+        protected readonly heightInLines: number
+    ) { }
+
+    create(ctx: MergeEditorViewZone.CreationContext): void {
+        const domNode = document.createElement('div');
+        domNode.className = 'diagonal-fill';
+        ctx.createViewZone({
+            afterLineNumber: this.afterLineNumber + 1, // + 1, since line numbers in Monaco are 1-based
+            heightInLines: this.heightInLines,
+            domNode
+        });
+    }
+}

package/src/browser/merge-editor/view/merge-range-actions.ts

@@ -0,0 +1,159 @@
+// *****************************************************************************
+// Copyright (C) 2025 1C-Soft LLC and others.
+//
+// This program and the accompanying materials are made available under the
+// terms of the Eclipse Public License v. 2.0 which is available at
+// http://www.eclipse.org/legal/epl-2.0.
+//
+// This Source Code may also be made available under the following Secondary
+// Licenses when the conditions for such availability set forth in the Eclipse
+// Public License v. 2.0 are satisfied: GNU General Public License, version 2
+// with the GNU Classpath Exception which is available at
+// https://www.gnu.org/software/classpath/license.html.
+//
+// SPDX-License-Identifier: EPL-2.0 OR GPL-2.0-only WITH Classpath-exception-2.0
+// *****************************************************************************
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+// copied and modified from https://github.com/microsoft/vscode/blob/1.96.3/src/vs/workbench/contrib/mergeEditor/browser/view/conflictActions.ts
+
+import { DerivedObservable, ObservableUtils } from '@theia/core/lib/common/observable';
+import { MergeRange, MergeRangeAcceptedState, MergeSide } from '../model/merge-range';
+import { MergeEditor } from '../merge-editor';
+import { nls } from '@theia/core';
+
+export interface MergeRangeAction {
+    readonly text: string;
+    readonly tooltip?: string;
+    run?(): unknown;
+}
+
+export class MergeRangeActions {
+
+    readonly side1ActionsObservable = DerivedObservable.create(() => this.getActionsForSide(1));
+    readonly side2ActionsObservable = DerivedObservable.create(() => this.getActionsForSide(2));
+    readonly resultActionsObservable = DerivedObservable.create(() => this.getResultActions());
+
+    protected readonly hasSideActionsObservable = DerivedObservable.create(() => this.side1ActionsObservable.get().length + this.side2ActionsObservable.get().length > 0);
+    get hasSideActions(): boolean { return this.hasSideActionsObservable.get(); }
+
+    protected readonly hasResultActionsObservable = DerivedObservable.create(() => this.resultActionsObservable.get().length > 0);
+    get hasResultActions(): boolean { return this.hasResultActionsObservable.get(); }
+
+    constructor(
+        protected readonly mergeEditor: MergeEditor,
+        protected readonly mergeRange: MergeRange
+    ) {}
+
+    protected getActionsForSide(side: MergeSide): readonly MergeRangeAction[] {
+        const { mergeEditor, mergeRange } = this;
+        const { model, side1Title, side2Title } = mergeEditor;
+
+        if (!model.hasMergeRange(mergeRange)) {
+            return [];
+        }
+
+        const result: MergeRangeAction[] = [];
+        const sideTitle = side === 1 ? side1Title : side2Title;
+        const state = model.getMergeRangeResultState(mergeRange);
+
+        if (state !== 'Unrecognized' && !state.includes('Side' + side)) {
+            if (state !== 'Base' || mergeRange.getChanges(side).length) {
+                result.push({
+                    text: nls.localizeByDefault('Accept {0}', sideTitle),
+                    tooltip: nls.localizeByDefault('Accept {0} in the result document.', sideTitle),
+                    run: () => this.applyMergeRangeAcceptedState(mergeRange, MergeRangeAcceptedState.addSide(state, side))
+                });
+            }
+
+            if (mergeRange.canBeSmartCombined(side)) {
+                result.push({
+                    text: mergeRange.isSmartCombinationOrderRelevant ?
+                        nls.localizeByDefault('Accept Combination ({0} First)', sideTitle) :
+                        nls.localizeByDefault('Accept Combination'),
+                    tooltip: nls.localizeByDefault('Accept an automatic combination of both sides in the result document.'),
+                    run: () => this.applyMergeRangeAcceptedState(mergeRange, MergeRangeAcceptedState.addSide(
+                        side === 1 ? 'Side1' : 'Side2', side === 1 ? 2 : 1, { smartCombination: true }))
+                });
+            }
+        }
+        return result;
+    }
+
+    protected getResultActions(): readonly MergeRangeAction[] {
+        const { mergeEditor, mergeRange } = this;
+        const { model, side1Title, side2Title } = mergeEditor;
+
+        if (!model.hasMergeRange(mergeRange)) {
+            return [];
+        }
+
+        const result: MergeRangeAction[] = [];
+        const state = model.getMergeRangeResultState(mergeRange);
+
+        if (state === 'Unrecognized') {
+            result.push({
+                text: nls.localizeByDefault('Manual Resolution'),
+                tooltip: nls.localizeByDefault('This conflict has been resolved manually.')
+            });
+            result.push({
+                text: nls.localizeByDefault('Reset to base'),
+                tooltip: nls.localizeByDefault('Reset this conflict to the common ancestor of both the right and left changes.'),
+                run: () => this.applyMergeRangeAcceptedState(mergeRange, 'Base')
+            });
+        } else if (state === 'Base') {
+            result.push({
+                text: nls.localizeByDefault('No Changes Accepted'),
+                tooltip: nls.localizeByDefault('The current resolution of this conflict equals the common ancestor of both the right and left changes.')
+            });
+            if (!model.isMergeRangeHandled(mergeRange)) {
+                result.push({
+                    text: nls.localizeByDefault('Mark as Handled'),
+                    run: () => this.applyMergeRangeAcceptedState(mergeRange, state)
+                });
+            }
+        } else {
+            const labels: string[] = [];
+            const stateToggles: MergeRangeAction[] = [];
+            if (state.includes('Side1')) {
+                labels.push(side1Title);
+                stateToggles.push({
+                    text: nls.localizeByDefault('Remove {0}', side1Title),
+                    tooltip: nls.localizeByDefault('Remove {0} from the result document.', side1Title),
+                    run: () => this.applyMergeRangeAcceptedState(mergeRange, MergeRangeAcceptedState.removeSide(state, 1))
+                });
+            }
+            if (state.includes('Side2')) {
+                labels.push(side2Title);
+                stateToggles.push({
+                    text: nls.localizeByDefault('Remove {0}', side2Title),
+                    tooltip: nls.localizeByDefault('Remove {0} from the result document.', side2Title),
+                    run: () => this.applyMergeRangeAcceptedState(mergeRange, MergeRangeAcceptedState.removeSide(state, 2))
+                });
+            }
+            if (state.startsWith('Side2')) {
+                labels.reverse();
+                stateToggles.reverse();
+            }
+            if (labels.length) {
+                result.push({
+                    text: labels.join(' + ')
+                });
+            }
+            result.push(...stateToggles);
+        }
+        return result;
+    }
+
+    protected async applyMergeRangeAcceptedState(mergeRange: MergeRange, state: MergeRangeAcceptedState): Promise<void> {
+        const { model, resultPane } = this.mergeEditor;
+        resultPane.activate();
+        await ObservableUtils.waitForState(model.isUpToDateObservable);
+        resultPane.goToMergeRange(mergeRange, { reveal: false }); // set the cursor state that will be restored when undoing the operation
+        model.applyMergeRangeAcceptedState(mergeRange, state);
+        await ObservableUtils.waitForState(model.isUpToDateObservable);
+        resultPane.goToMergeRange(mergeRange, { reveal: false }); // set the resulting cursor state
+    }
+}

package/src/browser/scm-colors.ts

@@ -18,4 +18,6 @@ export namespace ScmColors {
     export const editorGutterModifiedBackground = 'editorGutter.modifiedBackground';
     export const editorGutterAddedBackground = 'editorGutter.addedBackground';
     export const editorGutterDeletedBackground = 'editorGutter.deletedBackground';
+    export const handledConflictMinimapOverviewRulerColor = 'mergeEditor.conflict.handled.minimapOverViewRuler';
+    export const unhandledConflictMinimapOverviewRulerColor = 'mergeEditor.conflict.unhandled.minimapOverViewRuler';
 }