custom home tab sample (#16965)

* add sample for custom home tab

* revert unexpected changes

samples/sqlservices/package.json

@@ -51,6 +51,16 @@
       }
     ],
     "dashboard.tabs": [
+      {
+        "id": "sqlservices-home",
+        "isHomeTab": true,
+        "description": "",
+        "title": "Home",
+        "provider": "TESTPROVIDER",
+        "container": {
+          "modelview-container": null
+        }
+      },
       {
         "id": "sqlservices.tab",
         "title": "sqlservices",
@@ -59,6 +69,7 @@
           "dark": "./out/src/media/insights_inverse.svg"
         },
         "description": "Shows available services running in the SQL Server instance",
+        "provider": "*",
         "container": {
           "nav-section": [
             {
@@ -211,7 +222,8 @@
   "dependencies": {
     "fs-extra": "^5.0.0",
     "handlebars": "^4.7.7",
-    "vscode-nls": "^4.0.0"
+    "vscode-nls": "^4.0.0",
+    "uuid": "^8.3.0"
   },
   "devDependencies": {
     "@types/node": "^7.0.43",
@@ -227,7 +239,8 @@
     "tslint": "^3.14.0",
     "typescript": "^4.1.0-dev.20200824",
     "url-parse": "^1.5.0",
-    "vsce": "^1.57.1"
+    "vsce": "^1.57.1",
+    "@types/uuid": "^8.3.0"
   },
   "repository": {
     "type": "git",

samples/sqlservices/src/controllers/connectionProvider.ts

@@ -1,82 +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 * as azdata from 'azdata';
-import * as vscode from 'vscode';
-
-export class ConnectionProvider implements azdata.ConnectionProvider {
-	private onConnectionCompleteEmitter: vscode.EventEmitter<azdata.ConnectionInfoSummary> = new vscode.EventEmitter();
-	onConnectionComplete: vscode.Event<azdata.ConnectionInfoSummary> = this.onConnectionCompleteEmitter.event;
-
-	private onIntelliSenseCacheCompleteEmitter: vscode.EventEmitter<string> = new vscode.EventEmitter();
-	onIntelliSenseCacheComplete: vscode.Event<string> = this.onIntelliSenseCacheCompleteEmitter.event;
-
-	private onConnectionChangedEmitter: vscode.EventEmitter<azdata.ChangedConnectionInfo> = new vscode.EventEmitter();
-	onConnectionChanged: vscode.Event<azdata.ChangedConnectionInfo> = this.onConnectionChangedEmitter.event;
-
-	connect(connectionUri: string, connectionInfo: azdata.ConnectionInfo): Promise<boolean> {
-		this.onConnectionCompleteEmitter.fire({
-			connectionId: '',
-			ownerUri: connectionUri,
-			messages: '',
-			errorMessage: '',
-			errorNumber: 0,
-			connectionSummary: {
-				serverName: '',
-				userName: ''
-			},
-			serverInfo: {
-				serverReleaseVersion: 1,
-				engineEditionId: 1,
-				serverVersion: '1.0',
-				serverLevel: '',
-				serverEdition: '',
-				isCloud: true,
-				azureVersion: 1,
-				osVersion: '',
-				options: {}
-			}
-		});
-		return Promise.resolve(true);
-	}
-	disconnect(connectionUri: string): Promise<boolean> {
-		return Promise.resolve(true);
-	}
-	cancelConnect(connectionUri: string): Promise<boolean> {
-		return Promise.resolve(true);
-	}
-	listDatabases(connectionUri: string): Promise<azdata.ListDatabasesResult> {
-		return Promise.resolve({
-			databaseNames: ['master', 'msdb']
-		});
-	}
-	changeDatabase(connectionUri: string, newDatabase: string): Promise<boolean> {
-		return Promise.resolve(true);
-	}
-	rebuildIntelliSenseCache(connectionUri: string): Promise<void> {
-		return Promise.resolve();
-	}
-	getConnectionString(connectionUri: string, includePassword: boolean): Promise<string> {
-		return Promise.resolve('conn_string');
-	}
-	buildConnectionInfo?(connectionString: string): Promise<azdata.ConnectionInfo> {
-		return Promise.resolve({
-			options: []
-		});
-	}
-	registerOnConnectionComplete(handler: (connSummary: azdata.ConnectionInfoSummary) => any): void {
-		this.onConnectionComplete((e) => {
-			handler(e);
-		});
-	}
-	registerOnIntelliSenseCacheComplete(handler: (connectionUri: string) => any): void {
-		console.log('IntellisenseCache complete');
-	}
-	registerOnConnectionChanged(handler: (changedConnInfo: azdata.ChangedConnectionInfo) => any): void {
-		console.log('Connection changed');
-	}
-	handle?: number;
-	providerId: string = 'testProvider';
-
-}

samples/sqlservices/src/controllers/mainController.ts

@@ -51,6 +51,7 @@ export default class MainController implements vscode.Disposable {
 		const counterHtml = fs.readFileSync(path.join(__dirname, 'counter.html')).toString();
 		this.registerSqlServicesModelView();
 		this.registerSplitPanelModelView();
+		this.registerModelViewDashboardTab();
 
 		azdata.tasks.registerTask('sqlservices.clickTask', (profile) => {
 			vscode.window.showInformationMessage(`Clicked from profile ${profile.serverName}.${profile.databaseName}`);
@@ -739,6 +740,15 @@ export default class MainController implements vscode.Disposable {
 		});
 	}
 
+	private registerModelViewDashboardTab(): void {
+		azdata.ui.registerModelViewProvider('sqlservices-home', async (view) => {
+			const text = view.modelBuilder.text().withProps({
+				value: 'home tab content place holder'
+			}).component();
+			await view.initializeModel(text);
+		});
+	}
+
 	private registerSplitPanelModelView(): void {
 		azdata.ui.registerModelViewProvider('splitPanel', async (view) => {
 			let numPanels = 3;

samples/sqlservices/src/featureProviders/connectionProvider.ts

@@ -4,6 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as azdata from 'azdata';
 import * as vscode from 'vscode';
+import { v4 as uuid } from 'uuid';
 
 export const ProviderId: string = 'TESTPROVIDER';
 
@@ -23,7 +24,7 @@ export class ConnectionProvider implements azdata.ConnectionProvider {
 
 	connect(connectionUri: string, connectionInfo: azdata.ConnectionInfo): Promise<boolean> {
 		this.onConnectionCompleteEmitter.fire({
-			connectionId: '123',
+			connectionId: uuid(),
 			ownerUri: connectionUri,
 			messages: '',
 			errorMessage: '',

samples/sqlservices/yarn.lock

@@ -31,6 +31,11 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-7.10.9.tgz#4343e3b009f8cf5e1ed685e36097b74b4101e880"
   integrity sha512-usSpgoUsRtO5xNV5YEPU8PPnHisFx8u0rokj1BPVn/hDF7zwUDzVLiuKZM38B7z8V2111Fj6kd4rGtQFUZpNOw==
 
+"@types/uuid@^8.3.0":
+  version "8.3.1"
+  resolved "https://registry.yarnpkg.com/@types/uuid/-/uuid-8.3.1.tgz#1a32969cf8f0364b3d8c8af9cc3555b7805df14f"
+  integrity sha512-Y2mHTRAbqfFkpjldbkHGY8JIzRN6XqYRliG8/24FcHm2D2PwW24fl5xMRTVGdrb7iMrwCaIEbLWerGIkXuFWVg==
+
 "@types/vscode@^1.0.0":
   version "1.52.0"
   resolved "https://registry.yarnpkg.com/@types/vscode/-/vscode-1.52.0.tgz#61917968dd403932127fc4004a21fd8d69e4f61c"
@@ -3311,6 +3316,11 @@ util-deprecate@^1.0.1, util-deprecate@^1.0.2, util-deprecate@~1.0.1:
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
   integrity sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=
 
+uuid@^8.3.0:
+  version "8.3.2"
+  resolved "https://registry.yarnpkg.com/uuid/-/uuid-8.3.2.tgz#80d5b5ced271bb9af6c445f21a1a04c606cefbe2"
+  integrity sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==
+
 v8flags@^3.0.1:
   version "3.1.3"
   resolved "https://registry.yarnpkg.com/v8flags/-/v8flags-3.1.3.tgz#fc9dc23521ca20c5433f81cc4eb9b3033bb105d8"

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

@@ -165,9 +165,6 @@ export abstract class DashboardPage extends AngularDisposable implements IConfig
 			this.createTabs(tempWidgets);
 		}
 
-		this.showToolbar = true;
-		this.createToolbar(this.toolbarContainer.nativeElement, this.homeTabId);
-
 		this._register(this.themeService.onDidColorThemeChange((event: IColorTheme) => {
 			this.updateTheme(event);
 		}));