Feat/model backed ui (#1145)

This is an initial PR for a new model-driven UI where extensions can provide definitions of the components & how they're laid out using Containers.
#1140, #1141, #1142, #1143 and #1144 are all tracking additional work needed to improve the initial implementation and fix some issues with the implementation.

Features:
- Supports defining a FlexContainer that maps to a flexbox-based layout.
- Supports creating a card component, which is a key-value pair based control that will lay out simple information to a user. Eventually this will have an optional set of actions associated with it.
- Has a sample project which shows how to use the API and was used for verification

src/sql/workbench/api/node/mainThreadModelView.ts

@@ -0,0 +1,75 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+'use strict';
+
+import { MainThreadModelViewShape, SqlMainContext, ExtHostModelViewShape, SqlExtHostContext } from 'sql/workbench/api/node/sqlExtHost.protocol';
+import { extHostNamedCustomer } from 'vs/workbench/api/electron-browser/extHostCustomers';
+import { IExtHostContext } from 'vs/workbench/api/node/extHost.protocol';
+
+import * as sqlops from 'sqlops';
+
+import { IDashboardViewService } from 'sql/services/dashboard/common/dashboardViewService';
+import { IItemConfig, ModelComponentTypes, IComponentShape } from 'sql/workbench/api/common/sqlExtHostTypes';
+import { IModelView } from 'sql/services/model/modelViewService';
+
+
+@extHostNamedCustomer(SqlMainContext.MainThreadModelView)
+export class MainThreadModelView implements MainThreadModelViewShape {
+
+	private static _handlePool = 0;
+	private readonly _proxy: ExtHostModelViewShape;
+	private readonly _dialogs = new Map<number, IModelView>();
+
+	private knownWidgets = new Array<string>();
+
+	constructor(
+		context: IExtHostContext,
+		@IDashboardViewService viewService: IDashboardViewService
+	) {
+		this._proxy = context.getProxy(SqlExtHostContext.ExtHostModelView);
+		viewService.onRegisteredModelView(view => {
+			if (this.knownWidgets.includes(view.id)) {
+				let handle = MainThreadModelView._handlePool++;
+				this._dialogs.set(handle, view);
+				this._proxy.$registerWidget(handle, view.id, view.connection, view.serverInfo);
+			}
+		});
+	}
+
+	public dispose(): void {
+		throw new Error('Method not implemented.');
+	}
+
+	$registerProvider(id: string) {
+		this.knownWidgets.push(id);
+	}
+
+	$initializeModel(handle: number, rootComponent: IComponentShape): Thenable<void> {
+		return this.execModelViewAction(handle, (modelView) => modelView.initializeModel(rootComponent));
+	}
+
+	$clearContainer(handle: number, componentId: string): Thenable<void> {
+		return this.execModelViewAction(handle, (modelView) => modelView.clearContainer(componentId));
+	}
+
+	$addToContainer(handle: number, containerId: string, item: IItemConfig): Thenable<void> {
+		return this.execModelViewAction(handle,
+			(modelView) => modelView.addToContainer(containerId, item));
+	}
+
+	$setLayout(handle: number, componentId: string, layout: any): Thenable<void> {
+		return this.execModelViewAction(handle, (modelView) => modelView.setLayout(componentId, layout));
+	}
+
+	$setProperties(handle: number, componentId: string, properties: { [key: string]: any; }): Thenable<void> {
+		return this.execModelViewAction(handle, (modelView) => modelView.setProperties(componentId, properties));
+	}
+
+	private execModelViewAction<T>(handle: number, action: (m: IModelView) => T): Thenable<T> {
+		let modelView: IModelView = this._dialogs.get(handle);
+		let result = action(modelView);
+		return Promise.resolve(result);
+	}
+}