Fix zoom reset behavior when adding new connection (#21040)

src/sql/base/browser/ui/breadcrumb/breadcrumb.component.ts

@@ -6,7 +6,7 @@
 import 'vs/css!./media/breadcrumb';
 
 import { Component, Inject, forwardRef, OnInit, OnDestroy, ChangeDetectorRef } from '@angular/core';
-import { Router } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 
 import { IBreadcrumbService, MenuItem } from './interfaces';
 
@@ -36,6 +36,7 @@ export class BreadcrumbComponent implements OnInit, OnDestroy {
 	constructor(
 		@Inject(forwardRef(() => IBreadcrumbService)) private _breadcrumbService: IBreadcrumbService,
 		@Inject(forwardRef(() => Router)) private _router: Router,
+		@Inject(forwardRef(() => ActivatedRoute)) private _activeRoute: ActivatedRoute,
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _changeRef: ChangeDetectorRef
 	) { }
 
@@ -53,6 +54,6 @@ export class BreadcrumbComponent implements OnInit, OnDestroy {
 	}
 
 	public route(link: any[]): Promise<boolean> {
-		return this._router.navigate(link);
+		return this._router.navigate(link, { relativeTo: this._activeRoute, skipLocationChange: true });
 	}
 }

src/sql/workbench/contrib/dashboard/browser/core/dashboardPage.component.ts

@@ -31,7 +31,7 @@ import * as nls from 'vs/nls';
 import * as objects from 'vs/base/common/objects';
 import { Event, Emitter } from 'vs/base/common/event';
 import { Action, IAction, SubmenuAction } from 'vs/base/common/actions';
-import { ConfigurationTarget, IConfigurationService } from 'vs/platform/configuration/common/configuration';
+import { ConfigurationTarget } from 'vs/platform/configuration/common/configuration';
 import Severity from 'vs/base/common/severity';
 import { INotificationService } from 'vs/platform/notification/common/notification';
 import { IContextKeyService, ContextKeyExpr, RawContextKey, IContextKey } from 'vs/platform/contextkey/common/contextkey';
@@ -54,11 +54,9 @@ import { LabeledMenuItemActionItem } from 'sql/platform/actions/browser/menuEntr
 import { DASHBOARD_BORDER, TOOLBAR_OVERFLOW_SHADOW } from 'sql/workbench/common/theme';
 import { IActionViewItem } from 'vs/base/browser/ui/actionbar/actionbar';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
-import { onUnexpectedError } from 'vs/base/common/errors';
 
 const dashboardRegistry = Registry.as<IDashboardRegistry>(DashboardExtensions.DashboardContributions);
 const homeTabGroupId = 'home';
-const zoomLevelConfiguration = 'window.zoomLevel';
 
 @Component({
 	selector: 'dashboard-page',
@@ -132,8 +130,7 @@ export abstract class DashboardPage extends AngularDisposable implements IConfig
 		@Inject(IContextKeyService) contextKeyService: IContextKeyService,
 		@Inject(IMenuService) private menuService: IMenuService,
 		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
-		@Inject(IInstantiationService) private instantiationService: IInstantiationService,
-		@Inject(IConfigurationService) private configurationService: IConfigurationService
+		@Inject(IInstantiationService) private instantiationService: IInstantiationService
 	) {
 		super();
 		this._tabName = DashboardPage.tabName.bindTo(contextKeyService);
@@ -175,16 +172,6 @@ export abstract class DashboardPage extends AngularDisposable implements IConfig
 		this._register(this.themeService.onDidColorThemeChange((event: IColorTheme) => {
 			this.updateTheme(event);
 		}));
-
-		// Workaround for issue: https://github.com/microsoft/azuredatastudio/issues/14128
-		// While the Angular loads the dashboard components, the Electron's zoom level will be reset without going through
-		// the setZoomLevel API in VSCode.
-		// Before a permanent fix is available, to workaround the issue, we can get the current zoom level and
-		// set it so that the electron's zoom level is consistent with the vscode configuration.
-		const currentZoom: number = this.configurationService.getValue(zoomLevelConfiguration);
-		this.configurationService.updateValue(zoomLevelConfiguration, currentZoom - 1).then(() => {
-			return this.configurationService.updateValue(zoomLevelConfiguration, currentZoom);
-		}).catch(onUnexpectedError);
 	}
 
 	private getContributedTasks(tabId: string): ITaskbarContent[] {

src/sql/workbench/contrib/dashboard/browser/dashboard.component.ts

@@ -3,7 +3,7 @@
  *  Licensed under the Source EULA. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 import { OnInit, Component, Inject, forwardRef, ElementRef, ViewChild } from '@angular/core';
-import { Router } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 
 import { CommonServiceInterface } from 'sql/workbench/services/bootstrap/browser/commonServiceInterface.service';
 import { IConnectionProfile } from 'sql/platform/connection/common/interfaces';
@@ -31,6 +31,7 @@ export class DashboardComponent extends AngularDisposable implements OnInit {
 	constructor(
 		@Inject(forwardRef(() => CommonServiceInterface)) private _bootstrapService: CommonServiceInterface,
 		@Inject(forwardRef(() => Router)) private _router: Router,
+		@Inject(forwardRef(() => ActivatedRoute)) private _activeRoute: ActivatedRoute,
 		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService
 	) {
 		super();
@@ -42,7 +43,7 @@ export class DashboardComponent extends AngularDisposable implements OnInit {
 		const profile: IConnectionProfile = this._bootstrapService.getOriginalConnectionProfile();
 		if (profile && (!profile.databaseName || Utils.isServerConnection(profile))) {
 			// Route to the server page as this is the default database
-			this._router.navigate(['server-dashboard']).catch(onUnexpectedError);
+			this._router.navigate(['server-dashboard'], { relativeTo: this._activeRoute, skipLocationChange: true }).catch(onUnexpectedError);
 		}
 	}
 

src/sql/workbench/contrib/dashboard/browser/pages/databaseDashboardPage.component.ts

@@ -22,7 +22,6 @@ import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
 import { IMenuService } from 'vs/platform/actions/common/actions';
 import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
-import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
 
 export class DatabaseDashboardPage extends DashboardPage implements OnInit {
 	protected propertiesWidget: WidgetConfig = {
@@ -53,10 +52,9 @@ export class DatabaseDashboardPage extends DashboardPage implements OnInit {
 		@Inject(IContextKeyService) contextKeyService: IContextKeyService,
 		@Inject(IMenuService) menuService: IMenuService,
 		@Inject(IWorkbenchThemeService) themeService: IWorkbenchThemeService,
-		@Inject(IInstantiationService) instantiationService: IInstantiationService,
-		@Inject(IConfigurationService) configurationService: IConfigurationService
+		@Inject(IInstantiationService) instantiationService: IInstantiationService
 	) {
-		super(dashboardService, el, _cd, notificationService, angularEventingService, logService, commandService, contextKeyService, menuService, themeService, instantiationService, configurationService);
+		super(dashboardService, el, _cd, notificationService, angularEventingService, logService, commandService, contextKeyService, menuService, themeService, instantiationService);
 		this._register(dashboardService.onUpdatePage(() => {
 			this.refresh(true);
 			this._cd.detectChanges();

src/sql/workbench/contrib/dashboard/browser/pages/serverDashboardPage.component.ts

@@ -24,7 +24,6 @@ import { IMenuService } from 'vs/platform/actions/common/actions';
 import { onUnexpectedError } from 'vs/base/common/errors';
 import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
-import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
 
 export class ServerDashboardPage extends DashboardPage implements OnInit {
 	protected propertiesWidget: WidgetConfig = {
@@ -56,10 +55,9 @@ export class ServerDashboardPage extends DashboardPage implements OnInit {
 		@Inject(IContextKeyService) contextKeyService: IContextKeyService,
 		@Inject(IMenuService) menuService: IMenuService,
 		@Inject(IWorkbenchThemeService) themeService: IWorkbenchThemeService,
-		@Inject(IInstantiationService) instantiationService: IInstantiationService,
-		@Inject(IConfigurationService) configurationService: IConfigurationService
+		@Inject(IInstantiationService) instantiationService: IInstantiationService
 	) {
-		super(dashboardService, el, _cd, notificationService, angularEventingService, logService, commandService, contextKeyService, menuService, themeService, instantiationService, configurationService);
+		super(dashboardService, el, _cd, notificationService, angularEventingService, logService, commandService, contextKeyService, menuService, themeService, instantiationService);
 
 		// special-case handling for MSSQL data provider
 		const connInfo = this.dashboardService.connectionManagementService.connectionInfo;

src/sql/workbench/contrib/dashboard/browser/services/dashboardServiceInterface.service.ts

@@ -5,7 +5,7 @@
 
 /* Node Modules */
 import { Injectable, Inject, forwardRef } from '@angular/core';
-import { Router } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 
 /* SQL imports */
 import { IDashboardComponentParams, IBootstrapParams } from 'sql/workbench/services/bootstrap/common/bootstrapParams';
@@ -69,6 +69,7 @@ export class DashboardServiceInterface extends CommonServiceInterface {
 		@Inject(IQueryManagementService) queryManagementService: IQueryManagementService,
 		@Inject(IBootstrapParams) params: IDashboardComponentParams,
 		@Inject(forwardRef(() => Router)) private _router: Router,
+		@Inject(forwardRef(() => ActivatedRoute)) private _activeRoute: ActivatedRoute,
 		@Inject(INotificationService) private _notificationService: INotificationService,
 		@Inject(IAngularEventingService) private angularEventingService: IAngularEventingService,
 		@Inject(IConfigurationService) private _configService: IConfigurationService
@@ -117,7 +118,7 @@ export class DashboardServiceInterface extends CommonServiceInterface {
 							if (this._router.url === '/database-dashboard') {
 								this._updatePage.fire();
 							} else {
-								this._router.navigate(['database-dashboard']).catch(onUnexpectedError);
+								this._router.navigate(['database-dashboard'], { relativeTo: this._activeRoute, skipLocationChange: true }).catch(onUnexpectedError);
 							}
 						} else {
 							this._notificationService.notify({
@@ -135,7 +136,7 @@ export class DashboardServiceInterface extends CommonServiceInterface {
 				);
 				break;
 			case AngularEventType.NAV_SERVER:
-				this._router.navigate(['server-dashboard']).catch(onUnexpectedError);
+				this._router.navigate(['server-dashboard'], { relativeTo: this._activeRoute, skipLocationChange: true }).catch(onUnexpectedError);
 				break;
 			case AngularEventType.DELETE_WIDGET:
 				this._onDeleteWidget.fire(event.payload.id);

src/sql/workbench/contrib/dashboard/browser/widgets/explorer/explorerTable.ts

@@ -3,7 +3,7 @@
  *  Licensed under the Source EULA. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-import { Router } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 import { ButtonColumn } from 'sql/base/browser/ui/table/plugins/buttonColumn.plugin';
 import { RowSelectionModel } from 'sql/base/browser/ui/table/plugins/rowSelectionModel.plugin';
 import { IconCellValue } from 'sql/base/browser/ui/table/plugins/tableColumn';
@@ -53,6 +53,7 @@ export class ExplorerTable extends Disposable {
 	private _propertiesToDisplay: ObjectListViewProperty[];
 
 	constructor(private parentElement: HTMLElement,
+		private readonly activeRoute: ActivatedRoute,
 		private readonly router: Router,
 		private readonly context: string,
 		private readonly bootStrapService: CommonServiceInterface,
@@ -150,7 +151,7 @@ export class ExplorerTable extends Disposable {
 	private handleDoubleClick(item: Slick.SlickData): void {
 		if (this.context === 'server') {
 			this.progressService.showWhile(this.bootStrapService.connectionManagementService.changeDatabase(item[NameProperty]).then(result => {
-				this.router.navigate(['database-dashboard']).catch(onUnexpectedError);
+				this.router.navigate(['database-dashboard'], { relativeTo: this.activeRoute, skipLocationChange: true }).catch(onUnexpectedError);
 			}));
 		}
 	}

src/sql/workbench/contrib/dashboard/browser/widgets/explorer/explorerWidget.component.ts

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 
 import { ChangeDetectorRef, Component, ElementRef, forwardRef, Inject, OnInit, ViewChild } from '@angular/core';
-import { Router } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 import { DatabaseInfo } from 'azdata';
 import { subscriptionToDisposable } from 'sql/base/browser/lifecycle';
 import { ICapabilitiesService } from 'sql/platform/capabilities/common/capabilitiesService';
@@ -46,6 +46,7 @@ export class ExplorerWidget extends DashboardWidget implements IDashboardWidget,
 
 	constructor(
 		@Inject(forwardRef(() => CommonServiceInterface)) private readonly _bootstrap: CommonServiceInterface,
+		@Inject(forwardRef(() => ActivatedRoute)) private _activeRoute: ActivatedRoute,
 		@Inject(forwardRef(() => Router)) private readonly _router: Router,
 		@Inject(WIDGET_CONFIG) _config: WidgetConfig,
 		@Inject(forwardRef(() => ElementRef)) private readonly _el: ElementRef,
@@ -81,6 +82,7 @@ export class ExplorerWidget extends DashboardWidget implements IDashboardWidget,
 		};
 		this._input = new InputBox(this._inputContainer.nativeElement, this.contextViewService, inputOptions);
 		this._table = new ExplorerTable(this._tableContainer.nativeElement,
+			this._activeRoute,
 			this._router,
 			this._config.context,
 			this._bootstrap,