Fix #457 Provide user setting to change defaults for Chart Viewer (#484)

- Added contribution to define the available chart types
- Use the setting when initializing the chart viewer

src/sql/parts/grid/views/query/chartViewer.component.ts

@@ -22,6 +22,8 @@ import { QueryEditor } from 'sql/parts/query/editor/queryEditor';
 import { DataType, ILineConfig } from 'sql/parts/dashboard/widgets/insights/views/charts/types/lineChart.component';
 import * as PathUtilities from 'sql/common/pathUtilities';
 import { IChartViewActionContext, CopyAction, CreateInsightAction, SaveImageAction } from 'sql/parts/grid/views/query/chartViewerActions';
+import * as WorkbenchUtils from 'sql/workbench/common/sqlWorkbenchUtils';
+import * as Constants from 'sql/parts/query/common/constants';
 
 /* Insights */
 import {
@@ -107,7 +109,7 @@ export class ChartViewerComponent implements OnInit, OnDestroy, IChartViewAction
 		this._initActionBar();
 
 		// Init chart type dropdown
-		this.chartTypesSelectBox = new SelectBox(insightRegistry.getAllIds(), 'horizontalBar');
+		this.chartTypesSelectBox = new SelectBox(insightRegistry.getAllIds(), this.getDefaultChartType());
 		this.chartTypesSelectBox.render(this.chartTypesElement.nativeElement);
 		this.chartTypesSelectBox.onDidSelect(selected => this.onChartChanged());
 		this._disposables.push(attachSelectBoxStyler(this.chartTypesSelectBox, this._bootstrapService.themeService));
@@ -133,6 +135,18 @@ export class ChartViewerComponent implements OnInit, OnDestroy, IChartViewAction
 		this._disposables.push(attachSelectBoxStyler(this.legendSelectBox, this._bootstrapService.themeService));
 	}
 
+	private getDefaultChartType(): string {
+		let defaultChartType = Constants.chartTypeHorizontalBar;
+		if (this._bootstrapService.configurationService) {
+			let chartSettings = WorkbenchUtils.getSqlConfigSection(this._bootstrapService.configurationService, 'chart');
+			// Only use the value if it's a known chart type. Ideally could query this dynamically but can't figure out how
+			if (chartSettings && Constants.allChartTypes.indexOf(chartSettings[Constants.defaultChartType]) > -1) {
+				defaultChartType = chartSettings[Constants.defaultChartType];
+			}
+		}
+		return defaultChartType;
+	}
+
 	private _initActionBar() {
 		this._createInsightAction = this._bootstrapService.instantiationService.createInstance(CreateInsightAction);
 		this._copyAction = this._bootstrapService.instantiationService.createInstance(CopyAction);
@@ -150,7 +164,7 @@ export class ChartViewerComponent implements OnInit, OnDestroy, IChartViewAction
 
 
 	public onChartChanged(): void {
-		if (['scatter', 'timeSeries'].some(item => item === this.chartTypesSelectBox.value)) {
+		if ([Constants.chartTypeScatter, Constants.chartTypeTimeSeries].some(item => item === this.chartTypesSelectBox.value)) {
 			this.dataType = DataType.Point;
 			this.dataDirection = DataDirection.Horizontal;
 		}

src/sql/parts/query/common/constants.ts

@@ -13,3 +13,14 @@ export const shortcutStart = 'shortcut';
 export const tabColorModeOff = 'off';
 export const tabColorModeBorder = 'border';
 export const tabColorModeFill = 'fill';
+
+export const defaultChartType = 'defaultChartType';
+export const chartTypeBar = 'bar';
+export const chartTypeDoughnut = 'doughnut';
+export const chartTypeHorizontalBar = 'horizontalBar';
+export const chartTypeLine = 'line';
+export const chartTypePie = 'pie';
+export const chartTypeScatter = 'scatter';
+export const chartTypeTimeSeries = 'timeSeries';
+export const allChartTypes = [chartTypeBar, chartTypeDoughnut, chartTypeHorizontalBar, chartTypeLine,
+	chartTypePie, chartTypeScatter, chartTypeTimeSeries];

src/sql/parts/query/common/query.contribution.ts

@@ -241,6 +241,11 @@ let registryProperties = {
 		'description': localize('sql.showBatchTime', '[Optional] Should execution time be shown for individual batches'),
 		'default': false
 	},
+	'sql.chart.defaultChartType': {
+		'enum': Constants.allChartTypes,
+		'default': Constants.chartTypeHorizontalBar,
+		'description': localize('defaultChartType', "[Optional] the default chart type to use when opening Chart Viewer from a Query Results")
+	},
 	'sql.tabColorMode': {
 		'type': 'string',
 		'enum': [Constants.tabColorModeOff, Constants.tabColorModeBorder, Constants.tabColorModeFill],

src/sql/workbench/common/sqlWorkbenchUtils.ts

@@ -7,7 +7,7 @@
 import ConnectionConstants = require('sql/parts/connection/common/constants');
 import { QueryInput } from 'sql/parts/query/common/queryInput';
 
-import { IWorkspaceConfigurationService } from 'vs/workbench/services/configuration/common/configuration';
+import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
 import { IEditorInput } from 'vs/platform/editor/common/editor';
 import URI from 'vs/base/common/uri';
 
@@ -20,12 +20,12 @@ import URI from 'vs/base/common/uri';
  * @param {string} sectionName
  * @returns {*}
  */
-export function getSqlConfigSection(workspaceConfigService: IWorkspaceConfigurationService, sectionName: string): any {
+export function getSqlConfigSection(workspaceConfigService: IConfigurationService, sectionName: string): any {
 	let config = workspaceConfigService.getConfiguration(ConnectionConstants.sqlConfigSectionName);
 	return config ? config[sectionName] : {};
 }
 
-export function getSqlConfigValue<T>(workspaceConfigService: IWorkspaceConfigurationService, configName: string): T {
+export function getSqlConfigValue<T>(workspaceConfigService: IConfigurationService, configName: string): T {
 	let config = workspaceConfigService.getConfiguration(ConnectionConstants.sqlConfigSectionName);
 	return config[configName];
 }