Remove builder references from options dialog (#4774)

* remove more builder references; remove $ from declarations

* fix jquery references

* formatting

* fixing backup

* fix backup box

src/sql/parts/disasterRecovery/backup/backup.component.ts

@@ -11,7 +11,6 @@ import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox';
 import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox';
 import { ListBox } from 'sql/base/browser/ui/listBox/listBox';
 import { ModalFooterStyle } from 'sql/workbench/browser/modal/modal';
-import { CategoryView } from 'sql/workbench/browser/modal/optionsDialog';
 import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox';
 import { attachButtonStyler, attachListBoxStyler, attachInputBoxStyler, attachSelectBoxStyler, attachCheckboxStyler } from 'sql/platform/theme/common/styler';
 import { IConnectionProfile } from 'sql/platform/connection/common/interfaces';
@@ -19,20 +18,19 @@ import * as BackupConstants from 'sql/parts/disasterRecovery/backup/constants';
 import { IBackupService, TaskExecutionMode } from 'sql/platform/backup/common/backupService';
 import * as FileValidationConstants from 'sql/workbench/services/fileBrowser/common/fileValidationServiceConstants';
 import { IConnectionManagementService } from 'sql/platform/connection/common/connectionManagement';
-import { ScrollableSplitView } from 'sql/base/browser/ui/scrollableSplitview/scrollableSplitview';
 import { IFileBrowserDialogController } from 'sql/workbench/services/fileBrowser/common/fileBrowserDialogController';
 import { IBackupUiService } from 'sql/workbench/services/backup/common/backupUiService';
 
 import { MessageType } from 'vs/base/browser/ui/inputbox/inputBox';
 import * as lifecycle from 'vs/base/common/lifecycle';
 import { localize } from 'vs/nls';
-import * as DOM from 'vs/base/browser/dom';
 import * as types from 'vs/base/common/types';
 import * as strings from 'vs/base/common/strings';
 import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
 import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
 import { IClipboardService } from 'vs/platform/clipboard/common/clipboardService';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { ISelectOptionItem } from 'vs/base/browser/ui/selectBox/selectBox';
 
 export const BACKUP_SELECTOR: string = 'backup-component';
 
@@ -337,13 +335,6 @@ export class BackupComponent {
 	}
 
 	ngAfterViewInit() {
-		// Set category view for advanced options. This should be defined in ngAfterViewInit so that it correctly calculates the text height after data binding.
-		var splitview = new ScrollableSplitView(this.advancedOptionElement.nativeElement);
-		var advancedBodySize = DOM.getTotalHeight(this.advancedOptionBodyElement.nativeElement);
-		var categoryView = this.instantiationService.createInstance(CategoryView, this.advancedOptionBodyElement.nativeElement, advancedBodySize, { title: LocalizedStrings.ADVANCED_CONFIGURATION, id: LocalizedStrings.ADVANCED_CONFIGURATION, ariaHeaderLabel: LocalizedStrings.ADVANCED_CONFIGURATION });
-		splitview.addView(categoryView, 0);
-		splitview.layout(advancedBodySize + this._advancedHeaderSize);
-
 		this._backupUiService.onShowBackupDialog();
 	}
 
@@ -434,14 +425,14 @@ export class BackupComponent {
 
 			// Set backup path list
 			this.setDefaultBackupPaths();
-			var pathlist = [];
-			for (var i in this.backupPathTypePairs) {
-				pathlist.push(i);
+			let pathlist: ISelectOptionItem[] = [];
+			for (let i in this.backupPathTypePairs) {
+				pathlist.push({ text: i });
 			}
 			this.pathListBox.setOptions(pathlist, 0);
 
 			// Set encryption
-			var encryptorItems = this.populateEncryptorCombo();
+			let encryptorItems = this.populateEncryptorCombo();
 			this.encryptorSelectBox.setOptions(encryptorItems, 0);
 
 			if (encryptorItems.length === 0) {
@@ -729,9 +720,9 @@ export class BackupComponent {
 	}
 
 	private populateEncryptorCombo(): string[] {
-		var encryptorCombo = [];
+		let encryptorCombo = [];
 		this.backupEncryptors.forEach((encryptor) => {
-			var encryptorTypeStr = (encryptor.encryptorType === 0 ? BackupConstants.serverCertificate : BackupConstants.asymmetricKey);
+			let encryptorTypeStr = (encryptor.encryptorType === 0 ? BackupConstants.serverCertificate : BackupConstants.asymmetricKey);
 			encryptorCombo.push(encryptor.encryptorName + '(' + encryptorTypeStr + ')');
 		});
 		return encryptorCombo;
@@ -867,18 +858,18 @@ export class BackupComponent {
 	}
 
 	private createBackupInfo(): MssqlBackupInfo {
-		var backupPathArray = [];
-		for (var i in this.backupPathTypePairs) {
+		let backupPathArray = [];
+		for (let i in this.backupPathTypePairs) {
 			backupPathArray.push(i);
 		}
 
 		// get encryptor type and name
-		var encryptorName = '';
-		var encryptorType;
+		let encryptorName = '';
+		let encryptorType;
 
 		if (this.encryptCheckBox.checked && this.encryptorSelectBox.value !== '') {
-			var selectedEncryptor = this.encryptorSelectBox.value;
-			var encryptorTypeStr = selectedEncryptor.substring(selectedEncryptor.lastIndexOf('(') + 1, selectedEncryptor.lastIndexOf(')'));
+			let selectedEncryptor = this.encryptorSelectBox.value;
+			let encryptorTypeStr = selectedEncryptor.substring(selectedEncryptor.lastIndexOf('(') + 1, selectedEncryptor.lastIndexOf(')'));
 			encryptorType = (encryptorTypeStr === BackupConstants.serverCertificate ? 0 : 1);
 			encryptorName = selectedEncryptor.substring(0, selectedEncryptor.lastIndexOf('('));
 		}

src/sql/parts/grid/directives/mousedown.directive.ts

@@ -1,26 +0,0 @@
-/* --------------------------------------------------------------------------------------------
- * Copyright (c) Microsoft Corporation. All rights reserved.
- * Licensed under the Source EULA. See License.txt in the project root for license information.
- * ------------------------------------------------------------------------------------------ */
-import { ElementRef, Directive, Inject, Output, EventEmitter, forwardRef } from '@angular/core';
-
-@Directive({
-  selector: '[mousedown]'
-})
-export class MouseDownDirective {
-    @Output('mousedown') onMouseDown = new EventEmitter();
-
-    constructor(@Inject(forwardRef(() => ElementRef)) private _el: ElementRef) {
-        const self = this;
-        setTimeout(() => {
-            let $gridCanvas = $(this._el.nativeElement).find('.grid-canvas');
-            $gridCanvas.on('mousedown', () => {
-                self.onMouseDown.emit();
-            });
-            let jQueryCast: any = $;
-            let mouseDownFuncs: any[] = jQueryCast._data($gridCanvas[0], 'events')['mousedown'];
-            // reverse the event array so that our event fires first.
-            mouseDownFuncs.reverse();
-        });
-    }
-}

src/sql/parts/grid/directives/scroll.directive.ts

@@ -1,24 +0,0 @@
-/* --------------------------------------------------------------------------------------------
- * Copyright (c) Microsoft Corporation. All rights reserved.
- * Licensed under the Source EULA. See License.txt in the project root for license information.
- * ------------------------------------------------------------------------------------------ */
-import { ElementRef, Directive, Input, Output, EventEmitter, forwardRef,
-    Inject } from '@angular/core';
-import { Observable } from 'rxjs/Observable';
-
-@Directive({
-  selector: '[onScroll]'
-})
-export class ScrollDirective {
-    @Input() scrollEnabled: boolean = true;
-    @Output('onScroll') onScroll = new EventEmitter();
-
-    constructor(@Inject(forwardRef(() => ElementRef)) private _el: ElementRef) {
-        const self = this;
-        Observable.fromEvent(this._el.nativeElement, 'scroll').subscribe((event) => {
-            if (self.scrollEnabled) {
-                self.onScroll.emit(self._el.nativeElement.scrollTop);
-            }
-        });
-    }
-}

src/sql/parts/grid/views/editData/editData.component.ts

@@ -173,7 +173,7 @@ export class EditDataComponent extends GridParentComponent implements OnInit, On
 		this.onActiveCellChanged = this.onCellSelect;
 
 		this.onCellEditEnd = (event: Slick.OnCellChangeEventArgs<any>): void => {
-			if(self.currentEditCellValue !== event.item[event.cell]) {
+			if (self.currentEditCellValue !== event.item[event.cell]) {
 				self.currentCell.isDirty = true;
 			}
 			// Store the value that was set
@@ -541,12 +541,12 @@ export class EditDataComponent extends GridParentComponent implements OnInit, On
 		let grid = slick._grid;
 		if (dirtyState) {
 			// Change cell color
-			$(grid.getCellNode(row, column)).addClass('dirtyCell').removeClass('selected');
+			jQuery(grid.getCellNode(row, column)).addClass('dirtyCell').removeClass('selected');
 			if (this.dirtyCells.indexOf(column) === -1) {
 				this.dirtyCells.push(column);
 			}
 		} else {
-			$(grid.getCellNode(row, column)).removeClass('dirtyCell');
+			jQuery(grid.getCellNode(row, column)).removeClass('dirtyCell');
 			if (this.dirtyCells.indexOf(column) !== -1) {
 				this.dirtyCells.splice(this.dirtyCells.indexOf(column), 1);
 			}
@@ -559,17 +559,17 @@ export class EditDataComponent extends GridParentComponent implements OnInit, On
 		let grid = slick._grid;
 		if (dirtyState) {
 			// Change row header color
-			$(grid.getCellNode(row, 0)).addClass('dirtyRowHeader');
+			jQuery(grid.getCellNode(row, 0)).addClass('dirtyRowHeader');
 		} else {
-			$(grid.getCellNode(row, 0)).removeClass('dirtyRowHeader');
+			jQuery(grid.getCellNode(row, 0)).removeClass('dirtyRowHeader');
 		}
 	}
 
 	// Sets CSS to clean the entire grid of dirty state cells and rows
 	private setGridClean(): void {
 		// Remove dirty classes from the entire table
-		let allRows = $($('.grid-canvas').children());
-		let allCells = $(allRows.children());
+		let allRows = jQuery(jQuery('.grid-canvas').children());
+		let allCells = jQuery(allRows.children());
 		allCells.removeClass('dirtyCell').removeClass('dirtyRowHeader');
 		this.dirtyCells = [];
 	}
@@ -720,7 +720,7 @@ export class EditDataComponent extends GridParentComponent implements OnInit, On
 
 	private setCurrentCell(row: number, column: number) {
 		// Only update if we're actually changing cells
-		if(this.currentCell && (row !== this.currentCell.row || column !== this.currentCell.column)) {
+		if (this.currentCell && (row !== this.currentCell.row || column !== this.currentCell.column)) {
 			this.currentCell = {
 				row: row,
 				column: column,

src/sql/parts/grid/views/gridParentComponent.ts

@@ -519,7 +519,7 @@ export abstract class GridParentComponent {
 
 	private handleQueryPlanLink(cellRef: string, value: string): void {
 		const self = this;
-		$(cellRef).children('.xmlLink').click(function (): void {
+		jQuery(cellRef).children('.xmlLink').click(function (): void {
 			self.queryEditorService.newQueryPlanEditor(value);
 		});
 	}
@@ -527,7 +527,7 @@ export abstract class GridParentComponent {
 	private handleLink(cellRef: string, row: number, dataContext: JSON, colDef: any, linkType: string): void {
 		const self = this;
 		let value = self.getCellValueString(dataContext, colDef);
-		$(cellRef).children('.xmlLink').click(function (): void {
+		jQuery(cellRef).children('.xmlLink').click(function (): void {
 			self.dataService.openLink(value, colDef.name, linkType);
 		});
 	}

src/sql/parts/jobManagement/views/alertsView.component.ts

@@ -144,8 +144,8 @@ export class AlertsViewComponent extends JobManagementView implements OnInit, On
 			panelRows: 1
 		});
 		columns.unshift(rowDetail.getColumnDefinition());
-		$(this._gridEl.nativeElement).empty();
-		$(this.actionBarContainer.nativeElement).empty();
+		jQuery(this._gridEl.nativeElement).empty();
+		jQuery(this.actionBarContainer.nativeElement).empty();
 		this.initActionBar();
 
 		this._table = new Table(this._gridEl.nativeElement, { columns }, this.options);
@@ -230,4 +230,4 @@ export class AlertsViewComponent extends JobManagementView implements OnInit, On
 		let ownerUri: string = this._commonService.connectionManagementService.connectionInfo.ownerUri;
 		this._commandService.executeCommand('agent.openAlertDialog', ownerUri, null, null);
 	}
-}
+}

src/sql/parts/jobManagement/views/jobHistory.component.ts

@@ -17,8 +17,10 @@ import { RunJobAction, StopJobAction, EditJobAction, JobsRefreshAction } from 's
 import { JobCacheObject } from 'sql/platform/jobManagement/common/jobManagementService';
 import { JobManagementUtilities } from 'sql/platform/jobManagement/common/jobManagementUtilities';
 import { IJobManagementService } from 'sql/platform/jobManagement/common/interfaces';
-import { JobHistoryController, JobHistoryDataSource,
-	JobHistoryRenderer, JobHistoryFilter, JobHistoryModel, JobHistoryRow } from 'sql/parts/jobManagement/views/jobHistoryTree';
+import {
+	JobHistoryController, JobHistoryDataSource,
+	JobHistoryRenderer, JobHistoryFilter, JobHistoryModel, JobHistoryRow
+} from 'sql/parts/jobManagement/views/jobHistoryTree';
 import { JobStepsViewRow } from 'sql/parts/jobManagement/views/jobStepsViewTree';
 import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
 import { attachListStyler } from 'vs/platform/theme/common/styler';
@@ -210,7 +212,7 @@ export class JobHistoryComponent extends JobManagementView implements OnInit {
 				});
 				self._stepRows.unshift(new JobStepsViewRow());
 				self._stepRows[0].rowID = 'stepsColumn' + self._agentJobInfo.jobId;
-				self._stepRows[0].stepId = nls.localize('stepRow.stepID','Step ID');
+				self._stepRows[0].stepId = nls.localize('stepRow.stepID', 'Step ID');
 				self._stepRows[0].stepName = nls.localize('stepRow.stepName', 'Step Name');
 				self._stepRows[0].message = nls.localize('stepRow.message', 'Message');
 				this._showSteps = self._stepRows.length > 1;
@@ -251,7 +253,7 @@ export class JobHistoryComponent extends JobManagementView implements OnInit {
 	}
 
 	private toggleCollapse(): void {
-		let arrow: HTMLElement = $('.resultsViewCollapsible').get(0);
+		let arrow: HTMLElement = jQuery('.resultsViewCollapsible').get(0);
 		let checkbox: any = document.getElementById('accordion');
 		if (arrow.className === 'resultsViewCollapsible' && checkbox.checked === false) {
 			arrow.className = 'resultsViewCollapsible collapsed';
@@ -318,8 +320,8 @@ export class JobHistoryComponent extends JobManagementView implements OnInit {
 	}
 
 	public layout() {
-		let historyDetails = $('.overview-container').get(0);
-		let statusBar = $('.part.statusbar').get(0);
+		let historyDetails = jQuery('.overview-container').get(0);
+		let statusBar = jQuery('.part.statusbar').get(0);
 		if (historyDetails && statusBar) {
 			let historyBottom = historyDetails.getBoundingClientRect().bottom;
 			let statusTop = statusBar.getBoundingClientRect().top;

src/sql/parts/jobManagement/views/jobStepsView.component.ts

@@ -59,10 +59,10 @@ export class JobStepsViewComponent extends JobManagementView implements OnInit,
 	}
 
 	ngAfterContentChecked() {
-		$('.steps-tree .step-column-heading').closest('.monaco-tree-row').addClass('step-column-row');
+		jQuery('.steps-tree .step-column-heading').closest('.monaco-tree-row').addClass('step-column-row');
 		this.layout();
 		this._tree.onDidScroll(() => {
-			$('.steps-tree .step-column-heading').closest('.monaco-tree-row').addClass('step-column-row');
+			jQuery('.steps-tree .step-column-heading').closest('.monaco-tree-row').addClass('step-column-row');
 		});
 		this._treeController.onClick = (tree, element, event, origin = 'mouse') => {
 			const payload = { origin: origin };
@@ -80,12 +80,12 @@ export class JobStepsViewComponent extends JobManagementView implements OnInit,
 				tree.setFocus(element, payload);
 				tree.setSelection([element], payload);
 			}
-			$('.steps-tree .step-column-heading').closest('.monaco-tree-row').addClass('step-column-row');
+			jQuery('.steps-tree .step-column-heading').closest('.monaco-tree-row').addClass('step-column-row');
 			return true;
 		};
 		this._treeController.onKeyDown = (tree, event) => {
 			this._treeController.onKeyDownWrapper(tree, event);
-			$('.steps-tree .step-column-heading').closest('.monaco-tree-row').addClass('step-column-row');
+			jQuery('.steps-tree .step-column-heading').closest('.monaco-tree-row').addClass('step-column-row');
 			return true;
 		};
 		this._tree.onDidFocus(() => {
@@ -118,4 +118,3 @@ export class JobStepsViewComponent extends JobManagementView implements OnInit,
 		}
 	}
 }
-

src/sql/parts/jobManagement/views/jobsView.component.ts

@@ -134,8 +134,8 @@ export class JobsViewComponent extends JobManagementView implements OnInit, OnDe
 	}
 
 	public layout() {
-		let jobsViewToolbar = $('jobsview-component .agent-actionbar-container').get(0);
-		let statusBar = $('.part.statusbar').get(0);
+		let jobsViewToolbar = jQuery('jobsview-component .agent-actionbar-container').get(0);
+		let statusBar = jQuery('.part.statusbar').get(0);
 		if (jobsViewToolbar && statusBar) {
 			let toolbarBottom = jobsViewToolbar.getBoundingClientRect().bottom + ACTIONBAR_PADDING;
 			let statusTop = statusBar.getBoundingClientRect().top;
@@ -181,8 +181,8 @@ export class JobsViewComponent extends JobManagementView implements OnInit, OnDe
 		columns.unshift(this.rowDetail.getColumnDefinition());
 		let filterPlugin = new HeaderFilter({}, this._themeService);
 		this.filterPlugin = filterPlugin;
-		$(this._gridEl.nativeElement).empty();
-		$(this.actionBarContainer.nativeElement).empty();
+		jQuery(this._gridEl.nativeElement).empty();
+		jQuery(this.actionBarContainer.nativeElement).empty();
 		this.initActionBar();
 		this._table = new Table(this._gridEl.nativeElement, { columns }, options);
 		this._table.grid.setData(this.dataView, true);
@@ -353,7 +353,7 @@ export class JobsViewComponent extends JobManagementView implements OnInit, OnDe
 
 		this.expandJobs(start);
 		// tooltip for job name
-		$('.jobview-jobnamerow').hover(e => {
+		jQuery('.jobview-jobnamerow').hover(e => {
 			let currentTarget = e.currentTarget;
 			currentTarget.title = currentTarget.innerText;
 		});
@@ -362,9 +362,9 @@ export class JobsViewComponent extends JobManagementView implements OnInit, OnDe
 		this._table.grid.onColumnsResized.subscribe((e, data: any) => {
 			let nameWidth: number = data.grid.getColumns()[1].width;
 			// adjust job name when resized
-			$('#jobsDiv .jobview-grid .slick-cell.l1.r1 .jobview-jobnametext').css('width', `${nameWidth - 10}px`);
+			jQuery('#jobsDiv .jobview-grid .slick-cell.l1.r1 .jobview-jobnametext').css('width', `${nameWidth - 10}px`);
 			// adjust error message when resized
-			$('#jobsDiv .jobview-grid .slick-cell.l1.r1.error-row .jobview-jobnametext').css('width', '100%');
+			jQuery('#jobsDiv .jobview-grid .slick-cell.l1.r1.error-row .jobview-jobnametext').css('width', '100%');
 
 			// generate job charts again
 			self.jobs.forEach(job => {
@@ -376,11 +376,11 @@ export class JobsViewComponent extends JobManagementView implements OnInit, OnDe
 			});
 		});
 
-		$('#jobsDiv .jobview-grid .monaco-table .slick-viewport .grid-canvas .ui-widget-content.slick-row').hover((e1) =>
+		jQuery('#jobsDiv .jobview-grid .monaco-table .slick-viewport .grid-canvas .ui-widget-content.slick-row').hover((e1) =>
 			this.highlightErrorRows(e1), (e2) => this.hightlightNonErrorRows(e2));
 
 		this._table.grid.onScroll.subscribe((e) => {
-			$('#jobsDiv .jobview-grid .monaco-table .slick-viewport .grid-canvas .ui-widget-content.slick-row').hover((e1) =>
+			jQuery('#jobsDiv .jobview-grid .monaco-table .slick-viewport .grid-canvas .ui-widget-content.slick-row').hover((e1) =>
 				this.highlightErrorRows(e1), (e2) => this.hightlightNonErrorRows(e2));
 		});
 
@@ -393,15 +393,15 @@ export class JobsViewComponent extends JobManagementView implements OnInit, OnDe
 	private highlightErrorRows(e) {
 		// highlight the error row as well if a failing job row is hovered
 		if (e.currentTarget.children.item(0).classList.contains('job-with-error')) {
-			let target = $(e.currentTarget);
-			let targetChildren = $(e.currentTarget.children);
+			let target = jQuery(e.currentTarget);
+			let targetChildren = jQuery(e.currentTarget.children);
 			let siblings = target.nextAll().toArray();
 			let top = parseInt(target.css('top'), 10);
 			for (let i = 0; i < siblings.length; i++) {
 				let sibling = siblings[i];
-				let siblingTop = parseInt($(sibling).css('top'), 10);
+				let siblingTop = parseInt(jQuery(sibling).css('top'), 10);
 				if (siblingTop === top + ROW_HEIGHT) {
-					$(sibling.children).addClass('hovered');
+					jQuery(sibling.children).addClass('hovered');
 					sibling.onmouseenter = (e) => {
 						targetChildren.addClass('hovered');
 					};
@@ -417,14 +417,14 @@ export class JobsViewComponent extends JobManagementView implements OnInit, OnDe
 	private hightlightNonErrorRows(e) {
 		// switch back to original background
 		if (e.currentTarget.children.item(0).classList.contains('job-with-error')) {
-			let target = $(e.currentTarget);
+			let target = jQuery(e.currentTarget);
 			let siblings = target.nextAll().toArray();
 			let top = parseInt(target.css('top'), 10);
 			for (let i = 0; i < siblings.length; i++) {
 				let sibling = siblings[i];
-				let siblingTop = parseInt($(sibling).css('top'), 10);
+				let siblingTop = parseInt(jQuery(sibling).css('top'), 10);
 				if (siblingTop === top + ROW_HEIGHT) {
-					$(sibling.children).removeClass('hovered');
+					jQuery(sibling.children).removeClass('hovered');
 					break;
 				}
 			}
@@ -622,7 +622,7 @@ export class JobsViewComponent extends JobManagementView implements OnInit, OnDe
 		let chartHeights = this.getChartHeights(jobHistories);
 		let runCharts = [];
 		for (let i = 0; i < chartHeights.length; i++) {
-			let runGraph = $(`table.jobprevruns#${jobId} > tbody > tr > td > div.bar${i}`);
+			let runGraph = jQuery(`table.jobprevruns#${jobId} > tbody > tr > td > div.bar${i}`);
 			if (runGraph.length > 0) {
 				runGraph.css('height', chartHeights[i]);
 				let bgColor = jobHistories[i].runStatus === 0 ? 'red' : 'green';
@@ -842,9 +842,9 @@ export class JobsViewComponent extends JobManagementView implements OnInit, OnDe
 		let bgColor = theme.getColor(tableBackground);
 		let cellColor = theme.getColor(cellBackground);
 		let borderColor = theme.getColor(cellBorderColor);
-		let headerColumns = $('#agentViewDiv .slick-header-column');
-		let cells = $('.grid-canvas .ui-widget-content.slick-row .slick-cell');
-		let cellDetails = $('#jobsDiv .dynamic-cell-detail');
+		let headerColumns = jQuery('#agentViewDiv .slick-header-column');
+		let cells = jQuery('.grid-canvas .ui-widget-content.slick-row .slick-cell');
+		let cellDetails = jQuery('#jobsDiv .dynamic-cell-detail');
 		headerColumns.toArray().forEach(col => {
 			col.style.background = bgColor.toString();
 		});
@@ -952,4 +952,4 @@ export class JobsViewComponent extends JobManagementView implements OnInit, OnDe
 		let ownerUri: string = this._commonService.connectionManagementService.connectionInfo.ownerUri;
 		await this._commandService.executeCommand('agent.openJobDialog', ownerUri);
 	}
-}
+}

src/sql/parts/jobManagement/views/operatorsView.component.ts

@@ -145,8 +145,8 @@ export class OperatorsViewComponent extends JobManagementView implements OnInit,
 		});
 		columns.unshift(rowDetail.getColumnDefinition());
 
-		$(this._gridEl.nativeElement).empty();
-		$(this.actionBarContainer.nativeElement).empty();
+		jQuery(this._gridEl.nativeElement).empty();
+		jQuery(this.actionBarContainer.nativeElement).empty();
 		this.initActionBar();
 		this._table = new Table(this._gridEl.nativeElement, { columns }, this.options);
 		this._table.grid.setData(this.dataView, true);
@@ -226,4 +226,4 @@ export class OperatorsViewComponent extends JobManagementView implements OnInit,
 		let ownerUri: string = this._commonService.connectionManagementService.connectionInfo.ownerUri;
 		this._commandService.executeCommand('agent.openOperatorDialog', ownerUri);
 	}
-}
+}

src/sql/parts/jobManagement/views/proxiesView.component.ts

@@ -148,8 +148,8 @@ export class ProxiesViewComponent extends JobManagementView implements OnInit, O
 		});
 		columns.unshift(rowDetail.getColumnDefinition());
 
-		$(this._gridEl.nativeElement).empty();
-		$(this.actionBarContainer.nativeElement).empty();
+		jQuery(this._gridEl.nativeElement).empty();
+		jQuery(this.actionBarContainer.nativeElement).empty();
 		this.initActionBar();
 		this._table = new Table(this._gridEl.nativeElement, { columns }, this.options);
 		this._table.grid.setData(this.dataView, true);
@@ -234,4 +234,4 @@ export class ProxiesViewComponent extends JobManagementView implements OnInit, O
 			}
 		});
 	}
-}
+}