Merge branch 'eclipse-theia:master' into eclipse-theiagh-12557-worksp…

…ace-save-fixes

package.json

@@ -99,7 +99,7 @@
   ],
   "theiaPluginsDir": "plugins",
   "theiaPlugins": {
-    "eclipse-theia.builtin-extension-pack": "https://open-vsx.org/api/eclipse-theia/builtin-extension-pack/1.70.2/file/eclipse-theia.builtin-extension-pack-1.70.2.vsix",
+    "eclipse-theia.builtin-extension-pack": "https://open-vsx.org/api/eclipse-theia/builtin-extension-pack/1.77.0/file/eclipse-theia.builtin-extension-pack-1.77.0.vsix",
     "EditorConfig.EditorConfig": "https://open-vsx.org/api/EditorConfig/EditorConfig/0.14.4/file/EditorConfig.EditorConfig-0.14.4.vsix",
     "dbaeumer.vscode-eslint": "https://open-vsx.org/api/dbaeumer/vscode-eslint/2.1.20/file/dbaeumer.vscode-eslint-2.1.20.vsix"
   },

packages/core/src/browser/dialogs.ts

@@ -199,17 +199,18 @@ export abstract class AbstractDialog<T> extends BaseWidget {
     }
 
     protected appendCloseButton(text: string = Dialog.CANCEL): HTMLButtonElement {
-        this.closeButton = this.createButton(text);
-        this.controlPanel.appendChild(this.closeButton);
-        this.closeButton.classList.add('secondary');
-        return this.closeButton;
+        return this.closeButton = this.appendButton(text, false);
     }
 
     protected appendAcceptButton(text: string = Dialog.OK): HTMLButtonElement {
-        this.acceptButton = this.createButton(text);
-        this.controlPanel.appendChild(this.acceptButton);
-        this.acceptButton.classList.add('main');
-        return this.acceptButton;
+        return this.acceptButton = this.appendButton(text, true);
+    }
+
+    protected appendButton(text: string, primary: boolean): HTMLButtonElement {
+        const button = this.createButton(text);
+        this.controlPanel.appendChild(button);
+        button.classList.add(primary ? 'main' : 'secondary');
+        return button;
     }
 
     protected createButton(text: string): HTMLButtonElement {
@@ -351,8 +352,12 @@ export abstract class AbstractDialog<T> extends BaseWidget {
 }
 
 @injectable()
-export class ConfirmDialogProps extends DialogProps {
+export class MessageDialogProps extends DialogProps {
     readonly msg: string | HTMLElement;
+}
+
+@injectable()
+export class ConfirmDialogProps extends MessageDialogProps {
     readonly cancel?: string;
     readonly ok?: string;
 }
@@ -401,48 +406,52 @@ export async function confirmExit(): Promise<boolean> {
     return safeToExit === true;
 }
 
-export class ConfirmSaveDialogProps extends ConfirmDialogProps {
+export class ConfirmSaveDialogProps extends MessageDialogProps {
+    readonly cancel: string;
+    readonly dontSave: string;
     readonly save: string;
-    performSave: () => Promise<void>;
 }
 
-export class ConfirmSaveDialog extends ConfirmDialog {
+// Dialog prompting the user to confirm whether they wish to save changes or not
+export class ConfirmSaveDialog extends AbstractDialog<boolean | undefined> {
+    protected result?: boolean = false;
 
-    protected saveButton: HTMLButtonElement | undefined;
     constructor(
         @inject(ConfirmSaveDialogProps) protected override readonly props: ConfirmSaveDialogProps
     ) {
         super(props);
+        // Append message and buttons to the dialog
         this.contentNode.appendChild(this.createMessageNode(this.props.msg));
-        // reorder buttons
-        this.controlPanel.childNodes.forEach(child => this.controlPanel.removeChild(child));
-        [this.acceptButton, this.closeButton].forEach(child => {
-            if (typeof child !== 'undefined') {
-                this.controlPanel.appendChild(child);
-            }
-        });
-        this.appendSaveButton(props.save).addEventListener('click', async () => {
-            await props.performSave();
-            this.acceptButton?.click();
-        });
+        this.closeButton = this.appendButtonAndSetResult(props.cancel, false);
+        this.appendButtonAndSetResult(props.dontSave, false, false);
+        this.acceptButton = this.appendButtonAndSetResult(props.save, true, true);
     }
 
-    protected appendSaveButton(text: string = Dialog.OK): HTMLButtonElement {
-        this.saveButton = this.createButton(text);
-        this.controlPanel.appendChild(this.saveButton);
-        this.saveButton.classList.add('main');
-        return this.saveButton;
+    get value(): boolean | undefined {
+        return this.result;
     }
 
-    protected override onActivateRequest(msg: Message): void {
-        super.onActivateRequest(msg);
-        if (this.saveButton) {
-            this.saveButton.focus();
+    protected createMessageNode(msg: string | HTMLElement): HTMLElement {
+        if (typeof msg === 'string') {
+            const messageNode = document.createElement('div');
+            messageNode.textContent = msg;
+            return messageNode;
         }
+        return msg;
+    }
+
+    protected appendButtonAndSetResult(text: string, primary: boolean, result?: boolean): HTMLButtonElement {
+        const button = this.appendButton(text, primary);
+        button.addEventListener('click', () => {
+            this.result = result;
+            this.accept();
+        });
+        return button;
     }
 
 }
 
+// Asks the user to confirm whether they want to exit with or without saving the changes
 export async function confirmExitWithOrWithoutSaving(captionsToSave: string[], performSave: () => Promise<void>): Promise<boolean> {
     const div: HTMLElement = document.createElement('div');
     div.innerText = nls.localizeByDefault("Your changes will be lost if you don't save them.");
@@ -458,15 +467,18 @@ export async function confirmExitWithOrWithoutSaving(captionsToSave: string[], p
         });
         span.appendChild(document.createElement('br'));
         div.appendChild(span);
-        const safeToExit = await new ConfirmSaveDialog({
+        const result = await new ConfirmSaveDialog({
             title: nls.localizeByDefault('Do you want to save the changes to the following {0} files?', captionsToSave.length),
             msg: div,
-            ok: nls.localizeByDefault("Don't Save"),
+            dontSave: nls.localizeByDefault("Don't Save"),
             save: nls.localizeByDefault('Save All'),
-            cancel: Dialog.CANCEL,
-            performSave: performSave
+            cancel: Dialog.CANCEL
         }).open();
-        return safeToExit === true;
+
+        if (result) {
+            await performSave();
+        }
+        return result !== undefined;
     } else {
         // fallback if not passed with an empty caption-list.
         return confirmExit();

packages/core/src/browser/saveable.ts

@@ -293,8 +293,8 @@ export class ShouldSaveDialog extends AbstractDialog<boolean> {
         messageNode.textContent = nls.localizeByDefault("Your changes will be lost if you don't save them.");
         messageNode.setAttribute('style', 'flex: 1 100%; padding-bottom: calc(var(--theia-ui-padding)*3);');
         this.contentNode.appendChild(messageNode);
-        this.dontSaveButton = this.appendDontSaveButton();
         this.appendCloseButton();
+        this.dontSaveButton = this.appendDontSaveButton();
         this.appendAcceptButton(nls.localizeByDefault('Save'));
     }
 

packages/debug/src/browser/debug-session.tsx

@@ -43,6 +43,7 @@ import { DebugContribution } from './debug-contribution';
 import { Deferred, waitForEvent } from '@theia/core/lib/common/promise-util';
 import { WorkspaceService } from '@theia/workspace/lib/browser';
 import { DebugInstructionBreakpoint } from './model/debug-instruction-breakpoint';
+import { nls } from '@theia/core';
 
 export enum DebugState {
     Inactive,
@@ -860,14 +861,15 @@ export class DebugSession implements CompositeTreeElement {
 
     render(): React.ReactNode {
         let label = '';
+        const state = this.state === DebugState.Stopped ? nls.localizeByDefault('Paused') : nls.localizeByDefault('Running');
         const child = this.getSingleChildSession();
         if (child && child.configuration.compact) {
             // Inlines the name of the child debug session
             label = `: ${child.label}`;
         }
         return <div className='theia-debug-session' title='Session'>
             <span className='label'>{this.label + label}</span>
-            <span className='status'>{this.state === DebugState.Stopped ? 'Paused' : 'Running'}</span>
+            <span className='status'>{state}</span>
         </div>;
     }
 

packages/file-search/src/browser/quick-file-open.ts

@@ -168,7 +168,10 @@ export class QuickFileOpenService implements QuickAccessProvider {
 
             if (location.uri.scheme === 'file' && !alreadyCollected.has(uriString) && fuzzy.test(fileFilter, uriString)) {
                 if (recentlyUsedItems.length === 0) {
-                    recentlyUsedItems.push({ type: 'separator', label: 'recently opened' });
+                    recentlyUsedItems.push({
+                        type: 'separator',
+                        label: nls.localizeByDefault('recently opened')
+                    });
                 }
                 const item = this.toItem(fileFilter, location.uri);
                 recentlyUsedItems.push(item);
@@ -198,7 +201,10 @@ export class QuickFileOpenService implements QuickAccessProvider {
                 sortedResults.sort((a, b) => this.compareItems(a, b));
 
                 if (sortedResults.length > 0) {
-                    result.push({ type: 'separator', label: 'file results' });
+                    result.push({
+                        type: 'separator',
+                        label: nls.localizeByDefault('file results')
+                    });
                     result.push(...sortedResults);
                 }
 

packages/keymaps/README.md

@@ -37,7 +37,7 @@ You can use `shift`, `ctrl`, `alt`, `meta`, `option` (`alt`), `command` (`meta`)
 
 You can also use the following strings for special keys: `backspace`, `tab`, `enter`, `return`, `capslock`, `esc`, `escape`, `space`, `pageup`, `pagedown`, `end`, `home`, `left`, `up`, `right`, `down`, `ins`, `del` and `plus`.
 
-If unsure you can always look at the framework's [supported keys](https://eclipse-theia.github.io/theia/docs/next/modules/core.key-2.html)
+If unsure you can always look at the framework's [supported keys](https://eclipse-theia.github.io/theia/docs/next/modules/core.Key-4.html)
 
 ## Key Sequences
 

packages/monaco/src/browser/style/index.css

@@ -103,25 +103,6 @@
   color: var(--theia-foreground) !important;
 }
 
-.quick-input-list
-  .quick-input-list-rows
-  > .quick-input-list-row
-  .monaco-icon-label,
-.quick-input-list
-  .quick-input-list-rows
-  > .quick-input-list-row
-  .monaco-icon-label
-  .monaco-icon-label-container,
-.quick-input-list
-  .quick-input-list-rows
-  > .quick-input-list-row
-  .monaco-icon-label
-  .monaco-icon-label-container
-  > .monaco-icon-name-container {
-  display: flex !important;
-  overflow: hidden;
-}
-
 .quick-input-list .monaco-list-row.focused {
   background-color: var(--theia-quickInputList-focusBackground) !important;
 }
@@ -165,8 +146,7 @@
 }
 
 .monaco-icon-label > .monaco-icon-label-container {
-  flex: 1 !important;
-  line-height: 22px;
+  flex: 1;
 }
 
 .quick-input-list-rows
@@ -175,8 +155,9 @@
   .monaco-icon-description-container
   .label-description {
     font-family: var(--theia-ui-font-family);
-    font-size: calc(var(--theia-ui-font-size1) * 0.95) !important;
+    font-size: calc(var(--theia-ui-font-size1) * 0.9) !important;
     color: var(--theia-foreground) !important;
+    white-space: inherit;
 }
 
 .quick-input-list-rows
@@ -188,16 +169,27 @@
     font-family: var(--theia-ui-font-family);
     font-size: var(--theia-ui-font-size1) !important;
     color: var(--theia-foreground) !important;
-    overflow: hidden;
-    text-overflow: ellipsis;
 }
 
-.quick-input-list .monaco-icon-label::before {
-  transform: scale(0.8);
+.quick-input-list .monaco-icon-label.codicon,
+.quick-input-list .monaco-icon-label.file-icon {
+  display: flex;
+  text-align: left;
+}
+
+.codicon-file.default-file-icon.file-icon {
+  padding-left: 2px;
+  height: 22px;
+}
+
+.codicon-file.default-file-icon.file-icon::before {
+  margin-right: 4px;
+  font-size: var(--theia-ui-font-size1);
 }
 
 .quick-input-list .monaco-icon-label.codicon::before {
-  padding-top: 3px;
+  position: relative;
+  top: 3px;
 }
 
 .quick-input-list .monaco-icon-label.theia-file-icons-js {

packages/plugin-ext/src/common/plugin-api-rpc.ts

@@ -964,7 +964,7 @@ export interface SourceControlGroupFeatures {
 export interface ScmRawResource {
     handle: number,
     sourceUri: UriComponents,
-    icons: UriComponents[],
+    icons: (IconUrl | ThemeIcon | undefined)[], /* icons: light, dark */
     tooltip: string,
     strikeThrough: boolean,
     faded: boolean,

packages/plugin-ext/src/main/browser/scm-main.ts

@@ -40,6 +40,9 @@ import { URI as vscodeURI } from '@theia/core/shared/vscode-uri';
 import { Splice } from '../../common/arrays';
 import { UriComponents } from '../../common/uri-components';
 import { ColorRegistry } from '@theia/core/lib/browser/color-registry';
+import { PluginSharedStyle } from './plugin-shared-style';
+import { ThemeIcon } from '@theia/monaco-editor-core/esm/vs/platform/theme/common/themeService';
+import { IconUrl } from '../../common';
 
 export class PluginScmResourceGroup implements ScmResourceGroup {
 
@@ -147,10 +150,12 @@ export class PluginScmProvider implements ScmProvider {
     constructor(
         private readonly proxy: ScmExt,
         private readonly colors: ColorRegistry,
+        private readonly sharedStyle: PluginSharedStyle,
         private readonly _handle: number,
         private readonly _contextValue: string,
         private readonly _label: string,
-        private readonly _rootUri: vscodeURI | undefined
+        private readonly _rootUri: vscodeURI | undefined,
+        private disposables: DisposableCollection
     ) { }
 
     updateSourceControl(features: SourceControlProviderFeatures): void {
@@ -222,13 +227,13 @@ export class PluginScmProvider implements ScmProvider {
                 const { start, deleteCount, rawResources } = groupSlice;
                 const resources = rawResources.map(rawResource => {
                     const { handle, sourceUri, icons, tooltip, strikeThrough, faded, contextValue, command } = rawResource;
-                    const icon = icons[0];
-                    const iconDark = icons[1] || icon;
+                    const icon = this.toIconClass(icons[0]);
+                    const iconDark = this.toIconClass(icons[1]) || icon;
                     // eslint-disable-next-line @typescript-eslint/no-explicit-any
                     const colorVariable = (rawResource as any).colorId && this.colors.toCssVariableName((rawResource as any).colorId);
                     const decorations = {
-                        icon: icon ? vscodeURI.revive(icon) : undefined,
-                        iconDark: iconDark ? vscodeURI.revive(iconDark) : undefined,
+                        icon,
+                        iconDark,
                         tooltip,
                         strikeThrough,
                         // TODO remove the letter and colorId fields when the FileDecorationProvider is applied, see https://github.com/eclipse-theia/theia/pull/8911
@@ -258,6 +263,18 @@ export class PluginScmProvider implements ScmProvider {
         this.onDidChangeResourcesEmitter.fire();
     }
 
+    private toIconClass(icon: IconUrl | ThemeIcon | undefined): string | undefined {
+        if (!icon) {
+            return undefined;
+        }
+        if (ThemeIcon.isThemeIcon(icon)) {
+            return ThemeIcon.asClassName(icon);
+        }
+        const reference = this.sharedStyle.toIconClass(icon);
+        this.disposables.push(reference);
+        return reference.object.iconClass;
+    }
+
     unregisterGroup(handle: number): void {
         const group = this.groupsByHandle[handle];
 
@@ -280,11 +297,13 @@ export class ScmMainImpl implements ScmMain {
     private repositoryDisposables = new Map<number, DisposableCollection>();
     private readonly disposables = new DisposableCollection();
     private readonly colors: ColorRegistry;
+    private readonly sharedStyle: PluginSharedStyle;
 
     constructor(rpc: RPCProtocol, container: interfaces.Container) {
         this.proxy = rpc.getProxy(MAIN_RPC_CONTEXT.SCM_EXT);
         this.scmService = container.get(ScmService);
         this.colors = container.get(ColorRegistry);
+        this.sharedStyle = container.get(PluginSharedStyle);
     }
 
     dispose(): void {
@@ -298,7 +317,7 @@ export class ScmMainImpl implements ScmMain {
     }
 
     async $registerSourceControl(handle: number, id: string, label: string, rootUri: UriComponents | undefined): Promise<void> {
-        const provider = new PluginScmProvider(this.proxy, this.colors, handle, id, label, rootUri ? vscodeURI.revive(rootUri) : undefined);
+        const provider = new PluginScmProvider(this.proxy, this.colors, this.sharedStyle, handle, id, label, rootUri ? vscodeURI.revive(rootUri) : undefined, this.disposables);
         const repository = this.scmService.registerScmProvider(provider, {
             input: {
                 validator: async value => {