Implement "show online settings only"

src/vs/workbench/parts/preferences/browser/media/settingsEditor2.css

@@ -113,15 +113,18 @@
 	background-image: url('configure-inverse.svg');
 }
 
-.vs .settings-editor.showing-modified-only > .settings-header > .settings-header-controls .settings-header-controls-right .toolbar-toggle-more::before {
+.vs .settings-editor.showing-modified-only > .settings-header > .settings-header-controls .settings-header-controls-right .toolbar-toggle-more::before,
+.vs .settings-editor.settings-filtered-by-tag > .settings-header > .settings-header-controls .settings-header-controls-right .toolbar-toggle-more::before {
 	border-color : #fff;
 }
 
-.vs-dark .settings-editor.showing-modified-only > .settings-header > .settings-header-controls .settings-header-controls-right .toolbar-toggle-more::before {
+.vs-dark .settings-editor.showing-modified-only > .settings-header > .settings-header-controls .settings-header-controls-right .toolbar-toggle-more::before,
+.vs-dark .settings-editor.settings-filtered-by-tag > .settings-header > .settings-header-controls .settings-header-controls-right .toolbar-toggle-more::before {
 	border-color : #000;
 }
 
-.settings-editor.showing-modified-only > .settings-header > .settings-header-controls .settings-header-controls-right .toolbar-toggle-more::before {
+.settings-editor.showing-modified-only > .settings-header > .settings-header-controls .settings-header-controls-right .toolbar-toggle-more::before,
+.settings-editor.settings-filtered-by-tag > .settings-header > .settings-header-controls .settings-header-controls-right .toolbar-toggle-more::before {
 	content: "";
 	width: 6px;
 	height: 6px;

src/vs/workbench/parts/preferences/browser/settingsEditor2.ts

@@ -224,6 +224,12 @@ export class SettingsEditor2 extends BaseEditor {
 
 		const actions = [
 			this.instantiationService.createInstance(ToggleShowModifiedOnlyAction, this, this.viewState),
+			this.instantiationService.createInstance(
+				ToggleFilterByTagAction,
+				localize('filterBackgroundOnlineLabel', "Show background online settings only"),
+				'backgroundOnlineFeature',
+				this,
+				this.viewState),
 			this.instantiationService.createInstance(OpenSettingsAction)
 		];
 		this.toolbar.setActions([], actions)();
@@ -408,6 +414,24 @@ export class SettingsEditor2 extends BaseEditor {
 		});
 	}
 
+	toggleFilterByTag(tag: string): TPromise<void> {
+		// Clear other filters
+		this.viewState.showConfiguredOnly = false;
+
+		this.viewState.tagFilters = this.viewState.tagFilters || new Set<string>();
+		const wasFiltered = this.viewState.tagFilters.delete(tag);
+		const isFiltered = !wasFiltered;
+		if (isFiltered) {
+			this.viewState.tagFilters.add(tag);
+		}
+
+		DOM.toggleClass(this.rootElement, 'settings-filtered-by-tag', isFiltered);
+		return this.refreshTreeAndMaintainFocus().then(() => {
+			this.settingsTree.setScrollPosition(0);
+			this.expandAll(this.settingsTree);
+		});
+	}
+
 	private onDidChangeSetting(key: string, value: any): void {
 		if (this.pendingSettingUpdate && this.pendingSettingUpdate.key !== key) {
 			this.updateChangedSetting(key, value);
@@ -846,3 +870,24 @@ class ToggleShowModifiedOnlyAction extends Action {
 		return this.settingsEditor.toggleShowModifiedOnly();
 	}
 }
+
+class ToggleFilterByTagAction extends Action {
+	static readonly ID = 'settings.toggleFilterByTag';
+
+	get checked(): boolean {
+		return this.viewState.tagFilters && this.viewState.tagFilters.has(this.tag);
+	}
+
+	constructor(
+		label: string,
+		private tag: string,
+		private settingsEditor: SettingsEditor2,
+		private viewState: ISettingsEditorViewState
+	) {
+		super(ToggleFilterByTagAction.ID, label, 'toggle-filter-tag');
+	}
+
+	run(): TPromise<void> {
+		return this.settingsEditor.toggleFilterByTag(this.tag);
+	}
+}

src/vs/workbench/parts/preferences/browser/settingsTree.ts

@@ -437,6 +437,7 @@ function trimCategoryForGroup(category: string, groupId: string): string {
 export interface ISettingsEditorViewState {
 	settingsTarget: SettingsTarget;
 	showConfiguredOnly?: boolean;
+	tagFilters?: Set<string>;
 	filterToCategory?: SettingsTreeGroupElement;
 }
 
@@ -1114,6 +1115,18 @@ export class SettingsTreeFilter implements IFilter {
 			return this.groupHasConfiguredSetting(element);
 		}
 
+		if (element instanceof SettingsTreeSettingElement && this.viewState.tagFilters && this.viewState.tagFilters.size) {
+			if (element.setting.tags) {
+				return element.setting.tags.some(tag => this.viewState.tagFilters.has(tag));
+			} else {
+				return false;
+			}
+		}
+
+		if (element instanceof SettingsTreeGroupElement && this.viewState.tagFilters && this.viewState.tagFilters.size) {
+			return element.children.some(child => this.isVisible(tree, child));
+		}
+
 		return true;
 	}
 

src/vs/workbench/services/preferences/common/preferences.ts

@@ -49,6 +49,7 @@ export interface ISetting {
 	type?: string | string[];
 	enum?: string[];
 	enumDescriptions?: string[];
+	tags?: string[];
 }
 
 export interface IExtensionSetting extends ISetting {

src/vs/workbench/services/preferences/common/preferencesModels.ts

@@ -555,7 +555,20 @@ export class DefaultSettings extends Disposable {
 				const value = prop.default;
 				const description = (prop.description || '').split('\n');
 				const overrides = OVERRIDE_PROPERTY_PATTERN.test(key) ? this.parseOverrideSettings(prop.default) : [];
-				result.push({ key, value, description, range: null, keyRange: null, valueRange: null, descriptionRanges: [], overrides, type: prop.type, enum: prop.enum, enumDescriptions: prop.enumDescriptions });
+				result.push({
+					key,
+					value,
+					description,
+					range: null,
+					keyRange: null,
+					valueRange: null,
+					descriptionRanges: [],
+					overrides,
+					type: prop.type,
+					enum: prop.enum,
+					enumDescriptions: prop.enumDescriptions,
+					tags: prop.tags
+				});
 			}
 		}
 		return result;
@@ -748,7 +761,8 @@ export class DefaultSettingsEditorModel extends AbstractSettingsModel implements
 			value: setting.value,
 			range: setting.range,
 			overrides: [],
-			overrideOf: setting.overrideOf
+			overrideOf: setting.overrideOf,
+			tags: setting.tags
 		};
 	}