ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-01-22 01:25:38 -05:00
Code Issues Packages Projects Releases Wiki Activity

use context view provider to show the filter (#15106)

Browse Source 
* use context view provider

* handle promise

* replace .then with .catch
This commit is contained in:
Alan Ren
2021-04-13 11:34:26 -07:00
committed by GitHub
parent 836da58c2c
commit 8d098c227d
9 changed files with 60 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
src/sql/base/browser/ui/table/plugins/headerFilter.plugin.ts
View File

@@ -11,6 +11,8 @@ import { addDisposableListener } from 'vs/base/browser/dom';
import { DisposableStore } from 'vs/base/common/lifecycle';
import { withNullAsUndefined } from 'vs/base/common/types';
import { IDisposableDataProvider } from 'sql/base/common/dataProvider';
import { IContextViewProvider } from 'vs/base/browser/ui/contextview/contextview';
import { onUnexpectedError } from 'vs/base/common/errors';
export type HeaderFilterCommands = 'sort-asc' | 'sort-desc';
export interface CommandEventArgs<T extends Slick.SlickData> {
@@ -39,7 +41,7 @@ export class HeaderFilter<T extends Slick.SlickData> {
private disposableStore = new DisposableStore();
private _enabled: boolean = true;
constructor() {
constructor(private readonly contextViewProvider: IContextViewProvider) {
}
public init(grid: Slick.Grid<T>): void {
@@ -77,10 +79,7 @@ export class HeaderFilter<T extends Slick.SlickData> {
}
private hideMenu() {
if (this.$menu) {
this.$menu.remove();
this.$menu = undefined;
}
this.contextViewProvider.hideContextView();
}
private handleHeaderCellRendered(e: Event, args: Slick.OnHeaderCellRenderedEventArgs<T>) {
@@ -172,8 +171,25 @@ export class HeaderFilter<T extends Slick.SlickData> {
});
}
private async showFilter(element: HTMLElement) {
const target = withNullAsUndefined(element);
private showFilter(filterButton: HTMLElement): void {
this.contextViewProvider.showContextView({
getAnchor: () => filterButton,
render: (container: HTMLElement) => {
this.renderFilter(filterButton, container).catch(onUnexpectedError);
return {
dispose: () => {
if (this.$menu) {
this.$menu.remove();
this.$menu = undefined;
}
}
};
}
});
}
private async renderFilter(filterButton: HTMLElement, container: HTMLElement) {
const target = withNullAsUndefined(filterButton);
const $menuButton = jQuery(target);
this.columnDef = $menuButton.data('column');
@@ -204,7 +220,7 @@ export class HeaderFilter<T extends Slick.SlickData> {
}
if (!this.$menu) {
this.$menu = jQuery('<div class="slick-header-menu">').appendTo(document.body);
this.$menu = jQuery('<div class="slick-header-menu">').appendTo(container);
}
this.$menu.empty();
@@ -265,16 +281,6 @@ export class HeaderFilter<T extends Slick.SlickData> {
jQuery(':checkbox', $filter).bind('click', (e) => {
this.workingFilters = this.changeWorkingFilter(filterItems, this.workingFilters, jQuery(e.target));
});
const offset = jQuery(target).offset();
const left = offset.left - this.$menu.width() + jQuery(target).width() - 8;
let menutop = offset.top + jQuery(target).height();
if (menutop + offset.top > jQuery(window).height()) {
menutop -= (this.$menu.height() + jQuery(target).height() + 8);
}
this.$menu.css('top', menutop).css('left', (left > 0 ? left : 0));
this.okButton.focus();
}

6
src/sql/workbench/browser/modelComponents/table.component.ts
View File

@@ -35,6 +35,7 @@ import { ILogService } from 'vs/platform/log/common/log';
import { TableCellClickEventArgs } from 'sql/base/browser/ui/table/plugins/tableColumn';
import { HyperlinkCellValue, HyperlinkColumn } from 'sql/base/browser/ui/table/plugins/hyperlinkColumn.plugin';
import { attachButtonStyler } from 'vs/platform/theme/common/styler';
import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
export enum ColumnSizingMode {
ForceFit = 0, // all columns will be sized to fit in viewable space, no horiz scroll bar
@@ -81,7 +82,8 @@ export default class TableComponent extends ComponentBase<azdata.TableComponentP
@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
@Inject(forwardRef(() => ElementRef)) el: ElementRef,
@Inject(ILogService) logService: ILogService) {
@Inject(ILogService) logService: ILogService,
@Inject(IContextViewService) private contextViewService: IContextViewService) {
super(changeRef, el, logService);
}
@@ -500,7 +502,7 @@ export default class TableComponent extends ComponentBase<azdata.TableComponentP
private registerFilterPlugin() {
const filterPlugin = new HeaderFilter<Slick.SlickData>();
const filterPlugin = new HeaderFilter<Slick.SlickData>(this.contextViewService);
this._register(attachButtonStyler(filterPlugin, this.themeService));
this._filterPlugin = filterPlugin;
this._filterPlugin.onFilterApplied.subscribe((e, args) => {

6
src/sql/workbench/contrib/assessment/browser/asmtResultsView.component.ts
View File

@@ -46,6 +46,7 @@ import { TelemetryView } from 'sql/platform/telemetry/common/telemetryKeys';
import { LocalizedStrings } from 'sql/workbench/contrib/assessment/common/strings';
import { ConnectionManagementInfo } from 'sql/platform/connection/common/connectionManagementInfo';
import { attachButtonStyler } from 'vs/platform/theme/common/styler';
import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
export const ASMTRESULTSVIEW_SELECTOR: string = 'asmt-results-view-component';
export const ROW_HEIGHT: number = 25;
@@ -141,7 +142,8 @@ export class AsmtResultsViewComponent extends TabChild implements IAssessmentCom
@Inject(IInstantiationService) private _instantiationService: IInstantiationService,
@Inject(IDashboardService) _dashboardService: IDashboardService,
@Inject(IAdsTelemetryService) private _telemetryService: IAdsTelemetryService,
@Inject(ILogService) protected _logService: ILogService
@Inject(ILogService) protected _logService: ILogService,
@Inject(IContextViewService) private _contextViewService: IContextViewService
) {
super();
let self = this;
@@ -316,7 +318,7 @@ export class AsmtResultsViewComponent extends TabChild implements IAssessmentCom
columnDef.formatter = (row, cell, value, columnDef, dataContext) => this.detailSelectionFormatter(row, cell, value, columnDef, dataContext as ExtendedItem<Slick.SlickData>);
columns.unshift(columnDef);
let filterPlugin = new HeaderFilter<Slick.SlickData>();
let filterPlugin = new HeaderFilter<Slick.SlickData>(this._contextViewService);
this._register(attachButtonStyler(filterPlugin, this._themeService));
this.filterPlugin = filterPlugin;
this.filterPlugin.onFilterApplied.subscribe((e, args) => {

7
src/sql/workbench/contrib/jobManagement/browser/jobsView.component.ts
View File

@@ -21,7 +21,7 @@ import { IJobManagementService } from 'sql/workbench/services/jobManagement/comm
import { JobManagementView, JobActionContext } from 'sql/workbench/contrib/jobManagement/browser/jobManagementView';
import { CommonServiceInterface } from 'sql/workbench/services/bootstrap/browser/commonServiceInterface.service';
import { ICommandService } from 'vs/platform/commands/common/commands';
import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
import { IContextMenuService, IContextViewService } from 'vs/platform/contextview/browser/contextView';
import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
import { IAction } from 'vs/base/common/actions';
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
@@ -107,7 +107,8 @@ export class JobsViewComponent extends JobManagementView implements OnInit, OnDe
@Inject(IContextMenuService) contextMenuService: IContextMenuService,
@Inject(IKeybindingService) keybindingService: IKeybindingService,
@Inject(IDashboardService) _dashboardService: IDashboardService,
@Inject(IAdsTelemetryService) private _telemetryService: IAdsTelemetryService
@Inject(IAdsTelemetryService) private _telemetryService: IAdsTelemetryService,
@Inject(IContextViewService) private _contextViewService: IContextViewService
) {
super(commonService, _dashboardService, contextMenuService, keybindingService, instantiationService, _agentViewComponent);
let jobCacheObjectMap = this._jobManagementService.jobCacheObjectMap;
@@ -181,7 +182,7 @@ export class JobsViewComponent extends JobManagementView implements OnInit, OnDe
});
this.rowDetail = rowDetail;
columns.unshift(this.rowDetail.getColumnDefinition());
let filterPlugin = new HeaderFilter<IItem>();
let filterPlugin = new HeaderFilter<IItem>(this._contextViewService);
this._register(attachButtonStyler(filterPlugin, this._themeService));
this.filterPlugin = filterPlugin;
jQuery(this._gridEl.nativeElement).empty();

8
src/sql/workbench/contrib/jobManagement/browser/notebooksView.component.ts
View File

@@ -21,7 +21,7 @@ import { IJobManagementService } from 'sql/workbench/services/jobManagement/comm
import { JobManagementView, JobActionContext } from 'sql/workbench/contrib/jobManagement/browser/jobManagementView';
import { CommonServiceInterface } from 'sql/workbench/services/bootstrap/browser/commonServiceInterface.service';
import { ICommandService } from 'vs/platform/commands/common/commands';
import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
import { IContextMenuService, IContextViewService } from 'vs/platform/contextview/browser/contextView';
import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
import { IAction } from 'vs/base/common/actions';
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
@@ -106,7 +106,9 @@ export class NotebooksViewComponent extends JobManagementView implements OnInit,
@Inject(IContextMenuService) contextMenuService: IContextMenuService,
@Inject(IKeybindingService) keybindingService: IKeybindingService,
@Inject(IDashboardService) _dashboardService: IDashboardService,
@Inject(IAdsTelemetryService) private _telemetryService: IAdsTelemetryService
@Inject(IAdsTelemetryService) private _telemetryService: IAdsTelemetryService,
@Inject(IContextViewService) private _contextViewService: IContextViewService,
) {
super(commonService, _dashboardService, contextMenuService, keybindingService, instantiationService, _agentViewComponent);
let notebookCacheObjectMap = this._jobManagementService.notebookCacheObjectMap;
@@ -180,7 +182,7 @@ export class NotebooksViewComponent extends JobManagementView implements OnInit,
});
this.rowDetail = rowDetail;
columns.unshift(this.rowDetail.getColumnDefinition());
let filterPlugin = new HeaderFilter<IItem>();
let filterPlugin = new HeaderFilter<IItem>(this._contextViewService);
this._register(attachButtonStyler(filterPlugin, this._themeService));
this.filterPlugin = filterPlugin;
jQuery(this._gridEl.nativeElement).empty();

7
src/sql/workbench/contrib/notebook/browser/outputs/gridOutput.component.ts
View File

@@ -7,7 +7,7 @@ import { OnInit, Component, Input, Inject, ViewChild, ElementRef } from '@angula
import * as azdata from 'azdata';
import { IGridDataProvider, getResultsString } from 'sql/workbench/services/query/common/gridDataProvider';
import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
import { IContextMenuService, IContextViewService } from 'vs/platform/contextview/browser/contextView';
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
import { IEditorService } from 'vs/workbench/services/editor/common/editorService';
import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
@@ -207,12 +207,13 @@ class DataResourceTable extends GridTableBase<any> {
@IUntitledTextEditorService untitledEditorService: IUntitledTextEditorService,
@IConfigurationService configurationService: IConfigurationService,
@IQueryModelService queryModelService: IQueryModelService,
@IThemeService themeService: IThemeService
@IThemeService themeService: IThemeService,
@IContextViewService contextViewService: IContextViewService
) {
super(state, createResultSet(source), {
actionOrientation: ActionsOrientation.HORIZONTAL,
inMemoryDataProcessing: true
}, contextMenuService, instantiationService, editorService, untitledEditorService, configurationService, queryModelService, themeService);
}, contextMenuService, instantiationService, editorService, untitledEditorService, configurationService, queryModelService, themeService, contextViewService);
this._gridDataProvider = this.instantiationService.createInstance(DataResourceDataProvider, source, this.resultSet, this.cellModel);
this._chart = this.instantiationService.createInstance(ChartView, false);

12
src/sql/workbench/contrib/query/browser/gridPanel.ts
View File

@@ -22,7 +22,7 @@ import { AdditionalKeyBindings } from 'sql/base/browser/ui/table/plugins/additio
import { CopyKeybind } from 'sql/base/browser/ui/table/plugins/copyKeybind.plugin';
import { GridTable as HighPerfGridTable } from 'sql/workbench/contrib/query/browser/highPerfGridPanel';
import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
import { IContextMenuService, IContextViewService } from 'vs/platform/contextview/browser/contextView';
import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
import { Emitter, Event } from 'vs/base/common/event';
@@ -385,7 +385,8 @@ export abstract class GridTableBase<T> extends Disposable implements IView {
@IUntitledTextEditorService private readonly untitledEditorService: IUntitledTextEditorService,
@IConfigurationService protected readonly configurationService: IConfigurationService,
@IQueryModelService private readonly queryModelService: IQueryModelService,
@IThemeService private readonly themeService: IThemeService
@IThemeService private readonly themeService: IThemeService,
@IContextViewService private readonly contextViewService: IContextViewService
) {
super();
let config = this.configurationService.getValue<{ rowHeight: number }>('resultsGrid');
@@ -527,7 +528,7 @@ export abstract class GridTableBase<T> extends Disposable implements IView {
this.table.rerenderGrid();
}));
if (this.enableFilteringFeature) {
this.filterPlugin = new HeaderFilter();
this.filterPlugin = new HeaderFilter(this.contextViewService);
attachButtonStyler(this.filterPlugin, this.themeService);
this.table.registerPlugin(this.filterPlugin);
}
@@ -861,13 +862,14 @@ class GridTable<T> extends GridTableBase<T> {
@IUntitledTextEditorService untitledEditorService: IUntitledTextEditorService,
@IConfigurationService configurationService: IConfigurationService,
@IQueryModelService queryModelService: IQueryModelService,
@IThemeService themeService: IThemeService
@IThemeService themeService: IThemeService,
@IContextViewService contextViewService: IContextViewService
) {
super(state, resultSet, {
actionOrientation: ActionsOrientation.VERTICAL,
inMemoryDataProcessing: true,
inMemoryDataCountThreshold: configurationService.getValue<IQueryEditorConfiguration>('queryEditor').results.inMemoryDataProcessingThreshold,
}, contextMenuService, instantiationService, editorService, untitledEditorService, configurationService, queryModelService, themeService);
}, contextMenuService, instantiationService, editorService, untitledEditorService, configurationService, queryModelService, themeService, contextViewService);
this._gridDataProvider = this.instantiationService.createInstance(QueryGridDataProvider, this._runner, resultSet.batchId, resultSet.id);
}

6
src/sql/workbench/contrib/resourceViewer/browser/resourceViewerTable.ts
View File

@@ -25,6 +25,7 @@ import { Emitter } from 'vs/base/common/event';
import { ContextMenuAnchor } from 'sql/workbench/contrib/resourceViewer/browser/resourceViewerEditor';
import { LoadingSpinnerPlugin } from 'sql/base/browser/ui/table/plugins/loadingSpinner.plugin';
import { attachButtonStyler } from 'vs/platform/theme/common/styler';
import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
export class ResourceViewerTable extends Disposable {
@@ -38,7 +39,8 @@ export class ResourceViewerTable extends Disposable {
@IWorkbenchThemeService private _themeService: IWorkbenchThemeService,
@IOpenerService private _openerService: IOpenerService,
@ICommandService private _commandService: ICommandService,
@INotificationService private _notificationService: INotificationService) {
@INotificationService private _notificationService: INotificationService,
@IContextViewService private _contextViewService: IContextViewService) {
super();
let filterFn = (data: Array<azdata.DataGridItem>): Array<azdata.DataGridItem> => {
return data.filter(item => this.filter(item));
@@ -54,7 +56,7 @@ export class ResourceViewerTable extends Disposable {
}));
this._resourceViewerTable.setSelectionModel(new RowSelectionModel());
let filterPlugin = new HeaderFilter<azdata.DataGridItem>();
let filterPlugin = new HeaderFilter<azdata.DataGridItem>(this._contextViewService);
this._register(attachButtonStyler(filterPlugin, this._themeService));
this._register(attachTableStyler(this._resourceViewerTable, this._themeService));
this._register(this._resourceViewerTable.onClick(this.onTableClick, this));

8
src/sql/workbench/test/electron-browser/modalComponents/table.component.test.ts
View File

@@ -19,7 +19,7 @@ suite('TableComponent Tests', () => {
['4', '5', '6']
];
let columns = ['c1', 'c2', 'c3'];
const tableComponent = new TableComponent(undefined, undefined, undefined, new NullLogService());
const tableComponent = new TableComponent(undefined, undefined, undefined, new NullLogService(), undefined);
let actual = tableComponent.transformData(data, columns);
let expected: { [key: string]: string }[] = [
@@ -39,7 +39,7 @@ suite('TableComponent Tests', () => {
test('Table transformData should return empty array given undefined rows', () => {
let data = undefined;
const tableComponent = new TableComponent(undefined, undefined, undefined, new NullLogService());
const tableComponent = new TableComponent(undefined, undefined, undefined, new NullLogService(), undefined);
let columns = ['c1', 'c2', 'c3'];
let actual = tableComponent.transformData(data, columns);
let expected: { [key: string]: string }[] = [];
@@ -52,7 +52,7 @@ suite('TableComponent Tests', () => {
['4', '5', '6']
];
let columns;
const tableComponent = new TableComponent(undefined, undefined, undefined, new NullLogService());
const tableComponent = new TableComponent(undefined, undefined, undefined, new NullLogService(), undefined);
let actual = tableComponent.transformData(data, columns);
let expected: { [key: string]: string }[] = [];
assert.deepEqual(actual, expected);
@@ -63,7 +63,7 @@ suite('TableComponent Tests', () => {
['1', '2'],
['4', '5']
];
const tableComponent = new TableComponent(undefined, undefined, undefined, new NullLogService());
const tableComponent = new TableComponent(undefined, undefined, undefined, new NullLogService(), undefined);
let columns = ['c1', 'c2', 'c3'];
let actual = tableComponent.transformData(data, columns);
let expected: { [key: string]: string }[] = [