Switch withProperties to be withProps (#16380)

* Transition to withProps in arc

* Transition to withProps inputbox

* Transition to withProps in checkbox

* Transition to withProps text

* Transition to withProps in declarative table

* Transition to withProps hyperlink

* Transition to withProps in button

* Transition to withProps radiobutton

* Transition to withProps in input

* Transition to withProps button

* Transition to withProps in text

* Transition to withProps image

* Transition to withProps declare table

* Transition to withProps in table

* Transition to withProps radio button

* Transition to withProps in image

* Transition to withProps radio button

* Transition to withProps in commit

* Transition to withProps div cont

* Transition to withProps in comp

* Transition to withProps radio card

* Transition to withProps in comp icon

* Transition to withProps card

* Transition to withProps list
This commit is contained in:
nasc17
2021-07-21 11:12:47 -07:00
committed by GitHub
parent b2a2a48ed6
commit b472539646
70 changed files with 274 additions and 274 deletions

View File

@@ -119,7 +119,7 @@ export class AddControllerDialog {
this.uiModelBuilder = view.modelBuilder;
this.urlInputBox = this.uiModelBuilder.inputBox()
.withProperties<azdata.InputBoxProperties>({
.withProps({
placeHolder: loc.url.toLocaleLowerCase(),
value: this.model.prefilledUrl
}).component();
@@ -130,19 +130,19 @@ export class AddControllerDialog {
}).component();
this.authDropdown.onValueChanged(e => this.onAuthChanged());
this.usernameInputBox = this.uiModelBuilder.inputBox()
.withProperties<azdata.InputBoxProperties>({
.withProps({
placeHolder: loc.usernameRequired.toLocaleLowerCase(),
value: this.model.prefilledUsername
}).component();
this.passwordInputBox = this.uiModelBuilder.inputBox()
.withProperties<azdata.InputBoxProperties>({
.withProps({
placeHolder: loc.password,
inputType: 'password',
value: this.model.prefilledPassword
})
.component();
this.rememberPwCheckBox = this.uiModelBuilder.checkBox()
.withProperties<azdata.CheckBoxProperties>({
.withProps({
label: loc.rememberPassword,
checked: this.model.prefilledRememberPassword
}).component();

View File

@@ -59,7 +59,7 @@ export class BdcDashboardOverviewPage extends BdcDashboardPage {
// ##############
const propertiesLabel = this.modelView.modelBuilder.text()
.withProperties<azdata.TextComponentProperties>({ value: loc.clusterProperties, CSSStyles: { 'margin-block-start': '0px', 'margin-block-end': '10px' } })
.withProps({ value: loc.clusterProperties, CSSStyles: { 'margin-block-start': '0px', 'margin-block-end': '10px' } })
.component();
rootContainer.addItem(propertiesLabel, { CSSStyles: { 'margin-top': '15px', 'padding-left': '10px', ...cssStyles.title } });
@@ -76,7 +76,7 @@ export class BdcDashboardOverviewPage extends BdcDashboardPage {
rootContainer.addItem(overviewHeaderContainer, { CSSStyles: { 'padding-left': '10px', 'padding-top': '15px' } });
const overviewLabel = this.modelView.modelBuilder.text()
.withProperties<azdata.TextComponentProperties>({
.withProps({
value: loc.clusterOverview,
CSSStyles: { ...cssStyles.text }
})
@@ -95,7 +95,7 @@ export class BdcDashboardOverviewPage extends BdcDashboardPage {
const overviewContainer = this.modelView.modelBuilder.flexContainer().withLayout({ flexFlow: 'column', width: '100%', height: '100%' }).component();
this.serviceStatusTable = this.modelView.modelBuilder.declarativeTable()
.withProperties<azdata.DeclarativeTableProperties>(
.withProps(
{
columns: [
{ // status icon
@@ -197,7 +197,7 @@ export class BdcDashboardOverviewPage extends BdcDashboardPage {
this.serviceStatusDisplayContainer.addItem(this.serviceStatusLoadingComponent, { flex: '0 0 auto', CSSStyles: { 'padding-left': '150px', width: '30px' } });
this.serviceStatusErrorMessage = this.modelView.modelBuilder.text().withProperties<azdata.TextComponentProperties>({ display: 'none', CSSStyles: { ...cssStyles.errorText } }).component();
this.serviceStatusErrorMessage = this.modelView.modelBuilder.text().withProps({ display: 'none', CSSStyles: { ...cssStyles.errorText } }).component();
overviewContainer.addItem(this.serviceStatusErrorMessage);
overviewContainer.addItem(this.serviceStatusDisplayContainer);
@@ -209,16 +209,16 @@ export class BdcDashboardOverviewPage extends BdcDashboardPage {
// #####################
const endpointsLabel = this.modelView.modelBuilder.text()
.withProperties<azdata.TextComponentProperties>({ value: loc.serviceEndpoints, CSSStyles: { 'margin-block-start': '20px', 'margin-block-end': '0px' } })
.withProps({ value: loc.serviceEndpoints, CSSStyles: { 'margin-block-start': '20px', 'margin-block-end': '0px' } })
.component();
rootContainer.addItem(endpointsLabel, { CSSStyles: { 'padding-left': '10px', ...cssStyles.title } });
this.endpointsErrorMessage = this.modelView.modelBuilder.text().withProperties<azdata.TextComponentProperties>({ display: 'none', CSSStyles: { ...cssStyles.errorText } }).component();
this.endpointsErrorMessage = this.modelView.modelBuilder.text().withProps({ display: 'none', CSSStyles: { ...cssStyles.errorText } }).component();
const endpointsContainer = this.modelView.modelBuilder.flexContainer().withLayout({ flexFlow: 'column', width: '100%', height: '100%' }).component();
this.endpointsTable = this.modelView.modelBuilder.declarativeTable()
.withProperties<azdata.DeclarativeTableProperties>(
.withProps(
{
columns: [
{ // service
@@ -326,14 +326,14 @@ export class BdcDashboardOverviewPage extends BdcDashboardPage {
if (bdcStatus.services) {
this.serviceStatusTable.data = bdcStatus.services.map(serviceStatus => {
const statusIconCell = this.modelView.modelBuilder.text()
.withProperties<azdata.TextComponentProperties>({
.withProps({
value: getHealthStatusIcon(serviceStatus.healthStatus),
ariaRole: 'img',
title: getHealthStatusDisplayText(serviceStatus.healthStatus),
CSSStyles: { 'user-select': 'none', ...cssStyles.text }
}).component();
const nameCell = this.modelView.modelBuilder.hyperlink()
.withProperties<azdata.HyperlinkComponentProperties>({
.withProps({
label: getServiceNameDisplayText(serviceStatus.serviceName),
url: '',
CSSStyles: { ...cssStyles.text }
@@ -370,7 +370,7 @@ export class BdcDashboardOverviewPage extends BdcDashboardPage {
endpoints.unshift(...sqlServerMasterEndpoints);
this.endpointsTable.dataValues = endpoints.map(e => {
const copyValueCell = this.modelView.modelBuilder.button().withProperties<azdata.ButtonProperties>({ title: loc.copy }).component();
const copyValueCell = this.modelView.modelBuilder.button().withProps({ title: loc.copy }).component();
copyValueCell.iconPath = IconPathHelper.copy;
copyValueCell.onDidClick(() => {
vscode.env.clipboard.writeText(e.endpoint);
@@ -426,7 +426,7 @@ export class BdcDashboardOverviewPage extends BdcDashboardPage {
function createEndpointComponent(modelBuilder: azdata.ModelBuilder, endpoint: EndpointModel, bdcModel: BdcDashboardModel, isHyperlink: boolean): azdata.HyperlinkComponent | azdata.TextComponent {
if (isHyperlink) {
return modelBuilder.hyperlink()
.withProperties<azdata.HyperlinkComponentProperties>({
.withProps({
label: endpoint.endpoint,
title: endpoint.endpoint,
url: endpoint.endpoint
@@ -435,7 +435,7 @@ function createEndpointComponent(modelBuilder: azdata.ModelBuilder, endpoint: En
}
else if (endpoint.name === Endpoint.sqlServerMaster) {
const endpointCell = modelBuilder.hyperlink()
.withProperties<azdata.HyperlinkComponentProperties>({
.withProps({
title: endpoint.endpoint,
label: endpoint.endpoint,
url: '',
@@ -458,7 +458,7 @@ function createEndpointComponent(modelBuilder: azdata.ModelBuilder, endpoint: En
}
else {
return modelBuilder.text()
.withProperties<azdata.TextComponentProperties>({
.withProps({
value: endpoint.endpoint,
title: endpoint.endpoint,
CSSStyles: { ...cssStyles.text }

View File

@@ -30,7 +30,7 @@ export abstract class BdcDashboardPage extends InitializingComponent {
protected createToolbarContainer(): azdata.ToolbarContainer {
// Refresh button
this._refreshButton = this.modelView.modelBuilder.button()
.withProperties<azdata.ButtonProperties>({
.withProps({
label: loc.refresh,
iconPath: IconPathHelper.refresh
}).component();
@@ -40,7 +40,7 @@ export abstract class BdcDashboardPage extends InitializingComponent {
});
const openTroubleshootNotebookButton = this.modelView.modelBuilder.button()
.withProperties<azdata.ButtonProperties>({
.withProps({
label: loc.troubleshoot,
iconPath: IconPathHelper.notebook
}).component();

View File

@@ -54,7 +54,7 @@ export class BdcDashboardResourceStatusPage extends BdcDashboardPage {
// Header label
const healthStatusHeaderLabel = this.modelView.modelBuilder.text()
.withProperties<azdata.TextComponentProperties>({
.withProps({
value: loc.healthStatusDetails,
CSSStyles: { 'margin-block-start': '0px', 'margin-block-end': '10px' }
})
@@ -72,7 +72,7 @@ export class BdcDashboardResourceStatusPage extends BdcDashboardPage {
healthStatusHeaderContainer.addItem(this.lastUpdatedLabel, { CSSStyles: { 'margin-left': '45px' } });
this.instanceHealthStatusTable = this.modelView.modelBuilder.declarativeTable()
.withProperties<azdata.DeclarativeTableProperties>(
.withProps(
{
columns: [
{ // status icon
@@ -168,7 +168,7 @@ export class BdcDashboardResourceStatusPage extends BdcDashboardPage {
// Title label
const endpointsLabel = this.modelView.modelBuilder.text()
.withProperties<azdata.TextComponentProperties>({ value: loc.metricsAndLogs, CSSStyles: { 'margin-block-start': '20px', 'margin-block-end': '0px' } })
.withProps({ value: loc.metricsAndLogs, CSSStyles: { 'margin-block-start': '20px', 'margin-block-end': '0px' } })
.component();
this.rootContainer.addItem(endpointsLabel, { CSSStyles: { 'padding-left': '10px', ...cssStyles.title } });
@@ -250,7 +250,7 @@ export class BdcDashboardResourceStatusPage extends BdcDashboardPage {
});
this.metricsAndLogsRowsTable = this.modelView.modelBuilder.declarativeTable()
.withProperties<azdata.DeclarativeTableProperties>(
.withProps(
{
columns: metricsAndLogsColumns,
data: this.createMetricsAndLogsRows(),
@@ -299,7 +299,7 @@ export class BdcDashboardResourceStatusPage extends BdcDashboardPage {
if (isNullOrUndefined(instanceStatus.dashboards) || isNullOrUndefined(instanceStatus.dashboards.nodeMetricsUrl)) {
row.push(this.modelView.modelBuilder.text().withProps({ value: loc.notAvailable, CSSStyles: { ...cssStyles.text } }).component());
} else {
row.push(this.modelView.modelBuilder.hyperlink().withProperties<azdata.HyperlinkComponentProperties>({
row.push(this.modelView.modelBuilder.hyperlink().withProps({
label: loc.view,
url: instanceStatus.dashboards.nodeMetricsUrl,
title: instanceStatus.dashboards.nodeMetricsUrl,
@@ -314,7 +314,7 @@ export class BdcDashboardResourceStatusPage extends BdcDashboardPage {
if (isNullOrUndefined(instanceStatus.dashboards) || isNullOrUndefined(instanceStatus.dashboards.sqlMetricsUrl)) {
row.push(this.modelView.modelBuilder.text().withProps({ value: loc.notAvailable, CSSStyles: { ...cssStyles.text } }).component());
} else {
row.push(this.modelView.modelBuilder.hyperlink().withProperties<azdata.HyperlinkComponentProperties>({
row.push(this.modelView.modelBuilder.hyperlink().withProps({
label: loc.view,
url: instanceStatus.dashboards.sqlMetricsUrl,
title: instanceStatus.dashboards.sqlMetricsUrl,
@@ -327,7 +327,7 @@ export class BdcDashboardResourceStatusPage extends BdcDashboardPage {
if (isNullOrUndefined(instanceStatus.dashboards) || isNullOrUndefined(instanceStatus.dashboards.logsUrl)) {
row.push(this.modelView.modelBuilder.text().withProps({ value: loc.notAvailable, CSSStyles: { ...cssStyles.text } }).component());
} else {
row.push(this.modelView.modelBuilder.hyperlink().withProperties<azdata.HyperlinkComponentProperties>({
row.push(this.modelView.modelBuilder.hyperlink().withProps({
label: loc.view,
url: instanceStatus.dashboards.logsUrl,
title: instanceStatus.dashboards.logsUrl,
@@ -340,7 +340,7 @@ export class BdcDashboardResourceStatusPage extends BdcDashboardPage {
private createHealthStatusRow(instanceStatus: InstanceStatusModel): any[] {
const statusIconCell = this.modelView.modelBuilder.text()
.withProperties<azdata.TextComponentProperties>({
.withProps({
value: getHealthStatusIcon(instanceStatus.healthStatus),
ariaRole: 'img',
title: getHealthStatusDisplayText(instanceStatus.healthStatus),

View File

@@ -133,7 +133,7 @@ export abstract class HdfsDialogBase<T extends HdfsDialogProperties, R> {
this.uiModelBuilder = view.modelBuilder;
this.urlInputBox = this.uiModelBuilder.inputBox()
.withProperties<azdata.InputBoxProperties>({
.withProps({
placeHolder: loc.url.toLocaleLowerCase(),
value: this.model.props.url,
enabled: false
@@ -146,12 +146,12 @@ export abstract class HdfsDialogBase<T extends HdfsDialogProperties, R> {
}).component();
this.authDropdown.onValueChanged(e => this.onAuthChanged());
this.usernameInputBox = this.uiModelBuilder.inputBox()
.withProperties<azdata.InputBoxProperties>({
.withProps({
placeHolder: loc.username.toLocaleLowerCase(),
value: this.model.props.username
}).component();
this.passwordInputBox = this.uiModelBuilder.inputBox()
.withProperties<azdata.InputBoxProperties>({
.withProps({
placeHolder: loc.password.toLocaleLowerCase(),
inputType: 'password',
value: this.model.props.password

View File

@@ -151,16 +151,16 @@ export class MountHdfsDialog extends HdfsDialogBase<MountHdfsProperties, void> {
let pathVal = this.model.props.hdfsPath;
pathVal = (!pathVal || pathVal === '/') ? newMountName : (pathVal + newMountName);
this.pathInputBox = this.uiModelBuilder.inputBox()
.withProperties<azdata.InputBoxProperties>({
.withProps({
value: pathVal
}).component();
this.remoteUriInputBox = this.uiModelBuilder.inputBox()
.withProperties<azdata.InputBoxProperties>({
.withProps({
value: this.model.props.remoteUri
})
.component();
this.credentialsInputBox = this.uiModelBuilder.inputBox()
.withProperties<azdata.InputBoxProperties>({
.withProps({
inputType: 'password',
value: this.model.props.credentials
})
@@ -224,7 +224,7 @@ export class RefreshMountDialog extends HdfsDialogBase<MountHdfsProperties, void
protected getMainSectionComponents(): (azdata.FormComponentGroup | azdata.FormComponent)[] {
this.pathInputBox = this.uiModelBuilder.inputBox()
.withProperties<azdata.InputBoxProperties>({
.withProps({
value: this.model.props.hdfsPath
}).component();
return [
@@ -305,7 +305,7 @@ export class DeleteMountDialog extends HdfsDialogBase<MountHdfsProperties, void>
protected getMainSectionComponents(): (azdata.FormComponentGroup | azdata.FormComponent)[] {
this.pathInputBox = this.uiModelBuilder.inputBox()
.withProperties<azdata.InputBoxProperties>({
.withProps({
value: this.model.props.hdfsPath
}).component();
return [