MIAA Dashboard Updates (#10960)

* Add database info to MIAA dashboard

* hook up open in azure button

* Only use plural text

extensions/arc/src/localizedConstants.ts

@@ -21,6 +21,7 @@ export const properties = localize('arc.properties', "Properties");
 export const settings = localize('arc.settings', "Settings");
 export const security = localize('arc.security', "Security");
 export const computeAndStorage = localize('arc.computeAndStorage', "Compute + Storage");
+export const compute = localize('arc.compute', "Compute");
 export const backup = localize('arc.backup', "Backup");
 export const newSupportRequest = localize('arc.newSupportRequest', "New support request");
 export const diagnoseAndSolveProblems = localize('arc.diagnoseAndSolveProblems', "Diagnose and solve problems");
@@ -96,7 +97,14 @@ export function copiedToClipboard(name: string): string { return localize('arc.c
 export function refreshFailed(error: any): string { return localize('arc.refreshFailed', "Refresh failed. {0}", (error instanceof Error ? error.message : error)); }
 export function failedToManagePostgres(name: string, error: any): string { return localize('arc.failedToManagePostgres', "Failed to manage Postgres {0}. {1}", name, (error instanceof Error ? error.message : error)); }
 export function clickTheTroubleshootButton(resourceType: string): string { return localize('arc.clickTheTroubleshootButton', "Click the troubleshoot button to open the Azure Arc {0} troubleshooting notebook.", resourceType); }
-
-export const couldNotFindControllerResource = localize('arc.couldNotFindControllerResource', "Could not find Azure resource for Azure Arc Data Controller", name);
+export function numVCores(vCores: string): string {
+	const numCores = +vCores;
+	if (numCores && numCores > 0) {
+		return localize('arc.numVCores', "{0} vCores", numCores);
+	} else {
+		return '-';
+	}
+}
+export function couldNotFindRegistration(namespace: string, name: string) { return localize('arc.couldNotFindRegistration', "Could not find controller registration for {0} ({1})", name, namespace); }
 
 export const arcResources = localize('arc.arcResources', "Azure Arc Resources");

extensions/arc/src/models/miaaModel.ts

@@ -15,7 +15,7 @@ export class MiaaModel {
 
 	private _sqlInstanceRouter: SqlInstanceRouterApi;
 	private _status: HybridSqlNsNameGetResponse | undefined;
-
+	private _databases: DatabaseModel[] = [];
 	private readonly _onPasswordUpdated = new vscode.EventEmitter<string>();
 	private readonly _onStatusUpdated = new vscode.EventEmitter<HybridSqlNsNameGetResponse>();
 	private readonly _onDatabasesUpdated = new vscode.EventEmitter<DatabaseModel[]>();
@@ -58,19 +58,26 @@ export class MiaaModel {
 	}
 
 	public get databases(): DatabaseModel[] {
-		return [
-			{ name: 'contosoMI54', status: 'online' },
-			{ name: 'contosoMI56', status: 'online' },
-			{ name: 'contosoMI58', status: 'online' },
-		];
+		return this._databases;
 	}
 
 	/** Refreshes the model */
 	public async refresh(): Promise<void> {
-		this._sqlInstanceRouter.apiV1HybridSqlNsNameGet(this._namespace, this._name).then(response => {
+		const instanceRefresh = this._sqlInstanceRouter.apiV1HybridSqlNsNameGet(this._namespace, this._name).then(response => {
 			this._status = response.body;
 			this._onStatusUpdated.fire(this._status);
-			this._onDatabasesUpdated.fire(this.databases);
 		});
+		const provider = azdata.dataprotocol.getProvider<azdata.MetadataProvider>(this.connectionProfile.providerName, azdata.DataProviderType.MetadataProvider);
+		const databasesRefresh = azdata.connection.getUriForConnection(this.connectionProfile.id).then(ownerUri => {
+			provider.getDatabases(ownerUri).then(databases => {
+				if (databases.length > 0 && typeof (databases[0]) === 'object') {
+					this._databases = (<azdata.DatabaseInfo[]>databases).map(db => { return { name: db.options['name'], status: db.options['state'] }; });
+				} else {
+					this._databases = (<string[]>databases).map(db => { return { name: db, status: '-' }; });
+				}
+				this._onDatabasesUpdated.fire(this._databases);
+			});
+		});
+		await Promise.all([instanceRefresh, databasesRefresh]);
 	}
 }

extensions/arc/src/ui/dashboards/controller/controllerDashboardOverviewPage.ts

@@ -160,7 +160,7 @@ export class ControllerDashboardOverviewPage extends DashboardPage {
 				vscode.env.openExternal(vscode.Uri.parse(
 					`https://portal.azure.com/#resource/subscriptions/${r.subscriptionId}/resourceGroups/${r.resourceGroupName}/providers/Microsoft.AzureData/${ResourceType.dataControllers}/${r.instanceName}`));
 			} else {
-				vscode.window.showErrorMessage(loc.couldNotFindControllerResource);
+				vscode.window.showErrorMessage(loc.couldNotFindRegistration(this._controllerModel.namespace, 'controller'));
 			}
 		});
 

extensions/arc/src/ui/dashboards/miaa/miaaDashboardOverviewPage.ts

@@ -4,6 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 
 import * as azdata from 'azdata';
+import * as vscode from 'vscode';
 import * as loc from '../../../localizedConstants';
 import { DashboardPage } from '../../components/dashboardPage';
 import { IconPathHelper, cssStyles, ResourceType } from '../../../constants';
@@ -33,7 +34,7 @@ export class MiaaDashboardOverviewPage extends DashboardPage {
 		subscriptionId: '-',
 		miaaAdmin: '-',
 		host: '-',
-		computeAndStorage: '-'
+		vCores: '-'
 	};
 
 	constructor(modelView: azdata.ModelView, private _controllerModel: ControllerModel, private _miaaModel: MiaaModel) {
@@ -157,7 +158,6 @@ export class MiaaDashboardOverviewPage extends DashboardPage {
 		}).component();
 
 		this._databasesTableLoading = this.modelView.modelBuilder.loadingComponent().withItem(this._databasesTable).component();
-		this._databasesTableLoading.loading = false;
 		rootContainer.addItem(this._databasesTableLoading, { CSSStyles: { 'margin-bottom': '20px' } });
 
 		this.initialized = true;
@@ -166,8 +166,8 @@ export class MiaaDashboardOverviewPage extends DashboardPage {
 
 	public get toolbarContainer(): azdata.ToolbarContainer {
 
-		const createNewButton = this.modelView.modelBuilder.button().withProperties<azdata.ButtonProperties>({
-			label: loc.createNew,
+		const createDatabaseButton = this.modelView.modelBuilder.button().withProperties<azdata.ButtonProperties>({
+			label: loc.newDatabase,
 			iconPath: IconPathHelper.add
 		}).component();
 
@@ -186,9 +186,19 @@ export class MiaaDashboardOverviewPage extends DashboardPage {
 			iconPath: IconPathHelper.openInTab
 		}).component();
 
+		openInAzurePortalButton.onDidClick(async () => {
+			const r = this._controllerModel.getRegistration(ResourceType.sqlManagedInstances, this._miaaModel.namespace, this._miaaModel.name);
+			if (r) {
+				vscode.env.openExternal(vscode.Uri.parse(
+					`https://portal.azure.com/#resource/subscriptions/${r.subscriptionId}/resourceGroups/${r.resourceGroupName}/providers/Microsoft.AzureData/${ResourceType.sqlManagedInstances}/${r.instanceName}`));
+			} else {
+				vscode.window.showErrorMessage(loc.couldNotFindRegistration(this._miaaModel.namespace, this._miaaModel.name));
+			}
+		});
+
 		return this.modelView.modelBuilder.toolbarContainer().withToolbarItems(
 			[
-				{ component: createNewButton },
+				{ component: createDatabaseButton },
 				{ component: deleteButton },
 				{ component: resetPasswordButton, toolbarSeparatorAfter: true },
 				{ component: openInAzurePortalButton }
@@ -203,7 +213,7 @@ export class MiaaDashboardOverviewPage extends DashboardPage {
 			this._instanceProperties.dataController = this._controllerModel.controllerRegistration?.instanceName || '-';
 			this._instanceProperties.region = (await getAzurecoreApi()).getRegionDisplayName(reg.location);
 			this._instanceProperties.subscriptionId = reg.subscriptionId || '-';
-			this._instanceProperties.computeAndStorage = reg.vCores || '-';
+			this._instanceProperties.vCores = reg.vCores || '-';
 			this._instanceProperties.host = reg.externalEndpoint || '-';
 			this.refreshDisplayedProperties();
 		}
@@ -264,8 +274,8 @@ export class MiaaDashboardOverviewPage extends DashboardPage {
 				value: this._instanceProperties.host
 			},
 			{
-				displayName: loc.computeAndStorage,
-				value: this._instanceProperties.computeAndStorage
+				displayName: loc.compute,
+				value: loc.numVCores(this._instanceProperties.vCores)
 			}
 		];
 

src/sql/azdata.d.ts

@@ -1305,7 +1305,7 @@ declare module 'azdata' {
 
 	// Admin Services interfaces  -----------------------------------------------------------------------
 	export interface DatabaseInfo {
-		options: {};
+		options: { [key: string]: any };
 	}
 
 	export interface LoginInfo {