Settings editor - TOC 💄

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

@@ -253,7 +253,7 @@ export class SettingsEditor2 extends BaseEditor {
 					return false;
 				};
 
-				if (element && !isEqualOrParent(currentSelection, element)) {
+				if (element && (!currentSelection || !isEqualOrParent(currentSelection, element))) {
 					this.settingsTree.reveal(element, 0);
 					this.settingsTree.setSelection([element]);
 					this.settingsTree.setFocus(element);

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

@@ -3,7 +3,15 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-import { ITOCEntry } from 'vs/workbench/parts/preferences/browser/tocTree';
+import { ISetting } from 'vs/workbench/services/preferences/common/preferences';
+
+export interface ITOCEntry {
+	id: string;
+	label: string;
+
+	children?: ITOCEntry[];
+	settings?: (string | ISetting)[];
+}
 
 export const tocData: ITOCEntry = {
 	id: 'root',
@@ -124,7 +132,7 @@ export const tocData: ITOCEntry = {
 				},
 				{
 					id: 'features/scm',
-					label: 'Source Control Management',
+					label: 'SCM',
 					settings: ['scm.*']
 				},
 				{

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

@@ -3,18 +3,19 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-import * as arrays from 'vs/base/common/arrays';
 import * as DOM from 'vs/base/browser/dom';
 import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
 import { IMouseEvent } from 'vs/base/browser/mouseEvent';
 import { Button } from 'vs/base/browser/ui/button/button';
 import { InputBox } from 'vs/base/browser/ui/inputbox/inputBox';
 import { SelectBox } from 'vs/base/browser/ui/selectBox/selectBox';
+import * as arrays from 'vs/base/common/arrays';
 import { Color } from 'vs/base/common/color';
 import { Emitter, Event } from 'vs/base/common/event';
 import { KeyCode } from 'vs/base/common/keyCodes';
 import { dispose, IDisposable } from 'vs/base/common/lifecycle';
 import * as objects from 'vs/base/common/objects';
+import { escapeRegExpCharacters } from 'vs/base/common/strings';
 import URI from 'vs/base/common/uri';
 import { TPromise } from 'vs/base/common/winjs.base';
 import { IAccessibilityProvider, IDataSource, IFilter, IRenderer, ITree } from 'vs/base/parts/tree/browser/tree';
@@ -26,9 +27,8 @@ import { editorActiveLinkForeground, registerColor } from 'vs/platform/theme/com
 import { attachButtonStyler, attachInputBoxStyler, attachSelectBoxStyler } from 'vs/platform/theme/common/styler';
 import { ICssStyleCollector, ITheme, IThemeService, registerThemingParticipant } from 'vs/platform/theme/common/themeService';
 import { SettingsTarget } from 'vs/workbench/parts/preferences/browser/preferencesWidgets';
+import { ITOCEntry } from 'vs/workbench/parts/preferences/browser/settingsLayout';
 import { ISearchResult, ISetting, ISettingsGroup } from 'vs/workbench/services/preferences/common/preferences';
-import { ITOCEntry } from 'vs/workbench/parts/preferences/browser/tocTree';
-import { escapeRegExpCharacters } from 'vs/base/common/strings';
 
 const $ = DOM.$;
 
@@ -269,7 +269,7 @@ export class SettingsDataSource implements IDataSource {
 	}
 }
 
-export function settingKeyToDisplayFormat(key: string, groupId: string): { category: string, label: string } {
+export function settingKeyToDisplayFormat(key: string, groupId = ''): { category: string, label: string } {
 	groupId = groupId.replace(/\//g, '.');
 
 	let label = key

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

@@ -38,4 +38,48 @@ suite('SettingsTree', () => {
 				label: 'Foo'
 			});
 	});
+
+	test('settingKeyToDisplayFormat - with category', () => {
+		assert.deepEqual(
+			settingKeyToDisplayFormat('foo.bar', 'foo'),
+			{
+				category: '',
+				label: 'Bar'
+			});
+
+		assert.deepEqual(
+			settingKeyToDisplayFormat('foo.bar.etc', 'foo'),
+			{
+				category: 'Bar',
+				label: 'Etc'
+			});
+
+		assert.deepEqual(
+			settingKeyToDisplayFormat('fooBar.etcSomething', 'foo'),
+			{
+				category: 'Foo Bar',
+				label: 'Etc Something'
+			});
+
+		assert.deepEqual(
+			settingKeyToDisplayFormat('foo.bar.etc', 'foo.bar'),
+			{
+				category: '',
+				label: 'Etc'
+			});
+
+		assert.deepEqual(
+			settingKeyToDisplayFormat('foo.bar.etc', 'something.foo'),
+			{
+				category: 'Bar',
+				label: 'Etc'
+			});
+
+		assert.deepEqual(
+			settingKeyToDisplayFormat('bar.etc', 'something.bar'),
+			{
+				category: '',
+				label: 'Etc'
+			});
+	});
 });
\ No newline at end of file