ExplorerDecoariontsProvider

fixes #35075

src/vs/platform/theme/common/colorRegistry.ts

@@ -196,6 +196,7 @@ export const listHoverBackground = registerColor('list.hoverBackground', { dark:
 export const listHoverForeground = registerColor('list.hoverForeground', { dark: null, light: null, hc: null }, nls.localize('listHoverForeground', "List/Tree foreground when hovering over items using the mouse."));
 export const listDropBackground = registerColor('list.dropBackground', { dark: listFocusBackground, light: listFocusBackground, hc: null }, nls.localize('listDropBackground', "List/Tree drag and drop background when moving items around using the mouse."));
 export const listHighlightForeground = registerColor('list.highlightForeground', { dark: '#0097fb', light: '#007acc', hc: focusBorder }, nls.localize('highlight', 'List/Tree foreground color of the match highlights when searching inside the list/tree.'));
+export const listInvalidItemForeground = registerColor('list.invalidItemForeground', { dark: '#B89500', light: '#B89500', hc: '#B89500' }, nls.localize('invalidItemForeground', 'List/Tree foreground color for invalid items, for example an unresolved root in explorer.'));
 
 export const pickerGroupForeground = registerColor('pickerGroup.foreground', { dark: Color.fromHex('#0097FB').transparent(0.6), light: Color.fromHex('#007ACC').transparent(0.6), hc: Color.white }, nls.localize('pickerGroupForeground', "Quick picker color for grouping labels."));
 export const pickerGroupBorder = registerColor('pickerGroup.border', { dark: '#3F3F46', light: '#CCCEDB', hc: Color.white }, nls.localize('pickerGroupBorder', "Quick picker color for grouping borders."));

src/vs/workbench/parts/files/browser/views/explorerDecorationsProvider.ts

+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+'use strict';
+
+import URI from 'vs/base/common/uri';
+import Event, { Emitter } from 'vs/base/common/event';
+import { localize } from 'vs/nls';
+import { Model } from 'vs/workbench/parts/files/common/explorerModel';
+import { IWorkspaceContextService } from 'vs/platform/workspace/common/workspace';
+import { IDecorationsProvider, IDecorationData } from 'vs/workbench/services/decorations/browser/decorations';
+import { listInvalidItemForeground } from 'vs/platform/theme/common/colorRegistry';
+
+export class ExplorerDecorationsProvider implements IDecorationsProvider {
+	readonly label: string = localize('label', "Explorer");
+	private _onDidChange = new Emitter<URI[]>();
+
+	constructor(
+		private model: Model,
+		@IWorkspaceContextService contextService: IWorkspaceContextService
+	) {
+		contextService.onDidChangeWorkspaceFolders(e => {
+			this._onDidChange.fire(e.changed.map(wf => wf.uri));
+		});
+	}
+
+	get onDidChange(): Event<URI[]> {
+		return this._onDidChange.event;
+	}
+
+	provideDecorations(resource: URI): IDecorationData {
+		const fileStat = this.model.roots.filter(r => r.resource.toString() === resource.toString()).pop();
+		if (fileStat && fileStat.nonexistentRoot) {
+			return {
+				tooltip: localize('canNotResolve', "Can not resolve folder"),
+				letter: '!',
+				color: listInvalidItemForeground,
+			};
+		}
+
+		return undefined;
+	}
+}

src/vs/workbench/parts/files/browser/views/explorerView.ts

@@ -32,6 +32,7 @@ import { FileStat, Model } from 'vs/workbench/parts/files/common/explorerModel';
 import { IListService } from 'vs/platform/list/browser/listService';
 import { IWorkbenchEditorService } from 'vs/workbench/services/editor/common/editorService';
 import { IPartService } from 'vs/workbench/services/part/common/partService';
+import { ExplorerDecorationsProvider } from 'vs/workbench/parts/files/browser/views/explorerDecorationsProvider';
 import { IWorkspaceContextService, WorkbenchState, IWorkspaceFolder } from 'vs/platform/workspace/common/workspace';
 import { IConfigurationService, IConfigurationChangeEvent } from 'vs/platform/configuration/common/configuration';
 import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
@@ -45,6 +46,7 @@ import { IWorkbenchThemeService, IFileIconTheme } from 'vs/workbench/services/th
 import { isLinux } from 'vs/base/common/platform';
 import { IEnvironmentService } from 'vs/platform/environment/common/environment';
 import { attachListStyler } from 'vs/platform/theme/common/styler';
+import { IDecorationsService } from 'vs/workbench/services/decorations/browser/decorations';
 
 export interface IExplorerViewOptions extends IViewletViewOptions {
 	viewletState: FileViewletState;
@@ -98,7 +100,8 @@ export class ExplorerView extends ViewsViewletPanel {
 		@IContextKeyService contextKeyService: IContextKeyService,
 		@IConfigurationService private configurationService: IConfigurationService,
 		@IWorkbenchThemeService private themeService: IWorkbenchThemeService,
-		@IEnvironmentService private environmentService: IEnvironmentService
+		@IEnvironmentService private environmentService: IEnvironmentService,
+		@IDecorationsService decorationService: IDecorationsService
 	) {
 		super({ ...(options as IViewOptions), ariaHeaderLabel: nls.localize('explorerSection', "Files Explorer Section") }, keybindingService, contextMenuService);
 
@@ -120,6 +123,8 @@ export class ExplorerView extends ViewsViewletPanel {
 			(root: URI) => this.getFileEventsExcludes(root),
 			(event: IConfigurationChangeEvent) => event.affectsConfiguration(FILES_EXCLUDE_CONFIG)
 		);
+
+		decorationService.registerDecorationsProvider(new ExplorerDecorationsProvider(this.model, contextService));
 	}
 
 	private getFileEventsExcludes(root?: URI): glob.IExpression {

src/vs/workbench/parts/files/browser/views/explorerViewer.ts

@@ -313,12 +313,8 @@ export class FileRenderer implements IRenderer {
 		if (!editableData) {
 			templateData.label.element.style.display = 'flex';
 			const extraClasses = ['explorer-item'];
-			if (stat.nonexistentRoot) {
-				extraClasses.push('nonexistent-root');
-			}
 			templateData.label.setFile(stat.resource, {
 				hidePath: true,
-				title: stat.nonexistentRoot ? nls.localize('canNotResolve', "Can not resolve folder {0}", stat.resource.toString()) : undefined,
 				fileKind: stat.isRoot ? FileKind.ROOT_FOLDER : stat.isDirectory ? FileKind.FOLDER : FileKind.FILE,
 				extraClasses,
 				fileDecorations: this.configurationService.getConfiguration<IFilesConfiguration>().explorer.decorations

src/vs/workbench/parts/files/common/explorerModel.ts

@@ -116,7 +116,7 @@ export class FileStat implements IFileStat {
 	}
 
 	public get nonexistentRoot(): boolean {
-		return this.isRoot && !this.isDirectoryResolved;
+		return this.isRoot && !this.isDirectoryResolved && this.isDirectory;
 	}
 
 	public getId(): string {