Sql-Assessment api info button (#13490)

This commit is contained in:
Vladimir Chernov
2020-11-20 20:53:34 +03:00
committed by GitHub
parent 749989cd0b
commit 2a81a0a70f
5 changed files with 68 additions and 83 deletions

View File

@@ -14,13 +14,15 @@ import { HTMLReportBuilder } from '../htmlReportGenerator';
import { AssessmentResultGrid } from '../assessmentResultGrid';
import { LocalizedStrings } from '../localized';
import { TelemetryReporter, SqlAssessmentTelemetryView, SqlTelemetryActions } from '../telemetry';
import { EOL } from 'os';
const localize = nls.loadMessageBundle();
export class SqlAssessmentMainTab extends SqlAssessmentTab {
private assessmentPropertiesContainer!: azdata.PropertiesContainerComponent;
private apiVersionPropItem: azdata.PropertiesContainerItem;
private defaultRulesetPropItem: azdata.PropertiesContainerItem;
private serverProps: azdata.PropertiesContainerItem[] = [];
private invokeAssessmentLabel: string = localize('invokeAssessmentLabelServer', "Invoke assessment");
private getItemsLabel: string = localize('getAssessmentItemsServer', "View applicable rules");
private btnExportAsScript!: azdata.ButtonComponent;
@@ -31,7 +33,6 @@ export class SqlAssessmentMainTab extends SqlAssessmentTab {
private resultGrid!: AssessmentResultGrid;
public constructor(extensionContext: vscode.ExtensionContext, engine: AssessmentEngine) {
super(extensionContext, LocalizedStrings.ASSESSMENT_TAB_NAME, 'MainTab', {
dark: extensionContext.asAbsolutePath('resources/dark/server.svg'),
@@ -64,12 +65,11 @@ export class SqlAssessmentMainTab extends SqlAssessmentTab {
height: '100%',
}).component();
await this.createServerProperties(view);
rootContainer.addItem(await this.createPropertiesSection(view), { flex: '0 0 auto' });
rootContainer.addItem(await this.createToolbar(view), {
flex: '0 0 auto', CSSStyles: {
'border-top': '3px solid rgb(221, 221, 221)',
'margin-top': '20px',
'height': '32px'
}
});
@@ -78,74 +78,22 @@ export class SqlAssessmentMainTab extends SqlAssessmentTab {
rootContainer.addItem(this.resultGrid.component, {
flex: '1 1 auto',
CSSStyles: {
'padding-bottom': '15px'
'padding-bottom': '10px'
}
});
return rootContainer;
}
private async createPropertiesSection(view: azdata.ModelView): Promise<azdata.FlexContainer> {
private async createServerProperties(view: azdata.ModelView): Promise<void> {
const serverInfo = await azdata.connection.getServerInfo(view.connection.connectionId);
const connectionProfile = await azdata.connection.getCurrentConnection();
const propertiesContainer = view.modelBuilder.flexContainer()
.withLayout({
flexFlow: 'row',
justifyContent: 'flex-start'
}).component();
const apiInformationContainer = view.modelBuilder.flexContainer()
.withLayout({
flexFlow: 'column',
alignContent: 'flex-start'
}).component();
apiInformationContainer.addItem(
view.modelBuilder.text().withProperties({ value: LocalizedStrings.SECTION_TITLE_API }).component(), {
CSSStyles: { 'font-size': 'larger' }
});
this.assessmentPropertiesContainer = view.modelBuilder.propertiesContainer()
.withProperties<azdata.PropertiesContainerComponentProperties>({
propertyItems: [
this.apiVersionPropItem,
this.defaultRulesetPropItem]
}).component();
apiInformationContainer.addItem(this.assessmentPropertiesContainer, {
CSSStyles: {
'margin-left': '20px'
}
});
const sqlServerContainer = view.modelBuilder.flexContainer()
.withLayout({
flexFlow: 'column',
alignContent: 'flex-start'
}).component();
sqlServerContainer.addItem(
view.modelBuilder.text().withProperties({ value: LocalizedStrings.SECTION_TITLE_SQL_SERVER }).component(), {
CSSStyles: { 'font-size': 'larger' }
});
sqlServerContainer.addItem(
view.modelBuilder.propertiesContainer()
.withProperties<azdata.PropertiesContainerComponentProperties>({
propertyItems: [
{ displayName: LocalizedStrings.SERVER_VERSION, value: serverInfo.serverVersion },
{ displayName: LocalizedStrings.SERVER_INSTANCENAME, value: connectionProfile.serverName },
{ displayName: LocalizedStrings.SERVER_EDITION, value: serverInfo.serverEdition },
{ displayName: LocalizedStrings.SERVER_OSVERSION, value: serverInfo.osVersion },
]
}).component(), {
CSSStyles: {
'margin-left': '20px'
}
});
propertiesContainer.addItem(apiInformationContainer, { flex: '0 0 300px', CSSStyles: { 'margin-left': '10px' } });
propertiesContainer.addItem(sqlServerContainer, { flex: '1 1 auto' });
return propertiesContainer;
this.serverProps = [
{ displayName: LocalizedStrings.SERVER_VERSION, value: serverInfo.serverVersion },
{ displayName: LocalizedStrings.SERVER_INSTANCENAME, value: connectionProfile.serverName },
{ displayName: LocalizedStrings.SERVER_EDITION, value: serverInfo.serverEdition },
{ displayName: LocalizedStrings.SERVER_OSVERSION, value: serverInfo.osVersion },
];
}
private async createToolbar(view: azdata.ModelView): Promise<azdata.ToolbarContainer> {
@@ -279,6 +227,42 @@ export class SqlAssessmentMainTab extends SqlAssessmentTab {
vscode.env.openExternal(vscode.Uri.parse('https://aka.ms/sql-assessment-api'));
}));
let btnAPIDetails = view.modelBuilder.button()
.withProperties<azdata.ButtonProperties>({
label: LocalizedStrings.SECTION_TITLE_API,
iconPath: {
dark: this.extensionContext.asAbsolutePath('resources/dark/status_info.svg'),
light: this.extensionContext.asAbsolutePath('resources/light/status_info.svg')
},
}).component();
this.toDispose.push(btnAPIDetails.onDidClick(async () => {
let infoArray: azdata.PropertiesContainerItem[] = [];
if (this.apiVersionPropItem.value) {
infoArray.push(this.apiVersionPropItem);
}
if (this.defaultRulesetPropItem.value) {
infoArray.push(this.defaultRulesetPropItem);
}
infoArray.push(...this.serverProps);
const message = localize('msgBoxAsmtInfo', "SQL Assessment Information") + EOL + EOL +
infoArray.map(v => `${v.displayName}: ${v.value}`).join(EOL);
const copy: vscode.MessageItem = { title: localize('msgBoxCopyBtn', "Copy") };
const ok: vscode.MessageItem = { isCloseAffordance: true, title: localize('ok', "OK") };
const response = await vscode.window.showInformationMessage(message, { modal: true }, copy, ok);
if (response === copy) {
await vscode.env.clipboard.writeText(message);
vscode.window.showInformationMessage(localize('msgBoxCopied', 'SQL Assessment Information copied'));
}
}));
btnGetAssessmentItemsLoading.loading = false;
btnInvokeAssessmentLoading.loading = false;
return view.modelBuilder.toolbarContainer()
.withToolbarItems(
[
@@ -286,7 +270,8 @@ export class SqlAssessmentMainTab extends SqlAssessmentTab {
{ component: btnGetAssessmentItemsLoading },
{ component: this.btnExportAsScript },
{ component: this.btnHTMLExport },
{ component: btnViewSamples }
{ component: btnViewSamples },
{ component: btnAPIDetails }
]
).component();
}
@@ -294,10 +279,6 @@ export class SqlAssessmentMainTab extends SqlAssessmentTab {
private displayResults(result: azdata.SqlAssessmentResult, assessmentType: AssessmentType): void {
this.apiVersionPropItem.value = result.apiVersion;
this.defaultRulesetPropItem.value = result.items?.length > 0 ? result.items[0].rulesetVersion : '';
this.assessmentPropertiesContainer.propertyItems = [
this.apiVersionPropItem,
this.defaultRulesetPropItem
];
this.resultGrid.displayResult(result, assessmentType);
this.btnExportAsScript.enabled = this.btnHTMLExport.enabled = assessmentType === AssessmentType.InvokeAssessment;

View File

@@ -88,7 +88,11 @@ export class SqlAssessmentHistoryTab extends SqlAssessmentTab {
this.resultGrid.displayResult(historyResult.result, AssessmentType.InvokeAssessment);
title.value = localize('asmt.history.resultsTitle', "Assessment Results from {0}", new Date(historyResult.dateUpdated).toLocaleString());
root.addItem(infoPanel, { flex: `0 0 50px` });
root.addItem(this.resultGrid.component);
root.addItem(this.resultGrid.component, {
flex: '1 1 auto', CSSStyles: {
'padding-bottom': '10px'
}
});
this.summaryTable.selectedRows = [];
}