[vscode] icon theming

Signed-off-by: Anton Kosyakov <anton.kosyakov@typefox.io>

examples/api-samples/src/browser/sample-dynamic-label-provider-contribution.ts

@@ -14,7 +14,7 @@
  * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
  ********************************************************************************/
 
-import { DefaultUriLabelProviderContribution, DidChangeLabelEvent, FILE_ICON } from '@theia/core/lib/browser/label-provider';
+import { DefaultUriLabelProviderContribution, DidChangeLabelEvent } from '@theia/core/lib/browser/label-provider';
 import URI from '@theia/core/lib/common/uri';
 import { injectable } from 'inversify';
 import { Emitter, Event } from '@theia/core';
@@ -58,11 +58,11 @@ export class SampleDynamicLabelProviderContribution extends DefaultUriLabelProvi
         return new URI(element.toString());
     }
 
-    async getIcon(element: URI): Promise<string> {
+    getIcon(element: URI): string {
         const uri = this.getUri(element);
         const icon = super.getFileIcon(uri);
         if (!icon) {
-            return FILE_ICON;
+            return this.defaultFileIcon;
         }
         return icon;
     }

packages/core/src/browser/common-frontend-contribution.ts

@@ -36,8 +36,9 @@ import { UriSelection } from '../common/selection';
 import { StorageService } from './storage-service';
 import { Navigatable } from './navigatable';
 import { QuickViewService } from './quick-view-service';
-import { PrefixQuickOpenService } from './quick-open';
+import { PrefixQuickOpenService, QuickOpenItem, QuickOpenMode, QuickOpenService } from './quick-open';
 import { environment } from '@theia/application-package/lib/environment';
+import { IconThemeService } from './icon-theme-service';
 
 export namespace CommonMenus {
 
@@ -198,6 +199,12 @@ export namespace CommonCommands {
         label: 'Open Preferences',
     };
 
+    export const SELECT_ICON_THEME: Command = {
+        id: 'workbench.action.selectIconTheme',
+        label: 'File Icon Theme',
+        category: 'Preferences'
+    };
+
 }
 
 export const supportCut = browser.isNative || document.queryCommandSupported('cut');
@@ -238,6 +245,12 @@ export class CommonFrontendContribution implements FrontendApplicationContributi
     @inject(PrefixQuickOpenService)
     protected readonly quickOpen: PrefixQuickOpenService;
 
+    @inject(IconThemeService)
+    protected readonly iconThemes: IconThemeService;
+
+    @inject(QuickOpenService)
+    protected readonly quickOpenService: QuickOpenService;
+
     @postConstruct()
     protected init(): void {
         this.contextKeyService.createKey<boolean>('isLinux', OS.type() === OS.Type.Linux);
@@ -508,6 +521,10 @@ export class CommonFrontendContribution implements FrontendApplicationContributi
         commandRegistry.registerCommand(CommonCommands.OPEN_VIEW, {
             execute: () => this.quickOpen.open(this.quickView.prefix)
         });
+
+        commandRegistry.registerCommand(CommonCommands.SELECT_ICON_THEME, {
+            execute: () => this.selectIconTheme()
+        });
     }
 
     private findTabBar(event?: Event): TabBar<Widget> | undefined {
@@ -679,4 +696,41 @@ export class CommonFrontendContribution implements FrontendApplicationContributi
             this.shouldPreventClose = false;
         }
     }
+
+    protected selectIconTheme(): void {
+        let resetTo: string | undefined = this.iconThemes.current;
+        let items: (QuickOpenItem & { id: string })[] = [];
+        for (const iconTheme of this.iconThemes.definitions) {
+            const item = Object.assign(new QuickOpenItem({
+                label: iconTheme.label,
+                description: iconTheme.description,
+                run: (mode: QuickOpenMode) => {
+                    if (mode === QuickOpenMode.OPEN) {
+                        resetTo = undefined;
+                    }
+                    this.iconThemes.current = iconTheme.id;
+                    return true;
+                }
+            }), { id: iconTheme.id });
+            items.push(item);
+        }
+        items = items.sort((a, b) => {
+            if (a.id === 'none') {
+                return -1;
+            }
+            return a.getLabel()!.localeCompare(b.getLabel()!);
+        });
+        this.quickOpenService.open({
+            onType: (_, accept) => accept(items)
+        }, {
+                placeholder: 'Select File Icon Theme',
+                fuzzyMatchLabel: true,
+                selectIndex: () => items.findIndex(item => item.id === this.iconThemes.current),
+                onClose: () => {
+                    if (resetTo) {
+                        this.iconThemes.current = resetTo;
+                    }
+                }
+            });
+    }
 }

packages/core/src/browser/diff-uris.ts

@@ -16,7 +16,7 @@
 
 import { injectable, inject } from 'inversify';
 import URI from '../common/uri';
-import { LabelProviderContribution, LabelProvider } from './label-provider';
+import { LabelProviderContribution, LabelProvider, DidChangeLabelEvent } from './label-provider';
 
 export namespace DiffUris {
 
@@ -103,8 +103,13 @@ export class DiffUriLabelProviderContribution implements LabelProviderContributi
         return 'fa fa-columns';
     }
 
