cosmetic changes (#13820)

* cosmetic changes

* moved limitLongName function to the utils
This commit is contained in:
Vladimir Chernov
2020-12-16 23:11:49 +03:00
committed by GitHub
parent 94a777b23f
commit 2abc11a1c7
5 changed files with 47 additions and 23 deletions

View File

@@ -7,7 +7,7 @@ import * as nls from 'vscode-nls';
const localize = nls.loadMessageBundle();
export const LocalizedStrings = {
SECTION_TITLE_API: localize('asmt.section.api.title', "API information"),
SECTION_TITLE_API: localize('asmt.section.api.title', "Info"),
API_VERSION: localize('asmt.apiversion', "API Version"),
DEFAULT_RULESET_VERSION: localize('asmt.rulesetversion', "Default Ruleset"),
SECTION_TITLE_SQL_SERVER: localize('asmt.section.instance.title', "SQL Server Instance Details"),

View File

@@ -9,7 +9,7 @@ import * as nls from 'vscode-nls';
import { SqlAssessmentTab } from './sqlAssessmentTab';
import { AssessmentEngine, AssessmentType } from '../engine';
import { promises as fs } from 'fs';
import { suggestReportFile } from '../utils';
import { suggestReportFile, limitLongName } from '../utils';
import { HTMLReportBuilder } from '../htmlReportGenerator';
import { AssessmentResultGrid } from '../assessmentResultGrid';
import { LocalizedStrings } from '../localized';
@@ -69,8 +69,7 @@ export class SqlAssessmentMainTab extends SqlAssessmentTab {
rootContainer.addItem(await this.createToolbar(view), {
flex: '0 0 auto', CSSStyles: {
'border-top': '3px solid rgb(221, 221, 221)',
'height': '32px'
'border-top': '3px solid rgb(221, 221, 221)'
}
});
@@ -96,8 +95,9 @@ export class SqlAssessmentMainTab extends SqlAssessmentTab {
];
}
private async createToolbar(view: azdata.ModelView): Promise<azdata.ToolbarContainer> {
private async createToolbar(view: azdata.ModelView): Promise<azdata.ToolbarContainer> {
const targetIconPath = this.engine.isServerConnection
? {
dark: this.extensionContext.asAbsolutePath('resources/dark/server.svg'),
@@ -107,18 +107,22 @@ export class SqlAssessmentMainTab extends SqlAssessmentTab {
light: this.extensionContext.asAbsolutePath('resources/light/database.svg')
};
const iconSize: number = 16;
const btnHeight: string = '26px';
const maxNameLength: number = 40;
const btnInvokeAssessment = view.modelBuilder.button()
.withProperties<azdata.ButtonProperties>({
label: this.invokeAssessmentLabel,
label: limitLongName(this.invokeAssessmentLabel, maxNameLength),
iconPath: targetIconPath,
iconHeight: iconSize,
iconWidth: iconSize
iconWidth: iconSize,
height: btnHeight
}).component();
const btnInvokeAssessmentLoading = view.modelBuilder.loadingComponent()
.withItem(btnInvokeAssessment)
.withProperties<azdata.LoadingComponentProperties>({
loadingText: this.invokeAssessmentLabel,
loadingText: limitLongName(this.invokeAssessmentLabel, maxNameLength),
showText: true,
loading: false
}).component();
@@ -142,15 +146,16 @@ export class SqlAssessmentMainTab extends SqlAssessmentTab {
const btnGetAssessmentItems = view.modelBuilder.button()
.withProperties<azdata.ButtonProperties>({
label: this.getItemsLabel,
label: limitLongName(this.getItemsLabel, maxNameLength),
iconPath: targetIconPath,
iconHeight: iconSize,
iconWidth: iconSize
iconWidth: iconSize,
height: btnHeight
}).component();
const btnGetAssessmentItemsLoading = view.modelBuilder.loadingComponent()
.withItem(btnGetAssessmentItems)
.withProperties<azdata.LoadingComponentProperties>({
loadingText: this.getItemsLabel,
loadingText: limitLongName(this.getItemsLabel, maxNameLength),
showText: true,
loading: false
}).component();
@@ -181,7 +186,8 @@ export class SqlAssessmentMainTab extends SqlAssessmentTab {
light: this.extensionContext.asAbsolutePath('resources/light/newquery.svg')
},
iconHeight: iconSize,
iconWidth: iconSize
iconWidth: iconSize,
height: btnHeight
}).component();
this.toDispose.push(this.btnExportAsScript.onDidClick(async () => {
this.engine.generateAssessmentScript();
@@ -196,7 +202,8 @@ export class SqlAssessmentMainTab extends SqlAssessmentTab {
light: this.extensionContext.asAbsolutePath('resources/light/book.svg')
},
iconHeight: iconSize,
iconWidth: iconSize
iconWidth: iconSize,
height: btnHeight
}).component();
this.toDispose.push(this.btnHTMLExport.onDidClick(async () => {
@@ -224,13 +231,15 @@ export class SqlAssessmentMainTab extends SqlAssessmentTab {
let btnViewSamples = view.modelBuilder.button()
.withProperties<azdata.ButtonProperties>({
label: localize('btnViewSamples', "View all rules and learn more on GitHub"),
label: localize('btnViewSamplesShort', "View all on GitHub"),
iconPath: {
dark: this.extensionContext.asAbsolutePath('resources/dark/configuredashboard_inverse.svg'),
light: this.extensionContext.asAbsolutePath('resources/light/configuredashboard.svg')
},
iconHeight: iconSize,
iconWidth: iconSize
iconWidth: iconSize,
height: btnHeight,
title: localize('btnViewSamples', "View all rules and learn more on GitHub"),
}).component();
this.toDispose.push(btnViewSamples.onDidClick(() => {
@@ -246,7 +255,8 @@ export class SqlAssessmentMainTab extends SqlAssessmentTab {
light: this.extensionContext.asAbsolutePath('resources/light/status_info.svg')
},
iconHeight: iconSize,
iconWidth: iconSize
iconWidth: iconSize,
height: btnHeight
}).component();
this.toDispose.push(btnAPIDetails.onDidClick(async () => {
let infoArray: azdata.PropertiesContainerItem[] = [];

View File

@@ -96,3 +96,12 @@ export function htmlEscape(html: string): string {
function escapeFileName(str: string): string {
return str.replace(/\*/g, '_');
}
export function limitLongName(name: string, maxLength: number): string {
if (name.length > maxLength) {
return name.slice(0, maxLength) + '...';
}
return name;
}