diff --git a/src/sql/base/browser/ui/propertiesContainer/propertiesContainer.component.html b/src/sql/base/browser/ui/propertiesContainer/propertiesContainer.component.html index 444dc3f0c2..ceb0a044f7 100644 --- a/src/sql/base/browser/ui/propertiesContainer/propertiesContainer.component.html +++ b/src/sql/base/browser/ui/propertiesContainer/propertiesContainer.component.html @@ -5,7 +5,7 @@ *--------------------------------------------------------------------------------------------*/ -->
- +
{{item.displayName}}
:
diff --git a/src/sql/base/browser/ui/propertiesContainer/propertiesContainer.component.ts b/src/sql/base/browser/ui/propertiesContainer/propertiesContainer.component.ts index f89241190c..578b43f7a6 100644 --- a/src/sql/base/browser/ui/propertiesContainer/propertiesContainer.component.ts +++ b/src/sql/base/browser/ui/propertiesContainer/propertiesContainer.component.ts @@ -2,8 +2,8 @@ * Copyright (c) Microsoft Corporation. All rights reserved. * Licensed under the Source EULA. See License.txt in the project root for license information. *--------------------------------------------------------------------------------------------*/ -import 'vs/css!./media/propertiesContainer'; +import 'vs/css!./media/propertiesContainer'; import { Component, Inject, forwardRef, ChangeDetectorRef, OnInit, ElementRef, OnDestroy } from '@angular/core'; import { EventType, addDisposableListener } from 'vs/base/browser/dom'; import { Disposable } from 'vs/base/common/lifecycle'; @@ -18,7 +18,7 @@ enum PropertyLayoutDirection { column = 'columnLayout' } -export interface DisplayProperty { +export interface PropertyItem { displayName: string; value: string; } @@ -35,8 +35,7 @@ export class PropertiesContainer extends Disposable implements OnInit, OnDestroy public gridDisplayLayout = GridDisplayLayout.twoColumns; public propertyLayout = PropertyLayoutDirection.row; public height: number; - - private _displayProperties: DisplayProperty[] = []; + private _propertyItems: PropertyItem[] = []; constructor( @Inject(forwardRef(() => ChangeDetectorRef)) private _changeRef: ChangeDetectorRef, @@ -46,7 +45,7 @@ export class PropertiesContainer extends Disposable implements OnInit, OnDestroy } ngOnInit() { - this._register(addDisposableListener(window, EventType.RESIZE, () => this.layoutDisplayProperties())); + this._register(addDisposableListener(window, EventType.RESIZE, () => this.layoutPropertyItems())); this._changeRef.detectChanges(); } @@ -54,7 +53,7 @@ export class PropertiesContainer extends Disposable implements OnInit, OnDestroy this.dispose(); } - private layoutDisplayProperties(): void { + private layoutPropertyItems(): void { // Reflow: // 2 columns w/ horizontal alignment : 1366px and above // 2 columns w/ vertical alignment : 1024 - 1365px @@ -62,26 +61,26 @@ export class PropertiesContainer extends Disposable implements OnInit, OnDestroy if (window.innerWidth >= 1366) { this.gridDisplayLayout = GridDisplayLayout.twoColumns; this.propertyLayout = PropertyLayoutDirection.row; - this.height = Math.ceil(this.displayProperties.length / 2) * horizontalPropertyHeight + collapseHeight; + this.height = Math.ceil(this.propertyItems.length / 2) * horizontalPropertyHeight + collapseHeight; } else if (window.innerWidth < 1366 && window.innerWidth >= 1024) { this.gridDisplayLayout = GridDisplayLayout.twoColumns; this.propertyLayout = PropertyLayoutDirection.column; - this.height = Math.ceil(this.displayProperties.length / 2) * verticalPropertyHeight + collapseHeight; + this.height = Math.ceil(this.propertyItems.length / 2) * verticalPropertyHeight + collapseHeight; } else if (window.innerWidth < 1024) { this.gridDisplayLayout = GridDisplayLayout.oneColumn; this.propertyLayout = PropertyLayoutDirection.column; - this.height = this.displayProperties.length * verticalPropertyHeight + collapseHeight; + this.height = this.propertyItems.length * verticalPropertyHeight + collapseHeight; } this._changeRef.detectChanges(); } - public set displayProperties(displayProperties: DisplayProperty[]) { - this._displayProperties = displayProperties; - this.layoutDisplayProperties(); + public set propertyItems(propertyItems: PropertyItem[]) { + this._propertyItems = propertyItems; + this.layoutPropertyItems(); } - public get displayProperties(): DisplayProperty[] { - return this._displayProperties; + public get propertyItems(): PropertyItem[] { + return this._propertyItems; } } diff --git a/src/sql/workbench/browser/modelComponents/propertiesContainer.component.ts b/src/sql/workbench/browser/modelComponents/propertiesContainer.component.ts index 3589bb07a3..aab4c3610f 100644 --- a/src/sql/workbench/browser/modelComponents/propertiesContainer.component.ts +++ b/src/sql/workbench/browser/modelComponents/propertiesContainer.component.ts @@ -11,7 +11,7 @@ import { import * as azdata from 'azdata'; import { ComponentBase } from 'sql/workbench/browser/modelComponents/componentBase'; import { IComponent, IComponentDescriptor, IModelStore } from 'sql/platform/dashboard/browser/interfaces'; -import { PropertiesContainer, DisplayProperty } from 'sql/base/browser/ui/propertiesContainer/propertiesContainer.component'; +import { PropertiesContainer, PropertyItem } from 'sql/base/browser/ui/propertiesContainer/propertiesContainer.component'; @Component({ selector: `modelview-properties-container`, @@ -41,15 +41,15 @@ export default class PropertiesContainerComponent extends ComponentBase implemen public setProperties(properties: { [key: string]: any; }): void { super.setProperties(properties); - this._propertiesContainer.displayProperties = this.displayProperties; + this._propertiesContainer.propertyItems = this.propertyItems; } - public get displayProperties(): DisplayProperty[] { - return this.getPropertyOrDefault((props) => props.displayProperties, []); + public get propertyItems(): PropertyItem[] { + return this.getPropertyOrDefault((props) => props.propertyItems, []); } - public set displayProperties(newValue: azdata.PropertiesContainerItem[]) { - this.setPropertyFromUI((props, value) => props.displayProperties = value, newValue); - this._propertiesContainer.displayProperties = newValue; + public set propertyItems(newValue: azdata.PropertiesContainerItem[]) { + this.setPropertyFromUI((props, value) => props.propertyItems = value, newValue); + this._propertiesContainer.propertyItems = newValue; } } diff --git a/src/sql/workbench/contrib/dashboard/browser/widgets/properties/propertiesWidget.component.ts b/src/sql/workbench/contrib/dashboard/browser/widgets/properties/propertiesWidget.component.ts index cf1ae2bcfb..e92e0069c9 100644 --- a/src/sql/workbench/contrib/dashboard/browser/widgets/properties/propertiesWidget.component.ts +++ b/src/sql/workbench/contrib/dashboard/browser/widgets/properties/propertiesWidget.component.ts @@ -15,7 +15,7 @@ import * as nls from 'vs/nls'; import { Registry } from 'vs/platform/registry/common/platform'; import { ILogService } from 'vs/platform/log/common/log'; import { subscriptionToDisposable } from 'sql/base/browser/lifecycle'; -import { PropertiesContainer, DisplayProperty } from 'sql/base/browser/ui/propertiesContainer/propertiesContainer.component'; +import { PropertiesContainer, PropertyItem } from 'sql/base/browser/ui/propertiesContainer/propertiesContainer.component'; import { convertSizeToNumber } from 'sql/base/browser/dom'; export interface PropertiesConfig { @@ -86,9 +86,9 @@ export class PropertiesWidgetComponent extends DashboardWidget implements IDashb this._connection = this._bootstrap.connectionManagementService.connectionInfo; this.setLoadingStatus(true); this._register(subscriptionToDisposable(this._bootstrap.adminService.databaseInfo.subscribe(databaseInfo => { - const displayProperties = this.parseProperties(databaseInfo); + const propertyItems = this.parseProperties(databaseInfo); if (this._inited) { - this._propertiesContainer.displayProperties = displayProperties; + this._propertiesContainer.propertyItems = propertyItems; this._changeRef.detectChanges(); } else { this.logService.info('Database properties successfully retrieved but component not initialized yet'); @@ -100,7 +100,7 @@ export class PropertiesWidgetComponent extends DashboardWidget implements IDashb }))); } - private parseProperties(databaseInfo?: DatabaseInfo): DisplayProperty[] { + private parseProperties(databaseInfo?: DatabaseInfo): PropertyItem[] { const provider = this._config.provider; let propertyArray: Array; diff --git a/src/sql/workbench/contrib/dashboard/test/electron-browser/propertiesWidget.component.test.ts b/src/sql/workbench/contrib/dashboard/test/electron-browser/propertiesWidget.component.test.ts index 9e88594e47..5ff757b440 100644 --- a/src/sql/workbench/contrib/dashboard/test/electron-browser/propertiesWidget.component.test.ts +++ b/src/sql/workbench/contrib/dashboard/test/electron-browser/propertiesWidget.component.test.ts @@ -16,7 +16,7 @@ import * as TypeMoq from 'typemoq'; import * as assert from 'assert'; import { mssqlProviderName } from 'sql/platform/connection/common/constants'; import { NullLogService } from 'vs/platform/log/common/log'; -import { DisplayProperty } from 'sql/base/browser/ui/propertiesContainer/propertiesContainer.component'; +import { PropertyItem } from 'sql/base/browser/ui/propertiesContainer/propertiesContainer.component'; class TestChangeDetectorRef extends ChangeDetectorRef { reattach(): void { @@ -104,10 +104,10 @@ suite('Dashboard Properties Widget Tests', () => { return new Promise(resolve => { // because config parsing is done async we need to put our asserts on the thread stack setImmediate(() => { - const displayProperties: DisplayProperty[] = (testComponent as any).parseProperties(databaseInfo); - assert.equal(displayProperties.length, 1); - assert.equal(displayProperties[0].displayName, 'Test'); - assert.equal(displayProperties[0].value, 'Test Property'); + const propertyItems: PropertyItem[] = (testComponent as any).parseProperties(databaseInfo); + assert.equal(propertyItems.length, 1); + assert.equal(propertyItems[0].displayName, 'Test'); + assert.equal(propertyItems[0].value, 'Test Property'); resolve(); }); });