From ac476ba9732109287d7b1fa01d9bad077569a0d9 Mon Sep 17 00:00:00 2001 From: Alan Ren Date: Thu, 29 Oct 2020 22:46:11 -0700 Subject: [PATCH] make the tree theme aware and remove group color (#13143) * make the tree theme aware and remove group color * fix eslint error --- .../connection/browser/connectionBrowseTab.ts | 8 ++++++-- .../browser/asyncServerTreeRenderer.ts | 14 ++++++++++---- .../objectExplorer/browser/treeCreationUtils.ts | 4 ++-- 3 files changed, 18 insertions(+), 8 deletions(-) diff --git a/src/sql/workbench/services/connection/browser/connectionBrowseTab.ts b/src/sql/workbench/services/connection/browser/connectionBrowseTab.ts index 3382213d6e..cdc01240c2 100644 --- a/src/sql/workbench/services/connection/browser/connectionBrowseTab.ts +++ b/src/sql/workbench/services/connection/browser/connectionBrowseTab.ts @@ -134,7 +134,7 @@ export class ConnectionBrowserView extends Disposable implements IPanelView { new ProviderElementRenderer(), this.instantiationService.createInstance(TreeItemRenderer, this.treeLabels), this.instantiationService.createInstance(ConnectionProfileRenderer, true), - this.instantiationService.createInstance(ConnectionProfileGroupRenderer), + this.instantiationService.createInstance(ConnectionProfileGroupRenderer, { showColor: false }), this.instantiationService.createInstance(TreeNodeRenderer), new SavedConnectionsNodeRenderer() ]; @@ -215,6 +215,10 @@ export class ConnectionBrowserView extends Disposable implements IPanelView { this._register(this.capabilitiesService.onCapabilitiesRegistered(() => { this.updateSavedConnectionsNode(); })); + + this._register(this.themeService.onDidColorThemeChange(async () => { + await this.refresh(); + })); } private updateSavedConnectionsNode(): void { @@ -411,7 +415,7 @@ class DataSource implements IAsyncDataSource { } else if (element instanceof ConnectionProfile) { return false; } else if (element instanceof ConnectionProfileGroup) { - return element.hasChildren(); + return true; } else if (element instanceof TreeNode) { return element.children.length > 0; } else if (element instanceof SavedConnectionNode) { diff --git a/src/sql/workbench/services/objectExplorer/browser/asyncServerTreeRenderer.ts b/src/sql/workbench/services/objectExplorer/browser/asyncServerTreeRenderer.ts index 3323fea06e..0b8ab25b02 100644 --- a/src/sql/workbench/services/objectExplorer/browser/asyncServerTreeRenderer.ts +++ b/src/sql/workbench/services/objectExplorer/browser/asyncServerTreeRenderer.ts @@ -26,12 +26,17 @@ import { withNullAsUndefined } from 'vs/base/common/types'; const DefaultConnectionIconClass = 'server-page'; +export interface ConnectionProfileGroupDisplayOptions { + showColor: boolean; +} + class ConnectionProfileGroupTemplate extends Disposable { private _root: HTMLElement; private _nameContainer: HTMLElement; constructor( - container: HTMLElement + container: HTMLElement, + private _option: ConnectionProfileGroupDisplayOptions ) { super(); container.parentElement!.classList.add('server-group'); @@ -42,7 +47,7 @@ class ConnectionProfileGroupTemplate extends Disposable { set(element: ConnectionProfileGroup) { let rowElement = findParentElement(this._root, 'monaco-list-row'); - if (rowElement) { + if (this._option.showColor && rowElement) { rowElement.style.color = element.textColor; if (element.color) { rowElement.style.background = element.color; @@ -63,10 +68,11 @@ export class ConnectionProfileGroupRenderer implements ITreeRenderer, index: number, template: ConnectionProfileGroupTemplate): void { template.set(node.element); diff --git a/src/sql/workbench/services/objectExplorer/browser/treeCreationUtils.ts b/src/sql/workbench/services/objectExplorer/browser/treeCreationUtils.ts index 1c8ff151e3..db83de3c3e 100644 --- a/src/sql/workbench/services/objectExplorer/browser/treeCreationUtils.ts +++ b/src/sql/workbench/services/objectExplorer/browser/treeCreationUtils.ts @@ -33,7 +33,7 @@ export class TreeCreationUtils { public static createConnectionTree(treeContainer: HTMLElement, instantiationService: IInstantiationService, configurationService: IConfigurationService, ariaLabel: string, useController?: IController): Tree | AsyncServerTree { if (useAsyncServerTree(configurationService)) { const dataSource = instantiationService.createInstance(AsyncRecentConnectionTreeDataSource); - const connectionProfileGroupRender = instantiationService.createInstance(ConnectionProfileGroupRenderer); + const connectionProfileGroupRender = instantiationService.createInstance(ConnectionProfileGroupRenderer, { showColor: true }); const connectionProfileRenderer = instantiationService.createInstance(ConnectionProfileRenderer, true); const treeNodeRenderer = instantiationService.createInstance(TreeNodeRenderer); const dnd = instantiationService.createInstance(AsyncRecentConnectionsDragAndDrop); @@ -88,7 +88,7 @@ export class TreeCreationUtils { if (useAsyncServerTree(configurationService)) { const dataSource = instantiationService.createInstance(AsyncServerTreeDataSource); - const connectionProfileGroupRender = instantiationService.createInstance(ConnectionProfileGroupRenderer); + const connectionProfileGroupRender = instantiationService.createInstance(ConnectionProfileGroupRenderer, { showColor: true }); const connectionProfileRenderer = instantiationService.createInstance(ConnectionProfileRenderer, false); const treeNodeRenderer = instantiationService.createInstance(TreeNodeRenderer); const dnd = instantiationService.createInstance(AsyncServerTreeDragAndDrop);