mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-27 17:23:21 -05:00
Add option to show and hide the action bar in the query results view (#21560)
* Show and hide action bar in results view * Updates show action bar setting description * Removes excess padding * Code review change
This commit is contained in:
@@ -62,6 +62,7 @@ const HEADER_HEIGHT = 26;
|
||||
const MIN_GRID_HEIGHT_ROWS = 8;
|
||||
const ESTIMATED_SCROLL_BAR_HEIGHT = 15;
|
||||
const BOTTOM_PADDING = 15;
|
||||
const NO_ACTIONBAR_ADDITIONAL_PADDING = 75;
|
||||
const ACTIONBAR_WIDTH = 36;
|
||||
|
||||
// minimum height needed to show the full actionbar
|
||||
@@ -478,18 +479,12 @@ export abstract class GridTableBase<T> extends Disposable implements IView {
|
||||
|
||||
// actionsOrientation controls the orientation (horizontal or vertical) of the actionBar
|
||||
private build(): void {
|
||||
let actionBarContainer = document.createElement('div');
|
||||
|
||||
// Create a horizontal actionbar if orientation passed in is HORIZONTAL
|
||||
if (this.options.actionOrientation === ActionsOrientation.HORIZONTAL) {
|
||||
actionBarContainer.className = 'grid-panel action-bar horizontal';
|
||||
this.container.appendChild(actionBarContainer);
|
||||
}
|
||||
|
||||
this.tableContainer = document.createElement('div');
|
||||
this.tableContainer.className = 'grid-panel';
|
||||
this.tableContainer.style.display = 'inline-block';
|
||||
this.tableContainer.style.width = `calc(100% - ${ACTIONBAR_WIDTH}px)`;
|
||||
|
||||
let actionBarWidth = this.showActionBar ? ACTIONBAR_WIDTH : 0;
|
||||
this.tableContainer.style.width = `calc(100% - ${actionBarWidth}px)`;
|
||||
|
||||
this.container.appendChild(this.tableContainer);
|
||||
|
||||
@@ -563,12 +558,7 @@ export abstract class GridTableBase<T> extends Disposable implements IView {
|
||||
if (this.styles) {
|
||||
this.table.style(this.styles);
|
||||
}
|
||||
// If the actionsOrientation passed in is "VERTICAL" (or no actionsOrientation is passed in at all), create a vertical actionBar
|
||||
if (this.options.actionOrientation === ActionsOrientation.VERTICAL) {
|
||||
actionBarContainer.className = 'grid-panel action-bar vertical';
|
||||
actionBarContainer.style.width = ACTIONBAR_WIDTH + 'px';
|
||||
this.container.appendChild(actionBarContainer);
|
||||
}
|
||||
|
||||
let context: IGridActionContext = {
|
||||
gridDataProvider: this.gridDataProvider,
|
||||
table: this.table,
|
||||
@@ -576,14 +566,15 @@ export abstract class GridTableBase<T> extends Disposable implements IView {
|
||||
batchId: this.resultSet.batchId,
|
||||
resultId: this.resultSet.id
|
||||
};
|
||||
this.actionBar = new ActionBar(actionBarContainer, {
|
||||
orientation: this.options.actionOrientation, context: context
|
||||
});
|
||||
this.initializeActionBar(context);
|
||||
|
||||
// update context before we run an action
|
||||
this.selectionModel.onSelectedRangesChanged.subscribe(e => {
|
||||
this.actionBar.context = this.generateContext();
|
||||
});
|
||||
|
||||
this.rebuildActionBar();
|
||||
|
||||
this.selectionModel.onSelectedRangesChanged.subscribe(async e => {
|
||||
if (this.state) {
|
||||
this.state.selection = this.selectionModel.getSelectedRanges();
|
||||
@@ -628,6 +619,26 @@ export abstract class GridTableBase<T> extends Disposable implements IView {
|
||||
}));
|
||||
}
|
||||
|
||||
private initializeActionBar(context: IGridActionContext): void {
|
||||
let actionBarContainer = document.createElement('div');
|
||||
|
||||
// Create a horizontal actionbar if orientation passed in is HORIZONTAL
|
||||
if (this.options.actionOrientation === ActionsOrientation.HORIZONTAL) {
|
||||
actionBarContainer.className = 'grid-panel action-bar horizontal';
|
||||
this.container.appendChild(actionBarContainer);
|
||||
}
|
||||
// if the actionsOrientation passed in is "VERTICAL" (or no actionsOrientation is passed in at all), create a vertical actionBar
|
||||
else {
|
||||
actionBarContainer.className = 'grid-panel action-bar vertical';
|
||||
actionBarContainer.style.width = (this.showActionBar ? ACTIONBAR_WIDTH : 0) + 'px';
|
||||
this.container.appendChild(actionBarContainer);
|
||||
}
|
||||
|
||||
this.actionBar = new ActionBar(actionBarContainer, {
|
||||
orientation: this.options.actionOrientation, context: context
|
||||
});
|
||||
}
|
||||
|
||||
private restoreScrollState() {
|
||||
if (this.state.scrollPositionX || this.state.scrollPositionY) {
|
||||
this.table.grid.scrollTo(this.state.scrollPositionY);
|
||||
@@ -810,11 +821,17 @@ export abstract class GridTableBase<T> extends Disposable implements IView {
|
||||
public get minimumSize(): number {
|
||||
// clamp between ensuring we can show the actionbar, while also making sure we don't take too much space
|
||||
// if there is only one table then allow a minimum size of ROW_HEIGHT
|
||||
return this.isOnlyTable ? ROW_HEIGHT : Math.max(Math.min(this.maxSize, MIN_GRID_HEIGHT), ACTIONBAR_HEIGHT + BOTTOM_PADDING);
|
||||
let actionBarHeight = this.showActionBar ? ACTIONBAR_HEIGHT : 0;
|
||||
let bottomPadding = this.showActionBar ? BOTTOM_PADDING : BOTTOM_PADDING + NO_ACTIONBAR_ADDITIONAL_PADDING;
|
||||
|
||||
return this.isOnlyTable ? ROW_HEIGHT : Math.max(Math.min(this.maxSize, MIN_GRID_HEIGHT), actionBarHeight + bottomPadding);
|
||||
}
|
||||
|
||||
public get maximumSize(): number {
|
||||
return Math.max(this.maxSize, ACTIONBAR_HEIGHT + BOTTOM_PADDING);
|
||||
let actionBarHeight = this.showActionBar ? ACTIONBAR_HEIGHT : 0;
|
||||
let bottomPadding = this.showActionBar ? BOTTOM_PADDING : BOTTOM_PADDING + NO_ACTIONBAR_ADDITIONAL_PADDING;
|
||||
|
||||
return Math.max(this.maxSize, actionBarHeight + bottomPadding);
|
||||
}
|
||||
|
||||
private loadData(offset: number, count: number): Thenable<T[]> {
|
||||
@@ -933,7 +950,7 @@ class GridTable<T> extends GridTableBase<T> {
|
||||
super(state, resultSet, {
|
||||
actionOrientation: ActionsOrientation.VERTICAL,
|
||||
inMemoryDataProcessing: true,
|
||||
showActionBar: true,
|
||||
showActionBar: configurationService.getValue<IQueryEditorConfiguration>('queryEditor').results.showActionBar,
|
||||
inMemoryDataCountThreshold: configurationService.getValue<IQueryEditorConfiguration>('queryEditor').results.inMemoryDataProcessingThreshold,
|
||||
}, contextMenuService, instantiationService, editorService, untitledEditorService, configurationService, queryModelService, themeService, contextViewService, notificationService, executionPlanService, accessibilityService, quickInputService);
|
||||
this._gridDataProvider = this.instantiationService.createInstance(QueryGridDataProvider, this._runner, resultSet.batchId, resultSet.id);
|
||||
|
||||
@@ -442,6 +442,11 @@ const queryEditorConfiguration: IConfigurationNode = {
|
||||
'description': localize('queryEditor.results.openAfterSave', "Whether to open the file in Azure Data Studio after the result is saved."),
|
||||
'default': true
|
||||
},
|
||||
'queryEditor.results.showActionBar': {
|
||||
'type': 'boolean',
|
||||
'description': localize('queryEditor.results.showActionBar', "Whether to show the action bar in the query results view"),
|
||||
'default': true
|
||||
},
|
||||
'queryEditor.messages.showBatchTime': {
|
||||
'type': 'boolean',
|
||||
'description': localize('queryEditor.messages.showBatchTime', "Should execution time be shown for individual batches"),
|
||||
|
||||
Reference in New Issue
Block a user