Settings editor - Make TOC and settings tree share a model and filter on 'show modified only'

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

@@ -31,7 +31,7 @@ import { EditorOptions, IEditor } from 'vs/workbench/common/editor';
 import { SearchWidget, SettingsTarget, SettingsTargetsWidget } from 'vs/workbench/parts/preferences/browser/preferencesWidgets';
 import { tocData } from 'vs/workbench/parts/preferences/browser/settingsLayout';
 import { ISettingsEditorViewState, SearchResultIdx, SearchResultModel, SettingsAccessibilityProvider, SettingsDataSource, SettingsRenderer, SettingsTreeController, SettingsTreeElement, SettingsTreeFilter, SettingsTreeModel } from 'vs/workbench/parts/preferences/browser/settingsTree';
-import { getTOCElement, TOCDataSource, TOCRenderer } from 'vs/workbench/parts/preferences/browser/tocTree';
+import { TOCDataSource, TOCRenderer } from 'vs/workbench/parts/preferences/browser/tocTree';
 import { CONTEXT_SETTINGS_EDITOR, CONTEXT_SETTINGS_SEARCH_FOCUS, IPreferencesSearchService, ISearchProvider } from 'vs/workbench/parts/preferences/common/preferences';
 import { IPreferencesService, ISearchResult, ISettingsEditorModel } from 'vs/workbench/services/preferences/common/preferences';
 import { SettingsEditor2Input } from 'vs/workbench/services/preferences/common/preferencesEditorInput';
@@ -231,7 +231,8 @@ export class SettingsEditor2 extends BaseEditor {
 		this.tocTree = this.instantiationService.createInstance(WorkbenchTree, this.tocTreeContainer,
 			<ITreeConfiguration>{
 				dataSource: tocTreeDataSource,
-				renderer
+				renderer,
+				filter: this.instantiationService.createInstance(SettingsTreeFilter, this.viewState)
 			},
 			{
 				showLoading: false
@@ -328,6 +329,8 @@ export class SettingsEditor2 extends BaseEditor {
 	private onShowConfiguredOnlyClicked(): void {
 		this.viewState.showConfiguredOnly = this.showConfiguredSettingsOnlyCheckbox.checked;
 		this.refreshTreeAndMaintainFocus();
+		this.tocTree.refresh();
+		this.settingsTree.setScrollPosition(0);
 		this.expandAll(this.settingsTree);
 	}
 
@@ -427,9 +430,8 @@ export class SettingsEditor2 extends BaseEditor {
 					}
 
 					this.defaultSettingsEditorModel = model;
-					this.tocTree.setInput(getTOCElement(tocData));
-
 					this.settingsTreeModel = this.instantiationService.createInstance(SettingsTreeModel, this.viewState, tocData, this.defaultSettingsEditorModel.settingsGroups.slice(1));
+					this.tocTree.setInput(this.settingsTreeModel.root);
 					this.settingsTree.setInput(this.settingsTreeModel.root);
 				});
 		}

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

@@ -6,52 +6,24 @@
 import * as DOM from 'vs/base/browser/dom';
 import { TPromise } from 'vs/base/common/winjs.base';
 import { IDataSource, IRenderer, ITree } from 'vs/base/parts/tree/browser/tree';
-import { ISetting } from 'vs/workbench/services/preferences/common/preferences';
+import { SettingsTreeElement, SettingsTreeGroupElement } from 'vs/workbench/parts/preferences/browser/settingsTree';
 
 const $ = DOM.$;
 
-export interface ITOCEntry {
-	id: string;
-	label: string;
-	children?: ITOCEntry[];
-	settings?: (string | ISetting)[];
-}
-
-export class TOCElement {
-	id: string;
-	label: string;
-
-	parent?: TOCElement;
-	children?: TOCElement[];
-}
-
-export function getTOCElement(tocRoot: ITOCEntry, parent?: TOCElement): TOCElement {
-	const element = new TOCElement();
-	element.id = tocRoot.id;
-	element.label = tocRoot.label;
-
-	element.parent = parent;
-	if (tocRoot.children) {
-		element.children = tocRoot.children.map(child => getTOCElement(child, element));
-	}
-
-	return element;
-}
-
 export class TOCDataSource implements IDataSource {
-	getId(tree: ITree, element: TOCElement): string {
+	getId(tree: ITree, element: SettingsTreeGroupElement): string {
 		return element.id;
 	}
 
-	hasChildren(tree: ITree, element: TOCElement): boolean {
-		return !!(element.children && element.children.length);
+	hasChildren(tree: ITree, element: SettingsTreeElement): boolean {
+		return element instanceof SettingsTreeGroupElement && element.children && element.children.every(child => child instanceof SettingsTreeGroupElement);
 	}
 
-	getChildren(tree: ITree, element: TOCElement): TPromise<TOCElement[], any> {
-		return TPromise.as(<TOCElement[]>element.children);
+	getChildren(tree: ITree, element: SettingsTreeGroupElement): TPromise<SettingsTreeElement[], any> {
+		return TPromise.as(<SettingsTreeElement[]>element.children);
 	}
 
-	getParent(tree: ITree, element: TOCElement): TPromise<any, any> {
+	getParent(tree: ITree, element: SettingsTreeElement): TPromise<any, any> {
 		return TPromise.wrap(element.parent);
 	}
 
@@ -67,11 +39,11 @@ interface ITOCEntryTemplate {
 }
 
 export class TOCRenderer implements IRenderer {
-	getHeight(tree: ITree, element: TOCElement): number {
+	getHeight(tree: ITree, element: SettingsTreeElement): number {
 		return 22;
 	}
 
-	getTemplateId(tree: ITree, element: TOCElement): string {
+	getTemplateId(tree: ITree, element: SettingsTreeElement): string {
 		return TOC_ENTRY_TEMPLATE_ID;
 	}
 
@@ -81,7 +53,7 @@ export class TOCRenderer implements IRenderer {
 		};
 	}
 
-	renderElement(tree: ITree, element: TOCElement, templateId: string, template: ITOCEntryTemplate): void {
+	renderElement(tree: ITree, element: SettingsTreeGroupElement, templateId: string, template: ITOCEntryTemplate): void {
 		template.element.textContent = element.label;
 	}