-    getConstituentUris(uri: URI): URI[] {
-        return DiffUris.decode(uri);
+    affects(diffUri: URI, event: DidChangeLabelEvent): boolean {
+        for (const uri of DiffUris.decode(diffUri)) {
+            if (event.affects(uri)) {
+                return true;
+            }
+        }
+        return false;
     }
 
 }

packages/core/src/browser/frontend-application-module.ts

@@ -86,6 +86,9 @@ import { bindResourceProvider, bindMessageService, bindPreferenceService } from
 import { ColorRegistry } from './color-registry';
 import { ColorContribution, ColorApplicationContribution } from './color-application-contribution';
 import { ExternalUriService } from './external-uri-service';
+import { IconThemeService, NoneIconTheme } from './icon-theme-service';
+import { IconThemeApplicationContribution, IconThemeContribution, DefaultFileIconThemeContribution } from './icon-theme-contribution';
+import { TreeLabelProvider } from './tree/tree-label-provider';
 
 export { bindResourceProvider, bindMessageService, bindPreferenceService };
 
@@ -94,6 +97,15 @@ export const frontendApplicationModule = new ContainerModule((bind, unbind, isBo
     themeService.register(...BuiltinThemeProvider.themes);
     themeService.startupTheme();
 
+    bind(NoneIconTheme).toSelf().inSingletonScope();
+    bind(LabelProviderContribution).toService(NoneIconTheme);
+    bind(IconThemeService).toSelf().inSingletonScope();
+    bindContributionProvider(bind, IconThemeContribution);
+    bind(DefaultFileIconThemeContribution).toSelf().inSingletonScope();
+    bind(IconThemeContribution).toService(DefaultFileIconThemeContribution);
+    bind(IconThemeApplicationContribution).toSelf().inSingletonScope();
+    bind(FrontendApplicationContribution).toService(IconThemeApplicationContribution);
+
     bind(ColorRegistry).toSelf().inSingletonScope();
     bindContributionProvider(bind, ColorContribution);
     bind(ColorApplicationContribution).toSelf().inSingletonScope();
@@ -130,7 +142,8 @@ export const frontendApplicationModule = new ContainerModule((bind, unbind, isBo
     bind(TabBarRendererFactory).toFactory(context => () => {
         const contextMenuRenderer = context.container.get<ContextMenuRenderer>(ContextMenuRenderer);
         const decoratorService = context.container.get<TabBarDecoratorService>(TabBarDecoratorService);
-        return new TabBarRenderer(contextMenuRenderer, decoratorService);
+        const iconThemeService = context.container.get<IconThemeService>(IconThemeService);
+        return new TabBarRenderer(contextMenuRenderer, decoratorService, iconThemeService);
     });
 
     bindContributionProvider(bind, TabBarDecorator);
@@ -230,6 +243,9 @@ export const frontendApplicationModule = new ContainerModule((bind, unbind, isBo
     bind(LabelProviderContribution).to(DefaultUriLabelProviderContribution).inSingletonScope();
     bind(LabelProviderContribution).to(DiffUriLabelProviderContribution).inSingletonScope();
 
+    bind(TreeLabelProvider).toSelf().inSingletonScope();
+    bind(LabelProviderContribution).toService(TreeLabelProvider);
+
     bindPreferenceService(bind);
     bind(FrontendApplicationContribution).toService(PreferenceService);
 

packages/core/src/browser/icon-theme-contribution.ts

@@ -0,0 +1,64 @@
+/********************************************************************************
+ * Copyright (C) 2019 TypeFox 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 WITH Classpath-exception-2.0
+ ********************************************************************************/
+
+import { injectable, inject, named } from 'inversify';
+import { FrontendApplicationContribution } from './frontend-application';
+import { ContributionProvider } from '../common/contribution-provider';
+import { IconThemeService, IconTheme } from './icon-theme-service';
+import { MaybePromise } from '../common/types';
+import { Disposable } from '../common/disposable';
+
+export const IconThemeContribution = Symbol('IconThemeContribution');
+export interface IconThemeContribution {
+    registerIconThemes(iconThemes: IconThemeService): MaybePromise<void>;
+}
+
+@injectable()
+export class IconThemeApplicationContribution implements FrontendApplicationContribution {
+
+    @inject(IconThemeService)
+    protected readonly iconThemes: IconThemeService;
+
+    @inject(ContributionProvider) @named(IconThemeContribution)
+    protected readonly iconThemeContributions: ContributionProvider<IconThemeContribution>;
+
+    async onStart(): Promise<void> {
+        for (const contribution of this.iconThemeContributions.getContributions()) {
+            await contribution.registerIconThemes(this.iconThemes);
+        }
+    }
+
+}
+
+@injectable()
+export class DefaultFileIconThemeContribution implements IconTheme, IconThemeContribution {
+
+    readonly id = 'theia-file-icons';
+    readonly label = 'File Icons (Theia)';
+    readonly hasFileIcons = true;
+    readonly hasFolderIcons = true;
+
+    registerIconThemes(iconThemes: IconThemeService): MaybePromise<void> {
+        iconThemes.register(this);
+        iconThemes.default = this.id;
+    }
+
+    /* rely on behaviour before for backward-compatibility */
+    activate(): Disposable {
+        return Disposable.NULL;
+    }
+
+}