mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-02-16 10:58:30 -05:00
Add reusable settings dialog to QDS Reports (#24181)
* Initial changes * Add time, resource and chart component to config dialog * Add appropriate components of Configuration to Overall Resource Consumption Report and Top Resource Consuming Queries * Fix alignment and sizes of components * Address comments. Add group containers for individual components * Fix alignment * Add extra label and address comments * Address comments. Fix sequence of component addition * Update function definition to take in config information, instead of boolean to accomodate all future reports. And update doc comment
This commit is contained in:
@@ -8,10 +8,13 @@ import * as azdata from 'azdata';
|
||||
import * as path from 'path';
|
||||
import * as utils from '../common/utils';
|
||||
import * as constants from '../common/constants';
|
||||
import { ConfigureDialog } from '../settings/configureDialog';
|
||||
|
||||
export abstract class BaseQueryStoreReport {
|
||||
protected editor: azdata.workspace.ModelViewEditor;
|
||||
protected flexModel?: azdata.FlexContainer;
|
||||
protected configureDialog?: ConfigureDialog;
|
||||
protected configureButton?: azdata.ButtonComponent;
|
||||
|
||||
constructor(reportName: string, private reportTitle: string, protected resizeable: boolean, private extensionContext: vscode.ExtensionContext) {
|
||||
this.editor = azdata.workspace.createModelViewEditor(reportName, { retainContextWhenHidden: true, supportsSave: false }, reportName);
|
||||
@@ -103,7 +106,7 @@ export abstract class BaseQueryStoreReport {
|
||||
CSSStyles: { 'margin-top': '5px', 'margin-bottom': '5px', 'margin-right': '15px' }
|
||||
}).component();
|
||||
|
||||
const configureButton = view.modelBuilder.button().withProps({
|
||||
this.configureButton = view.modelBuilder.button().withProps({
|
||||
label: constants.configure,
|
||||
title: constants.configure,
|
||||
iconPath: {
|
||||
@@ -111,16 +114,14 @@ export abstract class BaseQueryStoreReport {
|
||||
dark: path.join(this.extensionContext.extensionPath, 'images', 'dark', 'gear.svg')
|
||||
}
|
||||
}).component();
|
||||
this.configureButton.enabled = true;
|
||||
|
||||
// TODO: enable after the configuration dialog is implemented
|
||||
configureButton.enabled = false;
|
||||
|
||||
configureButton.onDidClick(() => {
|
||||
// TODO: implement configuration dialog
|
||||
console.error('configuration dialog not implemented')
|
||||
this.configureButton.onDidClick(async () => {
|
||||
this.configureDialog = new ConfigureDialog();
|
||||
await this.configureButtonClick(this.configureDialog);
|
||||
});
|
||||
|
||||
await configureButton.updateCssStyles({ 'margin-top': '5px' });
|
||||
await this.configureButton.updateCssStyles({ 'margin-top': '5px' });
|
||||
|
||||
toolBar.addToolbarItems([
|
||||
{
|
||||
@@ -132,7 +133,7 @@ export abstract class BaseQueryStoreReport {
|
||||
toolbarSeparatorAfter: true
|
||||
},
|
||||
{
|
||||
component: configureButton
|
||||
component: this.configureButton
|
||||
}
|
||||
]);
|
||||
|
||||
@@ -140,5 +141,6 @@ export abstract class BaseQueryStoreReport {
|
||||
}
|
||||
|
||||
protected abstract createViews(_view: azdata.ModelView): Promise<azdata.FlexContainer[]>;
|
||||
protected abstract configureButtonClick(configureDialog: ConfigureDialog): Promise<void>;
|
||||
}
|
||||
|
||||
|
||||
@@ -8,6 +8,8 @@ import * as vscode from 'vscode';
|
||||
import * as constants from '../common/constants';
|
||||
import { BaseQueryStoreReport } from './baseQueryStoreReport';
|
||||
import { QueryStoreView } from './queryStoreView';
|
||||
import { ConfigureDialog } from '../settings/configureDialog';
|
||||
import { ConfigComponentsInfo } from '../common/utils';
|
||||
|
||||
|
||||
export class OverallResourceConsumption extends BaseQueryStoreReport {
|
||||
@@ -32,4 +34,9 @@ export class OverallResourceConsumption extends BaseQueryStoreReport {
|
||||
|
||||
return [durationContainer, executionCountContainer, cpuTimeContainer, logicalReadsContainer];
|
||||
}
|
||||
|
||||
protected override async configureButtonClick(configureDialog: ConfigureDialog): Promise<void> {
|
||||
const configComponentsInfo: ConfigComponentsInfo[] = [ConfigComponentsInfo.chartComponent, ConfigComponentsInfo.timeIntervalComponentOverallResource];
|
||||
await configureDialog.openDialog(configComponentsInfo);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -8,6 +8,8 @@ import * as vscode from 'vscode';
|
||||
import * as constants from '../common/constants';
|
||||
import { BaseQueryStoreReport } from './baseQueryStoreReport';
|
||||
import { QueryStoreView } from './queryStoreView';
|
||||
import { ConfigureDialog } from '../settings/configureDialog';
|
||||
import { ConfigComponentsInfo } from '../common/utils';
|
||||
|
||||
export class TopResourceConsumingQueries extends BaseQueryStoreReport {
|
||||
private queries: QueryStoreView;
|
||||
@@ -28,4 +30,10 @@ export class TopResourceConsumingQueries extends BaseQueryStoreReport {
|
||||
|
||||
return [queriesContainer, planSummaryContainer, planContainer];
|
||||
}
|
||||
|
||||
protected override async configureButtonClick(configureDialog: ConfigureDialog): Promise<void> {
|
||||
const configComponentsInfo: ConfigComponentsInfo[] = [ConfigComponentsInfo.consumptionCriteriaComponentTopResource, ConfigComponentsInfo.timeIntervalComponent, ConfigComponentsInfo.returnComponent,
|
||||
ConfigComponentsInfo.filterComponent];
|
||||
await configureDialog.openDialog(configComponentsInfo);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user