From e783aeab66adbf0321ee2a08ed5f8da4eee0a054 Mon Sep 17 00:00:00 2001 From: Matt Irvine Date: Tue, 12 Mar 2019 14:03:37 -0700 Subject: [PATCH] Use max column width when auto-sizing columns (#4394) --- .../base/browser/ui/table/plugins/autoSizeColumns.plugin.ts | 4 ++-- src/sql/parts/grid/views/editData/editData.component.ts | 2 +- src/sql/parts/query/editor/gridPanel.ts | 2 +- src/sql/parts/query/editor/resultsGridContribution.ts | 5 +++++ 4 files changed, 9 insertions(+), 4 deletions(-) diff --git a/src/sql/base/browser/ui/table/plugins/autoSizeColumns.plugin.ts b/src/sql/base/browser/ui/table/plugins/autoSizeColumns.plugin.ts index e03ef056c1..9abba8a3a1 100644 --- a/src/sql/base/browser/ui/table/plugins/autoSizeColumns.plugin.ts +++ b/src/sql/base/browser/ui/table/plugins/autoSizeColumns.plugin.ts @@ -9,7 +9,7 @@ export interface IAutoColumnSizeOptions extends Slick.PluginOptions { } const defaultOptions: IAutoColumnSizeOptions = { - maxWidth: 200, + maxWidth: 212, autoSizeOnRender: false }; @@ -146,7 +146,7 @@ export class AutoColumnSize implements Slick.Plugin { let template = this.getMaxTextTemplate(texts, columnDef, colIndex, data, rowEl); let width = this.getTemplateWidth(rowEl, template); this.deleteRow(rowEl); - return width; + return width > this._options.maxWidth ? this._options.maxWidth : width; } private getTemplateWidth(rowEl: JQuery, template: JQuery | HTMLElement): number { diff --git a/src/sql/parts/grid/views/editData/editData.component.ts b/src/sql/parts/grid/views/editData/editData.component.ts index cab03f6c2e..3863e04d65 100644 --- a/src/sql/parts/grid/views/editData/editData.component.ts +++ b/src/sql/parts/grid/views/editData/editData.component.ts @@ -380,7 +380,7 @@ export class EditDataComponent extends GridParentComponent implements OnInit, On }; })) }; - self.plugins.push([rowNumberColumn, new AutoColumnSize(), new AdditionalKeyBindings()]); + self.plugins.push([rowNumberColumn, new AutoColumnSize({ maxWidth: this.configurationService.getValue('resultsGrid.maxColumnWidth') }), new AdditionalKeyBindings()]); self.dataSet = dataSet; // Create a dataSet to render without rows to reduce DOM size diff --git a/src/sql/parts/query/editor/gridPanel.ts b/src/sql/parts/query/editor/gridPanel.ts index 964e1dc093..c80d5cbe47 100644 --- a/src/sql/parts/query/editor/gridPanel.ts +++ b/src/sql/parts/query/editor/gridPanel.ts @@ -503,7 +503,7 @@ class GridTable extends Disposable implements IView { this.table = this._register(new Table(tableContainer, { dataProvider: this.dataProvider, columns: this.columns }, tableOptions)); this.table.setSelectionModel(this.selectionModel); this.table.registerPlugin(new MouseWheelSupport()); - this.table.registerPlugin(new AutoColumnSize({ autoSizeOnRender: !this.state.columnSizes && this.configurationService.getValue('resultsGrid.autoSizeColumns') })); + this.table.registerPlugin(new AutoColumnSize({ autoSizeOnRender: !this.state.columnSizes && this.configurationService.getValue('resultsGrid.autoSizeColumns'), maxWidth: this.configurationService.getValue('resultsGrid.maxColumnWidth') })); this.table.registerPlugin(copyHandler); this.table.registerPlugin(this.rowNumberColumn); this.table.registerPlugin(new AdditionalKeyBindings()); diff --git a/src/sql/parts/query/editor/resultsGridContribution.ts b/src/sql/parts/query/editor/resultsGridContribution.ts index 9809a1eef9..76ab34b62e 100644 --- a/src/sql/parts/query/editor/resultsGridContribution.ts +++ b/src/sql/parts/query/editor/resultsGridContribution.ts @@ -66,6 +66,11 @@ const resultsGridConfiguration: IConfigurationNode = { type: 'boolean', default: true, description: nls.localize('autoSizeColumns', "Auto size the columns width on inital results. Could have performance problems with large number of columns or large cells") + }, + 'resultsGrid.maxColumnWidth': { + type: 'number', + default: 212, + description: nls.localize('maxColumnWidth', "The maximum width in pixels for auto-sized columns") } } };