removed discontinued red bar from error detail (#1521)

* add progress indicator for dashboard scripting

* formatting

build/gulpfile.vscode.js

@@ -77,7 +77,8 @@ const vsce = require('vsce');
 const sqlBuiltInExtensions = [
 	// Add SQL built-in extensions here.
 	// the extension will be excluded from SQLOps package and will have separate vsix packages
-	'agent'
+	'agent',
+	'profiler'
 ];
 
 const vscodeEntryPoints = _.flatten([

build/npm/postinstall.js

@@ -35,7 +35,8 @@ const extensions = [
 	'merge-conflict',
 	'insights-default',
 	'account-provider-azure',
-	'agent'
+	'agent',
+	'profiler'
 ];
 
 extensions.forEach(extension => yarnInstall(`extensions/${extension}`));

extensions/mssql/src/config.json

@@ -1,6 +1,6 @@
 {
 	"downloadUrl": "https://github.com/Microsoft/sqltoolsservice/releases/download/v{#version#}/microsoft.sqltools.servicelayer-{#fileName#}",
-	"version": "1.4.0-alpha.31",
+	"version": "1.4.0-alpha.35",
 	"downloadFileNames": {
 		"Windows_86": "win-x86-netcoreapp2.1.zip",
 		"Windows_64": "win-x64-netcoreapp2.1.zip",

extensions/mssql/yarn.lock

@@ -49,9 +49,9 @@ core-util-is@~1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
 
-"dataprotocol-client@github:Microsoft/sqlops-dataprotocolclient#0.1.5":
+"dataprotocol-client@github:Microsoft/sqlops-dataprotocolclient#0.1.7":
-  version "0.1.5"
+  version "0.1.7"
-  resolved "https://codeload.github.com/Microsoft/sqlops-dataprotocolclient/tar.gz/21b0bacfc759689a6c280408528c6029a21b1abf"
+  resolved "https://codeload.github.com/Microsoft/sqlops-dataprotocolclient/tar.gz/d50285b03d0d5073c086362c5c96afb279320607"
   dependencies:
     vscode-languageclient "3.5.0"
 

extensions/profiler/.vscodeignore

@@ -0,0 +1,2 @@
+client/src/**
+client/tsconfig.json

extensions/profiler/README.md

@@ -0,0 +1,25 @@
+# SQL Server Profiler for SQL Operations Studio
+
+Welcome to the SQL Server Profiler for SQL Operations Studio!  The SQL Server Profiler extension provides a simple SQL Server tracing solution similar to SSMS Profiler except built using XEvents.  SSMS Profiler is very easy to use and has good default values for the most common tracing configurations.  The UX is optimized for browsing through events and viewing the associated T-SQL text.  The SQL Server Profiler for SQL Operations Studio also assumes good default values for collecting T-SQL execution activities with an easy to use UX.
+
+Common SQL Profiler use-cases taken from https://docs.microsoft.com/en-us/sql/tools/sql-server-profiler/sql-server-profiler.
+
+- Stepping through problem queries to find the cause of the problem.
+- Finding and diagnosing slow-running queries.
+- Capturing the series of Transact-SQL statements that lead to a problem.
+- Monitoring the performance of SQL Server to tune workloads.
+- Correlating performance counters to diagnose problems.
+
+## Code of Conduct
+
+This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/). For more information see the [Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct/faq/) or contact [opencode@microsoft.com](mailto:opencode@microsoft.com) with any additional questions or comments.
+
+## Privacy Statement
+
+The [Microsoft Enterprise and Developer Privacy Statement](https://privacy.microsoft.com/en-us/privacystatement) describes the privacy statement of this software.
+
+## License
+
+Copyright (c) Microsoft Corporation. All rights reserved.
+
+Licensed under the [Source EULA](https://raw.githubusercontent.com/Microsoft/sqlopsstudio/master/LICENSE.txt).

extensions/profiler/client/src/apiWrapper.ts

@@ -0,0 +1,63 @@
+/*---------------------------------------------------------------------------------------------
+ *  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 * as vscode from 'vscode';
+import * as data from 'sqlops';
+
+/**
+ * Wrapper class to act as a facade over VSCode and Data APIs and allow us to test / mock callbacks into
+ * this API from our code
+ *
+ * @export
+ * @class ApiWrapper
+ */
+export class ApiWrapper {
+    // Data APIs
+
+    public registerWebviewProvider(widgetId: string, handler: (webview: data.DashboardWebview) => void): void {
+        return data.dashboard.registerWebviewProvider(widgetId, handler);
+    }
+
+
+    public registerControlHostProvider(widgetId: string, handler: (webview: data.DashboardWebview) => void): void {
+        return data.dashboard.registerWebviewProvider(widgetId, handler);
+    }
+
+    /**
+     * Get the configuration for a extensionName
+     * @param extensionName The string name of the extension to get the configuration for
+     * @param resource The optional URI, as a URI object or a string, to use to get resource-scoped configurations
+     */
+    public getConfiguration(extensionName: string, resource?: vscode.Uri | string): vscode.WorkspaceConfiguration {
+        if (typeof resource === 'string') {
+            try {
+                resource = this.parseUri(resource);
+            } catch (e) {
+                resource = undefined;
+            }
+        }
+        return vscode.workspace.getConfiguration(extensionName, resource as vscode.Uri);
+    }
+
+    /**
+     * Parse uri
+     */
+    public parseUri(uri: string): vscode.Uri {
+        return vscode.Uri.parse(uri);
+    }
+
+    public showOpenDialog(options: vscode.OpenDialogOptions): Thenable<vscode.Uri[] | undefined> {
+        return vscode.window.showOpenDialog(options);
+    }
+
+    public showErrorMessage(message: string, ...items: string[]): Thenable<string | undefined> {
+        return vscode.window.showErrorMessage(message, ...items);
+    }
+
+    public get workspaceRootPath(): string {
+        return vscode.workspace.rootPath;
+    }
+}

extensions/profiler/client/src/main.ts

@@ -0,0 +1,23 @@
+/*---------------------------------------------------------------------------------------------
+ *  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 vscode = require('vscode');
+import { MainController } from './mainController';
+import { ApiWrapper } from './apiWrapper';
+export let controller: MainController;
+
+export function activate(context: vscode.ExtensionContext) {
+	let apiWrapper = new ApiWrapper();
+	controller = new MainController(context, apiWrapper);
+	controller.activate();
+}
+
+// this method is called when your extension is deactivated
+export function deactivate(): void {
+	if (controller) {
+		controller.deactivate();
+	}
+}

extensions/profiler/client/src/mainController.ts

@@ -0,0 +1,32 @@
+/*---------------------------------------------------------------------------------------------
+ *  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 * as vscode from 'vscode';
+import * as data from 'sqlops';
+import { ApiWrapper } from './apiWrapper';
+
+/**
+ * The main controller class that initializes the extension
+ */
+export class MainController  {
+    protected _apiWrapper: ApiWrapper;
+    protected _context: vscode.ExtensionContext;
+
+    // PUBLIC METHODS //////////////////////////////////////////////////////
+    public constructor(context: vscode.ExtensionContext, apiWrapper?: ApiWrapper) {
+        this._apiWrapper = apiWrapper || new ApiWrapper();
+        this._context = context;
+    }
+
+    /**
+     * Deactivates the extension
+     */
+    public deactivate(): void {
+    }
+
+    public activate(): void {
+    }
+}

extensions/profiler/client/src/typings/ref.d.ts

@@ -0,0 +1,8 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+/// <reference path='../../../../../src/vs/vscode.d.ts'/>
+/// <reference path='../../../../../src/sql/sqlops.d.ts'/>
+/// <reference types='@types/node'/>

extensions/profiler/client/tsconfig.json

@@ -0,0 +1,19 @@
+{
+    "compileOnSave": true,
+    "compilerOptions": {
+        "module": "commonjs",
+        "target": "es6",
+		"outDir": "./out",
+		"lib": [
+			"es6", "es2015.promise"
+		],
+        "sourceMap": true,
+        "emitDecoratorMetadata": true,
+        "experimentalDecorators": true,
+        "moduleResolution": "node",
+        "declaration": true
+    },
+    "exclude": [
+        "node_modules"
+    ]
+}

extensions/profiler/package.json

@@ -0,0 +1,44 @@
+{
+  "name": "profiler",
+  "displayName": "SQL Server Profiler",
+  "description": "SQL Server Profiler for SQL Operations Studio",
+  "version": "0.30.0",
+  "publisher": "Microsoft",
+  "preview": true,
+  "license": "https://raw.githubusercontent.com/Microsoft/sqlopsstudio/master/LICENSE.txt",
+  "icon": "images/sqlserver.png",
+  "aiKey": "AIF-5574968e-856d-40d2-af67-c89a14e76412",
+  "engines": {
+    "vscode": "0.10.x"
+  },
+  "activationEvents": [
+    "*"
+  ],
+  "main": "./client/out/main",
+  "scripts": {
+    "compile": "gulp compile-extension:profiler-client"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Microsoft/sqlopsstudio.git"
+  },
+  "extensionDependencies": [
+    "Microsoft.mssql"
+  ],
+  "contributes": {
+
+      "commands": [
+      {
+        "command": "profiler.newProfiler",
+        "title": "New Profiler",
+        "category": "Profiler"
+      }
+    ],
+    "outputChannels": [
+      "sqlprofiler"
+    ]
+  },
+  "devDependencies": {
+    "vscode": "1.0.1"
+  }
+}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "sqlops",
-  "version": "0.30.1",
+  "version": "0.30.3",
   "distro": "8c3e97e3425cc9814496472ab73e076de2ba99ee",
   "author": {
     "name": "Microsoft Corporation"
@@ -59,7 +59,7 @@
     "reflect-metadata": "^0.1.8",
     "rxjs": "5.4.0",
     "semver": "4.3.6",
-    "slickgrid": "github:anthonydresser/SlickGrid#2.3.16",
+    "slickgrid": "github:anthonydresser/SlickGrid#2.3.17",
     "spdlog": "0.6.0",
     "svg.js": "^2.2.5",
     "sudo-prompt": "^8.0.0",
@@ -162,4 +162,4 @@
     "windows-mutex": "^0.2.0",
     "windows-process-tree": "0.1.6"
   }
-}
+}

samples/sqlservices/package-lock.json

@@ -27,6 +27,12 @@
                 "through2": "2.0.3"
             }
         },
+        "@types/handlebars": {
+            "version": "4.0.37",
+            "resolved": "https://registry.npmjs.org/@types/handlebars/-/handlebars-4.0.37.tgz",
+            "integrity": "sha512-c/g99PQsJEFYdK3LT1qgPAZ61fu/oFOaEhov/6ZuUNMi1xQFbAOSThlX8fAQLf+QoGXtyv4S39OjIRXf3HkBtw==",
+            "dev": true
+        },
         "@types/node": {
             "version": "7.0.58",
             "resolved": "https://registry.npmjs.org/@types/node/-/node-7.0.58.tgz",
@@ -51,11 +57,30 @@
                 "json-schema-traverse": "0.3.1"
             }
         },
+        "align-text": {
+            "version": "0.1.4",
+            "resolved": "https://registry.npmjs.org/align-text/-/align-text-0.1.4.tgz",
+            "integrity": "sha1-DNkKVhCT810KmSVsIrcGlDP60Rc=",
+            "requires": {
+                "kind-of": "3.2.2",
+                "longest": "1.0.1",
+                "repeat-string": "1.6.1"
+            },
+            "dependencies": {
+                "kind-of": {
+                    "version": "3.2.2",
+                    "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
+                    "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=",
+                    "requires": {
+                        "is-buffer": "1.1.6"
+                    }
+                }
+            }
+        },
         "amdefine": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
-            "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU=",
+            "integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU="
-            "dev": true
         },
         "ansi-colors": {
             "version": "1.1.0",
@@ -136,6 +161,15 @@
             "integrity": "sha1-+cjBN1fMHde8N5rHeyxipcKGjEA=",
             "dev": true
         },
+        "argparse": {
+            "version": "1.0.10",
+            "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
+            "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
+            "dev": true,
+            "requires": {
+                "sprintf-js": "1.0.3"
+            }
+        },
         "arr-diff": {
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-4.0.0.tgz",
@@ -289,6 +323,11 @@
             "integrity": "sha1-WWZ/QfrdTyDMvCu5a41Pf3jsA2c=",
             "dev": true
         },
+        "async": {
+            "version": "1.5.2",
+            "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
+            "integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo="
+        },
         "async-done": {
             "version": "1.2.4",
             "resolved": "https://registry.npmjs.org/async-done/-/async-done-1.2.4.tgz",
@@ -420,6 +459,12 @@
                 "inherits": "2.0.3"
             }
         },
+        "boolbase": {
+            "version": "1.0.0",
+            "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
+            "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24=",
+            "dev": true
+        },
         "boom": {
             "version": "2.10.1",
             "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
@@ -538,6 +583,16 @@
             "integrity": "sha1-cVuW6phBWTzDMGeSP17GDr2k99c=",
             "dev": true
         },
+        "center-align": {
+            "version": "0.1.3",
+            "resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz",
+            "integrity": "sha1-qg0yYptu6XIgBBHL1EYckHvCt60=",
+            "optional": true,
+            "requires": {
+                "align-text": "0.1.4",
+                "lazy-cache": "1.0.4"
+            }
+        },
         "chalk": {
             "version": "1.1.3",
             "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -551,6 +606,20 @@
                 "supports-color": "2.0.0"
             }
         },
+        "cheerio": {
+            "version": "1.0.0-rc.2",
+            "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-1.0.0-rc.2.tgz",
+            "integrity": "sha1-S59TqBsn5NXawxwP/Qz6A8xoMNs=",
+            "dev": true,
+            "requires": {
+                "css-select": "1.2.0",
+                "dom-serializer": "0.1.0",
+                "entities": "1.1.1",
+                "htmlparser2": "3.9.2",
+                "lodash": "4.17.10",
+                "parse5": "3.0.3"
+            }
+        },
         "child-process-promise": {
             "version": "2.2.1",
             "resolved": "https://registry.npmjs.org/child-process-promise/-/child-process-promise-2.2.1.tgz",
@@ -888,6 +957,24 @@
                 }
             }
         },
+        "css-select": {
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz",
+            "integrity": "sha1-KzoRBTnFNV8c2NMUYj6HCxIeyFg=",
+            "dev": true,
+            "requires": {
+                "boolbase": "1.0.0",
+                "css-what": "2.1.0",
+                "domutils": "1.5.1",
+                "nth-check": "1.0.1"
+            }
+        },
+        "css-what": {
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/css-what/-/css-what-2.1.0.tgz",
+            "integrity": "sha1-lGfQMsOM+u+58teVASUwYvh/ob0=",
+            "dev": true
+        },
         "d": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/d/-/d-1.0.0.tgz",
@@ -954,8 +1041,7 @@
         "decamelize": {
             "version": "1.2.0",
             "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
-            "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA=",
+            "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA="
-            "dev": true
         },
         "decode-uri-component": {
             "version": "0.2.0",
@@ -1043,6 +1129,12 @@
             "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk=",
             "dev": true
         },
+        "denodeify": {
+            "version": "1.2.1",
+            "resolved": "https://registry.npmjs.org/denodeify/-/denodeify-1.2.1.tgz",
+            "integrity": "sha1-OjYof1A05pnnV3kBBSwubJQlFjE=",
+            "dev": true
+        },
         "detect-file": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/detect-file/-/detect-file-1.0.0.tgz",
@@ -1061,6 +1153,49 @@
             "integrity": "sha512-MKPHZDMB0o6yHyDryUOScqZibp914ksXwAMYMTHj6KO8UeKsRYNJD3oNCKjTqZon+V488P7N/HzXF8t7ZR95ww==",
             "dev": true
         },
+        "dom-serializer": {
+            "version": "0.1.0",
+            "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
+            "integrity": "sha1-BzxpdUbOB4DOI75KKOKT5AvDDII=",
+            "dev": true,
+            "requires": {
+                "domelementtype": "1.1.3",
+                "entities": "1.1.1"
+            },
+            "dependencies": {
+                "domelementtype": {
+                    "version": "1.1.3",
+                    "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz",
+                    "integrity": "sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs=",
+                    "dev": true
+                }
+            }
+        },
+        "domelementtype": {
+            "version": "1.3.0",
+            "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.3.0.tgz",
+            "integrity": "sha1-sXrtguirWeUt2cGbF1bg/BhyBMI=",
+            "dev": true
+        },
+        "domhandler": {
+            "version": "2.4.2",
+            "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.2.tgz",
+            "integrity": "sha512-JiK04h0Ht5u/80fdLMCEmV4zkNh2BcoMFBmZ/91WtYZ8qVXSKjiw7fXMgFPnHcSZgOo3XdinHvmnDUeMf5R4wA==",
+            "dev": true,
+            "requires": {
+                "domelementtype": "1.3.0"
+            }
+        },
+        "domutils": {
+            "version": "1.5.1",
+            "resolved": "https://registry.npmjs.org/domutils/-/domutils-1.5.1.tgz",
+            "integrity": "sha1-3NhIiib1Y9YQeeSMn3t+Mjc2gs8=",
+            "dev": true,
+            "requires": {
+                "dom-serializer": "0.1.0",
+                "domelementtype": "1.3.0"
+            }
+        },
         "duplexer": {
             "version": "0.1.1",
             "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
@@ -1143,6 +1278,12 @@
                 "once": "1.4.0"
             }
         },
+        "entities": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.1.tgz",
+            "integrity": "sha1-blwtClYhtdra7O+AuQ7ftc13cvA=",
+            "dev": true
+        },
         "error-ex": {
             "version": "1.3.1",
             "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.1.tgz",
@@ -1630,6 +1771,16 @@
             "integrity": "sha1-g8YK/Fi5xWmXAH7Rp2izqzA6RP4=",
             "dev": true
         },
+        "fs-extra": {
+            "version": "5.0.0",
+            "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-5.0.0.tgz",
+            "integrity": "sha512-66Pm4RYbjzdyeuqudYqhFiNBbCIuI9kgRqLPSHIlXHidW8NIQtVdkM1yeZ4lXwuhbTETv3EUGMNHAAw6hiundQ==",
+            "requires": {
+                "graceful-fs": "4.1.11",
+                "jsonfile": "4.0.0",
+                "universalify": "0.1.1"
+            }
+        },
         "fs-mkdirp-stream": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/fs-mkdirp-stream/-/fs-mkdirp-stream-1.0.0.tgz",
@@ -2762,8 +2913,7 @@
         "graceful-fs": {
             "version": "4.1.11",
             "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
-            "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg=",
+            "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg="
-            "dev": true
         },
         "growl": {
             "version": "1.10.3",
@@ -3928,6 +4078,27 @@
                 "glogg": "1.0.1"
             }
         },
+        "handlebars": {
+            "version": "4.0.11",
+            "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.11.tgz",
+            "integrity": "sha1-Ywo13+ApS8KB7a5v/F0yn8eYLcw=",
+            "requires": {
+                "async": "1.5.2",
+                "optimist": "0.6.1",
+                "source-map": "0.4.4",
+                "uglify-js": "2.8.29"
+            },
+            "dependencies": {
+                "source-map": {
+                    "version": "0.4.4",
+                    "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.4.4.tgz",
+                    "integrity": "sha1-66T12pwNyZneaAMti092FzZSA2s=",
+                    "requires": {
+                        "amdefine": "1.0.1"
+                    }
+                }
+            }
+        },
         "har-schema": {
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-2.0.0.tgz",
@@ -4047,6 +4218,20 @@
             "integrity": "sha512-lIbgIIQA3lz5XaB6vxakj6sDHADJiZadYEJB+FgA+C4nubM1NwcuvUr9EJPmnH1skZqpqUzWborWo8EIUi0Sdw==",
             "dev": true
         },
+        "htmlparser2": {
+            "version": "3.9.2",
+            "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.9.2.tgz",
+            "integrity": "sha1-G9+HrMoPP55T+k/M6w9LTLsAszg=",
+            "dev": true,
+            "requires": {
+                "domelementtype": "1.3.0",
+                "domhandler": "2.4.2",
+                "domutils": "1.5.1",
+                "entities": "1.1.1",
+                "inherits": "2.0.3",
+                "readable-stream": "2.3.5"
+            }
+        },
         "http-signature": {
             "version": "1.1.1",
             "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.1.1.tgz",
@@ -4135,8 +4320,7 @@
         "is-buffer": {
             "version": "1.1.6",
             "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
-            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==",
+            "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
-            "dev": true
         },
         "is-builtin-module": {
             "version": "1.0.0",
@@ -4443,6 +4627,14 @@
             "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus=",
             "dev": true
         },
+        "jsonfile": {
+            "version": "4.0.0",
+            "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
+            "integrity": "sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss=",
+            "requires": {
+                "graceful-fs": "4.1.11"
+            }
+        },
         "jsonify": {
             "version": "0.0.0",
             "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
@@ -4497,6 +4689,12 @@
                 "es6-weak-map": "2.0.2"
             }
         },
+        "lazy-cache": {
+            "version": "1.0.4",
+            "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz",
+            "integrity": "sha1-odePw6UEdMuAhF07O24dpJpEbo4=",
+            "optional": true
+        },
         "lazystream": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/lazystream/-/lazystream-1.0.0.tgz",
@@ -4540,6 +4738,15 @@
                 "resolve": "1.6.0"
             }
         },
+        "linkify-it": {
+            "version": "2.0.3",
+            "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-2.0.3.tgz",
+            "integrity": "sha1-2UpGSPmxwXnWT6lykSaL22zpQ08=",
+            "dev": true,
+            "requires": {
+                "uc.micro": "1.0.5"
+            }
+        },
         "load-json-file": {
             "version": "1.1.0",
             "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
@@ -4553,6 +4760,12 @@
                 "strip-bom": "2.0.0"
             }
         },
+        "lodash": {
+            "version": "4.17.10",
+            "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.10.tgz",
+            "integrity": "sha512-UejweD1pDoXu+AD825lWwp4ZGtSwgnpZxb3JDViD7StjQz+Nb/6l093lx4OQ0foGWNRoc19mWy7BzL+UAK2iVg==",
+            "dev": true
+        },
         "lodash._basecopy": {
             "version": "3.0.1",
             "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz",
@@ -4678,6 +4891,11 @@
                 "lodash.escape": "3.2.0"
             }
         },
+        "longest": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/longest/-/longest-1.0.1.tgz",
+            "integrity": "sha1-MKCy2jj3N3DoKUoNIuZiXtd9AJc="
+        },
         "lru-cache": {
             "version": "4.1.2",
             "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.2.tgz",
@@ -4738,6 +4956,19 @@
                 "object-visit": "1.0.1"
             }
         },
+        "markdown-it": {
+            "version": "8.4.1",
+            "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-8.4.1.tgz",
+            "integrity": "sha512-CzzqSSNkFRUf9vlWvhK1awpJreMRqdCrBvZ8DIoDWTOkESMIF741UPAhuAmbyWmdiFPA6WARNhnu2M6Nrhwa+A==",
+            "dev": true,
+            "requires": {
+                "argparse": "1.0.10",
+                "entities": "1.1.1",
+                "linkify-it": "2.0.3",
+                "mdurl": "1.0.1",
+                "uc.micro": "1.0.5"
+            }
+        },
         "matchdep": {
             "version": "2.0.0",
             "resolved": "https://registry.npmjs.org/matchdep/-/matchdep-2.0.0.tgz",
@@ -4750,6 +4981,12 @@
                 "stack-trace": "0.0.10"
             }
         },
+        "mdurl": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/mdurl/-/mdurl-1.0.1.tgz",
+            "integrity": "sha1-/oWy7HWlkDfyrf7BAP1sYBdhFS4=",
+            "dev": true
+        },
         "memoizee": {
             "version": "0.4.12",
             "resolved": "https://registry.npmjs.org/memoizee/-/memoizee-0.4.12.tgz",
@@ -4796,6 +5033,12 @@
                 "to-regex": "3.0.2"
             }
         },
+        "mime": {
+            "version": "1.6.0",
+            "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
+            "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
+            "dev": true
+        },
         "mime-db": {
             "version": "1.33.0",
             "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.33.0.tgz",
@@ -4941,6 +5184,12 @@
             "integrity": "sha1-WzLqB+tDyd7WEwQ0z5JvRrKn/U0=",
             "dev": true
         },
+        "mute-stream": {
+            "version": "0.0.7",
+            "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz",
+            "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s=",
+            "dev": true
+        },
         "nan": {
             "version": "2.10.0",
             "resolved": "https://registry.npmjs.org/nan/-/nan-2.10.0.tgz",
@@ -5019,6 +5268,15 @@
                 "once": "1.4.0"
             }
         },
+        "nth-check": {
+            "version": "1.0.1",
+            "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-1.0.1.tgz",
+            "integrity": "sha1-mSms32KPwsQQmN6rgqxYDPFJquQ=",
+            "dev": true,
+            "requires": {
+                "boolbase": "1.0.0"
+            }
+        },
         "number-is-nan": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
@@ -5207,7 +5465,6 @@
             "version": "0.6.1",
             "resolved": "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz",
             "integrity": "sha1-2j6nRob6IaGaERwybpDrFaAZZoY=",
-            "dev": true,
             "requires": {
                 "minimist": "0.0.10",
                 "wordwrap": "0.0.3"
@@ -5216,8 +5473,7 @@
                 "minimist": {
                     "version": "0.0.10",
                     "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz",
-                    "integrity": "sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8=",
+                    "integrity": "sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8="
-                    "dev": true
                 }
             }
         },
@@ -5230,6 +5486,12 @@
                 "readable-stream": "2.3.5"
             }
         },
+        "os-homedir": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
+            "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=",
+            "dev": true
+        },
         "os-locale": {
             "version": "1.4.0",
             "resolved": "https://registry.npmjs.org/os-locale/-/os-locale-1.4.0.tgz",
@@ -5239,6 +5501,22 @@
                 "lcid": "1.0.0"
             }
         },
+        "os-tmpdir": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
+            "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=",
+            "dev": true
+        },
+        "osenv": {
+            "version": "0.1.5",
+            "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.5.tgz",
+            "integrity": "sha512-0CWcCECdMVc2Rw3U5w9ZjqX6ga6ubk1xDVKxtBQPK7wis/0F2r9T6k4ydGYhecl7YUBxBVxhL5oisPsNxAPe2g==",
+            "dev": true,
+            "requires": {
+                "os-homedir": "1.0.2",
+                "os-tmpdir": "1.0.2"
+            }
+        },
         "p-map": {
             "version": "1.2.0",
             "resolved": "https://registry.npmjs.org/p-map/-/p-map-1.2.0.tgz",
@@ -5300,6 +5578,24 @@
             "integrity": "sha1-bVuTSkVpk7I9N/QKOC1vFmao5cY=",
             "dev": true
         },
+        "parse-semver": {
+            "version": "1.1.1",
+            "resolved": "https://registry.npmjs.org/parse-semver/-/parse-semver-1.1.1.tgz",
+            "integrity": "sha1-mkr9bfBj3Egm+T+6SpnPIj9mbLg=",
+            "dev": true,
+            "requires": {
+                "semver": "5.5.0"
+            }
+        },
+        "parse5": {
+            "version": "3.0.3",
+            "resolved": "https://registry.npmjs.org/parse5/-/parse5-3.0.3.tgz",
+            "integrity": "sha512-rgO9Zg5LLLkfJF9E6CCmXlSE4UVceloys8JrFqCcHloC3usd/kJCyPDwH2SOlzix2j3xaP9sUX3e8+kvkuleAA==",
+            "dev": true,
+            "requires": {
+                "@types/node": "7.0.58"
+            }
+        },
         "pascalcase": {
             "version": "0.1.1",
             "resolved": "https://registry.npmjs.org/pascalcase/-/pascalcase-0.1.1.tgz",
@@ -5564,6 +5860,15 @@
                 }
             }
         },
+        "read": {
+            "version": "1.0.7",
+            "resolved": "https://registry.npmjs.org/read/-/read-1.0.7.tgz",
+            "integrity": "sha1-s9oZvQUkMal2cdRKQmNK33ELQMQ=",
+            "dev": true,
+            "requires": {
+                "mute-stream": "0.0.7"
+            }
+        },
         "read-pkg": {
             "version": "1.1.0",
             "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
@@ -5684,8 +5989,7 @@
         "repeat-string": {
             "version": "1.6.1",
             "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz",
-            "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc=",
+            "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc="
-            "dev": true
         },
         "replace-ext": {
             "version": "1.0.0",
@@ -5915,6 +6219,15 @@
             "integrity": "sha512-TTlYpa+OL+vMMNG24xSlQGEJ3B/RzEfUlLct7b5G/ytav+wPrplCpVMFuwzXbkecJrb6IYo1iFb0S9v37754mg==",
             "dev": true
         },
+        "right-align": {
+            "version": "0.1.3",
+            "resolved": "https://registry.npmjs.org/right-align/-/right-align-0.1.3.tgz",
+            "integrity": "sha1-YTObci/mo1FWiSENJOFMlhSGE+8=",
+            "optional": true,
+            "requires": {
+                "align-text": "0.1.4"
+            }
+        },
         "rimraf": {
             "version": "2.6.2",
             "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.2.tgz",
@@ -6136,8 +6449,7 @@
         "source-map": {
             "version": "0.5.7",
             "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
-            "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=",
+            "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
-            "dev": true
         },
         "source-map-resolve": {
             "version": "0.5.1",
@@ -6536,6 +6848,15 @@
                 "next-tick": "1.0.0"
             }
         },
+        "tmp": {
+            "version": "0.0.29",
+            "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.29.tgz",
+            "integrity": "sha1-8lEl/w3Z2jzLDC3Tce4SiLuRKMA=",
+            "dev": true,
+            "requires": {
+                "os-tmpdir": "1.0.2"
+            }
+        },
         "to-absolute-glob": {
             "version": "2.0.2",
             "resolved": "https://registry.npmjs.org/to-absolute-glob/-/to-absolute-glob-2.0.2.tgz",
@@ -6653,6 +6974,12 @@
                 }
             }
         },
+        "tunnel": {
+            "version": "0.0.4",
+            "resolved": "https://registry.npmjs.org/tunnel/-/tunnel-0.0.4.tgz",
+            "integrity": "sha1-LTeFoVjBdMmhbcLARuxfxfF0IhM=",
+            "dev": true
+        },
         "tunnel-agent": {
             "version": "0.4.3",
             "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.4.3.tgz",
@@ -6666,6 +6993,16 @@
             "dev": true,
             "optional": true
         },
+        "typed-rest-client": {
+            "version": "0.12.0",
+            "resolved": "https://registry.npmjs.org/typed-rest-client/-/typed-rest-client-0.12.0.tgz",
+            "integrity": "sha1-Y3b1Un9CfaEh3K/f1+QeEyHgcgw=",
+            "dev": true,
+            "requires": {
+                "tunnel": "0.0.4",
+                "underscore": "1.8.3"
+            }
+        },
         "typedarray": {
             "version": "0.0.6",
             "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
@@ -6678,12 +7015,78 @@
             "integrity": "sha512-Ao/f6d/4EPLq0YwzsQz8iXflezpTkQzqAyenTiw4kCUGr1uPiFLC3+fZ+gMZz6eeI/qdRUqvC+HxIJzUAzEFdg==",
             "dev": true
         },
+        "uc.micro": {
+            "version": "1.0.5",
+            "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-1.0.5.tgz",
+            "integrity": "sha512-JoLI4g5zv5qNyT09f4YAvEZIIV1oOjqnewYg5D38dkQljIzpPT296dbIGvKro3digYI1bkb7W6EP1y4uDlmzLg==",
+            "dev": true
+        },
+        "uglify-js": {
+            "version": "2.8.29",
+            "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz",
+            "integrity": "sha1-KcVzMUgFe7Th913zW3qcty5qWd0=",
+            "optional": true,
+            "requires": {
+                "source-map": "0.5.7",
+                "uglify-to-browserify": "1.0.2",
+                "yargs": "3.10.0"
+            },
+            "dependencies": {
+                "camelcase": {
+                    "version": "1.2.1",
+                    "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+                    "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk=",
+                    "optional": true
+                },
+                "cliui": {
+                    "version": "2.1.0",
+                    "resolved": "https://registry.npmjs.org/cliui/-/cliui-2.1.0.tgz",
+                    "integrity": "sha1-S0dXYP+AJkx2LDoXGQMukcf+oNE=",
+                    "optional": true,
+                    "requires": {
+                        "center-align": "0.1.3",
+                        "right-align": "0.1.3",
+                        "wordwrap": "0.0.2"
+                    }
+                },
+                "wordwrap": {
+                    "version": "0.0.2",
+                    "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.2.tgz",
+                    "integrity": "sha1-t5Zpu0LstAn4PVg8rVLKF+qhZD8=",
+                    "optional": true
+                },
+                "yargs": {
+                    "version": "3.10.0",
+                    "resolved": "https://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz",
+                    "integrity": "sha1-9+572FfdfB0tOMDnTvvWgdFDH9E=",
+                    "optional": true,
+                    "requires": {
+                        "camelcase": "1.2.1",
+                        "cliui": "2.1.0",
+                        "decamelize": "1.2.0",
+                        "window-size": "0.1.0"
+                    }
+                }
+            }
+        },
+        "uglify-to-browserify": {
+            "version": "1.0.2",
+            "resolved": "https://registry.npmjs.org/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz",
+            "integrity": "sha1-bgkk1r2mta/jSeOabWMoUKD4grc=",
+            "optional": true
+        },
         "unc-path-regex": {
             "version": "0.1.2",
             "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz",
             "integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo=",
             "dev": true
         },
+        "underscore": {
+            "version": "1.8.3",
+            "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.8.3.tgz",
+            "integrity": "sha1-Tz+1OxBuYJf8+ctBCfKl6b36UCI=",
+            "dev": true
+        },
         "underscore.string": {
             "version": "3.3.4",
             "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-3.3.4.tgz",
@@ -6762,6 +7165,11 @@
                 "through2-filter": "2.0.0"
             }
         },
+        "universalify": {
+            "version": "0.1.1",
+            "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.1.tgz",
+            "integrity": "sha1-+nG63UQ3r0wUiEHjs7Fl+enlkLc="
+        },
         "unset-value": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/unset-value/-/unset-value-1.0.0.tgz",
@@ -6814,6 +7222,12 @@
             "integrity": "sha1-2pN/emLiH+wf0Y1Js1wpNQZ6bHI=",
             "dev": true
         },
+        "url-join": {
+            "version": "1.1.0",
+            "resolved": "https://registry.npmjs.org/url-join/-/url-join-1.1.0.tgz",
+            "integrity": "sha1-dBxsL0WWxIMNZxhGCSDQySIC3Hg=",
+            "dev": true
+        },
         "url-parse": {
             "version": "1.3.0",
             "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.3.0.tgz",
@@ -6983,6 +7397,31 @@
                 "vinyl": "2.1.0"
             }
         },
+        "vsce": {
+            "version": "1.36.2",
+            "resolved": "https://registry.npmjs.org/vsce/-/vsce-1.36.2.tgz",
+            "integrity": "sha512-LiQjHdoaXOHKdk/PRN5OWWeEm/4w7tnFLf8EM+pzvlz/8uk7uJiqtMjVYAYawnU7c8KbMSz9nE9M6nCTV4ZSQA==",
+            "dev": true,
+            "requires": {
+                "cheerio": "1.0.0-rc.2",
+                "commander": "2.15.1",
+                "denodeify": "1.2.1",
+                "glob": "7.1.2",
+                "lodash": "4.17.10",
+                "markdown-it": "8.4.1",
+                "mime": "1.6.0",
+                "minimatch": "3.0.4",
+                "osenv": "0.1.5",
+                "parse-semver": "1.1.1",
+                "read": "1.0.7",
+                "semver": "5.5.0",
+                "tmp": "0.0.29",
+                "url-join": "1.1.0",
+                "vso-node-api": "6.5.0",
+                "yauzl": "2.9.1",
+                "yazl": "2.4.3"
+            }
+        },
         "vscode": {
             "version": "1.1.14",
             "resolved": "https://registry.npmjs.org/vscode/-/vscode-1.1.14.tgz",
@@ -7010,6 +7449,17 @@
             "resolved": "https://registry.npmjs.org/vscode-nls/-/vscode-nls-3.2.2.tgz",
             "integrity": "sha512-/Ur1+tgazwd51+ncRyoy0UIu4dvMdVXS9XMUULQlZIBoNGEwOhwEx9x+hHWoUjldMrOQ32t2CGKo0u6D4R6/hg=="
         },
+        "vso-node-api": {
+            "version": "6.5.0",
+            "resolved": "https://registry.npmjs.org/vso-node-api/-/vso-node-api-6.5.0.tgz",
+            "integrity": "sha512-hFjPLMJkq02zF8U+LhZ4airH0ivaiKzGdlNAQlYFB3lWuGH/UANUrl63DVPUQOyGw+7ZNQ+ufM44T6mWN92xyg==",
+            "dev": true,
+            "requires": {
+                "tunnel": "0.0.4",
+                "typed-rest-client": "0.12.0",
+                "underscore": "1.8.3"
+            }
+        },
         "which": {
             "version": "1.3.0",
             "resolved": "https://registry.npmjs.org/which/-/which-1.3.0.tgz",
@@ -7025,11 +7475,16 @@
             "integrity": "sha1-u6Y8qGGUiZT/MHc2CJ47lgJsKk8=",
             "dev": true
         },
+        "window-size": {
+            "version": "0.1.0",
+            "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
+            "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0=",
+            "optional": true
+        },
         "wordwrap": {
             "version": "0.0.3",
             "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz",
-            "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc=",
+            "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc="
-            "dev": true
         },
         "wrap-ansi": {
             "version": "2.1.0",

samples/sqlservices/package.json

@@ -16,11 +16,24 @@
     ],
     "main": "./out/src/extension",
     "contributes": {
-
+        "commands": [
-        "commands": [{
+            {
-              "command": "mssql.openDialog",
+                "command": "sqlservices.openDialog",
-              "title": "mssql.openDialog"
+                "title": "openDialog"
-        }],
+            },
+            {
+                "command": "sqlservices.openEditor",
+                "title": "sqlservices.openEditor"
+            },
+            {
+                "command": "sqlservices.openEditorWithWebView",
+                "title": "sqlservices.openEditorWithWebView"
+            },
+            {
+                "command": "sqlservices.openEditorWithWebView2",
+                "title": "sqlservices.openEditorWithWebView2"
+            }
+        ],
         "dashboard.tabs": [
             {
                 "id": "sqlservices.tab",
@@ -84,6 +97,7 @@
         "tslint": "^3.14.0",
         "typescript": "^2.6.1",
         "vscode": "^1.1.14",
-        "@types/handlebars": "^4.0.11"
+        "@types/handlebars": "^4.0.11",
+        "vsce": "1.36.2"
     }
 }

samples/sqlservices/src/controllers/button.html

@@ -0,0 +1,18 @@
+<!--
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+-->
+<html>
+    <header>
+    </header>
+    <body>
+        <button onclick="count()">Count</button>
+        <script>
+            function count() {
+                parent.postMessage('count', '*');
+            }
+        </script>
+    </body>
+</html>

samples/sqlservices/src/controllers/counter.html

@@ -0,0 +1,21 @@
+<!--
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+-->
+<html>
+    <header>
+
+    </header>
+    <body>
+        <div id="output">Total Counts: 0</div>
+        <script>
+            let output = document.getElementById('output');
+            window.addEventListener("message", receiveMessage, false);
+            function receiveMessage(e) {
+                output.innerText = 'Total Counts: ' + e.data;
+            }
+        </script>
+    </body>
+</html>

samples/sqlservices/src/controllers/mainController.ts

@@ -9,6 +9,8 @@ import * as sqlops from 'sqlops';
 import * as Utils from '../utils';
 import * as vscode from 'vscode';
 import SplitPropertiesPanel from './splitPropertiesPanel';
+import * as fs from 'fs';
+import * as path from 'path';
 
 /**
  * The main controller class that initializes the extension
@@ -33,6 +35,8 @@ export default class MainController implements vscode.Disposable {
 	}
 
 	public activate(): Promise<boolean> {
+		const buttonHtml = fs.readFileSync(path.join(__dirname, 'button.html')).toString();
+		const counterHtml = fs.readFileSync(path.join(__dirname, 'counter.html')).toString();
 		this.registerSqlServicesModelView();
 		this.registerSplitPanelModelView();
 
@@ -40,10 +44,22 @@ export default class MainController implements vscode.Disposable {
 			vscode.window.showInformationMessage(`Clicked from profile ${profile.serverName}.${profile.databaseName}`);
 		});
 
-		vscode.commands.registerCommand('mssql.openDialog', () =>  {
+		vscode.commands.registerCommand('sqlservices.openDialog', () => {
 			this.openDialog();
 		});
 
+		vscode.commands.registerCommand('sqlservices.openEditor', () => {
+			this.openEditor();
+		});
+
+		vscode.commands.registerCommand('sqlservices.openEditorWithWebView', () => {
+			this.openEditorWithWebview(buttonHtml, counterHtml);
+		});
+
+		vscode.commands.registerCommand('sqlservices.openEditorWithWebView2', () => {
+			this.openEditorWithWebview2();
+		});
+
 		return Promise.resolve(true);
 	}
 
@@ -65,83 +81,208 @@ export default class MainController implements vscode.Disposable {
 		dialog.customButtons = [customButton1, customButton2];
 		tab1.registerContent(async (view) => {
 			let inputBox = view.modelBuilder.inputBox()
-			.withProperties({
+				.withProperties({
-				//width: 300
+					//width: 300
-			})
+				}).component();
-			.component();
+			let inputBox2 = view.modelBuilder.inputBox().component();
-			let inputBox2 = view.modelBuilder.inputBox()
-			.component();
-
-			let inputBox3 = view.modelBuilder.inputBox()
-			.component();
 
 			let checkbox = view.modelBuilder.checkBox()
-			.withProperties({
+				.withProperties({
-				label: 'Copy-only backup'
+					label: 'Copy-only backup'
-			})
+				})
-			.component();
+				.component();
 			checkbox.onChanged(e => {
-						console.info("inputBox.enabled " + inputBox.enabled);
+				console.info("inputBox.enabled " + inputBox.enabled);
-						inputBox.enabled = !inputBox.enabled;
+				inputBox.enabled = !inputBox.enabled;
 			});
 			let button = view.modelBuilder.button()
-			.withProperties({
+				.withProperties({
-				label: '+'
+					label: '+'
-			}).component();
+				}).component();
 			let button3 = view.modelBuilder.button()
-			.withProperties({
+				.withProperties({
-			label: '-'
+					label: '-'
 
-			}).component();
+				}).component();
 			let button2 = view.modelBuilder.button()
-			.component();
+				.component();
 			button.onDidClick(e => {
-							inputBox2.value = 'Button clicked';
+				inputBox2.value = 'Button clicked';
 			});
 			let dropdown = view.modelBuilder.dropDown()
-			.withProperties({
+				.withProperties({
-				value: 'Full',
+					value: 'Full',
-				values: ['Full', 'Differential', 'Transaction Log']
+					values: ['Full', 'Differential', 'Transaction Log']
-			})
+				})
-			.component();
+				.component();
 			let f = 0;
 			inputBox.onTextChanged((params) => {
-			vscode.window.showInformationMessage(inputBox.value);
+				vscode.window.showInformationMessage(inputBox.value);
 				f = f + 1;
-				inputBox2.value=f.toString();
+				inputBox2.value = f.toString();
 			});
 			dropdown.onValueChanged((params) => {
-					vscode.window.showInformationMessage(inputBox2.value);
+				vscode.window.showInformationMessage(inputBox2.value);
-					inputBox.value = dropdown.value;
+				inputBox.value = dropdown.value;
 			});
-			let formModel = view.modelBuilder.formContainer()
+			let radioButton = view.modelBuilder.radioButton()
-			.withFormItems([{
+				.withProperties({
-						component: inputBox,
+					value: 'option1',
-						title: 'Backup name'
+					name: 'radioButtonOptions',
+					label: 'Option 1',
+					checked: true
+					//width: 300
+				}).component();
+			let radioButton2 = view.modelBuilder.radioButton()
+				.withProperties({
+					value: 'option2',
+					name: 'radioButtonOptions',
+					label: 'Option 2'
+				}).component();
+			let inputBox3 = view.modelBuilder.inputBox().component();
+			let inputBox4 = view.modelBuilder.inputBox().component();
+			let form2Model = view.modelBuilder.formContainer()
+				.withFormItems([{
+					component: inputBox3,
+					title: 'inputBox3'
 				}, {
-						component: inputBox2,
+					component: inputBox4,
-						title: 'Recovery model'
+					title: 'inputBox4'
-				}, {
-						component:dropdown,
-						title: 'Backup type'
-				}, {
-						component: checkbox,
-						title: ''
-				}, {
-						component: inputBox2,
-						title: 'Backup files',
-						actions: [button, button3]
 				}], {
-						horizontal:false,
+					horizontal: true
-						width: 500,
+				}).component();
-						componentWidth: 400
+			let groupModel1 = view.modelBuilder.groupContainer()
-							}).component();
+				.withLayout({
+				}).withItems([
+					form2Model
+				]).component();
+			radioButton.onDidClick(() => {
+				inputBox.value = radioButton.value;
+				groupModel1.enabled = true;
+			});
+			radioButton2.onDidClick(() => {
+				inputBox.value = radioButton.value;
+				groupModel1.enabled = false;
+			});
+
+			let flexRadioButtonsModel = view.modelBuilder.flexContainer()
+				.withLayout({
+					flexFlow: 'column',
+					alignItems: 'left',
+					height: 50
+				}).withItems([
+					radioButton, groupModel1, radioButton2]
+				, { flex: '1 1 50%' }).component();
+			let formModel = view.modelBuilder.formContainer()
+				.withFormItems([{
+					component: inputBox,
+					title: 'Backup name'
+				}, {
+					component: inputBox2,
+					title: 'Recovery model'
+				}, {
+					component: dropdown,
+					title: 'Backup type'
+				}, {
+					component: checkbox,
+					title: ''
+				}, {
+					component: inputBox2,
+					title: 'Backup files',
+					actions: [button, button3]
+				}, {
+					component: flexRadioButtonsModel,
+					title: 'Options'
+				}], {
+					horizontal: false,
+					componentWidth: 400
+				}).component();
 			await view.initializeModel(formModel);
 		});
 
 		sqlops.window.modelviewdialog.openDialog(dialog);
 	}
 
+	private openEditor(): void {
+		let editor = sqlops.workspace.createModelViewEditor('Test Model View');
+		editor.registerContent(async view => {
+			let inputBox = view.modelBuilder.inputBox()
+				.withValidation(component => component.value !== 'valid')
+				.component();
+			let formModel = view.modelBuilder.formContainer()
+				.withFormItems([{
+					component: inputBox,
+					title: 'Enter anything but "valid"'
+				}]).component();
+			view.onClosed((params) => {
+				vscode.window.showInformationMessage('The model view editor is closed.');
+			});
+			await view.initializeModel(formModel);
+		});
+		editor.openEditor();
+	}
+
+	private openEditorWithWebview(html1: string, html2: string): void {
+		let editor = sqlops.workspace.createModelViewEditor('Editor webview', { retainContextWhenHidden: true });
+		editor.registerContent(async view => {
+			let count = 0;
+			let webview1 = view.modelBuilder.webView()
+				.withProperties({
+					html: html1
+				})
+				.component();
+			let webview2 = view.modelBuilder.webView()
+				.withProperties({
+					html: html2
+				})
+				.component();
+			webview1.onMessage((params) => {
+				count++;
+				webview2.message = count;
+			});
+
+			let flexModel = view.modelBuilder.flexContainer()
+				.withLayout({
+					flexFlow: 'column',
+					alignItems: 'flex-start',
+					height: 500
+				}).withItems([
+					webview1, webview2
+				], { flex: '1 1 50%' })
+				.component();
+			await view.initializeModel(flexModel);
+		});
+		editor.openEditor();
+	}
+
+	private openEditorWithWebview2(): void {
+		let editor = sqlops.workspace.createModelViewEditor('Editor webview2', { retainContextWhenHidden: true });
+		editor.registerContent(async view => {
+
+			let webview = view.modelBuilder.webView()
+				.component();
+			let flexModel = view.modelBuilder.flexContainer()
+				.withLayout({
+					flexFlow: 'column',
+					alignItems: 'stretch',
+					height: '100%'
+				}).withItems([
+					webview
+				], { flex: '1 1 50%' })
+				.component();
+
+			let templateValues = {url: 'http://whoisactive.com/docs/'};
+			Utils.renderTemplateHtml(path.join(__dirname, '..'), 'templateTab.html', templateValues)
+				.then(html => {
+					webview.html = html;
+				});
+
+			await view.initializeModel(flexModel);
+		});
+		editor.openEditor();
+	}
+
+
 	private registerSqlServicesModelView(): void {
 		sqlops.ui.registerModelViewProvider('sqlservices', async (view) => {
 			let flexModel = view.modelBuilder.flexContainer()

samples/sqlservices/src/resources/templateTab.html

@@ -0,0 +1,36 @@
+<!--
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+-->
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <script type="text/javascript">
+        window.onload = function() {
+            document.getElementById('frame').src = "{{{url}}}";
+        };
+    </script>
+    <style>
+        body {
+            margin: 0;
+            padding: 0;
+            width: 100%;
+            height: 100%;
+            overflow: hidden;
+        }
+        #frame {
+            position: absolute;
+            left: 0;
+            right: 0;
+            top: 0;
+            bottom: 0;
+        }
+    </style>
+</head>
+<body>
+    <iframe id="frame" width="100%" height="100%" frameborder="0"></iframe>
+</body>
+</html>

samples/sqlservices/yarn.lock

@@ -19,6 +19,14 @@
     normalize-path "^2.0.1"
     through2 "^2.0.3"
 
+"@types/handlebars@^4.0.11":
+  version "4.0.37"
+  resolved "https://registry.yarnpkg.com/@types/handlebars/-/handlebars-4.0.37.tgz#a3bc3eba0c0f03f753cac00841a5b21e26a02c03"
+
+"@types/node@*":
+  version "10.1.3"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-10.1.3.tgz#5c16980936c4e3c83ce64e8ed71fb37bd7aea135"
+
 "@types/node@^7.0.43":
   version "7.0.58"
   resolved "https://registry.yarnpkg.com/@types/node/-/node-7.0.58.tgz#ae852120137f40a29731a559e48003bd2d5d19f7"
@@ -47,6 +55,14 @@ ajv@^5.1.0:
     fast-json-stable-stringify "^2.0.0"
     json-schema-traverse "^0.3.0"
 
+align-text@^0.1.1, align-text@^0.1.3:
+  version "0.1.4"
+  resolved "https://registry.yarnpkg.com/align-text/-/align-text-0.1.4.tgz#0cd90a561093f35d0a99256c22b7069433fad117"
+  dependencies:
+    kind-of "^3.0.2"
+    longest "^1.0.1"
+    repeat-string "^1.5.2"
+
 amdefine@>=0.0.4:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/amdefine/-/amdefine-1.0.1.tgz#4a5282ac164729e93619bcfd3ad151f817ce91f5"
@@ -115,6 +131,12 @@ are-we-there-yet@~1.1.2:
     delegates "^1.0.0"
     readable-stream "^2.0.6"
 
+argparse@^1.0.7:
+  version "1.0.10"
+  resolved "https://registry.yarnpkg.com/argparse/-/argparse-1.0.10.tgz#bcd6791ea5ae09725e17e5ad988134cd40b3d911"
+  dependencies:
+    sprintf-js "~1.0.2"
+
 arr-diff@^1.0.1:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-1.1.0.tgz#687c32758163588fef7de7b36fabe495eb1a399a"
@@ -250,6 +272,10 @@ async-settle@^1.0.0:
   dependencies:
     async-done "^1.2.2"
 
+async@^1.4.0:
+  version "1.5.2"
+  resolved "https://registry.yarnpkg.com/async/-/async-1.5.2.tgz#ec6a61ae56480c0c3cb241c95618e20892f9672a"
+
 asynckit@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79"
@@ -324,6 +350,10 @@ block-stream@*:
   dependencies:
     inherits "~2.0.0"
 
+boolbase@~1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/boolbase/-/boolbase-1.0.0.tgz#68dff5fbe60c51eb37725ea9e3ed310dcc1e776e"
+
 boom@2.x.x:
   version "2.10.1"
   resolved "https://registry.yarnpkg.com/boom/-/boom-2.10.1.tgz#39c8918ceff5799f83f9492a848f625add0c766f"
@@ -408,6 +438,10 @@ cache-base@^1.0.1:
     union-value "^1.0.0"
     unset-value "^1.0.0"
 
+camelcase@^1.0.2:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-1.2.1.tgz#9bb5304d2e0b56698b2c758b08a3eaa9daa58a39"
+
 camelcase@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-3.0.0.tgz#32fc4b9fcdaf845fcdf7e73bb97cac2261f0ab0a"
@@ -420,6 +454,13 @@ caseless@~0.12.0:
   version "0.12.0"
   resolved "https://registry.yarnpkg.com/caseless/-/caseless-0.12.0.tgz#1b681c21ff84033c826543090689420d187151dc"
 
+center-align@^0.1.1:
+  version "0.1.3"
+  resolved "https://registry.yarnpkg.com/center-align/-/center-align-0.1.3.tgz#aa0d32629b6ee972200411cbd4461c907bc2b7ad"
+  dependencies:
+    align-text "^0.1.3"
+    lazy-cache "^1.0.3"
+
 chalk@^1.0.0, chalk@^1.1.1:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-1.1.3.tgz#a8115c55e4a702fe4d150abd3872822a7e09fc98"
@@ -430,6 +471,17 @@ chalk@^1.0.0, chalk@^1.1.1:
     strip-ansi "^3.0.0"
     supports-color "^2.0.0"
 
+cheerio@^1.0.0-rc.1:
+  version "1.0.0-rc.2"
+  resolved "https://registry.yarnpkg.com/cheerio/-/cheerio-1.0.0-rc.2.tgz#4b9f53a81b27e4d5dac31c0ffd0cfa03cc6830db"
+  dependencies:
+    css-select "~1.2.0"
+    dom-serializer "~0.1.0"
+    entities "~1.1.1"
+    htmlparser2 "^3.9.1"
+    lodash "^4.15.0"
+    parse5 "^3.0.1"
+
 child-process-promise@^2.2.1:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/child-process-promise/-/child-process-promise-2.2.1.tgz#4730a11ef610fad450b8f223c79d31d7bdad8074"
@@ -465,6 +517,14 @@ class-utils@^0.3.5:
     isobject "^3.0.0"
     static-extend "^0.1.1"
 
+cliui@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/cliui/-/cliui-2.1.0.tgz#4b475760ff80264c762c3a1719032e91c7fea0d1"
+  dependencies:
+    center-align "^0.1.1"
+    right-align "^0.1.1"
+    wordwrap "0.0.2"
+
 cliui@^3.2.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/cliui/-/cliui-3.2.0.tgz#120601537a916d29940f934da3b48d585a39213d"
@@ -546,7 +606,7 @@ commander@2.11.0:
   version "2.11.0"
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.11.0.tgz#157152fd1e7a6c8d98a5b715cf376df928004563"
 
-commander@^2.9.0:
+commander@^2.8.1, commander@^2.9.0:
   version "2.15.1"
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.15.1.tgz#df46e867d0fc2aec66a34662b406a9ccafff5b0f"
 
@@ -609,6 +669,19 @@ cryptiles@3.x.x:
   dependencies:
     boom "5.x.x"
 
+css-select@~1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/css-select/-/css-select-1.2.0.tgz#2b3a110539c5355f1cd8d314623e870b121ec858"
+  dependencies:
+    boolbase "~1.0.0"
+    css-what "2.1"
+    domutils "1.5.1"
+    nth-check "~1.0.1"
+
+css-what@2.1:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/css-what/-/css-what-2.1.0.tgz#9467d032c38cfaefb9f2d79501253062f87fa1bd"
+
 css@2.X, css@^2.2.1:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/css/-/css-2.2.1.tgz#73a4c81de85db664d4ee674f7d47085e3b2d55dc"
@@ -654,7 +727,7 @@ debug@^2.2.0, debug@^2.3.3:
   dependencies:
     ms "2.0.0"
 
-decamelize@^1.1.1:
+decamelize@^1.0.0, decamelize@^1.1.1:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/decamelize/-/decamelize-1.2.0.tgz#f6534d15148269b20352e7bee26f501f9a191290"
 
@@ -727,6 +800,10 @@ delegates@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/delegates/-/delegates-1.0.0.tgz#84c6e159b81904fdca59a0ef44cd870d31250f9a"
 
+denodeify@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/denodeify/-/denodeify-1.2.1.tgz#3a36287f5034e699e7577901052c2e6c94251631"
+
 detect-file@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/detect-file/-/detect-file-1.0.0.tgz#f0d66d03672a825cb1b73bdb3fe62310c8e552b7"
@@ -747,6 +824,41 @@ diff@^2.2.1:
   version "2.2.3"
   resolved "https://registry.yarnpkg.com/diff/-/diff-2.2.3.tgz#60eafd0d28ee906e4e8ff0a52c1229521033bf99"
 
+dom-serializer@0, dom-serializer@~0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.1.0.tgz#073c697546ce0780ce23be4a28e293e40bc30c82"
+  dependencies:
+    domelementtype "~1.1.1"
+    entities "~1.1.1"
+
+domelementtype@1, domelementtype@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-1.3.0.tgz#b17aed82e8ab59e52dd9c19b1756e0fc187204c2"
+
+domelementtype@~1.1.1:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-1.1.3.tgz#bd28773e2642881aec51544924299c5cd822185b"
+
+domhandler@^2.3.0:
+  version "2.4.2"
+  resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-2.4.2.tgz#8805097e933d65e85546f726d60f5eb88b44f803"
+  dependencies:
+    domelementtype "1"
+
+domutils@1.5.1:
+  version "1.5.1"
+  resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.5.1.tgz#dcd8488a26f563d61079e48c9f7b7e32373682cf"
+  dependencies:
+    dom-serializer "0"
+    domelementtype "1"
+
+domutils@^1.5.1:
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.7.0.tgz#56ea341e834e06e6748af7a1cb25da67ea9f8c2a"
+  dependencies:
+    dom-serializer "0"
+    domelementtype "1"
+
 duplexer2@0.0.2:
   version "0.0.2"
   resolved "https://registry.yarnpkg.com/duplexer2/-/duplexer2-0.0.2.tgz#c614dcf67e2fb14995a91711e5a617e8a60a31db"
@@ -785,6 +897,10 @@ end-of-stream@^1.0.0, end-of-stream@^1.1.0:
   dependencies:
     once "^1.4.0"
 
+entities@^1.1.1, entities@~1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/entities/-/entities-1.1.1.tgz#6e5c2d0a5621b5dadaecef80b90edfb5cd7772f0"
+
 error-ex@^1.2.0:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/error-ex/-/error-ex-1.3.1.tgz#f855a86ce61adc4e8621c3cda21e7a7612c3a8dc"
@@ -834,7 +950,7 @@ event-emitter@^0.3.5:
     d "1"
     es5-ext "~0.10.14"
 
-event-stream@^3.3.1, event-stream@~3.3.4:
+event-stream@^3.3.1, event-stream@^3.3.4, event-stream@~3.3.4:
   version "3.3.4"
   resolved "http://registry.npmjs.org/event-stream/-/event-stream-3.3.4.tgz#4ab4c9a0f5a54db9338b4c34d86bfce8f4b35571"
   dependencies:
@@ -1068,6 +1184,14 @@ from@~0:
   version "0.1.7"
   resolved "https://registry.yarnpkg.com/from/-/from-0.1.7.tgz#83c60afc58b9c56997007ed1a768b3ab303a44fe"
 
+fs-extra@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-5.0.0.tgz#414d0110cdd06705734d055652c5411260c31abd"
+  dependencies:
+    graceful-fs "^4.1.2"
+    jsonfile "^4.0.0"
+    universalify "^0.1.0"
+
 fs-mkdirp-stream@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/fs-mkdirp-stream/-/fs-mkdirp-stream-1.0.0.tgz#0b7815fc3201c6a69e14db98ce098c16935259eb"
@@ -1201,7 +1325,7 @@ glob-watcher@^5.0.0:
     just-debounce "^1.0.0"
     object.defaults "^1.1.0"
 
-glob@7.1.2, glob@^7.0.3, glob@^7.0.5, glob@^7.1.1, glob@^7.1.2:
+glob@7.1.2, glob@^7.0.3, glob@^7.0.5, glob@^7.0.6, glob@^7.1.1, glob@^7.1.2:
   version "7.1.2"
   resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.2.tgz#c19c9df9a028702d678612384a6552404c636d15"
   dependencies:
@@ -1314,6 +1438,16 @@ gulp-gunzip@1.0.0:
     through2 "~0.6.5"
     vinyl "~0.4.6"
 
+gulp-remote-src-vscode@^0.5.0:
+  version "0.5.0"
+  resolved "https://registry.yarnpkg.com/gulp-remote-src-vscode/-/gulp-remote-src-vscode-0.5.0.tgz#71785553bc491880088ad971f90910c4b2d80a99"
+  dependencies:
+    event-stream "^3.3.4"
+    node.extend "^1.1.2"
+    request "^2.79.0"
+    through2 "^2.0.3"
+    vinyl "^2.0.1"
+
 gulp-remote-src@^0.4.3:
   version "0.4.3"
   resolved "https://registry.yarnpkg.com/gulp-remote-src/-/gulp-remote-src-0.4.3.tgz#5728cfd643433dd4845ddef0969f0f971a2ab4a1"
@@ -1386,6 +1520,16 @@ gulp-untar@^0.0.6:
     tar "^2.2.1"
     through2 "~2.0.3"
 
+gulp-untar@^0.0.7:
+  version "0.0.7"
+  resolved "https://registry.yarnpkg.com/gulp-untar/-/gulp-untar-0.0.7.tgz#92067d79e0fa1e92d60562a100233a44a5aa08b4"
+  dependencies:
+    event-stream "~3.3.4"
+    streamifier "~0.1.1"
+    tar "^2.2.1"
+    through2 "~2.0.3"
+    vinyl "^1.2.0"
+
 gulp-util@~3.0.7, gulp-util@~3.0.8:
   version "3.0.8"
   resolved "https://registry.yarnpkg.com/gulp-util/-/gulp-util-3.0.8.tgz#0054e1e744502e27c04c187c3ecc505dd54bbb4f"
@@ -1436,6 +1580,16 @@ gulplog@^1.0.0:
   dependencies:
     glogg "^1.0.0"
 
+handlebars@^4.0.11:
+  version "4.0.11"
+  resolved "https://registry.yarnpkg.com/handlebars/-/handlebars-4.0.11.tgz#630a35dfe0294bc281edae6ffc5d329fc7982dcc"
+  dependencies:
+    async "^1.4.0"
+    optimist "^0.6.1"
+    source-map "^0.4.4"
+  optionalDependencies:
+    uglify-js "^2.6"
+
 har-schema@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/har-schema/-/har-schema-1.0.5.tgz#d263135f43307c02c602afc8fe95970c0151369e"
@@ -1558,6 +1712,17 @@ hosted-git-info@^2.1.4:
   version "2.6.0"
   resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.6.0.tgz#23235b29ab230c576aab0d4f13fc046b0b038222"
 
+htmlparser2@^3.9.1:
+  version "3.9.2"
+  resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-3.9.2.tgz#1bdf87acca0f3f9e53fa4fcceb0f4b4cbb00b338"
+  dependencies:
+    domelementtype "^1.3.0"
+    domhandler "^2.3.0"
+    domutils "^1.5.1"
+    entities "^1.1.1"
+    inherits "^2.0.1"
+    readable-stream "^2.0.2"
+
 http-signature@~1.1.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/http-signature/-/http-signature-1.1.1.tgz#df72e267066cd0ac67fb76adf8e134a8fbcf91bf"
@@ -1886,6 +2051,12 @@ json-stringify-safe@~5.0.1:
   version "5.0.1"
   resolved "https://registry.yarnpkg.com/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz#1296a2d58fd45f19a0f6ce01d65701e2c735b6eb"
 
+jsonfile@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-4.0.0.tgz#8771aae0799b64076b76640fca058f9c10e33ecb"
+  optionalDependencies:
+    graceful-fs "^4.1.6"
+
 jsonify@~0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/jsonify/-/jsonify-0.0.0.tgz#2c74b6ee41d93ca51b7b5aaee8f503631d252a73"
@@ -1938,6 +2109,10 @@ last-run@^1.1.0:
     default-resolution "^2.0.0"
     es6-weak-map "^2.0.1"
 
+lazy-cache@^1.0.3:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/lazy-cache/-/lazy-cache-1.0.4.tgz#a1d78fc3a50474cb80845d3b3b6e1da49a446e8e"
+
 lazystream@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/lazystream/-/lazystream-1.0.0.tgz#f6995fe0f820392f61396be89462407bb77168e4"
@@ -1969,6 +2144,12 @@ liftoff@^2.5.0:
     rechoir "^0.6.2"
     resolve "^1.1.7"
 
+linkify-it@^2.0.0:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/linkify-it/-/linkify-it-2.0.3.tgz#d94a4648f9b1c179d64fa97291268bdb6ce9434f"
+  dependencies:
+    uc.micro "^1.0.1"
+
 load-json-file@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-1.1.0.tgz#956905708d58b4bab4c2261b04f59f31c99374c0"
@@ -2066,6 +2247,14 @@ lodash.templatesettings@^3.0.0:
     lodash._reinterpolate "^3.0.0"
     lodash.escape "^3.0.0"
 
+lodash@^4.15.0:
+  version "4.17.10"
+  resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.10.tgz#1b7793cf7259ea38fb3661d4d38b3260af8ae4e7"
+
+longest@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/longest/-/longest-1.0.1.tgz#30a0b2da38f73770e8294a0d22e6625ed77d0097"
+
 lru-cache@^4.0.1:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-4.1.2.tgz#45234b2e6e2f2b33da125624c4664929a0224c3f"
@@ -2099,6 +2288,16 @@ map-visit@^1.0.0:
   dependencies:
     object-visit "^1.0.0"
 
+markdown-it@^8.3.1:
+  version "8.4.1"
+  resolved "https://registry.yarnpkg.com/markdown-it/-/markdown-it-8.4.1.tgz#206fe59b0e4e1b78a7c73250af9b34a4ad0aaf44"
+  dependencies:
+    argparse "^1.0.7"
+    entities "~1.1.1"
+    linkify-it "^2.0.0"
+    mdurl "^1.0.1"
+    uc.micro "^1.0.5"
+
 matchdep@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/matchdep/-/matchdep-2.0.0.tgz#c6f34834a0d8dbc3b37c27ee8bbcb27c7775582e"
@@ -2108,6 +2307,10 @@ matchdep@^2.0.0:
     resolve "^1.4.0"
     stack-trace "0.0.10"
 
+mdurl@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/mdurl/-/mdurl-1.0.1.tgz#fe85b2ec75a59037f2adfec100fd6c601761152e"
+
 memoizee@0.4.X:
   version "0.4.12"
   resolved "https://registry.yarnpkg.com/memoizee/-/memoizee-0.4.12.tgz#780e99a219c50c549be6d0fc61765080975c58fb"
@@ -2173,7 +2376,11 @@ mime-types@^2.1.12, mime-types@~2.1.17, mime-types@~2.1.7:
   dependencies:
     mime-db "~1.33.0"
 
-"minimatch@2 || 3", minimatch@^3.0.0, minimatch@^3.0.2, minimatch@^3.0.4:
+mime@^1.3.4:
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/mime/-/mime-1.6.0.tgz#32cd9e5c64553bd58d19a568af452acff04981b1"
+
+"minimatch@2 || 3", minimatch@^3.0.0, minimatch@^3.0.2, minimatch@^3.0.3, minimatch@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.4.tgz#5166e286457f03306064be5497e8dbb0c3d32083"
   dependencies:
@@ -2242,6 +2449,10 @@ mute-stdout@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/mute-stdout/-/mute-stdout-1.0.0.tgz#5b32ea07eb43c9ded6130434cf926f46b2a7fd4d"
 
+mute-stream@~0.0.4:
+  version "0.0.7"
+  resolved "https://registry.yarnpkg.com/mute-stream/-/mute-stream-0.0.7.tgz#3075ce93bc21b8fab43e1bc4da7e8115ed1e7bab"
+
 nan@^2.3.0:
   version "2.10.0"
   resolved "https://registry.yarnpkg.com/nan/-/nan-2.10.0.tgz#96d0cd610ebd58d4b4de9cc0c6828cda99c7548f"
@@ -2287,7 +2498,7 @@ node-version@^1.0.0:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/node-version/-/node-version-1.1.3.tgz#1081c87cce6d2dbbd61d0e51e28c287782678496"
 
-node.extend@~1.1.2:
+node.extend@^1.1.2, node.extend@~1.1.2:
   version "1.1.6"
   resolved "https://registry.yarnpkg.com/node.extend/-/node.extend-1.1.6.tgz#a7b882c82d6c93a4863a5504bd5de8ec86258b96"
   dependencies:
@@ -2330,6 +2541,12 @@ npmlog@^4.0.2:
     gauge "~2.7.3"
     set-blocking "~2.0.0"
 
+nth-check@~1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/nth-check/-/nth-check-1.0.1.tgz#9929acdf628fc2c41098deab82ac580cf149aae4"
+  dependencies:
+    boolbase "~1.0.0"
+
 number-is-nan@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/number-is-nan/-/number-is-nan-1.0.1.tgz#097b602b53422a522c1afb8790318336941a011d"
@@ -2415,7 +2632,7 @@ once@^1.3.0, once@^1.3.1, once@^1.3.2, once@^1.3.3, once@^1.4.0:
   dependencies:
     wrappy "1"
 
-optimist@~0.6.0:
+optimist@^0.6.1, optimist@~0.6.0:
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/optimist/-/optimist-0.6.1.tgz#da3ea74686fa21a19a111c326e90eb15a0196686"
   dependencies:
@@ -2445,11 +2662,11 @@ os-locale@^1.4.0:
   dependencies:
     lcid "^1.0.0"
 
-os-tmpdir@^1.0.0:
+os-tmpdir@^1.0.0, os-tmpdir@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/os-tmpdir/-/os-tmpdir-1.0.2.tgz#bbe67406c79aa85c5cfec766fe5734555dfa1274"
 
-osenv@^0.1.4:
+osenv@^0.1.3, osenv@^0.1.4:
   version "0.1.5"
   resolved "https://registry.yarnpkg.com/osenv/-/osenv-0.1.5.tgz#85cdfafaeb28e8677f416e287592b5f3f49ea410"
   dependencies:
@@ -2487,6 +2704,18 @@ parse-passwd@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/parse-passwd/-/parse-passwd-1.0.0.tgz#6d5b934a456993b23d37f40a382d6f1666a8e5c6"
 
+parse-semver@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/parse-semver/-/parse-semver-1.1.1.tgz#9a4afd6df063dc4826f93fba4a99cf223f666cb8"
+  dependencies:
+    semver "^5.1.0"
+
+parse5@^3.0.1:
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/parse5/-/parse5-3.0.3.tgz#042f792ffdd36851551cf4e9e066b3874ab45b5c"
+  dependencies:
+    "@types/node" "*"
+
 pascalcase@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/pascalcase/-/pascalcase-0.1.1.tgz#b363e55e8006ca6fe21784d2db22bd15d7917f14"
@@ -2683,6 +2912,12 @@ read-pkg@^1.0.0:
     normalize-package-data "^2.3.2"
     path-type "^1.0.0"
 
+read@^1.0.7:
+  version "1.0.7"
+  resolved "https://registry.yarnpkg.com/read/-/read-1.0.7.tgz#b3da19bd052431a97671d44a42634adf710b40c4"
+  dependencies:
+    mute-stream "~0.0.4"
+
 "readable-stream@>=1.0.33-1 <1.1.0-0":
   version "1.0.34"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-1.0.34.tgz#125820e34bc842d2f2aaafafe4c2916ee32c157c"
@@ -2811,6 +3046,31 @@ request@2.81.0:
     tunnel-agent "^0.6.0"
     uuid "^3.0.0"
 
+request@^2.79.0:
+  version "2.87.0"
+  resolved "https://registry.yarnpkg.com/request/-/request-2.87.0.tgz#32f00235cd08d482b4d0d68db93a829c0ed5756e"
+  dependencies:
+    aws-sign2 "~0.7.0"
+    aws4 "^1.6.0"
+    caseless "~0.12.0"
+    combined-stream "~1.0.5"
+    extend "~3.0.1"
+    forever-agent "~0.6.1"
+    form-data "~2.3.1"
+    har-validator "~5.0.3"
+    http-signature "~1.2.0"
+    is-typedarray "~1.0.0"
+    isstream "~0.1.2"
+    json-stringify-safe "~5.0.1"
+    mime-types "~2.1.17"
+    oauth-sign "~0.8.2"
+    performance-now "^2.1.0"
+    qs "~6.5.1"
+    safe-buffer "^5.1.1"
+    tough-cookie "~2.3.3"
+    tunnel-agent "^0.6.0"
+    uuid "^3.1.0"
+
 request@^2.83.0:
   version "2.85.0"
   resolved "https://registry.yarnpkg.com/request/-/request-2.85.0.tgz#5a03615a47c61420b3eb99b7dba204f83603e1fa"
@@ -2902,6 +3162,12 @@ ret@~0.1.10:
   version "0.1.15"
   resolved "https://registry.yarnpkg.com/ret/-/ret-0.1.15.tgz#b8a4825d5bdb1fc3f6f53c2bc33f81388681c7bc"
 
+right-align@^0.1.1:
+  version "0.1.3"
+  resolved "https://registry.yarnpkg.com/right-align/-/right-align-0.1.3.tgz#61339b722fe6a3515689210d24e14c96148613ef"
+  dependencies:
+    align-text "^0.1.1"
+
 rimraf@2, rimraf@^2.2.8, rimraf@^2.5.1, rimraf@^2.6.1:
   version "2.6.2"
   resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.6.2.tgz#2ed8150d24a16ea8651e6d6ef0f47c4158ce7a36"
@@ -2924,7 +3190,7 @@ semver-greatest-satisfied-range@^1.1.0:
   dependencies:
     sver-compat "^1.5.0"
 
-"semver@2 || 3 || 4 || 5", semver@^5.3.0, semver@^5.4.1:
+"semver@2 || 3 || 4 || 5", semver@^5.1.0, semver@^5.3.0, semver@^5.4.1:
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.5.0.tgz#dc4bbc7a6ca9d916dee5d43516f0092b58f7b8ab"
 
@@ -3036,7 +3302,13 @@ source-map@^0.1.38:
   dependencies:
     amdefine ">=0.0.4"
 
-source-map@^0.5.6, source-map@~0.5.3:
+source-map@^0.4.4:
+  version "0.4.4"
+  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.4.4.tgz#eba4f5da9c0dc999de68032d8b4f76173652036b"
+  dependencies:
+    amdefine ">=0.0.4"
+
+source-map@^0.5.6, source-map@~0.5.1, source-map@~0.5.3:
   version "0.5.7"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
 
@@ -3086,6 +3358,10 @@ sprintf-js@^1.0.3:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.1.1.tgz#36be78320afe5801f6cea3ee78b6e5aab940ea0c"
 
+sprintf-js@~1.0.2:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c"
+
 "sqlops@github:anthonydresser/sqlops-extension-sqlops":
   version "1.1.11"
   resolved "https://codeload.github.com/anthonydresser/sqlops-extension-sqlops/tar.gz/dac501bbaa03a25239c060c6371dfdcf06707599"
@@ -3281,6 +3557,12 @@ timers-ext@^0.1.2:
     es5-ext "~0.10.14"
     next-tick "1"
 
+tmp@0.0.29:
+  version "0.0.29"
+  resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.0.29.tgz#f25125ff0dd9da3ccb0c2dd371ee1288bb9128c0"
+  dependencies:
+    os-tmpdir "~1.0.1"
+
 to-absolute-glob@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/to-absolute-glob/-/to-absolute-glob-0.1.1.tgz#1cdfa472a9ef50c239ee66999b662ca0eb39937f"
@@ -3350,10 +3632,21 @@ tunnel-agent@~0.4.1:
   version "0.4.3"
   resolved "https://registry.yarnpkg.com/tunnel-agent/-/tunnel-agent-0.4.3.tgz#6373db76909fe570e08d73583365ed828a74eeeb"
 
+tunnel@0.0.4:
+  version "0.0.4"
+  resolved "https://registry.yarnpkg.com/tunnel/-/tunnel-0.0.4.tgz#2d3785a158c174c9a16dc2c046ec5fc5f1742213"
+
 tweetnacl@^0.14.3, tweetnacl@~0.14.0:
   version "0.14.5"
   resolved "https://registry.yarnpkg.com/tweetnacl/-/tweetnacl-0.14.5.tgz#5ae68177f192d4456269d108afa93ff8743f4f64"
 
+typed-rest-client@^0.12.0:
+  version "0.12.0"
+  resolved "https://registry.yarnpkg.com/typed-rest-client/-/typed-rest-client-0.12.0.tgz#6376f5527f427da121dcafdfd7e41e1321e0720c"
+  dependencies:
+    tunnel "0.0.4"
+    underscore "1.8.3"
+
 typedarray@^0.0.6:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
@@ -3362,6 +3655,23 @@ typescript@^2.6.1:
   version "2.8.1"
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-2.8.1.tgz#6160e4f8f195d5ba81d4876f9c0cc1fbc0820624"
 
+uc.micro@^1.0.1, uc.micro@^1.0.5:
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/uc.micro/-/uc.micro-1.0.5.tgz#0c65f15f815aa08b560a61ce8b4db7ffc3f45376"
+
+uglify-js@^2.6:
+  version "2.8.29"
+  resolved "https://registry.yarnpkg.com/uglify-js/-/uglify-js-2.8.29.tgz#29c5733148057bb4e1f75df35b7a9cb72e6a59dd"
+  dependencies:
+    source-map "~0.5.1"
+    yargs "~3.10.0"
+  optionalDependencies:
+    uglify-to-browserify "~1.0.0"
+
+uglify-to-browserify@~1.0.0:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz#6e0924d6bda6b5afe349e39a6d632850a0f882b7"
+
 uid-number@^0.0.6:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/uid-number/-/uid-number-0.0.6.tgz#0ea10e8035e8eb5b8e4449f06da1c730663baa81"
@@ -3377,6 +3687,10 @@ underscore.string@^3.3.4:
     sprintf-js "^1.0.3"
     util-deprecate "^1.0.2"
 
+underscore@1.8.3:
+  version "1.8.3"
+  resolved "https://registry.yarnpkg.com/underscore/-/underscore-1.8.3.tgz#4f3fb53b106e6097fcf9cb4109f2a5e9bdfa5022"
+
 undertaker-registry@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/undertaker-registry/-/undertaker-registry-1.0.1.tgz#5e4bda308e4a8a2ae584f9b9a4359a499825cc50"
@@ -3411,6 +3725,10 @@ unique-stream@^2.0.2:
     json-stable-stringify "^1.0.0"
     through2-filter "^2.0.0"
 
+universalify@^0.1.0:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/universalify/-/universalify-0.1.1.tgz#fa71badd4437af4c148841e3b3b165f9e9e590b7"
+
 unset-value@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/unset-value/-/unset-value-1.0.0.tgz#8376873f7d2335179ffb1e6fc3a8ed0dfc8ab559"
@@ -3426,6 +3744,10 @@ urix@^0.1.0, urix@~0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/urix/-/urix-0.1.0.tgz#da937f7a62e21fec1fd18d49b35c2935067a6c72"
 
+url-join@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/url-join/-/url-join-1.1.0.tgz#741c6c2f4596c4830d6718460920d0c92202dc78"
+
 url-parse@^1.1.9:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.2.0.tgz#3a19e8aaa6d023ddd27dcc44cb4fc8f7fec23986"
@@ -3554,7 +3876,7 @@ vinyl@^0.5.0:
     clone-stats "^0.0.1"
     replace-ext "0.0.1"
 
-vinyl@^1.0.0:
+vinyl@^1.0.0, vinyl@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/vinyl/-/vinyl-1.2.0.tgz#5c88036cf565e5df05558bfc911f8656df218884"
   dependencies:
@@ -3562,7 +3884,7 @@ vinyl@^1.0.0:
     clone-stats "^0.0.1"
     replace-ext "0.0.1"
 
-vinyl@^2.0.0, vinyl@^2.0.2:
+vinyl@^2.0.0, vinyl@^2.0.1, vinyl@^2.0.2:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/vinyl/-/vinyl-2.1.0.tgz#021f9c2cf951d6b939943c89eb5ee5add4fd924c"
   dependencies:
@@ -3585,21 +3907,43 @@ vinyl@~2.0.1:
     remove-trailing-separator "^1.0.1"
     replace-ext "^1.0.0"
 
+vsce@1.36.2:
+  version "1.36.2"
+  resolved "https://registry.yarnpkg.com/vsce/-/vsce-1.36.2.tgz#dfcfca722bc6aa6bfcbffb1efd23176ba99b2944"
+  dependencies:
+    cheerio "^1.0.0-rc.1"
+    commander "^2.8.1"
+    denodeify "^1.2.1"
+    glob "^7.0.6"
+    lodash "^4.15.0"
+    markdown-it "^8.3.1"
+    mime "^1.3.4"
+    minimatch "^3.0.3"
+    osenv "^0.1.3"
+    parse-semver "^1.1.1"
+    read "^1.0.7"
+    semver "^5.1.0"
+    tmp "0.0.29"
+    url-join "^1.1.0"
+    vso-node-api "^6.1.2-preview"
+    yauzl "^2.3.1"
+    yazl "^2.2.2"
+
 vscode-nls@^3.2.2:
   version "3.2.2"
   resolved "https://registry.yarnpkg.com/vscode-nls/-/vscode-nls-3.2.2.tgz#3817eca5b985c2393de325197cf4e15eb2aa5350"
 
-vscode@^1.1.6:
+vscode@^1.1.14:
-  version "1.1.14"
+  version "1.1.18"
-  resolved "https://registry.yarnpkg.com/vscode/-/vscode-1.1.14.tgz#f327f5fd45c085d12def616962af205b2bc75db5"
+  resolved "https://registry.yarnpkg.com/vscode/-/vscode-1.1.18.tgz#e9227265dc72fc826bd6cd7bd21193f4e48fa671"
   dependencies:
     glob "^7.1.2"
     gulp-chmod "^2.0.0"
     gulp-filter "^5.0.1"
     gulp-gunzip "1.0.0"
-    gulp-remote-src "^0.4.3"
+    gulp-remote-src-vscode "^0.5.0"
     gulp-symdest "^1.1.0"
-    gulp-untar "^0.0.6"
+    gulp-untar "^0.0.7"
     gulp-vinyl-zip "^2.1.0"
     mocha "^4.0.1"
     request "^2.83.0"
@@ -3608,6 +3952,14 @@ vscode@^1.1.6:
     url-parse "^1.1.9"
     vinyl-source-stream "^1.1.0"
 
+vso-node-api@^6.1.2-preview:
+  version "6.5.0"
+  resolved "https://registry.yarnpkg.com/vso-node-api/-/vso-node-api-6.5.0.tgz#5f3453f27d211b0fd54423c4c73116c1e8fea0c6"
+  dependencies:
+    tunnel "0.0.4"
+    typed-rest-client "^0.12.0"
+    underscore "1.8.3"
+
 which-module@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/which-module/-/which-module-1.0.0.tgz#bba63ca861948994ff307736089e3b96026c2a4f"
@@ -3624,6 +3976,14 @@ wide-align@^1.1.0:
   dependencies:
     string-width "^1.0.2"
 
+window-size@0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/window-size/-/window-size-0.1.0.tgz#5438cd2ea93b202efa3a19fe8887aee7c94f9c9d"
+
+wordwrap@0.0.2:
+  version "0.0.2"
+  resolved "https://registry.yarnpkg.com/wordwrap/-/wordwrap-0.0.2.tgz#b79669bb42ecb409f83d583cad52ca17eaa1643f"
+
 wordwrap@~0.0.2:
   version "0.0.3"
   resolved "https://registry.yarnpkg.com/wordwrap/-/wordwrap-0.0.3.tgz#a3d5da6cd5c0bc0008d37234bbaf1bed63059107"
@@ -3675,14 +4035,23 @@ yargs@^7.1.0:
     y18n "^3.2.1"
     yargs-parser "^5.0.0"
 
-yauzl@^2.2.1:
+yargs@~3.10.0:
+  version "3.10.0"
+  resolved "https://registry.yarnpkg.com/yargs/-/yargs-3.10.0.tgz#f7ee7bd857dd7c1d2d38c0e74efbd681d1431fd1"
+  dependencies:
+    camelcase "^1.0.2"
+    cliui "^2.1.0"
+    decamelize "^1.0.0"
+    window-size "0.1.0"
+
+yauzl@^2.2.1, yauzl@^2.3.1:
   version "2.9.1"
   resolved "https://registry.yarnpkg.com/yauzl/-/yauzl-2.9.1.tgz#a81981ea70a57946133883f029c5821a89359a7f"
   dependencies:
     buffer-crc32 "~0.2.3"
     fd-slicer "~1.0.1"
 
-yazl@^2.2.1:
+yazl@^2.2.1, yazl@^2.2.2:
   version "2.4.3"
   resolved "https://registry.yarnpkg.com/yazl/-/yazl-2.4.3.tgz#ec26e5cc87d5601b9df8432dbdd3cd2e5173a071"
   dependencies:

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

@@ -50,8 +50,8 @@ let idPool = 0;
 			<div *ngIf="!options.showTabsWhenOne ? _tabs.length !== 1 : true" class="composite title">
 				<div class="tabContainer">
 					<div class="tabList" role="tablist" scrollable [horizontalScroll]="ScrollbarVisibility.Auto" [verticalScroll]="ScrollbarVisibility.Hidden" [scrollYToX]="true">
-						<div *ngFor="let tab of _tabs">
+						<div role="presentation" *ngFor="let tab of _tabs">
-							<tab-header [active]="_activeTab === tab" [tab]="tab" [showIcon]="options.showIcon" (onSelectTab)='selectTab($event)' (onCloseTab)='closeTab($event)'> </tab-header>
+							<tab-header role="presentation" [active]="_activeTab === tab" [tab]="tab" [showIcon]="options.showIcon" (onSelectTab)='selectTab($event)' (onCloseTab)='closeTab($event)'></tab-header>
 						</div>
 					</div>
 				</div>

src/sql/base/browser/ui/panel/panel.ts

@@ -66,6 +66,8 @@ export class TabbedPanel extends Disposable implements IThemable {
 		this.$header.append(actionbarcontainer);
 		this.$parent.append(this.$header);
 		this.$body = $('tabBody');
+		this.$body.attr('role', 'tabpanel');
+		this.$body.attr('tabindex', '0');
 		this.$parent.append(this.$body);
 	}
 
@@ -92,7 +94,7 @@ export class TabbedPanel extends Disposable implements IThemable {
 		tabHeaderElement.attr('tabindex', '0');
 		tabHeaderElement.attr('role', 'tab');
 		tabHeaderElement.attr('aria-selected', 'false');
-		tabHeaderElement.attr('aria-label', tab.title);
+		tabHeaderElement.attr('aria-controls', tab.identifier);
 		let tabElement = $('.tab');
 		tabHeaderElement.append(tabElement);
 		let tabLabel = $('a.tabLabel');
@@ -124,6 +126,7 @@ export class TabbedPanel extends Disposable implements IThemable {
 		this._shownTab = id;
 		this.$body.clearChildren();
 		let tab = this._tabMap.get(this._shownTab);
+		this.$body.attr('aria-labelledby', tab.identifier);
 		tab.label.addClass('active');
 		tab.header.addClass('active');
 		tab.header.attr('aria-selected', 'true');

src/sql/base/browser/ui/panel/tab.component.ts

@@ -13,7 +13,7 @@ export abstract class TabChild {
 @Component({
 	selector: 'tab',
 	template: `
-		<div class="visibility" [class.hidden]="shouldBeHidden()" *ngIf="shouldBeIfed()" class="fullsize">
+		<div role="tabpanel" [attr.aria-labelledby]="identifier" tabindex="0" class="visibility" [class.hidden]="shouldBeHidden()" *ngIf="shouldBeIfed()" class="fullsize">
 			<ng-container *ngTemplateOutlet="templateRef"></ng-container>
 		</div>
 	`

src/sql/base/browser/ui/panel/tabHeader.component.ts

@@ -19,8 +19,8 @@ import { CloseTabAction } from './tabActions';
 @Component({
 	selector: 'tab-header',
 	template: `
-		<div #actionHeader class="tab-header" style="flex: 0 0; flex-direction: row; height: 100%" [class.active]="tab.active" tabindex="0" (keyup)="onKey($event)">
+		<div #actionHeader role="presentation" class="tab-header" style="flex: 0 0; flex-direction: row; height: 100%" [class.active]="tab.active" tabindex="0" (keyup)="onKey($event)">
-			<span class="tab" (click)="selectTab(tab)" role="tab" [attr.aria-selected]="tab.active" [attr.aria-label]="tab.title">
+			<span class="tab" (click)="selectTab(tab)" role="tab" [attr.aria-selected]="tab.active" [attr.aria-controls]="tab.title">
 				<a class="tabLabel" [class.active]="tab.active" #tabLabel>
 				</a>
 			</span>

src/sql/base/browser/ui/radioButton/radioButton.ts

@@ -0,0 +1,83 @@
+/*---------------------------------------------------------------------------------------------
+ *  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 * as DOM from 'vs/base/browser/dom';
+import { IContextViewProvider } from 'vs/base/browser/ui/contextview/contextview';
+import { Color } from 'vs/base/common/color';
+import { InputBox } from 'vs/base/browser/ui/inputbox/inputBox';
+import Event, { Emitter } from 'vs/base/common/event';
+import { Widget } from 'vs/base/browser/ui/widget';
+
+export interface IRadioButtonOptions {
+	label: string;
+	enabled?: boolean;
+	checked?: boolean;
+}
+
+export class RadioButton extends Widget {
+
+	private inputElement: HTMLInputElement;
+	private _onClicked = new Emitter<void>();
+	public readonly onClicked: Event<void> = this._onClicked.event;
+	private _label: HTMLSpanElement;
+
+	constructor(container: HTMLElement, opts: IRadioButtonOptions) {
+		super();
+		this.inputElement = document.createElement('input');
+		this.inputElement.type = 'radio';
+
+		this._label = document.createElement('span');
+
+		this.label = opts.label;
+		this.enabled = opts.enabled || true;
+		this.checked = opts.checked || false;
+		this.onclick(this.inputElement, () => this._onClicked.fire());
+
+		container.appendChild(this.inputElement);
+		container.appendChild(this._label);
+	}
+
+	public set name(value: string) {
+		this.inputElement.setAttribute('name', value);
+	}
+
+	public get name(): string {
+		return this.inputElement.getAttribute('name');
+	}
+
+	public set value(value: string) {
+		this.inputElement.setAttribute('value', value);
+	}
+
+	public get value(): string {
+		return this.inputElement.getAttribute('value');
+	}
+
+	public set checked(val: boolean) {
+		this.inputElement.checked = val;
+	}
+
+	public get checked(): boolean {
+		return this.inputElement.checked;
+	}
+
+	public set enabled(val: boolean) {
+		this.inputElement.disabled = !val;
+	}
+
+	public get enabled(): boolean {
+		return !this.inputElement.disabled;
+	}
+
+	public isEnabled(): boolean {
+		return !this.inputElement.hasAttribute('disabled');
+	}
+
+	public set label(val: string) {
+		this._label.innerText = val;
+	}
+
+}

src/sql/base/browser/ui/table/plugins/autoSizeColumns.plugin.ts

@@ -67,7 +67,7 @@ export class AutoColumnSize<T> implements Slick.Plugin<T> {
 		let rowEl = this.createRow(columnDef);
 		let data = this._grid.getData();
 		let viewPort = this._grid.getViewport();
-		let start = Math.max(0, viewPort.top + 1);
+		let start = Math.max(0, viewPort.top);
 		let end = Math.min(data.getLength(), viewPort.bottom);
 		for (let i = start; i < end; i++) {
 			texts.push(data.getItem(i)[columnDef.field]);

src/sql/parts/accountManagement/firewallRuleDialog/firewallRuleDialog.ts

@@ -205,11 +205,11 @@ export class FirewallRuleDialog extends Modal {
 		this._register(this._themeService.onDidColorThemeChange(e => this.updateTheme(e)));
 		this.updateTheme(this._themeService.getColorTheme());
 
-		jQuery(this._IPAddressInput).on('click', () => {
+		$(this._IPAddressInput).on(DOM.EventType.CLICK, () => {
 			this.onFirewallRuleOptionSelected(true);
 		});
 
-		jQuery(this._subnetIPRangeInput).on('click', () => {
+		$(this._subnetIPRangeInput).on(DOM.EventType.CLICK, () => {
 			this.onFirewallRuleOptionSelected(false);
 		});
 	}

src/sql/parts/admin/database/create/createDatabase.component.ts

@@ -5,8 +5,8 @@
 
 import { ChangeDetectorRef, ElementRef, Component, forwardRef, Inject } from '@angular/core';
 import { NgForm } from '@angular/forms';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
+
-import { TaskDialogComponentParams } from 'sql/services/bootstrap/bootstrapParams';
+import { ITaskDialogComponentParams } from 'sql/services/bootstrap/bootstrapParams';
 import { ConnectionManagementInfo } from 'sql/parts/connection/common/connectionManagementInfo';
 import { IAdminService } from 'sql/parts/admin/common/adminService';
 import { ITaskDialogComponent } from 'sql/parts/tasks/common/tasks';
@@ -31,8 +31,6 @@ export interface DatabaseFile {
 })
 export class CreateDatabaseComponent implements ITaskDialogComponent {
 
-	private _adminService: IAdminService;
-
 	public formSubmitted: boolean = false;
 
 	public ownerUri: string;
@@ -49,9 +47,8 @@ export class CreateDatabaseComponent implements ITaskDialogComponent {
 	constructor(
 		@Inject(forwardRef(() => ElementRef)) private _el: ElementRef,
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _changeDetectorRef: ChangeDetectorRef,
-		@Inject(BOOTSTRAP_SERVICE_ID) private _bootstrapService: IBootstrapService
+		@Inject(IAdminService) private _adminService: IAdminService
 	) {
-		this._adminService = this._bootstrapService.adminService;
 	}
 
 	private getDatabaseInfo(form: NgForm): sqlops.DatabaseInfo {
@@ -77,7 +74,7 @@ export class CreateDatabaseComponent implements ITaskDialogComponent {
 
 	public onSelectOwner(): void { }
 
-	public injectBootstapper(parameters: TaskDialogComponentParams): void {
+	public injectBootstapper(parameters: ITaskDialogComponentParams): void {
 		let self = this;
 		this.ownerUri = parameters.ownerUri;
 		this._adminService.getDefaultDatabaseInfo(this.ownerUri).then(dbInfo => {

src/sql/parts/admin/security/createLogin.component.ts

@@ -4,8 +4,8 @@
 *--------------------------------------------------------------------------------------------*/
 
 import { ElementRef, Component, Inject, forwardRef } from '@angular/core';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
+import { IBootstrapParams } from 'sql/services/bootstrap/bootstrapService';
-import { DashboardComponentParams } from 'sql/services/bootstrap/bootstrapParams';
+import { IDashboardComponentParams } from 'sql/services/bootstrap/bootstrapParams';
 import { ConnectionManagementInfo } from 'sql/parts/connection/common/connectionManagementInfo';
 
 export const CREATELOGIN_SELECTOR: string = 'createlogin-component';
@@ -22,9 +22,7 @@ export class CreateLoginComponent {
 
 	constructor(
         @Inject(forwardRef(() => ElementRef)) private _el: ElementRef,
-        @Inject(BOOTSTRAP_SERVICE_ID) private _bootstrapService: IBootstrapService
+        @Inject(IBootstrapParams) private _params: IDashboardComponentParams
 	) {
-        let parameters: DashboardComponentParams = this._bootstrapService.getBootstrapParams(this._el.nativeElement.tagName);
-
 	}
 }

src/sql/parts/admin/security/createLogin.module.ts

@@ -3,37 +3,43 @@
 *  Licensed under the Source EULA. See License.txt in the project root for license information.
 *--------------------------------------------------------------------------------------------*/
 
-import { NgModule, Inject, forwardRef, ApplicationRef, ComponentFactoryResolver } from '@angular/core';
+import { NgModule, Inject, forwardRef, ApplicationRef, ComponentFactoryResolver, Type } from '@angular/core';
 import { APP_BASE_HREF, CommonModule } from '@angular/common';
 import { BrowserModule } from '@angular/platform-browser';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
+import { IBootstrapParams } from 'sql/services/bootstrap/bootstrapService';
 
 import { CreateLoginComponent, CREATELOGIN_SELECTOR } from 'sql/parts/admin/security/createLogin.component';
 
 // Connection Dashboard main angular module
-@NgModule({
+export const CreateLoginModule = (params: IBootstrapParams, selector: string): Type<any> => {
-	declarations: [
-		CreateLoginComponent
-	],
-	entryComponents: [CreateLoginComponent],
-	imports: [
-		CommonModule,
-		BrowserModule
-	],
-	providers: [{ provide: APP_BASE_HREF, useValue: '/' }]
-})
-export class CreateLoginModule {
 
-	constructor(
+	@NgModule({
-		@Inject(forwardRef(() => ComponentFactoryResolver)) private _resolver: ComponentFactoryResolver,
+		declarations: [
-		@Inject(BOOTSTRAP_SERVICE_ID) private _bootstrapService: IBootstrapService
+			CreateLoginComponent
-	) {
+		],
+		entryComponents: [CreateLoginComponent],
+		imports: [
+			CommonModule,
+			BrowserModule
+		],
+		providers: [
+			{ provide: APP_BASE_HREF, useValue: '/' },
+			{ provide: IBootstrapParams, useValue: params }
+		]
+	})
+	class ModuleClass {
+
+		constructor(
+			@Inject(forwardRef(() => ComponentFactoryResolver)) private _resolver: ComponentFactoryResolver
+		) {
+		}
+
+		ngDoBootstrap(appRef: ApplicationRef) {
+			const factory = this._resolver.resolveComponentFactory(CreateLoginComponent);
+			(<any>factory).factory.selector = selector;
+			appRef.bootstrap(factory);
+		}
 	}
 
-	ngDoBootstrap(appRef: ApplicationRef) {
+	return ModuleClass;
-		const factory = this._resolver.resolveComponentFactory(CreateLoginComponent);
+};
-		const uniqueSelector: string = this._bootstrapService.getUniqueSelector(CREATELOGIN_SELECTOR);
-		(<any>factory).factory.selector = uniqueSelector;
-		appRef.bootstrap(factory);
-	}
-}

src/sql/parts/admin/security/createLoginEditor.ts

@@ -17,8 +17,7 @@ import { IConnectionManagementService } from 'sql/parts/connection/common/connec
 import { IMetadataService } from 'sql/services/metadata/metadataService';
 import { IScriptingService } from 'sql/services/scripting/scriptingService';
 import { IQueryEditorService } from 'sql/parts/query/common/queryEditorService';
-import { IBootstrapService } from 'sql/services/bootstrap/bootstrapService';
+import { bootstrapAngular, IBootstrapParams } from 'sql/services/bootstrap/bootstrapService';
-import { BootstrapParams } from 'sql/services/bootstrap/bootstrapParams';
 import { CREATELOGIN_SELECTOR } from 'sql/parts/admin/security/createLogin.component';
 
 export class CreateLoginEditor extends BaseEditor {
@@ -32,8 +31,7 @@ export class CreateLoginEditor extends BaseEditor {
 		@IConnectionManagementService private _connectionService: IConnectionManagementService,
 		@IMetadataService private _metadataService: IMetadataService,
 		@IScriptingService private _scriptingService: IScriptingService,
-		@IQueryEditorService private _queryEditorService: IQueryEditorService,
+		@IQueryEditorService private _queryEditorService: IQueryEditorService
-		@IBootstrapService private _bootstrapService: IBootstrapService
 	) {
 		super(CreateLoginEditor.ID, telemetryService, themeService);
 	}
@@ -96,11 +94,11 @@ export class CreateLoginEditor extends BaseEditor {
 	private bootstrapAngular(input: CreateLoginInput): void {
 
 		// Get the bootstrap params and perform the bootstrap
-		let params: BootstrapParams = {
+		let params: IBootstrapParams = {
 			connection: input.getConnectionProfile(),
 			ownerUri: input.getUri()
 		};
-		let uniqueSelector = this._bootstrapService.bootstrap(
+		let uniqueSelector = this.instantiationService.invokeFunction(bootstrapAngular,
 			CreateLoginModule,
 			this.getContainer().getHTMLElement(),
 			CREATELOGIN_SELECTOR,

src/sql/parts/dashboard/common/dashboardHelper.ts

@@ -5,8 +5,10 @@
 import * as types from 'vs/base/common/types';
 import { generateUuid } from 'vs/base/common/uuid';
 import { Registry } from 'vs/platform/registry/common/platform';
-import { error } from 'sql/base/common/log';
 import * as nls from 'vs/nls';
+import { ContextKeyExpr, IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
+
+import { error } from 'sql/base/common/log';
 import { WidgetConfig } from 'sql/parts/dashboard/common/dashboardWidget';
 import { Extensions, IInsightRegistry } from 'sql/platform/dashboard/common/insightRegistry';
 import { ConnectionManagementInfo } from 'sql/parts/connection/common/connectionManagementInfo';
@@ -19,7 +21,7 @@ import { CONTROLHOST_CONTAINER } from 'sql/parts/dashboard/containers/dashboardC
 import { NAV_SECTION } from 'sql/parts/dashboard/containers/dashboardNavSection.contribution';
 import { IDashboardContainerRegistry, Extensions as DashboardContainerExtensions, IDashboardContainer, registerContainerType } from 'sql/platform/dashboard/common/dashboardContainerRegistry';
 import { IDashboardTab } from 'sql/platform/dashboard/common/dashboardRegistry';
-import { ContextKeyExpr } from 'vs/platform/contextkey/common/contextkey';
+import { SingleConnectionManagementService } from 'sql/services/common/commonServiceInterface.service';
 
 const dashboardcontainerRegistry = Registry.as<IDashboardContainerRegistry>(DashboardContainerExtensions.dashboardContainerContributions);
 const containerTypes = [
@@ -118,8 +120,8 @@ export function initExtensionConfigs(configurations: WidgetConfig[]): Array<Widg
  * Add provider to the passed widgets and returns the new widgets
  * @param widgets Array of widgets to add provider onto
  */
-export function addProvider(config: WidgetConfig[], dashboardService: DashboardServiceInterface): Array<WidgetConfig> {
+export function addProvider<T extends { connectionManagementService: SingleConnectionManagementService }>(config: WidgetConfig[], collection: T): Array<WidgetConfig> {
-	let provider = dashboardService.connectionManagementService.connectionInfo.providerId;
+	let provider = collection.connectionManagementService.connectionInfo.providerId;
 	return config.map((item) => {
 		if (item.provider === undefined) {
 			item.provider = provider;
@@ -132,8 +134,8 @@ export function addProvider(config: WidgetConfig[], dashboardService: DashboardS
  * Adds the edition to the passed widgets and returns the new widgets
  * @param widgets Array of widgets to add edition onto
  */
-export function addEdition(config: WidgetConfig[], dashboardService: DashboardServiceInterface): Array<WidgetConfig> {
+export function addEdition<T extends { connectionManagementService: SingleConnectionManagementService }>(config: WidgetConfig[], collection: DashboardServiceInterface): Array<WidgetConfig> {
-	let connectionInfo: ConnectionManagementInfo = dashboardService.connectionManagementService.connectionInfo;
+	let connectionInfo: ConnectionManagementInfo = collection.connectionManagementService.connectionInfo;
 	let edition = connectionInfo.serverInfo.engineEditionId;
 	return config.map((item) => {
 		if (item.edition === undefined) {
@@ -147,7 +149,7 @@ export function addEdition(config: WidgetConfig[], dashboardService: DashboardSe
  * Adds the context to the passed widgets and returns the new widgets
  * @param widgets Array of widgets to add context to
  */
-export function addContext(config: WidgetConfig[], dashboardServer: DashboardServiceInterface, context: string): Array<WidgetConfig> {
+export function addContext(config: WidgetConfig[], collection: any, context: string): Array<WidgetConfig> {
 	return config.map((item) => {
 		if (item.context === undefined) {
 			item.context = context;
@@ -160,12 +162,12 @@ export function addContext(config: WidgetConfig[], dashboardServer: DashboardSer
  * Returns a filtered version of the widgets passed based on edition and provider
  * @param config widgets to filter
  */
-export function filterConfigs<T extends { when?: string }>(config: T[], dashboardService: DashboardServiceInterface): Array<T> {
+export function filterConfigs<T extends { when?: string }, K extends { contextKeyService: IContextKeyService }>(config: T[], collection: K): Array<T> {
 	return config.filter((item) => {
 		if (!item.when) {
 			return true;
 		} else {
-			return dashboardService.contextKeyService.contextMatchesRules(ContextKeyExpr.deserialize(item.when));
+			return collection.contextKeyService.contextMatchesRules(ContextKeyExpr.deserialize(item.when));
 		}
 	});
 }

src/sql/parts/dashboard/common/dashboardPage.component.ts

@@ -9,7 +9,7 @@ import 'sql/parts/dashboard/common/dashboardPanelStyles';
 import { Component, Inject, forwardRef, ViewChild, ElementRef, ViewChildren, QueryList, OnDestroy, ChangeDetectorRef } from '@angular/core';
 
 import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
-import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
+import { CommonServiceInterface, SingleConnectionManagementService } from 'sql/services/common/commonServiceInterface.service';
 import { WidgetConfig, TabConfig, TabSettingConfig } from 'sql/parts/dashboard/common/dashboardWidget';
 import { Extensions, IInsightRegistry } from 'sql/platform/dashboard/common/insightRegistry';
 import { DashboardWidgetWrapper } from 'sql/parts/dashboard/contents/dashboardWidgetWrapper.component';
@@ -18,8 +18,7 @@ import { PanelComponent } from 'sql/base/browser/ui/panel/panel.component';
 import { IDashboardRegistry, Extensions as DashboardExtensions, IDashboardTab } from 'sql/platform/dashboard/common/dashboardRegistry';
 import { PinUnpinTabAction, AddFeatureTabAction } from './actions';
 import { TabComponent, TabChild } from 'sql/base/browser/ui/panel/tab.component';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
+import { AngularEventType, IAngularEventingService } from 'sql/services/angularEventing/angularEventingService';
-import { AngularEventType } from 'sql/services/angularEventing/angularEventingService';
 import { DashboardTab } from 'sql/parts/dashboard/common/interfaces';
 import * as dashboardHelper from 'sql/parts/dashboard/common/dashboardHelper';
 import { WIDGETS_CONTAINER } from 'sql/parts/dashboard/containers/dashboardWidgetContainer.contribution';
@@ -40,9 +39,16 @@ import Event, { Emitter } from 'vs/base/common/event';
 import { Action } from 'vs/base/common/actions';
 import { ConfigurationTarget } from 'vs/platform/configuration/common/configuration';
 import Severity from 'vs/base/common/severity';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { INotificationService } from 'vs/platform/notification/common/notification';
+import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
 
 const dashboardRegistry = Registry.as<IDashboardRegistry>(DashboardExtensions.DashboardContributions);
 
+interface IConfigModifierCollection {
+	connectionManagementService: SingleConnectionManagementService;
+	contextKeyService: IContextKeyService;
+}
 
 @Component({
 	selector: 'dashboard-page',
@@ -71,7 +77,7 @@ export abstract class DashboardPage extends AngularDisposable {
 	private readonly homeTabTitle: string = nls.localize('home', 'Home');
 
 	// a set of config modifiers
-	private readonly _configModifiers: Array<(item: Array<WidgetConfig>, dashboardServer: DashboardServiceInterface, context: string) => Array<WidgetConfig>> = [
+	private readonly _configModifiers: Array<(item: Array<WidgetConfig>, collection: IConfigModifierCollection, context: string) => Array<WidgetConfig>> = [
 		dashboardHelper.removeEmpty,
 		dashboardHelper.initExtensionConfigs,
 		dashboardHelper.addProvider,
@@ -80,27 +86,36 @@ export abstract class DashboardPage extends AngularDisposable {
 		dashboardHelper.filterConfigs
 	];
 
+	public get connectionManagementService(): SingleConnectionManagementService {
+		return this.dashboardService.connectionManagementService;
+	}
+
+	public get contextKeyService(): IContextKeyService {
+		return this.dashboardService.scopedContextKeyService;
+	}
+
 	private readonly _gridModifiers: Array<(item: Array<WidgetConfig>, originalConfig: Array<WidgetConfig>) => Array<WidgetConfig>> = [
 		dashboardHelper.validateGridConfig
 	];
 
 	protected abstract propertiesWidget: WidgetConfig;
 	protected abstract get context(): string;
-	protected dashboardService: DashboardServiceInterface;
 
 	constructor(
-		@Inject(forwardRef(() => CommonServiceInterface)) protected commonService: CommonServiceInterface,
+		@Inject(forwardRef(() => CommonServiceInterface)) protected dashboardService: DashboardServiceInterface,
 		@Inject(forwardRef(() => ElementRef)) protected _el: ElementRef,
-		@Inject(forwardRef(() => ChangeDetectorRef)) protected _cd: ChangeDetectorRef
+		@Inject(forwardRef(() => ChangeDetectorRef)) protected _cd: ChangeDetectorRef,
+		@Inject(IInstantiationService) private instantiationService: IInstantiationService,
+		@Inject(INotificationService) private notificationService: INotificationService,
+		@Inject(IAngularEventingService) private angularEventingService: IAngularEventingService
 	) {
 		super();
-		this.dashboardService = commonService as DashboardServiceInterface;
 	}
 
 	protected init() {
 		this.dashboardService.dashboardContextKey.set(this.context);
 		if (!this.dashboardService.connectionManagementService.connectionInfo) {
-			this.dashboardService.notificationService.notify({
+			this.notificationService.notify({
 				severity: Severity.Error,
 				message: nls.localize('missingConnectionInfo', 'No connection information could be found for this dashboard')
 			});
@@ -110,8 +125,8 @@ export abstract class DashboardPage extends AngularDisposable {
 			this._originalConfig = objects.deepClone(tempWidgets);
 			let properties = this.getProperties();
 			this._configModifiers.forEach((cb) => {
-				tempWidgets = cb.apply(this, [tempWidgets, this.dashboardService, this.context]);
+				tempWidgets = cb.apply(this, [tempWidgets, this, this.context]);
-				properties = properties ? cb.apply(this, [properties, this.dashboardService, this.context]) : undefined;
+				properties = properties ? cb.apply(this, [properties, this, this.context]) : undefined;
 			});
 			this._gridModifiers.forEach(cb => {
 				tempWidgets = cb.apply(this, [tempWidgets, this._originalConfig]);
@@ -143,7 +158,7 @@ export abstract class DashboardPage extends AngularDisposable {
 		};
 		this.addNewTab(homeTab);
 
-		let allTabs = dashboardHelper.filterConfigs(dashboardRegistry.tabs, this.dashboardService);
+		let allTabs = dashboardHelper.filterConfigs(dashboardRegistry.tabs, this);
 
 		// Load tab setting configs
 		this._tabSettingConfigs = this.dashboardService.getSettings<Array<TabSettingConfig>>([this.context, 'tabs'].join('.'));
@@ -171,7 +186,7 @@ export abstract class DashboardPage extends AngularDisposable {
 
 		// Set panel actions
 		let openedTabs = [...pinnedDashboardTabs, ...alwaysShowTabs];
-		let addNewTabAction = this.dashboardService.instantiationService.createInstance(AddFeatureTabAction, allTabs, openedTabs, this.dashboardService.getUnderlyingUri());
+		let addNewTabAction = this.instantiationService.createInstance(AddFeatureTabAction, allTabs, openedTabs, this.dashboardService.getUnderlyingUri());
 		this._tabsDispose.push(addNewTabAction);
 		this.panelActions = [addNewTabAction];
 		this._cd.detectChanges();
@@ -232,7 +247,7 @@ export abstract class DashboardPage extends AngularDisposable {
 				} else if (v.alwaysShow) {
 					isPinned = true;
 				}
-				actions.push(this.dashboardService.instantiationService.createInstance(PinUnpinTabAction, v.id, this.dashboardService.getUnderlyingUri(), isPinned));
+				actions.push(this.instantiationService.createInstance(PinUnpinTabAction, v.id, this.dashboardService.getUnderlyingUri(), isPinned));
 
 				let config = v as TabConfig;
 				config.context = this.context;
@@ -317,7 +332,6 @@ export abstract class DashboardPage extends AngularDisposable {
 	public handleTabClose(tab: TabComponent): void {
 		let index = this.tabs.findIndex(i => i.id === tab.identifier);
 		this.tabs.splice(index, 1);
-		this._cd.detectChanges();
+		this.angularEventingService.sendAngularEvent(this.dashboardService.getUnderlyingUri(), AngularEventType.CLOSE_TAB, { id: tab.identifier });
-		this.dashboardService.angularEventingService.sendAngularEvent(this.dashboardService.getUnderlyingUri(), AngularEventType.CLOSE_TAB, { id: tab.identifier });
 	}
 }

src/sql/parts/dashboard/containers/dashboardHomeContainer.component.ts

@@ -12,12 +12,12 @@ import { DashboardTab } from 'sql/parts/dashboard/common/interfaces';
 import { WidgetConfig } from 'sql/parts/dashboard/common/dashboardWidget';
 import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
 import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
-import { AngularEventType } from 'sql/services/angularEventing/angularEventingService';
+import { AngularEventType, IAngularEventingService } from 'sql/services/angularEventing/angularEventingService';
 import { DashboardWidgetWrapper } from 'sql/parts/dashboard/contents/dashboardWidgetWrapper.component';
 import { ScrollableDirective } from 'sql/base/browser/ui/scrollable/scrollable.directive';
 import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
 
-import { ConfigurationTarget } from 'vs/platform/configuration/common/configuration';
+import { ConfigurationTarget, IConfigurationService } from 'vs/platform/configuration/common/configuration';
 import { ScrollbarVisibility } from 'vs/base/common/scrollable';
 
 @Component({
@@ -44,7 +44,9 @@ export class DashboardHomeContainer extends DashboardWidgetContainer {
 
 	constructor(
 		@Inject(forwardRef(() => ChangeDetectorRef)) _cd: ChangeDetectorRef,
-		@Inject(forwardRef(() => CommonServiceInterface)) protected dashboardService: DashboardServiceInterface
+		@Inject(forwardRef(() => CommonServiceInterface)) protected dashboardService: DashboardServiceInterface,
+		@Inject(IConfigurationService) private _configurationService: IConfigurationService,
+		@Inject(IAngularEventingService) private angularEventingService: IAngularEventingService
 	) {
 		super(_cd);
 	}
@@ -54,14 +56,12 @@ export class DashboardHomeContainer extends DashboardWidgetContainer {
 		if (collapsedVal === 'collapsed') {
 			this._propertiesClass.collapsed = true;
 		}
-		this.dashboardService.angularEventingService.onAngularEvent(this.dashboardService.getUnderlyingUri(), event => {
+		this.angularEventingService.onAngularEvent(this.dashboardService.getUnderlyingUri(), event => {
 			if (event.event === AngularEventType.COLLAPSE_WIDGET && this._propertiesClass && event.payload === this._propertiesClass.guid) {
 				this._propertiesClass.collapsed = !this._propertiesClass.collapsed;
 				this._cd.detectChanges();
-				this.dashboardService.configurationEditingService.writeConfiguration(ConfigurationTarget.USER, {
+				this._configurationService.updateValue(`dashboard.${this.properties.context}.properties`,
-					key: `dashboard.${this.properties.context}.properties`,
+					this._propertiesClass.collapsed ? 'collapsed' : true, ConfigurationTarget.USER);
-					value: this._propertiesClass.collapsed ? 'collapsed' : true
-				});
 			}
 		});
 	}

src/sql/parts/dashboard/contents/dashboardWidgetWrapper.component.ts

@@ -28,7 +28,7 @@ import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboar
 import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
 
 import { IDisposable } from 'vs/base/common/lifecycle';
-import { IColorTheme } from 'vs/workbench/services/themes/common/workbenchThemeService';
+import { IColorTheme, IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
 import * as colors from 'vs/platform/theme/common/colorRegistry';
 import * as themeColors from 'vs/workbench/common/theme';
 import { Action } from 'vs/base/common/actions';
@@ -37,6 +37,7 @@ import { ActionBar } from 'vs/base/browser/ui/actionbar/actionbar';
 import { memoize } from 'vs/base/common/decorators';
 import { generateUuid } from 'vs/base/common/uuid';
 import { Emitter } from 'vs/base/common/event';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 
 const componentMap: { [x: string]: Type<IDashboardWidget> } = {
 	'properties-widget': PropertiesWidgetComponent,
@@ -91,20 +92,22 @@ export class DashboardWidgetWrapper extends AngularDisposable implements OnInit
 		@Inject(forwardRef(() => ElementRef)) private _ref: ElementRef,
 		@Inject(forwardRef(() => CommonServiceInterface)) private _bootstrap: CommonServiceInterface,
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _changeref: ChangeDetectorRef,
-		@Inject(forwardRef(() => Injector)) private _injector: Injector
+		@Inject(forwardRef(() => Injector)) private _injector: Injector,
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
+		@Inject(IInstantiationService) private instantiationService: IInstantiationService
 	) {
 		super();
 	}
 
 	ngOnInit() {
 		let self = this;
-		this._register(self._bootstrap.themeService.onDidColorThemeChange((event: IColorTheme) => {
+		this._register(self.themeService.onDidColorThemeChange((event: IColorTheme) => {
 			self.updateTheme(event);
 		}));
 	}
 
 	ngAfterViewInit() {
-		this.updateTheme(this._bootstrap.themeService.getColorTheme());
+		this.updateTheme(this.themeService.getColorTheme());
 		if (this.componentHost) {
 			this.loadWidget();
 		}
@@ -112,10 +115,10 @@ export class DashboardWidgetWrapper extends AngularDisposable implements OnInit
 		this._actionbar = new ActionBar(this._actionbarRef.nativeElement);
 		if (this._actions) {
 			if (this.collapsable) {
-				this._collapseAction = this._bootstrap.instantiationService.createInstance(CollapseWidgetAction, this._bootstrap.getUnderlyingUri(), this.guid, this.collapsed);
+				this._collapseAction = this.instantiationService.createInstance(CollapseWidgetAction, this._bootstrap.getUnderlyingUri(), this.guid, this.collapsed);
 				this._actionbar.push(this._collapseAction, { icon: true, label: false });
 			}
-			this._actionbar.push(this._bootstrap.instantiationService.createInstance(ToggleMoreWidgetAction, this._actions, this._component.actionsContext), { icon: true, label: false });
+			this._actionbar.push(this.instantiationService.createInstance(ToggleMoreWidgetAction, this._actions, this._component.actionsContext), { icon: true, label: false });
 		}
 		this.layout();
 	}
@@ -137,7 +140,7 @@ export class DashboardWidgetWrapper extends AngularDisposable implements OnInit
 	}
 
 	public enableEdit(): void {
-		this._actionbar.push(this._bootstrap.instantiationService.createInstance(DeleteWidgetAction, this._config.id, this._bootstrap.getUnderlyingUri()), { icon: true, label: false });
+		this._actionbar.push(this.instantiationService.createInstance(DeleteWidgetAction, this._config.id, this._bootstrap.getUnderlyingUri()), { icon: true, label: false });
 	}
 
 	public disableEdit(): void {

src/sql/parts/dashboard/contents/webviewContent.component.ts

@@ -8,15 +8,18 @@ import { Component, forwardRef, Input, OnInit, Inject, ChangeDetectorRef, Elemen
 
 import Event, { Emitter } from 'vs/base/common/event';
 import { Webview } from 'vs/workbench/parts/html/browser/webview';
-import { Parts } from 'vs/workbench/services/part/common/partService';
+import { Parts, IPartService } from 'vs/workbench/services/part/common/partService';
 import { IDisposable, Disposable } from 'vs/base/common/lifecycle';
 import { addDisposableListener, EventType } from 'vs/base/browser/dom';
 import { memoize } from 'vs/base/common/decorators';
+import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
+import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
+import { IEnvironmentService } from 'vs/platform/environment/common/environment';
 
 import { TabConfig } from 'sql/parts/dashboard/common/dashboardWidget';
 import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
 import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
-import { IDashboardWebview } from 'sql/services/dashboard/common/dashboardViewService';
+import { IDashboardWebview, IDashboardViewService } from 'sql/services/dashboard/common/dashboardViewService';
 import { AngularDisposable } from 'sql/base/common/lifecycle';
 
 import * as sqlops from 'sqlops';
@@ -40,13 +43,18 @@ export class WebviewContent extends AngularDisposable implements OnInit, IDashbo
 	constructor(
 		@Inject(forwardRef(() => CommonServiceInterface)) private _dashboardService: DashboardServiceInterface,
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _changeRef: ChangeDetectorRef,
-		@Inject(forwardRef(() => ElementRef)) private _el: ElementRef
+		@Inject(forwardRef(() => ElementRef)) private _el: ElementRef,
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
+		@Inject(IContextViewService) private contextViewService: IContextViewService,
+		@Inject(IDashboardViewService) private dashboardViewService: IDashboardViewService,
+		@Inject(IPartService) private partService: IPartService,
+		@Inject(IEnvironmentService) private environmentService: IEnvironmentService
 	) {
 		super();
 	}
 
 	ngOnInit() {
-		this._dashboardService.dashboardViewService.registerWebview(this);
+		this.dashboardViewService.registerWebview(this);
 		this._createWebview();
 		this._register(addDisposableListener(window, EventType.RESIZE, e => {
 			this.layout();
@@ -101,10 +109,10 @@ export class WebviewContent extends AngularDisposable implements OnInit, IDashbo
 		}
 
 		this._webview = new Webview(this._el.nativeElement,
-			this._dashboardService.partService.getContainer(Parts.EDITOR_PART),
+			this.partService.getContainer(Parts.EDITOR_PART),
-			this._dashboardService.themeService,
+			this.themeService,
-			this._dashboardService.environmentService,
+			this.environmentService,
-			this._dashboardService.contextViewService,
+			this.contextViewService,
 			undefined,
 			undefined,
 			{
@@ -117,7 +125,7 @@ export class WebviewContent extends AngularDisposable implements OnInit, IDashbo
 		this._onMessageDisposable = this._webview.onMessage(e => {
 			this._onMessage.fire(e);
 		});
-		this._webview.style(this._dashboardService.themeService.getTheme());
+		this._webview.style(this.themeService.getTheme());
 		if (this._html) {
 			this._webview.contents = this._html;
 		}

src/sql/parts/dashboard/dashboard.component.ts

@@ -16,7 +16,7 @@ import { RefreshWidgetAction, EditDashboardAction } from 'sql/parts/dashboard/co
 import { DashboardPage } from 'sql/parts/dashboard/common/dashboardPage.component';
 import { AngularDisposable } from 'sql/base/common/lifecycle';
 
-import { IColorTheme } from 'vs/workbench/services/themes/common/workbenchThemeService';
+import { IColorTheme, IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
 import { IDisposable } from 'vs/base/common/lifecycle';
 import * as themeColors from 'vs/workbench/common/theme';
 import { ActionBar } from 'vs/base/browser/ui/actionbar/actionbar';
@@ -39,14 +39,15 @@ export class DashboardComponent extends AngularDisposable implements OnInit {
 	constructor(
 		@Inject(forwardRef(() => CommonServiceInterface)) private _bootstrapService: CommonServiceInterface,
 		@Inject(forwardRef(() => Router)) private _router: Router,
-		@Inject(forwardRef(() => ChangeDetectorRef)) private _changeRef: ChangeDetectorRef
+		@Inject(forwardRef(() => ChangeDetectorRef)) private _changeRef: ChangeDetectorRef,
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService
 	) {
 		super();
 	}
 
 	ngOnInit() {
-		this._register(this._bootstrapService.themeService.onDidColorThemeChange(this.updateTheme, this));
+		this._register(this.themeService.onDidColorThemeChange(this.updateTheme, this));
-		this.updateTheme(this._bootstrapService.themeService.getColorTheme());
+		this.updateTheme(this.themeService.getColorTheme());
 		let profile: IConnectionProfile = this._bootstrapService.getOriginalConnectionProfile();
 		this.actionbar = new ActionBar(this.actionbarContainer.nativeElement);
 		this.actionbar.push(new RefreshWidgetAction(this.refresh, this), {

src/sql/parts/dashboard/dashboard.module.ts

@@ -3,7 +3,7 @@
  *  Licensed under the Source EULA. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-import { Inject, NgModule, forwardRef, ApplicationRef, ComponentFactoryResolver } from '@angular/core';
+import { Inject, NgModule, forwardRef, ApplicationRef, ComponentFactoryResolver, NgModuleRef, NgModuleFactory } from '@angular/core';
 import { CommonModule, APP_BASE_HREF } from '@angular/common';
 import { BrowserModule } from '@angular/platform-browser';
 import { RouterModule, Routes, UrlSerializer, Router, NavigationEnd } from '@angular/router';
@@ -12,9 +12,9 @@ import { NgGridModule } from 'angular2-grid';
 import { ChartsModule } from 'ng2-charts/ng2-charts';
 
 import CustomUrlSerializer from 'sql/common/urlSerializer';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
 import { Extensions, IInsightRegistry } from 'sql/platform/dashboard/common/insightRegistry';
 import { Extensions as ComponentExtensions, IComponentRegistry } from 'sql/platform/dashboard/common/modelComponentRegistry';
+import { IBootstrapParams } from 'sql/services/bootstrap/bootstrapService';
 
 import { Registry } from 'vs/platform/registry/common/platform';
 
@@ -104,64 +104,68 @@ const appRoutes: Routes = [
 ];
 
 // Connection Dashboard main angular module
-@NgModule({
+export const DashboardModule = (params, selector: string): any => {
-	declarations: [
+	@NgModule({
-		...baseComponents,
+		declarations: [
-		...pageComponents,
+			...baseComponents,
-		...widgetComponents,
+			...pageComponents,
-		...insightComponents,
+			...widgetComponents,
-		...extensionComponents
+			...insightComponents,
-	],
+			...extensionComponents
-	// also for widgets
+		],
-	entryComponents: [
+		// also for widgets
-		DashboardComponent,
+		entryComponents: [
-		...widgetComponents,
+			DashboardComponent,
-		...insightComponents,
+			...widgetComponents,
-		...extensionComponents
+			...insightComponents,
-	],
+			...extensionComponents
-	imports: [
+		],
-		CommonModule,
+		imports: [
-		BrowserModule,
+			CommonModule,
-		FormsModule,
+			BrowserModule,
-		NgGridModule,
+			FormsModule,
-		ChartsModule,
+			NgGridModule,
-		RouterModule.forRoot(appRoutes),
+			ChartsModule,
-		PanelModule,
+			RouterModule.forRoot(appRoutes),
-		ScrollableModule
+			PanelModule,
-	],
+			ScrollableModule
-	providers: [
+		],
-		{ provide: APP_BASE_HREF, useValue: '/' },
+		providers: [
-		{ provide: IBreadcrumbService, useClass: BreadcrumbService },
+			{ provide: APP_BASE_HREF, useValue: '/' },
-		{ provide: CommonServiceInterface, useClass: DashboardServiceInterface },
+			{ provide: IBreadcrumbService, useClass: BreadcrumbService },
-		{ provide: UrlSerializer, useClass: CustomUrlSerializer }
+			{ provide: CommonServiceInterface, useClass: DashboardServiceInterface },
-	]
+			{ provide: UrlSerializer, useClass: CustomUrlSerializer },
-})
+			{ provide: IBootstrapParams, useValue: params }
-export class DashboardModule {
+		]
-	private _bootstrap: DashboardServiceInterface;
+	})
-	constructor(
+	class ModuleClass {
-		@Inject(forwardRef(() => ComponentFactoryResolver)) private _resolver: ComponentFactoryResolver,
+		private _bootstrap: DashboardServiceInterface;
-		@Inject(BOOTSTRAP_SERVICE_ID) private _bootstrapService: IBootstrapService,
+		constructor(
-		@Inject(forwardRef(() => CommonServiceInterface)) bootstrap: CommonServiceInterface,
+			@Inject(forwardRef(() => ComponentFactoryResolver)) private _resolver: ComponentFactoryResolver,
-		@Inject(forwardRef(() => Router)) private _router: Router
+			@Inject(forwardRef(() => CommonServiceInterface)) bootstrap: CommonServiceInterface,
-	) {
+			@Inject(forwardRef(() => Router)) private _router: Router,
-		this._bootstrap = bootstrap as DashboardServiceInterface;
+			@Inject(ITelemetryService) private telemetryService: ITelemetryService
+		) {
+			this._bootstrap = bootstrap as DashboardServiceInterface;
+		}
+
+		ngDoBootstrap(appRef: ApplicationRef) {
+			const factory = this._resolver.resolveComponentFactory(DashboardComponent);
+			this._bootstrap.selector = selector;
+			(<any>factory).factory.selector = selector;
+			appRef.bootstrap(factory);
+
+			this._router.events.subscribe(e => {
+				if (e instanceof NavigationEnd) {
+					this._bootstrap.handlePageNavigation();
+					TelemetryUtils.addTelemetry(this.telemetryService, TelemetryKeys.DashboardNavigated, {
+						numberOfNavigations: this._bootstrap.getNumberOfPageNavigations(),
+						routeUrl: e.url
+					});
+				}
+			});
+		}
 	}
 
-	ngDoBootstrap(appRef: ApplicationRef) {
+	return ModuleClass;
-		const factory = this._resolver.resolveComponentFactory(DashboardComponent);
+};
-		const uniqueSelector: string = this._bootstrapService.getUniqueSelector(DASHBOARD_SELECTOR);
-		this._bootstrap.selector = uniqueSelector;
-		(<any>factory).factory.selector = uniqueSelector;
-		appRef.bootstrap(factory);
-
-		this._router.events.subscribe(e => {
-			if (e instanceof NavigationEnd) {
-				this._bootstrap.handlePageNavigation();
-				TelemetryUtils.addTelemetry(this._bootstrapService.telemetryService, TelemetryKeys.DashboardNavigated, {
-					numberOfNavigations: this._bootstrap.getNumberOfPageNavigations(),
-					routeUrl: e.url
-				});
-			}
-		});
-	}
-}

src/sql/parts/dashboard/dashboardEditor.ts

@@ -15,8 +15,8 @@ import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
 
 import { DashboardInput } from './dashboardInput';
 import { DashboardModule } from './dashboard.module';
-import { IBootstrapService } from 'sql/services/bootstrap/bootstrapService';
+import { bootstrapAngular } from 'sql/services/bootstrap/bootstrapService';
-import { DashboardComponentParams } from 'sql/services/bootstrap/bootstrapParams';
+import { IDashboardComponentParams } from 'sql/services/bootstrap/bootstrapParams';
 import { DASHBOARD_SELECTOR } from 'sql/parts/dashboard/dashboard.component';
 import { ConnectionContextkey } from 'sql/parts/connection/common/connectionContextKey';
 import { IDashboardService } from 'sql/services/dashboard/common/dashboardService';
@@ -34,7 +34,6 @@ export class DashboardEditor extends BaseEditor {
 		@ITelemetryService telemetryService: ITelemetryService,
 		@IWorkbenchThemeService themeService: IWorkbenchThemeService,
 		@IInstantiationService private instantiationService: IInstantiationService,
-		@IBootstrapService private _bootstrapService: IBootstrapService,
 		@IContextKeyService private _contextKeyService: IContextKeyService,
 		@IDashboardService private _dashboardService: IDashboardService,
 		@IConnectionManagementService private _connMan: IConnectionManagementService
@@ -114,7 +113,7 @@ export class DashboardEditor extends BaseEditor {
 		let connectionContextKey = new ConnectionContextkey(scopedContextService);
 		connectionContextKey.set(input.connectionProfile);
 
-		let params: DashboardComponentParams = {
+		let params: IDashboardComponentParams = {
 			connection: input.connectionProfile,
 			ownerUri: input.uri,
 			scopedContextService,
@@ -123,7 +122,7 @@ export class DashboardEditor extends BaseEditor {
 
 		input.hasBootstrapped = true;
 
-		let uniqueSelector = this._bootstrapService.bootstrap(
+		let uniqueSelector = this.instantiationService.invokeFunction(bootstrapAngular,
 			DashboardModule,
 			this._dashboardContainer,
 			DASHBOARD_SELECTOR,

src/sql/parts/dashboard/pages/databaseDashboardPage.component.ts

@@ -10,11 +10,14 @@ import { BreadcrumbClass } from 'sql/parts/dashboard/services/breadcrumb.service
 import { IBreadcrumbService } from 'sql/base/browser/ui/breadcrumb/interfaces';
 import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
 import { WidgetConfig } from 'sql/parts/dashboard/common/dashboardWidget';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
+import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
+import { IAngularEventingService } from 'sql/services/angularEventing/angularEventingService';
 
 import * as colors from 'vs/platform/theme/common/colorRegistry';
 import * as nls from 'vs/nls';
-import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { INotificationService } from 'vs/platform/notification/common/notification';
+import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
 
 export class DatabaseDashboardPage extends DashboardPage implements OnInit {
 	protected propertiesWidget: WidgetConfig = {
@@ -38,9 +41,12 @@ export class DatabaseDashboardPage extends DashboardPage implements OnInit {
 		@Inject(forwardRef(() => IBreadcrumbService)) private _breadcrumbService: IBreadcrumbService,
 		@Inject(forwardRef(() => CommonServiceInterface)) dashboardService: DashboardServiceInterface,
 		@Inject(forwardRef(() => ChangeDetectorRef)) _cd: ChangeDetectorRef,
-		@Inject(forwardRef(() => ElementRef)) el: ElementRef
+		@Inject(forwardRef(() => ElementRef)) el: ElementRef,
+		@Inject(IInstantiationService) instantiationService: IInstantiationService,
+		@Inject(INotificationService) notificationService: INotificationService,
+		@Inject(IAngularEventingService) angularEventingService: IAngularEventingService
 	) {
-		super(dashboardService, el, _cd);
+		super(dashboardService, el, _cd, instantiationService, notificationService, angularEventingService);
 		this._register(dashboardService.onUpdatePage(() => {
 			this.refresh(true);
 			this._cd.detectChanges();

src/sql/parts/dashboard/pages/serverDashboardPage.component.ts

@@ -11,10 +11,13 @@ import { IBreadcrumbService } from 'sql/base/browser/ui/breadcrumb/interfaces';
 import { WidgetConfig } from 'sql/parts/dashboard/common/dashboardWidget';
 import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
 import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
+import { IAngularEventingService } from 'sql/services/angularEventing/angularEventingService';
 
 import * as colors from 'vs/platform/theme/common/colorRegistry';
 import * as nls from 'vs/nls';
+import { INotificationService } from 'vs/platform/notification/common/notification';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
 
 export class ServerDashboardPage extends DashboardPage implements OnInit {
 	protected propertiesWidget: WidgetConfig = {
@@ -37,11 +40,14 @@ export class ServerDashboardPage extends DashboardPage implements OnInit {
 
 	constructor(
 		@Inject(forwardRef(() => IBreadcrumbService)) private breadcrumbService: IBreadcrumbService,
-		@Inject(forwardRef(() => CommonServiceInterface)) dashboardService: CommonServiceInterface,
+		@Inject(forwardRef(() => CommonServiceInterface)) dashboardService: DashboardServiceInterface,
 		@Inject(forwardRef(() => ChangeDetectorRef)) _cd: ChangeDetectorRef,
-		@Inject(forwardRef(() => ElementRef)) el: ElementRef
+		@Inject(forwardRef(() => ElementRef)) el: ElementRef,
+		@Inject(IInstantiationService) instantiationService: IInstantiationService,
+		@Inject(INotificationService) notificationService: INotificationService,
+		@Inject(IAngularEventingService) angularEventingService: IAngularEventingService
 	) {
-		super(dashboardService, el, _cd);
+		super(dashboardService, el, _cd, instantiationService, notificationService, angularEventingService);
 		// revert back to default database
 		this._letDashboardPromise = this.dashboardService.connectionManagementService.changeDatabase('master');
 	}

src/sql/parts/dashboard/services/dashboardServiceInterface.service.ts

@@ -9,8 +9,8 @@ import { Router } from '@angular/router';
 import { Observable } from 'rxjs/Observable';
 
 /* SQL imports */
-import { DashboardComponentParams } from 'sql/services/bootstrap/bootstrapParams';
+import { IDashboardComponentParams } from 'sql/services/bootstrap/bootstrapParams';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
+import { IBootstrapParams } from 'sql/services/bootstrap/bootstrapService';
 import { IMetadataService } from 'sql/services/metadata/metadataService';
 import { IConnectionManagementService } from 'sql/parts/connection/common/connectionManagement';
 import { ConnectionManagementInfo } from 'sql/parts/connection/common/connectionManagementInfo';
@@ -64,9 +64,6 @@ export class DashboardServiceInterface extends CommonServiceInterface {
 
 	/* Static Services */
 
-	private _dashboardViewService = this._bootstrapService.dashboardViewService;
-
-
 	private _updatePage = new Emitter<void>();
 	public readonly onUpdatePage: Event<void> = this._updatePage.event;
 
@@ -88,14 +85,21 @@ export class DashboardServiceInterface extends CommonServiceInterface {
 	private _numberOfPageNavigations = 0;
 
 	constructor(
-		@Inject(BOOTSTRAP_SERVICE_ID) bootstrapService: IBootstrapService,
 		@Inject(forwardRef(() => Router)) private _router: Router,
+		@Inject(INotificationService) private _notificationService: INotificationService,
+		@Inject(IMetadataService) metadataService: IMetadataService,
+		@Inject(IConnectionManagementService) connectionManagementService: IConnectionManagementService,
+		@Inject(IAdminService) adminService: IAdminService,
+		@Inject(IQueryManagementService) queryManagementService: IQueryManagementService,
+		@Inject(IAngularEventingService) private angularEventingService: IAngularEventingService,
+		@Inject(IConfigurationService) private _configService: IConfigurationService,
+		@Inject(IBootstrapParams) _params: IDashboardComponentParams
 	) {
-		super(bootstrapService);
+		super(_params, metadataService, connectionManagementService, adminService, queryManagementService);
 	}
 
-	public get dashboardViewService(): IDashboardViewService {
+	private get params(): IDashboardComponentParams {
-		return this._dashboardViewService;
+		return this._params;
 	}
 
 	/**
@@ -107,11 +111,10 @@ export class DashboardServiceInterface extends CommonServiceInterface {
 	}
 
 	protected _getbootstrapParams(): void {
-		this._bootstrapParams = this._bootstrapService.getBootstrapParams<DashboardComponentParams>(this._uniqueSelector);
+		this.scopedContextKeyService = this.params.scopedContextService;
-		this._contextKeyService = this._bootstrapParams.scopedContextService;
+		this._connectionContextKey = this.params.connectionContextKey;
-		this._connectionContextKey = this._bootstrapParams.connectionContextKey;
+		this.dashboardContextKey = this._dashboardContextKey.bindTo(this.scopedContextKeyService);
-		this.dashboardContextKey = this._dashboardContextKey.bindTo(this._contextKeyService);
+		this.uri = this.params.ownerUri;
-		this.uri = this._bootstrapParams.ownerUri;
 	}
 
 	/**
@@ -120,7 +123,7 @@ export class DashboardServiceInterface extends CommonServiceInterface {
 	 */
 	protected set uri(uri: string) {
 		super.setUri(uri);
-		this._register(toDisposableSubscription(this._bootstrapService.angularEventingService.onAngularEvent(this._uri, (event) => this.handleDashboardEvent(event))));
+		this._register(toDisposableSubscription(this.angularEventingService.onAngularEvent(this._uri, (event) => this.handleDashboardEvent(event))));
 	}
 
 	/**
@@ -147,7 +150,7 @@ export class DashboardServiceInterface extends CommonServiceInterface {
 	}
 
 	public writeSettings(type: string, value: any, target: ConfigurationTarget) {
-		this._configurationEditingService.writeConfiguration(target, { key: [DASHBOARD_SETTINGS, type].join('.'), value });
+		this._configService.updateValue([DASHBOARD_SETTINGS, type].join('.'), value, target);
 	}
 
 	private handleDashboardEvent(event: IAngularEvent): void {

src/sql/parts/dashboard/widgets/explorer/explorerTree.ts

@@ -6,7 +6,7 @@
 import { Router } from '@angular/router';
 
 import { IConnectionProfile } from 'sql/parts/connection/common/interfaces';
-import { MetadataType } from 'sql/parts/connection/common/connectionManagement';
+import { MetadataType, IConnectionManagementService, IErrorMessageService } from 'sql/parts/connection/common/connectionManagement';
 import { SingleConnectionManagementService } from 'sql/services/common/commonServiceInterface.service';
 import {
 	NewQueryAction, ScriptSelectAction, EditDataAction, ScriptCreateAction, ScriptExecuteAction, ScriptAlterAction,
@@ -16,6 +16,8 @@ import { ICapabilitiesService } from 'sql/services/capabilities/capabilitiesServ
 import { ConnectionManagementInfo } from 'sql/parts/connection/common/connectionManagementInfo';
 import * as Constants from 'sql/parts/connection/common/constants';
 import { OEAction } from 'sql/parts/objectExplorer/viewlet/objectExplorerActions';
+import { IQueryEditorService } from 'sql/parts/query/common/queryEditorService';
+import { IScriptingService } from 'sql/services/scripting/scriptingService';
 
 import { ObjectMetadata } from 'sqlops';
 
@@ -30,6 +32,7 @@ import { generateUuid } from 'vs/base/common/uuid';
 import { $ } from 'vs/base/browser/dom';
 import { ExecuteCommandAction } from 'vs/platform/actions/common/actions';
 import { IKeyboardEvent } from 'vs/base/browser/keyboardEvent';
+import { IProgressService } from 'vs/platform/progress/common/progress';
 
 export class ObjectMetadataWrapper implements ObjectMetadata {
 	public metadataType: MetadataType;
@@ -370,7 +373,7 @@ function GetExplorerActions(element: TreeResource, instantiationService: IInstan
 
 	if (element instanceof ObjectMetadataWrapper) {
 		if (element.metadataType === MetadataType.View || element.metadataType === MetadataType.Table) {
-			actions.push(instantiationService.createInstance(ScriptSelectAction, ScriptSelectAction.ID, ScriptSelectAction.LABEL));
+			actions.push(instantiationService.createInstance(ExplorerScriptSelectAction, ScriptSelectAction.ID, ScriptSelectAction.LABEL));
 		}
 
 		if (element.metadataType === MetadataType.Table) {
@@ -378,12 +381,12 @@ function GetExplorerActions(element: TreeResource, instantiationService: IInstan
 		}
 
 		if (element.metadataType === MetadataType.SProc && info.connectionProfile.providerName === Constants.mssqlProviderName) {
-			actions.push(instantiationService.createInstance(ScriptExecuteAction, ScriptExecuteAction.ID, ScriptExecuteAction.LABEL));
+			actions.push(instantiationService.createInstance(ExplorerScriptExecuteAction, ScriptExecuteAction.ID, ScriptExecuteAction.LABEL));
 		}
 
 		if ((element.metadataType === MetadataType.SProc || element.metadataType === MetadataType.Function || element.metadataType === MetadataType.View)
 			&& info.connectionProfile.providerName === Constants.mssqlProviderName) {
-			actions.push(instantiationService.createInstance(ScriptAlterAction, ScriptAlterAction.ID, ScriptAlterAction.LABEL));
+			actions.push(instantiationService.createInstance(ExplorerScriptAlterAction, ScriptAlterAction.ID, ScriptAlterAction.LABEL));
 		}
 	} else {
 		actions.push(instantiationService.createInstance(CustomExecuteCommandAction, NewQueryAction.ID, NewQueryAction.LABEL));
@@ -402,7 +405,7 @@ function GetExplorerActions(element: TreeResource, instantiationService: IInstan
 		return TPromise.as(actions);
 	}
 
-	actions.push(instantiationService.createInstance(ScriptCreateAction, ScriptCreateAction.ID, ScriptCreateAction.LABEL));
+	actions.push(instantiationService.createInstance(ExplorerScriptCreateAction, ScriptCreateAction.ID, ScriptCreateAction.LABEL));
 
 	return TPromise.as(actions);
 }
@@ -412,3 +415,78 @@ class CustomExecuteCommandAction extends ExecuteCommandAction {
 		return super.run(context.profile);
 	}
 }
+
+class ExplorerScriptSelectAction extends ScriptSelectAction {
+	constructor(
+		id: string, label: string,
+		@IQueryEditorService queryEditorService: IQueryEditorService,
+		@IConnectionManagementService connectionManagementService: IConnectionManagementService,
+		@IScriptingService scriptingService: IScriptingService,
+		@IProgressService private progressService: IProgressService
+	) {
+		super(id, label, queryEditorService, connectionManagementService, scriptingService);
+	}
+
+	public run(actionContext: BaseActionContext): TPromise<boolean> {
+		let promise = super.run(actionContext);
+		this.progressService.showWhile(promise);
+		return promise;
+	}
+}
+
+class ExplorerScriptCreateAction extends ScriptCreateAction {
+	constructor(
+		id: string, label: string,
+		@IQueryEditorService queryEditorService: IQueryEditorService,
+		@IConnectionManagementService connectionManagementService: IConnectionManagementService,
+		@IScriptingService scriptingService: IScriptingService,
+		@IErrorMessageService errorMessageService: IErrorMessageService,
+		@IProgressService private progressService: IProgressService
+	) {
+		super(id, label, queryEditorService, connectionManagementService, scriptingService, errorMessageService);
+	}
+
+	public run(actionContext: BaseActionContext): TPromise<boolean> {
+		let promise = super.run(actionContext);
+		this.progressService.showWhile(promise);
+		return promise;
+	}
+}
+
+class ExplorerScriptAlterAction extends ScriptAlterAction {
+	constructor(
+		id: string, label: string,
+		@IQueryEditorService queryEditorService: IQueryEditorService,
+		@IConnectionManagementService connectionManagementService: IConnectionManagementService,
+		@IScriptingService scriptingService: IScriptingService,
+		@IErrorMessageService errorMessageService: IErrorMessageService,
+		@IProgressService private progressService: IProgressService
+	) {
+		super(id, label, queryEditorService, connectionManagementService, scriptingService, errorMessageService);
+	}
+
+	public run(actionContext: BaseActionContext): TPromise<boolean> {
+		let promise = super.run(actionContext);
+		this.progressService.showWhile(promise);
+		return promise;
+	}
+}
+
+class ExplorerScriptExecuteAction extends ScriptExecuteAction {
+	constructor(
+		id: string, label: string,
+		@IQueryEditorService queryEditorService: IQueryEditorService,
+		@IConnectionManagementService connectionManagementService: IConnectionManagementService,
+		@IScriptingService scriptingService: IScriptingService,
+		@IErrorMessageService errorMessageService: IErrorMessageService,
+		@IProgressService private progressService: IProgressService
+	) {
+		super(id, label, queryEditorService, connectionManagementService, scriptingService, errorMessageService);
+	}
+
+	public run(actionContext: BaseActionContext): TPromise<boolean> {
+		let promise = super.run(actionContext);
+		this.progressService.showWhile(promise);
+		return promise;
+	}
+}

src/sql/parts/dashboard/widgets/explorer/explorerWidget.component.ts

@@ -16,6 +16,7 @@ import { CommonServiceInterface } from 'sql/services/common/commonServiceInterfa
 import { toDisposableSubscription } from 'sql/parts/common/rxjsUtils';
 import { ExplorerFilter, ExplorerRenderer, ExplorerDataSource, ExplorerController, ObjectMetadataWrapper, ExplorerModel } from './explorerTree';
 import { ConnectionProfile } from 'sql/parts/connection/common/connectionProfile';
+import { ICapabilitiesService } from 'sql/services/capabilities/capabilitiesService';
 
 import { InputBox, IInputOptions } from 'vs/base/browser/ui/inputbox/inputBox';
 import { attachInputBoxStyler, attachListStyler } from 'vs/platform/theme/common/styler';
@@ -23,6 +24,10 @@ import * as nls from 'vs/nls';
 import { Tree } from 'vs/base/parts/tree/browser/treeImpl';
 import { getContentHeight } from 'vs/base/browser/dom';
 import { Delayer } from 'vs/base/common/async';
+import { IContextViewService, IContextMenuService } from 'vs/platform/contextview/browser/contextView';
+import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { IProgressService } from 'vs/platform/progress/common/progress';
 
 @Component({
 	selector: 'explorer-widget',
@@ -36,9 +41,9 @@ export class ExplorerWidget extends DashboardWidget implements IDashboardWidget,
 		this._bootstrap.getUnderlyingUri(),
 		this._bootstrap.connectionManagementService,
 		this._router,
-		this._bootstrap.contextMenuService,
+		this.contextMenuService,
-		this._bootstrap.capabilitiesService,
+		this.capabilitiesService,
-		this._bootstrap.instantiationService
+		this.instantiationService
 	);
 	private _treeRenderer = new ExplorerRenderer();
 	private _treeDataSource = new ExplorerDataSource();
@@ -54,7 +59,13 @@ export class ExplorerWidget extends DashboardWidget implements IDashboardWidget,
 		@Inject(forwardRef(() => Router)) private _router: Router,
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _changeRef: ChangeDetectorRef,
 		@Inject(WIDGET_CONFIG) protected _config: WidgetConfig,
-		@Inject(forwardRef(() => ElementRef)) private _el: ElementRef
+		@Inject(forwardRef(() => ElementRef)) private _el: ElementRef,
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
+		@Inject(IContextViewService) private contextViewService: IContextViewService,
+		@Inject(IInstantiationService) private instantiationService: IInstantiationService,
+		@Inject(IContextMenuService) private contextMenuService: IContextMenuService,
+		@Inject(ICapabilitiesService) private capabilitiesService: ICapabilitiesService,
+		@Inject(IProgressService) private progressService: IProgressService
 	) {
 		super();
 		this.init();
@@ -69,7 +80,7 @@ export class ExplorerWidget extends DashboardWidget implements IDashboardWidget,
 			placeholder: placeholderLabel,
 			ariaLabel: placeholderLabel
 		};
-		this._input = new InputBox(this._inputContainer.nativeElement, this._bootstrap.contextViewService, inputOptions);
+		this._input = new InputBox(this._inputContainer.nativeElement, this.contextViewService, inputOptions);
 		this._register(this._input.onDidChange(e => {
 			this._filterDelayer.trigger(() => {
 				this._treeFilter.filterString = e;
@@ -84,9 +95,9 @@ export class ExplorerWidget extends DashboardWidget implements IDashboardWidget,
 		});
 		this._tree.layout(getContentHeight(this._tableContainer.nativeElement));
 		this._register(this._input);
-		this._register(attachInputBoxStyler(this._input, this._bootstrap.themeService));
+		this._register(attachInputBoxStyler(this._input, this.themeService));
 		this._register(this._tree);
-		this._register(attachListStyler(this._tree, this._bootstrap.themeService));
+		this._register(attachListStyler(this._tree, this.themeService));
 	}
 
 	private init(): void {
@@ -109,7 +120,7 @@ export class ExplorerWidget extends DashboardWidget implements IDashboardWidget,
 			this._register(toDisposableSubscription(this._bootstrap.metadataService.databaseNames.subscribe(
 				data => {
 					let profileData = data.map(d => {
-						let profile = new ConnectionProfile(this._bootstrap.capabilitiesService, currentProfile);
+						let profile = new ConnectionProfile(this.capabilitiesService, currentProfile);
 						profile.databaseName = d;
 						return profile;
 					});

src/sql/parts/dashboard/widgets/insights/insightsWidget.component.ts

@@ -26,8 +26,10 @@ import * as types from 'vs/base/common/types';
 import * as pfs from 'vs/base/node/pfs';
 import * as nls from 'vs/nls';
 import { Registry } from 'vs/platform/registry/common/platform';
-import { WorkbenchState } from 'vs/platform/workspace/common/workspace';
+import { WorkbenchState, IWorkspaceContextService } from 'vs/platform/workspace/common/workspace';
 import { IntervalTimer } from 'vs/base/common/async';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { IStorageService } from 'vs/platform/storage/common/storage';
 
 const insightRegistry = Registry.as<IInsightRegistry>(Extensions.InsightContribution);
 
@@ -63,7 +65,11 @@ export class InsightsWidget extends DashboardWidget implements IDashboardWidget,
 		@Inject(forwardRef(() => CommonServiceInterface)) private dashboardService: CommonServiceInterface,
 		@Inject(WIDGET_CONFIG) protected _config: WidgetConfig,
 		@Inject(forwardRef(() => ViewContainerRef)) private viewContainerRef: ViewContainerRef,
-		@Inject(forwardRef(() => ChangeDetectorRef)) private _cd: ChangeDetectorRef
+		@Inject(forwardRef(() => ChangeDetectorRef)) private _cd: ChangeDetectorRef,
+		@Inject(IInstantiationService) private instantiationService: IInstantiationService,
+		@Inject(IStorageService) private storageService: IStorageService,
+		@Inject(IWorkspaceContextService) private workspaceContextService: IWorkspaceContextService,
+
 	) {
 		super();
 		this.insightConfig = <IInsightsConfig>this._config.widget['insights-widget'];
@@ -128,9 +134,9 @@ export class InsightsWidget extends DashboardWidget implements IDashboardWidget,
 	get actions(): Array<Action> {
 		let actions: Array<Action> = [];
 		if (this.insightConfig.details && (this.insightConfig.details.query || this.insightConfig.details.queryFile)) {
-			actions.push(this.dashboardService.instantiationService.createInstance(InsightAction, InsightAction.ID, InsightAction.LABEL));
+			actions.push(this.instantiationService.createInstance(InsightAction, InsightAction.ID, InsightAction.LABEL));
 		}
-		actions.push(this.dashboardService.instantiationService.createInstance(RunInsightQueryAction, RunInsightQueryAction.ID, RunInsightQueryAction.LABEL));
+		actions.push(this.instantiationService.createInstance(RunInsightQueryAction, RunInsightQueryAction.ID, RunInsightQueryAction.LABEL));
 		return actions;
 	}
 
@@ -150,14 +156,14 @@ export class InsightsWidget extends DashboardWidget implements IDashboardWidget,
 			};
 			this.lastUpdated = nls.localize('insights.lastUpdated', "Last Updated: {0} {1}", currentTime.toLocaleTimeString(), currentTime.toLocaleDateString());
 			this._cd.detectChanges();
-			this.dashboardService.storageService.store(this._getStorageKey(), JSON.stringify(store));
+			this.storageService.store(this._getStorageKey(), JSON.stringify(store));
 		}
 		return result;
 	}
 
 	private _checkStorage(): boolean {
 		if (this.insightConfig.cacheId) {
-			let storage = this.dashboardService.storageService.get(this._getStorageKey());
+			let storage = this.storageService.get(this._getStorageKey());
 			if (storage) {
 				let storedResult: IStorageResult = JSON.parse(storage);
 				let date = new Date(storedResult.date);
@@ -272,15 +278,15 @@ export class InsightsWidget extends DashboardWidget implements IDashboardWidget,
 				filePath = filePath.replace(match[0], '');
 
 				//filePath = this.dashboardService.workspaceContextService.toResource(filePath).fsPath;
-				switch (this.dashboardService.workspaceContextService.getWorkbenchState()) {
+				switch (this.workspaceContextService.getWorkbenchState()) {
 					case WorkbenchState.FOLDER:
-						filePath = this.dashboardService.workspaceContextService.getWorkspace().folders[0].toResource(filePath).fsPath;
+						filePath = this.workspaceContextService.getWorkspace().folders[0].toResource(filePath).fsPath;
 						break;
 					case WorkbenchState.WORKSPACE:
 						let filePathArray = filePath.split('/');
 						// filter out empty sections
 						filePathArray = filePathArray.filter(i => !!i);
-						let folder = this.dashboardService.workspaceContextService.getWorkspace().folders.find(i => i.name === filePathArray[0]);
+						let folder = this.workspaceContextService.getWorkspace().folders.find(i => i.name === filePathArray[0]);
 						if (!folder) {
 							return Promise.reject<void[]>(new Error(`Could not find workspace folder ${filePathArray[0]}`));
 						}

src/sql/parts/dashboard/widgets/insights/views/charts/chartInsight.component.ts

@@ -5,22 +5,19 @@
 import { Component, Input, Inject, ChangeDetectorRef, forwardRef, ElementRef, ViewChild } from '@angular/core';
 import { BaseChartDirective } from 'ng2-charts/ng2-charts';
 
-/* SQL Imports */
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
-
 import * as TelemetryKeys from 'sql/common/telemetryKeys';
 import * as TelemetryUtils from 'sql/common/telemetryUtilities';
 import { IInsightsView, IInsightData } from 'sql/parts/dashboard/widgets/insights/interfaces';
 import { memoize, unmemoize } from 'sql/base/common/decorators';
-
-/* VS Imports */
-import * as colors from 'vs/platform/theme/common/colorRegistry';
 import { mixin } from 'sql/base/common/objects';
+
+import * as colors from 'vs/platform/theme/common/colorRegistry';
 import { Color } from 'vs/base/common/color';
 import * as types from 'vs/base/common/types';
 import { Disposable } from 'vs/base/common/lifecycle';
-import { IColorTheme } from 'vs/workbench/services/themes/common/workbenchThemeService';
+import { IColorTheme, IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
 import * as nls from 'vs/nls';
+import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
 
 export enum ChartType {
 	Bar = 'bar',
@@ -121,14 +118,15 @@ export abstract class ChartInsight extends Disposable implements IInsightsView {
 	constructor(
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _changeRef: ChangeDetectorRef,
 		@Inject(forwardRef(() => ElementRef)) private _el: ElementRef,
-		@Inject(BOOTSTRAP_SERVICE_ID) protected _bootstrapService: IBootstrapService
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
+		@Inject(ITelemetryService) private telemetryService: ITelemetryService
 	) {
 		super();
 	}
 
 	init() {
-		this._register(this._bootstrapService.themeService.onDidColorThemeChange(e => this.updateTheme(e)));
+		this._register(this.themeService.onDidColorThemeChange(e => this.updateTheme(e)));
-		this.updateTheme(this._bootstrapService.themeService.getColorTheme());
+		this.updateTheme(this.themeService.getColorTheme());
 		// Note: must use a boolean to not render the canvas until all properties such as the labels and chart type are set.
 		// This is because chart.js doesn't auto-update anything other than dataset when re-rendering so defaults are used
 		// hence it's easier to not render until ready
@@ -142,7 +140,7 @@ export abstract class ChartInsight extends Disposable implements IInsightsView {
 			this._hasError = true;
 			this._changeRef.detectChanges();
 		}
-		TelemetryUtils.addTelemetry(this._bootstrapService.telemetryService, TelemetryKeys.ChartCreated, { type: this.chartType });
+		TelemetryUtils.addTelemetry(this.telemetryService, TelemetryKeys.ChartCreated, { type: this.chartType });
 	}
 
 	/**

src/sql/parts/dashboard/widgets/insights/views/tableInsight.component.ts

@@ -7,16 +7,16 @@ import { Component, Input, Inject, ChangeDetectorRef, forwardRef, ElementRef, On
 import { getContentHeight, getContentWidth } from 'vs/base/browser/dom';
 import { Dimension } from 'vs/base/browser/builder';
 import { Disposable } from 'vs/base/common/lifecycle';
+import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
 
 import { IInsightsView, IInsightData } from 'sql/parts/dashboard/widgets/insights/interfaces';
 import { Table } from 'sql/base/browser/ui/table/table';
 import { TableDataView } from 'sql/base/browser/ui/table/tableDataView';
 import { DragCellSelectionModel } from 'sql/base/browser/ui/table/plugins/dragCellSelectionModel.plugin';
 import { attachTableStyler} from 'sql/common/theme/styler';
-import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
 
 @Component({
-	template: '<span></span>'
+	template: ''
 })
 export default class TableInsight extends Disposable implements IInsightsView, OnInit {
 	private table: Table<any>;
@@ -26,7 +26,7 @@ export default class TableInsight extends Disposable implements IInsightsView, O
 	constructor(
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _changeRef: ChangeDetectorRef,
 		@Inject(forwardRef(() => ElementRef)) private _elementRef: ElementRef,
-		@Inject(forwardRef(() => CommonServiceInterface)) private _bootstrap: CommonServiceInterface,
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService
 	) {
 		super();
 		this._elementRef.nativeElement.className = 'slickgridContainer';
@@ -65,7 +65,7 @@ export default class TableInsight extends Disposable implements IInsightsView, O
 		if (!this.table) {
 			this.table = new Table(this._elementRef.nativeElement, this.dataView, this.columns, { showRowNumber: true });
 			this.table.setSelectionModel(new DragCellSelectionModel());
-			this._register(attachTableStyler(this.table, this._bootstrap.themeService));
+			this._register(attachTableStyler(this.table, this.themeService));
 		}
 	}
 }

src/sql/parts/dashboard/widgets/tasks/tasksWidget.component.ts

@@ -29,9 +29,9 @@ import { ScrollableElement } from 'vs/base/browser/ui/scrollbar/scrollableElemen
 import { ScrollbarVisibility } from 'vs/base/common/scrollable';
 import { $, Builder } from 'vs/base/browser/builder';
 import * as DOM from 'vs/base/browser/dom';
-import { CommandsRegistry, ICommand } from 'vs/platform/commands/common/commands';
+import { CommandsRegistry, ICommand, ICommandService } from 'vs/platform/commands/common/commands';
 import { MenuRegistry, ICommandAction } from 'vs/platform/actions/common/actions';
-import { ContextKeyExpr } from 'vs/platform/contextkey/common/contextkey';
+import { ContextKeyExpr, IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
 import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
 import { KeyCode } from 'vs/base/common/keyCodes';
 
@@ -62,7 +62,9 @@ export class TasksWidget extends DashboardWidget implements IDashboardWidget, On
 		@Inject(forwardRef(() => CommonServiceInterface)) private _bootstrap: CommonServiceInterface,
 		@Inject(forwardRef(() => DomSanitizer)) private _sanitizer: DomSanitizer,
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _changeref: ChangeDetectorRef,
-		@Inject(WIDGET_CONFIG) protected _config: WidgetConfig
+		@Inject(ICommandService) private commandService: ICommandService,
+		@Inject(WIDGET_CONFIG) protected _config: WidgetConfig,
+		@Inject(IContextKeyService) contextKeyService: IContextKeyService
 	) {
 		super();
 		this._profile = this._bootstrap.connectionManagementService.connectionInfo.connectionProfile;
@@ -76,7 +78,7 @@ export class TasksWidget extends DashboardWidget implements IDashboardWidget, On
 						return i;
 					}
 				} else {
-					if (tasks.includes(i.name) && _bootstrap.contextKeyService.contextMatchesRules(ContextKeyExpr.deserialize(i.when))) {
+					if (tasks.includes(i.name) && contextKeyService.contextMatchesRules(ContextKeyExpr.deserialize(i.when))) {
 						return i.name;
 					}
 				}
@@ -165,7 +167,7 @@ export class TasksWidget extends DashboardWidget implements IDashboardWidget, On
 
 	public runTask(task: ICommandAction) {
 		let serverInfo = this._bootstrap.connectionManagementService.connectionInfo.serverInfo;
-		this._bootstrap.commandService.executeCommand(task.id, this._profile);
+		this.commandService.executeCommand(task.id, this._profile);
 	}
 
 	public layout(): void {

src/sql/parts/dashboard/widgets/webview/webviewWidget.component.ts

@@ -6,7 +6,7 @@
 import { Component, Inject, forwardRef, ChangeDetectorRef, OnInit, ViewChild, ElementRef } from '@angular/core';
 
 import { Webview } from 'vs/workbench/parts/html/browser/webview';
-import { Parts } from 'vs/workbench/services/part/common/partService';
+import { Parts, IPartService } from 'vs/workbench/services/part/common/partService';
 import Event, { Emitter } from 'vs/base/common/event';
 import { IDisposable } from 'vs/base/common/lifecycle';
 import { memoize } from 'vs/base/common/decorators';
@@ -14,9 +14,12 @@ import { memoize } from 'vs/base/common/decorators';
 import { DashboardWidget, IDashboardWidget, WidgetConfig, WIDGET_CONFIG } from 'sql/parts/dashboard/common/dashboardWidget';
 import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
 import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
-import { IDashboardWebview } from 'sql/services/dashboard/common/dashboardViewService';
+import { IDashboardWebview, IDashboardViewService } from 'sql/services/dashboard/common/dashboardViewService';
 
 import * as sqlops from 'sqlops';
+import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
+import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
+import { IEnvironmentService } from 'vs/platform/environment/common/environment';
 
 interface IWebviewWidgetConfig {
 	id: string;
@@ -36,21 +39,24 @@ export class WebviewWidget extends DashboardWidget implements IDashboardWidget,
 	private _onMessage = new Emitter<string>();
 	public readonly onMessage: Event<string> = this._onMessage.event;
 	private _onMessageDisposable: IDisposable;
-	private _dashboardService: DashboardServiceInterface;
 
 	constructor(
-		@Inject(forwardRef(() => CommonServiceInterface)) private commonService: CommonServiceInterface,
+		@Inject(forwardRef(() => CommonServiceInterface)) private _dashboardService: DashboardServiceInterface,
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _changeRef: ChangeDetectorRef,
 		@Inject(WIDGET_CONFIG) protected _config: WidgetConfig,
-		@Inject(forwardRef(() => ElementRef)) private _el: ElementRef
+		@Inject(forwardRef(() => ElementRef)) private _el: ElementRef,
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
+		@Inject(IContextViewService) private contextViewService: IContextViewService,
+		@Inject(IDashboardViewService) private dashboardViewService: IDashboardViewService,
+		@Inject(IPartService) private partService: IPartService,
+		@Inject(IEnvironmentService) private environmentService: IEnvironmentService
 	) {
 		super();
 		this._id = (_config.widget[selector] as IWebviewWidgetConfig).id;
-		this._dashboardService = commonService as DashboardServiceInterface;
 	}
 
 	ngOnInit() {
-		this._dashboardService.dashboardViewService.registerWebview(this);
+		this.dashboardViewService.registerWebview(this);
 		this._createWebview();
 	}
 
@@ -101,10 +107,10 @@ export class WebviewWidget extends DashboardWidget implements IDashboardWidget,
 		}
 		this._webview = new Webview(
 			this._el.nativeElement,
-			this._dashboardService.partService.getContainer(Parts.EDITOR_PART),
+			this.partService.getContainer(Parts.EDITOR_PART),
-			this._dashboardService.themeService,
+			this.themeService,
-			this._dashboardService.environmentService,
+			this.environmentService,
-			this._dashboardService.contextViewService,
+			this.contextViewService,
 			undefined,
 			undefined,
 			{
@@ -115,7 +121,7 @@ export class WebviewWidget extends DashboardWidget implements IDashboardWidget,
 		this._onMessageDisposable = this._webview.onMessage(e => {
 			this._onMessage.fire(e);
 		});
-		this._webview.style(this._dashboardService.themeService.getTheme());
+		this._webview.style(this.themeService.getTheme());
 		if (this._html) {
 			this._webview.contents = this._html;
 		}

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

@@ -19,8 +19,9 @@ import { IConnectionProfile } from 'sql/parts/connection/common/interfaces';
 import * as BackupConstants from 'sql/parts/disasterRecovery/backup/constants';
 import { IBackupService, IBackupUiService, TaskExecutionMode } from 'sql/parts/disasterRecovery/backup/common/backupService';
 import FileValidationConstants = require('sql/parts/fileBrowser/common/fileValidationServiceConstants');
-import { DashboardComponentParams } from 'sql/services/bootstrap/bootstrapParams';
+import { IDashboardComponentParams } from 'sql/services/bootstrap/bootstrapParams';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
+import { IFileBrowserDialogController } from 'sql/parts/fileBrowser/common/interfaces';
+import { IConnectionManagementService } from 'sql/parts/connection/common/connectionManagement';
 
 import { MessageType } from 'vs/base/browser/ui/inputbox/inputBox';
 import * as lifecycle from 'vs/base/common/lifecycle';
@@ -30,6 +31,9 @@ import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
 import { KeyCode } from 'vs/base/common/keyCodes';
 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';
 
 export const BACKUP_SELECTOR: string = 'backup-component';
 
@@ -143,8 +147,6 @@ export class BackupComponent {
 
 	private localizedStrings = LocalizedStrings;
 
-	private _backupService: IBackupService;
-	private _backupUiService: IBackupUiService;
 	private _uri: string;
 	private _toDispose: lifecycle.IDisposable[] = [];
 	private _advancedHeaderSize = 32;
@@ -199,10 +201,14 @@ export class BackupComponent {
 	constructor(
 		@Inject(forwardRef(() => ElementRef)) private _el: ElementRef,
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _changeDetectorRef: ChangeDetectorRef,
-		@Inject(BOOTSTRAP_SERVICE_ID) private _bootstrapService: IBootstrapService,
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
+		@Inject(IContextViewService) private contextViewService: IContextViewService,
+		@Inject(IFileBrowserDialogController) private fileBrowserDialogService: IFileBrowserDialogController,
+		@Inject(IBackupUiService) private _backupUiService: IBackupUiService,
+		@Inject(IBackupService) private _backupService: IBackupService,
+		@Inject(IClipboardService) private clipboardService: IClipboardService,
+		@Inject(IConnectionManagementService) private connectionManagementService: IConnectionManagementService
 	) {
-		this._backupService = _bootstrapService.backupService;
-		this._backupUiService = _bootstrapService.backupUiService;
 		this._backupUiService.onShowBackupEvent((param) => this.onGetBackupConfigInfo(param));
 	}
 
@@ -210,12 +216,12 @@ export class BackupComponent {
 		let self = this;
 		this.addFooterButtons();
 
-		this.recoveryBox = new InputBox(this.recoveryModelElement.nativeElement, this._bootstrapService.contextViewService, {
+		this.recoveryBox = new InputBox(this.recoveryModelElement.nativeElement, this.contextViewService, {
 			placeholder: this.recoveryModel,
 			ariaLabel: LocalizedStrings.RECOVERY_MODEL
 		});
 		// Set backup type
-		this.backupTypeSelectBox = new SelectBox([], '', this._bootstrapService.contextViewService);
+		this.backupTypeSelectBox = new SelectBox([], '', this.contextViewService);
 		this.backupTypeSelectBox.render(this.backupTypeElement.nativeElement);
 
 		// Set copy-only check box
@@ -259,12 +265,12 @@ export class BackupComponent {
 		});
 
 		// Set backup name
-		this.backupNameBox = new InputBox(this.backupNameElement.nativeElement, this._bootstrapService.contextViewService, {
+		this.backupNameBox = new InputBox(this.backupNameElement.nativeElement, this.contextViewService, {
 			ariaLabel: LocalizedStrings.BACKUP_NAME
 		});
 
 		// Set backup path list
-		this.pathListBox = new ListBox([], '', this._bootstrapService.contextViewService, this._bootstrapService.clipboardService);
+		this.pathListBox = new ListBox([], '', this.contextViewService, this.clipboardService);
 		this.pathListBox.render(this.pathElement.nativeElement);
 
 		// Set backup path add/remove buttons
@@ -277,18 +283,18 @@ export class BackupComponent {
 		this.removePathButton.title = localize('removeFile', 'Remove files');
 
 		// Set compression
-		this.compressionSelectBox = new SelectBox(this.compressionOptions, this.compressionOptions[0], this._bootstrapService.contextViewService);
+		this.compressionSelectBox = new SelectBox(this.compressionOptions, this.compressionOptions[0], this.contextViewService);
 		this.compressionSelectBox.render(this.compressionElement.nativeElement);
 
 		// Set encryption
-		this.algorithmSelectBox = new SelectBox(this.encryptionAlgorithms, this.encryptionAlgorithms[0], this._bootstrapService.contextViewService);
+		this.algorithmSelectBox = new SelectBox(this.encryptionAlgorithms, this.encryptionAlgorithms[0], this.contextViewService);
 		this.algorithmSelectBox.render(this.encryptionAlgorithmElement.nativeElement);
-		this.encryptorSelectBox = new SelectBox([], '', this._bootstrapService.contextViewService);
+		this.encryptorSelectBox = new SelectBox([], '', this.contextViewService);
 		this.encryptorSelectBox.render(this.encryptorElement.nativeElement);
 
 		// Set media
 		this.mediaNameBox = new InputBox(this.mediaNameElement.nativeElement,
-			this._bootstrapService.contextViewService,
+			this.contextViewService,
 			{
 				validationOptions: {
 					validation: (value: string) => !value ? ({ type: MessageType.ERROR, content: LocalizedStrings.MEDIA_NAME_REQUIRED_ERROR }) : null
@@ -297,14 +303,14 @@ export class BackupComponent {
 			}
 		);
 
-		this.mediaDescriptionBox = new InputBox(this.mediaDescriptionElement.nativeElement, this._bootstrapService.contextViewService, {
+		this.mediaDescriptionBox = new InputBox(this.mediaDescriptionElement.nativeElement, this.contextViewService, {
 			ariaLabel: LocalizedStrings.NEW_MEDIA_SET_DESCRIPTION
 		});
 
 		// Set backup retain days
 		let invalidInputMessage = localize('backupComponent.invalidInput', 'Invalid input. Value must be greater than or equal 0.');
 		this.backupRetainDaysBox = new InputBox(this.backupDaysElement.nativeElement,
-			this._bootstrapService.contextViewService,
+			this.contextViewService,
 			{
 				placeholder: '0',
 				type: 'number',
@@ -387,21 +393,21 @@ export class BackupComponent {
 		this.scriptButton = new Button(this.scriptButtonElement.nativeElement);
 		this.scriptButton.label = localize('backupComponent.script', 'Script');
 		this.addButtonClickHandler(this.scriptButton, () => this.onScript());
-		this._toDispose.push(attachButtonStyler(this.scriptButton, this._bootstrapService.themeService));
+		this._toDispose.push(attachButtonStyler(this.scriptButton, this.themeService));
 		this.scriptButton.enabled = false;
 
 		// Set backup footer button
 		this.backupButton = new Button(this.backupButtonElement.nativeElement);
 		this.backupButton.label = localize('backupComponent.backup', 'Backup');
 		this.addButtonClickHandler(this.backupButton, () => this.onOk());
-		this._toDispose.push(attachButtonStyler(this.backupButton, this._bootstrapService.themeService));
+		this._toDispose.push(attachButtonStyler(this.backupButton, this.themeService));
 		this.backupEnabled = false;
 
 		// Set cancel footer button
 		this.cancelButton = new Button(this.cancelButtonElement.nativeElement);
 		this.cancelButton.label = localize('backupComponent.cancel', 'Cancel');
 		this.addButtonClickHandler(this.cancelButton, () => this.onCancel());
-		this._toDispose.push(attachButtonStyler(this.cancelButton, this._bootstrapService.themeService));
+		this._toDispose.push(attachButtonStyler(this.cancelButton, this.themeService));
 	}
 
 	private initialize(isMetadataPopulated: boolean): void {
@@ -505,18 +511,18 @@ export class BackupComponent {
 
 	private registerListeners(): void {
 		// Theme styler
-		this._toDispose.push(attachInputBoxStyler(this.backupNameBox, this._bootstrapService.themeService));
+		this._toDispose.push(attachInputBoxStyler(this.backupNameBox, this.themeService));
-		this._toDispose.push(attachInputBoxStyler(this.recoveryBox, this._bootstrapService.themeService));
+		this._toDispose.push(attachInputBoxStyler(this.recoveryBox, this.themeService));
-		this._toDispose.push(attachSelectBoxStyler(this.backupTypeSelectBox, this._bootstrapService.themeService));
+		this._toDispose.push(attachSelectBoxStyler(this.backupTypeSelectBox, this.themeService));
-		this._toDispose.push(attachListBoxStyler(this.pathListBox, this._bootstrapService.themeService));
+		this._toDispose.push(attachListBoxStyler(this.pathListBox, this.themeService));
-		this._toDispose.push(attachButtonStyler(this.addPathButton, this._bootstrapService.themeService));
+		this._toDispose.push(attachButtonStyler(this.addPathButton, this.themeService));
-		this._toDispose.push(attachButtonStyler(this.removePathButton, this._bootstrapService.themeService));
+		this._toDispose.push(attachButtonStyler(this.removePathButton, this.themeService));
-		this._toDispose.push(attachSelectBoxStyler(this.compressionSelectBox, this._bootstrapService.themeService));
+		this._toDispose.push(attachSelectBoxStyler(this.compressionSelectBox, this.themeService));
-		this._toDispose.push(attachSelectBoxStyler(this.algorithmSelectBox, this._bootstrapService.themeService));
+		this._toDispose.push(attachSelectBoxStyler(this.algorithmSelectBox, this.themeService));
-		this._toDispose.push(attachSelectBoxStyler(this.encryptorSelectBox, this._bootstrapService.themeService));
+		this._toDispose.push(attachSelectBoxStyler(this.encryptorSelectBox, this.themeService));
-		this._toDispose.push(attachInputBoxStyler(this.mediaNameBox, this._bootstrapService.themeService));
+		this._toDispose.push(attachInputBoxStyler(this.mediaNameBox, this.themeService));
-		this._toDispose.push(attachInputBoxStyler(this.mediaDescriptionBox, this._bootstrapService.themeService));
+		this._toDispose.push(attachInputBoxStyler(this.mediaDescriptionBox, this.themeService));
-		this._toDispose.push(attachInputBoxStyler(this.backupRetainDaysBox, this._bootstrapService.themeService));
+		this._toDispose.push(attachInputBoxStyler(this.backupRetainDaysBox, this.themeService));
 
 		this._toDispose.push(this.backupTypeSelectBox.onDidSelect(selected => this.onBackupTypeChanged()));
 		this.addButtonClickHandler(this.addPathButton, () => this.onAddClick());
@@ -528,7 +534,7 @@ export class BackupComponent {
 			this.backupRetainDaysChanged(days);
 		}));
 
-		this._toDispose.push(this._bootstrapService.themeService.onDidColorThemeChange(e => this.updateTheme()));
+		this._toDispose.push(this.themeService.onDidColorThemeChange(e => this.updateTheme()));
 	}
 
 	// Update theming that is specific to backup dialog
@@ -566,7 +572,7 @@ export class BackupComponent {
 
 	private onCancel(): void {
 		this.close();
-		this._bootstrapService.connectionManagementService.disconnect(this._uri);
+		this.connectionManagementService.disconnect(this._uri);
 	}
 
 	private close(): void {
@@ -629,7 +635,7 @@ export class BackupComponent {
 	}
 
 	private onAddClick(): void {
-		this._bootstrapService.fileBrowserDialogService.showDialog(this._uri,
+		this.fileBrowserDialogService.showDialog(this._uri,
 			this.defaultNewBackupFolder,
 			BackupConstants.fileFiltersSet,
 			FileValidationConstants.backup,

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

@@ -3,43 +3,50 @@
 *  Licensed under the Source EULA. See License.txt in the project root for license information.
 *--------------------------------------------------------------------------------------------*/
 
-import { ApplicationRef, ComponentFactoryResolver, ModuleWithProviders, NgModule,
+import {
-	Inject, forwardRef } from '@angular/core';
+	ApplicationRef, ComponentFactoryResolver, ModuleWithProviders, NgModule,
+	Inject, forwardRef, Type
+} from '@angular/core';
 import { APP_BASE_HREF, CommonModule } from '@angular/common';
 import { FormsModule } from '@angular/forms';
 import { BrowserModule } from '@angular/platform-browser';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
+import { IBootstrapParams } from 'sql/services/bootstrap/bootstrapService';
 import { BackupComponent, BACKUP_SELECTOR } from 'sql/parts/disasterRecovery/backup/backup.component';
 
 // work around
-const BrowserAnimationsModule = (<any> require.__$__nodeRequire('@angular/platform-browser/animations')).BrowserAnimationsModule;
+const BrowserAnimationsModule = (<any>require.__$__nodeRequire('@angular/platform-browser/animations')).BrowserAnimationsModule;
 
 // Backup wizard main angular module
-@NgModule({
+export const BackupModule = (params: IBootstrapParams, selector: string): Type<any> => {
-	declarations: [
+	@NgModule({
-		BackupComponent
+		declarations: [
-	],
+			BackupComponent
-	entryComponents: [BackupComponent],
+		],
-	imports: [
+		entryComponents: [BackupComponent],
-		FormsModule,
+		imports: [
-		CommonModule,
+			FormsModule,
-		BrowserModule,
+			CommonModule,
-		BrowserAnimationsModule,
+			BrowserModule,
-	],
+			BrowserAnimationsModule,
-	providers: [{ provide: APP_BASE_HREF, useValue: '/' }]
+		],
-})
+		providers: [
-export class BackupModule {
+			{ provide: APP_BASE_HREF, useValue: '/' },
+			{ provide: IBootstrapParams, useValue: params }
+		]
+	})
+	class ModuleClass {
 
-	constructor(
+		constructor(
-		@Inject(forwardRef(() => ComponentFactoryResolver)) private _resolver: ComponentFactoryResolver,
+			@Inject(forwardRef(() => ComponentFactoryResolver)) private _resolver: ComponentFactoryResolver
-		@Inject(BOOTSTRAP_SERVICE_ID) private _bootstrapService: IBootstrapService
+		) {
-	) {
+		}
+
+		ngDoBootstrap(appRef: ApplicationRef) {
+			const factory = this._resolver.resolveComponentFactory(BackupComponent);
+			(<any>factory).factory.selector = selector;
+			appRef.bootstrap(factory);
+		}
 	}
 
-	ngDoBootstrap(appRef: ApplicationRef) {
+	return ModuleClass;
-		const factory = this._resolver.resolveComponentFactory(BackupComponent);
+};
-		const uniqueSelector: string = this._bootstrapService.getUniqueSelector(BACKUP_SELECTOR);
-		(<any>factory).factory.selector = uniqueSelector;
-		appRef.bootstrap(factory);
-	}
-}

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

@@ -7,7 +7,6 @@ import { Modal } from 'sql/base/browser/ui/modal/modal';
 import { IConnectionProfile } from 'sql/parts/connection/common/interfaces';
 import { BackupModule } from 'sql/parts/disasterRecovery/backup/backup.module';
 import { BACKUP_SELECTOR } from 'sql/parts/disasterRecovery/backup/backup.component';
-import { IBootstrapService } from 'sql/services/bootstrap/bootstrapService';
 import { attachModalDialogStyler } from 'sql/common/theme/styler';
 import { IConnectionManagementService } from 'sql/parts/connection/common/connectionManagement';
 import * as TelemetryKeys from 'sql/common/telemetryKeys';
@@ -17,6 +16,8 @@ import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
 import { IPartService } from 'vs/workbench/services/part/common/partService';
 import { Builder } from 'vs/base/browser/builder';
 import { IThemeService } from 'vs/platform/theme/common/themeService';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { bootstrapAngular } from 'sql/services/bootstrap/bootstrapService';
 
 export class BackupDialog extends Modal {
 	private _bodyBuilder: Builder;
@@ -25,12 +26,12 @@ export class BackupDialog extends Modal {
 	private _moduleRef: any;
 
 	constructor(
-		@IBootstrapService private _bootstrapService: IBootstrapService,
 		@IThemeService private _themeService: IThemeService,
 		@IPartService partService: IPartService,
 		@IConnectionManagementService private _connectionManagementService: IConnectionManagementService,
 		@ITelemetryService telemetryService: ITelemetryService,
-		@IContextKeyService contextKeyService: IContextKeyService
+		@IContextKeyService contextKeyService: IContextKeyService,
+		@IInstantiationService private _instantiationService: IInstantiationService
 	) {
 		super('', TelemetryKeys.Backup, partService, telemetryService, contextKeyService, { isAngular: true, hasErrors: true });
 	}
@@ -53,7 +54,7 @@ export class BackupDialog extends Modal {
 	 * Get the bootstrap params and perform the bootstrap
 	 */
 	private bootstrapAngular(bodyContainer: HTMLElement) {
-		this._uniqueSelector = this._bootstrapService.bootstrap(
+		this._uniqueSelector = this._instantiationService.invokeFunction(bootstrapAngular,
 			BackupModule,
 			bodyContainer,
 			BACKUP_SELECTOR,

src/sql/parts/disasterRecovery/backup/common/backupService.ts

@@ -9,7 +9,7 @@ import { createDecorator } from 'vs/platform/instantiation/common/instantiation'
 import Event from 'vs/base/common/event';
 import * as sqlops from 'sqlops';
 
-import { DashboardComponentParams } from 'sql/services/bootstrap/bootstrapParams';
+import { IDashboardComponentParams } from 'sql/services/bootstrap/bootstrapParams';
 import { IConnectionProfile } from 'sql/parts/connection/common/interfaces';
 
 

src/sql/parts/disasterRecovery/backup/common/backupServiceImp.ts

@@ -14,7 +14,7 @@ import { IBackupService, TaskExecutionMode, IBackupUiService } from 'sql/parts/d
 import { BackupDialog } from 'sql/parts/disasterRecovery/backup/backupDialog';
 import { OptionsDialog } from 'sql/base/browser/ui/modal/optionsDialog';
 import Event, { Emitter } from 'vs/base/common/event';
-import { DashboardComponentParams } from 'sql/services/bootstrap/bootstrapParams';
+import { IDashboardComponentParams } from 'sql/services/bootstrap/bootstrapParams';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 import { IPartService } from 'vs/workbench/services/part/common/partService';
 import { ICapabilitiesService } from 'sql/services/capabilities/capabilitiesService';
@@ -22,7 +22,6 @@ import { IConnectionProfile } from 'sql/parts/connection/common/interfaces';
 import { TPromise } from 'vs/base/common/winjs.base';
 import * as ConnectionUtils from 'sql/parts/connection/common/utils';
 import { ProviderConnectionInfo } from 'sql/parts/connection/common/providerConnectionInfo';
-import { ServiceOption } from 'sqlops';
 
 export class BackupService implements IBackupService {
 
@@ -96,11 +95,13 @@ export class BackupUiService implements IBackupUiService {
 	private _onShowBackupEvent: Emitter<{ connection: IConnectionProfile, ownerUri: string }>;
 	public get onShowBackupEvent(): Event<{ connection: IConnectionProfile, ownerUri: string }> { return this._onShowBackupEvent.event; }
 
-	constructor( @IInstantiationService private _instantiationService: IInstantiationService,
+	constructor(
+		@IInstantiationService private _instantiationService: IInstantiationService,
 		@IPartService private _partService: IPartService,
 		@ICapabilitiesService private _capabilitiesService: ICapabilitiesService,
 		@IBackupService private _disasterRecoveryService: IBackupService,
-		@IConnectionManagementService private _connectionManagementService: IConnectionManagementService) {
+		@IConnectionManagementService private _connectionManagementService: IConnectionManagementService
+	) {
 		this._onShowBackupEvent = new Emitter<{ connection: IConnectionProfile, ownerUri: string }>();
 	}
 
@@ -115,7 +116,7 @@ export class BackupUiService implements IBackupUiService {
 		});
 	}
 
-	private getOptions(provider: string): ServiceOption[] {
+	private getOptions(provider: string): sqlops.ServiceOption[] {
 		let feature = this._capabilitiesService.getLegacyCapabilities(this._currentProvider).features.find(f => f.featureName === 'backup');
 		if (feature) {
 			return feature.optionsMetadata;

src/sql/parts/disasterRecovery/restore/restoreDialog.ts

@@ -17,6 +17,11 @@ import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
 import { IPartService } from 'vs/workbench/services/part/common/partService';
 import { localize } from 'vs/nls';
 import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
+import { mixin } from 'vs/base/common/objects';
+import * as DOM from 'vs/base/browser/dom';
+import * as strings from 'vs/base/common/strings';
+
+import * as sqlops from 'sqlops';
 
 import { Button } from 'sql/base/browser/ui/button/button';
 import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox';
@@ -33,14 +38,10 @@ import * as TelemetryKeys from 'sql/common/telemetryKeys';
 import * as BackupConstants from 'sql/parts/disasterRecovery/backup/constants';
 import { RestoreViewModel, RestoreOptionParam, SouceDatabaseNamesParam } from 'sql/parts/disasterRecovery/restore/restoreViewModel';
 import * as FileValidationConstants from 'sql/parts/fileBrowser/common/fileValidationServiceConstants';
-import { IBootstrapService } from 'sql/services/bootstrap/bootstrapService';
 import { Dropdown } from 'sql/base/browser/ui/editableDropdown/dropdown';
 import { TabbedPanel, PanelTabIdentifier } from 'sql/base/browser/ui/panel/panel';
-import * as DOM from 'vs/base/browser/dom';
-import * as sqlops from 'sqlops';
-import * as strings from 'vs/base/common/strings';
 import { ServiceOptionType } from 'sql/workbench/api/common/sqlExtHostTypes';
-import { mixin } from 'vs/base/common/objects';
+import { IFileBrowserDialogController } from 'sql/parts/fileBrowser/common/interfaces';
 
 interface FileListElement {
 	logicalFileName: string;
@@ -130,9 +131,9 @@ export class RestoreDialog extends Modal {
 		@IPartService partService: IPartService,
 		@IThemeService private _themeService: IThemeService,
 		@IContextViewService private _contextViewService: IContextViewService,
-		@IBootstrapService private _bootstrapService: IBootstrapService,
 		@ITelemetryService telemetryService: ITelemetryService,
-		@IContextKeyService contextKeyService: IContextKeyService
+		@IContextKeyService contextKeyService: IContextKeyService,
+		@IFileBrowserDialogController private fileBrowserDialogService: IFileBrowserDialogController
 	) {
 		super(localize('RestoreDialogTitle', 'Restore database'), TelemetryKeys.Restore, partService, telemetryService, contextKeyService, { hasErrors: true, isWide: true, hasSpinner: true });
 		this._restoreTitle = localize('restoreDialog.restoreTitle', 'Restore database');
@@ -656,7 +657,7 @@ export class RestoreDialog extends Modal {
 	}
 
 	private onFileBrowserRequested(): void {
-		this._bootstrapService.fileBrowserDialogService.showDialog(this._ownerUri,
+		this.fileBrowserDialogService.showDialog(this._ownerUri,
 			this.viewModel.defaultBackupFolder,
 			BackupConstants.fileFiltersSet,
 			FileValidationConstants.restore,

src/sql/parts/editData/editor/editDataEditor.ts

@@ -33,10 +33,6 @@ import { IConnectionManagementService } from 'sql/parts/connection/common/connec
 import {
 	RefreshTableAction, StopRefreshTableAction, ChangeMaxRowsAction, ChangeMaxRowsActionItem, ShowQueryPaneAction
 } from 'sql/parts/editData/execution/editDataActions';
-import { EditDataModule } from 'sql/parts/grid/views/editData/editData.module';
-import { IBootstrapService } from 'sql/services/bootstrap/bootstrapService';
-import { EDITDATA_SELECTOR } from 'sql/parts/grid/views/editData/editData.component';
-import { EditDataComponentParams } from 'sql/services/bootstrap/bootstrapParams';
 import { TextResourceEditor } from 'vs/workbench/browser/parts/editor/textResourceEditor';
 import { CodeEditor } from 'vs/editor/browser/codeEditor';
 import { IContextKey, IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
@@ -93,8 +89,7 @@ export class EditDataEditor extends BaseEditor {
 		@IEditorDescriptorService private _editorDescriptorService: IEditorDescriptorService,
 		@IEditorGroupService private _editorGroupService: IEditorGroupService,
 		@IContextKeyService contextKeyService: IContextKeyService,
-		@IConnectionManagementService private _connectionManagementService: IConnectionManagementService,
+		@IConnectionManagementService private _connectionManagementService: IConnectionManagementService
-		@IBootstrapService private _bootstrapService: IBootstrapService
 	) {
 		super(EditDataEditor.ID, _telemetryService, themeService);
 

src/sql/parts/editData/editor/editDataResultsEditor.ts

@@ -1,3 +1,9 @@
+/*---------------------------------------------------------------------------------------------
+*  Copyright (c) Microsoft Corporation. All rights reserved.
+*  Licensed under the Source EULA. See License.txt in the project root for license information.
+*--------------------------------------------------------------------------------------------*/
+
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 import { Dimension, Builder } from 'vs/base/browser/builder';
 import { EditorOptions } from 'vs/workbench/common/editor';
 import { TPromise } from 'vs/base/common/winjs.base';
@@ -5,14 +11,15 @@ import { getZoomLevel } from 'vs/base/browser/browser';
 import { Configuration } from 'vs/editor/browser/config/configuration';
 import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
 import { IThemeService } from 'vs/platform/theme/common/themeService';
-import { IQueryModelService } from 'sql/parts/query/execution/queryModel';
-import { IBootstrapService } from 'sql/services/bootstrap/bootstrapService';
 import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
-import { BareResultsGridInfo } from 'sql/parts/query/editor/queryResultsEditor';
 import { BaseEditor } from 'vs/workbench/browser/parts/editor/baseEditor';
 import * as dom from 'vs/base/browser/dom';
 import * as types from 'vs/base/common/types';
-import { EditDataComponentParams } from 'sql/services/bootstrap/bootstrapParams';
+
+import { IQueryModelService } from 'sql/parts/query/execution/queryModel';
+import { bootstrapAngular } from 'sql/services/bootstrap/bootstrapService';
+import { BareResultsGridInfo } from 'sql/parts/query/editor/queryResultsEditor';
+import { IEditDataComponentParams } from 'sql/services/bootstrap/bootstrapParams';
 import { EditDataModule } from 'sql/parts/grid/views/editData/editData.module';
 import { EDITDATA_SELECTOR } from 'sql/parts/grid/views/editData/editData.component';
 import { EditDataResultsInput } from 'sql/parts/editData/common/editDataResultsInput';
@@ -28,8 +35,8 @@ export class EditDataResultsEditor extends BaseEditor {
 		@ITelemetryService telemetryService: ITelemetryService,
 		@IThemeService themeService: IThemeService,
 		@IQueryModelService private _queryModelService: IQueryModelService,
-		@IBootstrapService private _bootstrapService: IBootstrapService,
+		@IConfigurationService private _configurationService: IConfigurationService,
-		@IConfigurationService private _configurationService: IConfigurationService
+		@IInstantiationService private _instantiationService: IInstantiationService
 	) {
 		super(EditDataResultsEditor.ID, telemetryService, themeService);
 		this._rawOptions = BareResultsGridInfo.createFromRawSettings(this._configurationService.getValue('resultsGrid'), getZoomLevel());
@@ -102,8 +109,8 @@ export class EditDataResultsEditor extends BaseEditor {
 		// Otherwise many components will be left around and be subscribed
 		// to events from the backing data service
 		const parent = input.container;
-		let params: EditDataComponentParams = { dataService: dataService };
+		let params: IEditDataComponentParams = { dataService: dataService };
-		this._bootstrapService.bootstrap(
+		this._instantiationService.invokeFunction(bootstrapAngular,
 			EditDataModule,
 			parent,
 			EDITDATA_SELECTOR,

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

@@ -14,16 +14,27 @@ import 'vs/css!./media/editData';
 
 import { ElementRef, ChangeDetectorRef, OnInit, OnDestroy, Component, Inject, forwardRef, EventEmitter } from '@angular/core';
 import { IGridDataRow, VirtualizedCollection } from 'angular2-slickgrid';
+
 import { IGridDataSet } from 'sql/parts/grid/common/interfaces';
 import * as Services from 'sql/parts/grid/services/sharedServices';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
+import { IEditDataComponentParams } from 'sql/services/bootstrap/bootstrapParams';
-import { EditDataComponentParams } from 'sql/services/bootstrap/bootstrapParams';
 import { GridParentComponent } from 'sql/parts/grid/views/gridParentComponent';
 import { EditDataGridActionProvider } from 'sql/parts/grid/views/editData/editDataGridActions';
 import { error } from 'sql/base/common/log';
 import { clone } from 'sql/base/common/objects';
+import { IQueryEditorService } from 'sql/parts/query/common/queryEditorService';
+import { IBootstrapParams } from 'sql/services/bootstrap/bootstrapService';
+
 import { INotificationService } from 'vs/platform/notification/common/notification';
 import Severity from 'vs/base/common/severity';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
+import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
+import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
+import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
+import { IClipboardService } from 'vs/platform/clipboard/common/clipboardService';
+import { KeyCode } from 'vs/base/common/keyCodes';
+import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
 
 export const EDITDATA_SELECTOR: string = 'editdata-component';
 
@@ -55,8 +66,6 @@ export class EditDataComponent extends GridParentComponent implements OnInit, On
 	private removingNewRow: boolean;
 	private rowIdMappings: { [gridRowId: number]: number } = {};
 
-	private notificationService: INotificationService;
-
 	// Edit Data functions
 	public onActiveCellChanged: (event: { row: number, column: number }) => void;
 	public onCellEditEnd: (event: { row: number, column: number, newValue: any }) => void;
@@ -71,14 +80,20 @@ export class EditDataComponent extends GridParentComponent implements OnInit, On
 	constructor(
 		@Inject(forwardRef(() => ElementRef)) el: ElementRef,
 		@Inject(forwardRef(() => ChangeDetectorRef)) cd: ChangeDetectorRef,
-		@Inject(BOOTSTRAP_SERVICE_ID) bootstrapService: IBootstrapService
+		@Inject(IBootstrapParams) params: IEditDataComponentParams,
+		@Inject(IInstantiationService) private instantiationService: IInstantiationService,
+		@Inject(INotificationService) private notificationService: INotificationService,
+		@Inject(IContextMenuService) contextMenuService: IContextMenuService,
+		@Inject(IKeybindingService) keybindingService: IKeybindingService,
+		@Inject(IContextKeyService) contextKeyService: IContextKeyService,
+		@Inject(IConfigurationService) configurationService: IConfigurationService,
+		@Inject(IClipboardService) clipboardService: IClipboardService,
+		@Inject(IQueryEditorService) queryEditorService: IQueryEditorService
 	) {
-		super(el, cd, bootstrapService);
+		super(el, cd, contextMenuService, keybindingService, contextKeyService, configurationService, clipboardService, queryEditorService);
 		this._el.nativeElement.className = 'slickgridContainer';
-		let editDataParameters: EditDataComponentParams = this._bootstrapService.getBootstrapParams(this._el.nativeElement.tagName);
+		this.dataService = params.dataService;
-		this.dataService = editDataParameters.dataService;
+		this.actionProvider = this.instantiationService.createInstance(EditDataGridActionProvider, this.dataService, this.onGridSelectAll(), this.onDeleteRow(), this.onRevertRow());
-		this.actionProvider = this._bootstrapService.instantiationService.createInstance(EditDataGridActionProvider, this.dataService, this.onGridSelectAll(), this.onDeleteRow(), this.onRevertRow());
-		this.notificationService = bootstrapService.notificationService;
 	}
 
 	/**
@@ -408,12 +423,12 @@ export class EditDataComponent extends GridParentComponent implements OnInit, On
 		}, self.scrollTimeOutTime);
 	}
 
-	protected tryHandleKeyEvent(e): boolean {
+	protected tryHandleKeyEvent(e: StandardKeyboardEvent): boolean {
 		let handled: boolean = false;
 		// If the esc key was pressed while in a create session
 		let currentNewRowIndex = this.dataSet.totalRows - 2;
 
-		if (e.keyCode === jQuery.ui.keyCode.ESCAPE && this.newRowVisible && this.currentCell.row === currentNewRowIndex) {
+		if (e.keyCode === KeyCode.Escape && this.newRowVisible && this.currentCell.row === currentNewRowIndex) {
 			// revert our last new row
 			this.removingNewRow = true;
 
@@ -423,7 +438,7 @@ export class EditDataComponent extends GridParentComponent implements OnInit, On
 					this.newRowVisible = false;
 				});
 			handled = true;
-		} else if (e.keyCode === jQuery.ui.keyCode.ESCAPE) {
+		} else if (e.keyCode === KeyCode.Escape) {
 			this.currentEditCellValue = null;
 			this.onRevertRow()(this.currentCell.row);
 			handled = true;

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

@@ -4,42 +4,48 @@
  *--------------------------------------------------------------------------------------------*/
 
 
-import { ApplicationRef, ComponentFactoryResolver, NgModule, Inject, forwardRef } from '@angular/core';
+import { ApplicationRef, ComponentFactoryResolver, NgModule, Inject, forwardRef, Type } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { BrowserModule } from '@angular/platform-browser';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
 
 import { EditDataComponent, EDITDATA_SELECTOR } from 'sql/parts/grid/views/editData/editData.component';
 import { SlickGrid } from 'angular2-slickgrid';
+import { IBootstrapParams } from 'sql/services/bootstrap/bootstrapService';
 
-@NgModule({
+export const EditDataModule = (params: IBootstrapParams, selector: string): Type<any> => {
 
-	imports: [
+	@NgModule({
-		CommonModule,
-		BrowserModule
-	],
 
-	declarations: [
+		imports: [
-		EditDataComponent,
+			CommonModule,
-		SlickGrid
+			BrowserModule
-	],
+		],
 
-	entryComponents: [
+		declarations: [
-		EditDataComponent
+			EditDataComponent,
-	]
+			SlickGrid
-})
+		],
-export class EditDataModule {
 
-	constructor(
+		entryComponents: [
-		@Inject(forwardRef(() => ComponentFactoryResolver)) private _resolver: ComponentFactoryResolver,
+			EditDataComponent
-		@Inject(BOOTSTRAP_SERVICE_ID) private _bootstrapService: IBootstrapService
+		],
-	) {
+		providers: [
+			{ provide: IBootstrapParams, useValue: params }
+		]
+	})
+	class ModuleClass {
+
+		constructor(
+			@Inject(forwardRef(() => ComponentFactoryResolver)) private _resolver: ComponentFactoryResolver
+		) {
+		}
+
+		ngDoBootstrap(appRef: ApplicationRef) {
+			const factory = this._resolver.resolveComponentFactory(EditDataComponent);
+			(<any>factory).factory.selector = selector;
+			appRef.bootstrap(factory);
+		}
 	}
 
-	ngDoBootstrap(appRef: ApplicationRef) {
+	return ModuleClass;
-		const factory = this._resolver.resolveComponentFactory(EditDataComponent);
+};
-		const uniqueSelector: string = this._bootstrapService.getUniqueSelector(EDITDATA_SELECTOR);
-		(<any>factory).factory.selector = uniqueSelector;
-		appRef.bootstrap(factory);
-	}
-}

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

@@ -24,8 +24,8 @@ import * as actions from 'sql/parts/grid/views/gridActions';
 import * as Services from 'sql/parts/grid/services/sharedServices';
 import * as GridContentEvents from 'sql/parts/grid/common/gridContentEvents';
 import { ResultsVisibleContext, ResultsGridFocussedContext, ResultsMessagesFocussedContext, QueryEditorVisibleContext } from 'sql/parts/query/common/queryContext';
-import { IBootstrapService } from 'sql/services/bootstrap/bootstrapService';
 import { error } from 'sql/base/common/log';
+import { IQueryEditorService } from 'sql/parts/query/common/queryEditorService';
 
 import { IAction } from 'vs/base/common/actions';
 import { ResolvedKeybinding } from 'vs/base/common/keyCodes';
@@ -35,6 +35,9 @@ import { IContextMenuService } from 'vs/platform/contextview/browser/contextView
 import { IDisposable, dispose } from 'vs/base/common/lifecycle';
 import { AutoColumnSize } from 'sql/base/browser/ui/table/plugins/autoSizeColumns.plugin';
 import { DragCellSelectionModel } from 'sql/base/browser/ui/table/plugins/dragCellSelectionModel.plugin';
+import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
+import { IClipboardService } from 'vs/platform/clipboard/common/clipboardService';
+import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
 
 export abstract class GridParentComponent {
 	// CONSTANTS
@@ -62,9 +65,6 @@ export abstract class GridParentComponent {
 	// FIELDS
 	// Service for interaction with the IQueryModel
 	protected dataService: DataService;
-	protected keybindingService: IKeybindingService;
-	protected scopedContextKeyService: IContextKeyService;
-	protected contextMenuService: IContextMenuService;
 	protected actionProvider: actions.GridActionProvider;
 
 	protected toDispose: IDisposable[];
@@ -113,7 +113,12 @@ export abstract class GridParentComponent {
 	constructor(
 		protected _el: ElementRef,
 		protected _cd: ChangeDetectorRef,
-		protected _bootstrapService: IBootstrapService
+		protected contextMenuService: IContextMenuService,
+		protected keybindingService: IKeybindingService,
+		protected contextKeyService: IContextKeyService,
+		protected configurationService: IConfigurationService,
+		protected clipboardService: IClipboardService,
+		protected queryEditorService: IQueryEditorService
 	) {
 		this.toDispose = [];
 	}
@@ -121,8 +126,8 @@ export abstract class GridParentComponent {
 	protected baseInit(): void {
 		const self = this;
 		this.initShortcutsBase();
-		if (this._bootstrapService.configurationService) {
+		if (this.configurationService) {
-			let sqlConfig = this._bootstrapService.configurationService.getValue('sql');
+			let sqlConfig = this.configurationService.getValue('sql');
 			if (sqlConfig) {
 				this._messageActive = sqlConfig['messagesDefaultOpen'];
 			}
@@ -180,10 +185,7 @@ export abstract class GridParentComponent {
 			}
 		});
 
-		this.contextMenuService = this._bootstrapService.contextMenuService;
+		this.bindKeys(this.contextKeyService);
-		this.keybindingService = this._bootstrapService.keybindingService;
-
-		this.bindKeys(this._bootstrapService.contextKeyService);
 	}
 
 	/*
@@ -200,7 +202,7 @@ export abstract class GridParentComponent {
 			this.queryEditorVisible = QueryEditorVisibleContext.bindTo(contextKeyService);
 			this.queryEditorVisible.set(true);
 
-			let gridContextKeyService = this._bootstrapService.contextKeyService.createScoped(this._el.nativeElement);
+			let gridContextKeyService = this.contextKeyService.createScoped(this._el.nativeElement);
 			this.toDispose.push(gridContextKeyService);
 			this.resultsVisibleContextKey = ResultsVisibleContext.bindTo(gridContextKeyService);
 			this.resultsVisibleContextKey.set(true);
@@ -245,7 +247,7 @@ export abstract class GridParentComponent {
 	private copySelection(): void {
 		let messageText = this.getMessageText();
 		if (messageText.length > 0) {
-			this._bootstrapService.clipboardService.writeText(messageText);
+			this.clipboardService.writeText(messageText);
 		} else {
 			let activeGrid = this.activeGrid;
 			let selection = this.slickgrids.toArray()[activeGrid].getSelectedRanges();
@@ -268,7 +270,7 @@ export abstract class GridParentComponent {
 			messageText = this.getMessageText();
 		}
 		if (messageText.length > 0) {
-			this._bootstrapService.clipboardService.writeText(messageText);
+			this.clipboardService.writeText(messageText);
 		}
 	}
 
@@ -289,7 +291,7 @@ export abstract class GridParentComponent {
 
 	protected goToNextGrid() {
 		if (this.renderedDataSets.length > 0) {
-			let next  = this.activeGrid + 1;
+			let next = this.activeGrid + 1;
 			if (next >= this.renderedDataSets.length) {
 				next = 0;
 			}
@@ -532,7 +534,7 @@ export abstract class GridParentComponent {
 	private handleQueryPlanLink(cellRef: string, value: string): void {
 		const self = this;
 		$(cellRef).children('.xmlLink').click(function (): void {
-			self._bootstrapService.queryEditorService.newQueryPlanEditor(value);
+			self.queryEditorService.newQueryPlanEditor(value);
 		});
 	}
 
@@ -567,9 +569,7 @@ export abstract class GridParentComponent {
 	}
 
 	keyEvent(e: KeyboardEvent): void {
-		let self = this;
+		if (this.tryHandleKeyEvent(new StandardKeyboardEvent(e))) {
-		let handled = self.tryHandleKeyEvent(e);
-		if (handled) {
 			e.preventDefault();
 			e.stopPropagation();
 		}
@@ -582,12 +582,12 @@ export abstract class GridParentComponent {
 	 *
 	 * @protected
 	 * @abstract
-	 * @param {any} e
+	 * @param {StandardKeyboardEvent} e
 	 * @returns {boolean}
 	 *
 	 * @memberOf GridParentComponent
 	 */
-	protected abstract tryHandleKeyEvent(e): boolean;
+	protected abstract tryHandleKeyEvent(e: StandardKeyboardEvent): boolean;
 
 	resizeGrids(): void {
 		const self = this;

src/sql/parts/grid/views/query/chartViewer.component.ts

@@ -14,7 +14,6 @@ import { Taskbar } from 'sql/base/browser/ui/taskbar/taskbar';
 import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox';
 import { ComponentHostDirective } from 'sql/parts/dashboard/common/componentHost.directive';
 import { IGridDataSet } from 'sql/parts/grid/common/interfaces';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
 import { IInsightData, IInsightsView, IInsightsConfig } from 'sql/parts/dashboard/widgets/insights/interfaces';
 import { Extensions, IInsightRegistry } from 'sql/platform/dashboard/common/insightRegistry';
 import { QueryEditor } from 'sql/parts/query/editor/queryEditor';
@@ -24,6 +23,8 @@ import { IChartViewActionContext, CopyAction, CreateInsightAction, SaveImageActi
 import * as WorkbenchUtils from 'sql/workbench/common/sqlWorkbenchUtils';
 import * as Constants from 'sql/parts/query/common/constants';
 import { SelectBox as AngularSelectBox } from 'sql/base/browser/ui/selectBox/selectBox.component';
+import { IQueryModelService } from 'sql/parts/query/execution/queryModel';
+import { IClipboardService } from 'sql/platform/clipboard/common/clipboardService';
 
 /* Insights */
 import {
@@ -40,6 +41,13 @@ import { mixin } from 'vs/base/common/objects';
 import * as paths from 'vs/base/common/paths';
 import * as pfs from 'vs/base/node/pfs';
 import { ISelectData } from 'vs/base/browser/ui/selectBox/selectBox';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { INotificationService } from 'vs/platform/notification/common/notification';
+import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
+import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
+import { IWindowsService, IWindowService } from 'vs/platform/windows/common/windows';
+import { IWorkspaceContextService } from 'vs/platform/workspace/common/workspace';
+import { IWorkbenchEditorService } from 'vs/workbench/services/editor/common/editorService';
 
 const insightRegistry = Registry.as<IInsightRegistry>(Extensions.InsightContribution);
 
@@ -94,8 +102,17 @@ export class ChartViewerComponent implements OnInit, OnDestroy, IChartViewAction
 	constructor(
 		@Inject(forwardRef(() => ComponentFactoryResolver)) private _componentFactoryResolver: ComponentFactoryResolver,
 		@Inject(forwardRef(() => ViewContainerRef)) private _viewContainerRef: ViewContainerRef,
-		@Inject(BOOTSTRAP_SERVICE_ID) private _bootstrapService: IBootstrapService,
+		@Inject(forwardRef(() => ChangeDetectorRef)) private _cd: ChangeDetectorRef,
-		@Inject(forwardRef(() => ChangeDetectorRef)) private _cd: ChangeDetectorRef
+		@Inject(IInstantiationService) private instantiationService: IInstantiationService,
+		@Inject(INotificationService) private notificationService: INotificationService,
+		@Inject(IContextMenuService) private contextMenuService: IContextMenuService,
+		@Inject(IClipboardService) private clipboardService: IClipboardService,
+		@Inject(IConfigurationService) private configurationService: IConfigurationService,
+		@Inject(IWindowsService) private windowsService: IWindowsService,
+		@Inject(IWorkspaceContextService) private workspaceContextService: IWorkspaceContextService,
+		@Inject(IWindowService) private windowService: IWindowService,
+		@Inject(IQueryModelService) private queryModelService: IQueryModelService,
+		@Inject(IWorkbenchEditorService) private editorService: IWorkbenchEditorService
 	) {
 		this.setDefaultChartConfig();
 	}
@@ -116,8 +133,8 @@ export class ChartViewerComponent implements OnInit, OnDestroy, IChartViewAction
 
 	private getDefaultChartType(): string {
 		let defaultChartType = Constants.chartTypeHorizontalBar;
-		if (this._bootstrapService.configurationService) {
+		if (this.configurationService) {
-			let chartSettings = WorkbenchUtils.getSqlConfigSection(this._bootstrapService.configurationService, 'chart');
+			let chartSettings = WorkbenchUtils.getSqlConfigSection(this.configurationService, 'chart');
 			// Only use the value if it's a known chart type. Ideally could query this dynamically but can't figure out how
 			if (chartSettings && Constants.allChartTypes.indexOf(chartSettings[Constants.defaultChartType]) > -1) {
 				defaultChartType = chartSettings[Constants.defaultChartType];
@@ -127,12 +144,12 @@ export class ChartViewerComponent implements OnInit, OnDestroy, IChartViewAction
 	}
 
 	private _initActionBar() {
-		this._createInsightAction = this._bootstrapService.instantiationService.createInstance(CreateInsightAction);
+		this._createInsightAction = this.instantiationService.createInstance(CreateInsightAction);
-		this._copyAction = this._bootstrapService.instantiationService.createInstance(CopyAction);
+		this._copyAction = this.instantiationService.createInstance(CopyAction);
-		this._saveAction = this._bootstrapService.instantiationService.createInstance(SaveImageAction);
+		this._saveAction = this.instantiationService.createInstance(SaveImageAction);
 
 		let taskbar = <HTMLElement>this.taskbarContainer.nativeElement;
-		this._actionBar = new Taskbar(taskbar, this._bootstrapService.contextMenuService);
+		this._actionBar = new Taskbar(taskbar, this.contextMenuService);
 		this._actionBar.context = this;
 		this._actionBar.setContent([
 			{ action: this._createInsightAction },
@@ -180,7 +197,7 @@ export class ChartViewerComponent implements OnInit, OnDestroy, IChartViewAction
 			return;
 		}
 
-		this._bootstrapService.clipboardService.writeImageDataUrl(data);
+		this.clipboardService.writeImageDataUrl(data);
 	}
 
 	public saveChart(): void {
@@ -197,8 +214,8 @@ export class ChartViewerComponent implements OnInit, OnDestroy, IChartViewAction
 						this.showError(err.message);
 					} else {
 						let fileUri = URI.from({ scheme: PathUtilities.FILE_SCHEMA, path: filePath });
-						this._bootstrapService.windowsService.openExternal(fileUri.toString());
+						this.windowsService.openExternal(fileUri.toString());
-						this._bootstrapService.notificationService.notify({
+						this.notificationService.notify({
 							severity: Severity.Error,
 							message: nls.localize('chartSaved', 'Saved Chart to path: {0}', filePath)
 						});
@@ -209,9 +226,9 @@ export class ChartViewerComponent implements OnInit, OnDestroy, IChartViewAction
 	}
 
 	private promptForFilepath(): Thenable<string> {
-		let filepathPlaceHolder = PathUtilities.resolveCurrentDirectory(this.getActiveUriString(), PathUtilities.getRootPath(this._bootstrapService.workspaceContextService));
+		let filepathPlaceHolder = PathUtilities.resolveCurrentDirectory(this.getActiveUriString(), PathUtilities.getRootPath(this.workspaceContextService));
 		filepathPlaceHolder = paths.join(filepathPlaceHolder, 'chart.png');
-		return this._bootstrapService.windowService.showSaveDialog({
+		return this.windowService.showSaveDialog({
 			title: nls.localize('chartViewer.saveAsFileTitle', 'Choose Results File'),
 			defaultPath: paths.normalize(filepathPlaceHolder, true)
 		});
@@ -230,7 +247,7 @@ export class ChartViewerComponent implements OnInit, OnDestroy, IChartViewAction
 		}
 
 		let uri: URI = URI.parse(uriString);
-		let dataService = this._bootstrapService.queryModelService.getDataService(uriString);
+		let dataService = this.queryModelService.getDataService(uriString);
 		if (!dataService) {
 			this.showError(nls.localize('createInsightNoDataService', 'Cannot create insight, backing data model not found'));
 			return;
@@ -259,7 +276,7 @@ export class ChartViewerComponent implements OnInit, OnDestroy, IChartViewAction
 	}
 
 	private showError(errorMsg: string) {
-		this._bootstrapService.notificationService.notify({
+		this.notificationService.notify({
 			severity: Severity.Error,
 			message: errorMsg
 		});
@@ -274,7 +291,7 @@ export class ChartViewerComponent implements OnInit, OnDestroy, IChartViewAction
 	}
 
 	private getActiveUriString(): string {
-		let editorService = this._bootstrapService.editorService;
+		let editorService = this.editorService;
 		let editor = editorService.getActiveEditor();
 		if (editor && editor instanceof QueryEditor) {
 			let queryEditor: QueryEditor = editor;

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

@@ -22,16 +22,22 @@ import * as Services from 'sql/parts/grid/services/sharedServices';
 import { IGridIcon, IMessage, IGridDataSet } from 'sql/parts/grid/common/interfaces';
 import { GridParentComponent } from 'sql/parts/grid/views/gridParentComponent';
 import { GridActionProvider } from 'sql/parts/grid/views/gridActions';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
+import { IQueryComponentParams } from 'sql/services/bootstrap/bootstrapParams';
-import { QueryComponentParams } from 'sql/services/bootstrap/bootstrapParams';
 import { error } from 'sql/base/common/log';
 import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
 import { clone } from 'sql/base/common/objects';
+import { IQueryEditorService } from 'sql/parts/query/common/queryEditorService';
 
 import * as strings from 'vs/base/common/strings';
 import * as DOM from 'vs/base/browser/dom';
 import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
 import { KeyCode } from 'vs/base/common/keyCodes';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
+import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
+import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
+import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
+import { IClipboardService } from 'vs/platform/clipboard/common/clipboardService';
 
 export const QUERY_SELECTOR: string = 'query-component';
 
@@ -149,7 +155,7 @@ export class QueryComponent extends GridParentComponent implements OnInit, OnDes
 	public showChartRequested: EventEmitter<IGridDataSet> = new EventEmitter<IGridDataSet>();
 	public goToNextQueryOutputTabRequested: EventEmitter<void> = new EventEmitter<void>();
 
-	@Input() public queryParameters: QueryComponentParams;
+	@Input() public queryParameters: IQueryComponentParams;
 
 	@ViewChildren('slickgrid') slickgrids: QueryList<SlickGrid>;
 	// tslint:disable-next-line:no-unused-variable
@@ -159,14 +165,20 @@ export class QueryComponent extends GridParentComponent implements OnInit, OnDes
 	constructor(
 		@Inject(forwardRef(() => ElementRef)) el: ElementRef,
 		@Inject(forwardRef(() => ChangeDetectorRef)) cd: ChangeDetectorRef,
-		@Inject(BOOTSTRAP_SERVICE_ID) bootstrapService: IBootstrapService
+		@Inject(IInstantiationService) private instantiationService: IInstantiationService,
+		@Inject(IContextMenuService) contextMenuService: IContextMenuService,
+		@Inject(IKeybindingService) keybindingService: IKeybindingService,
+		@Inject(IContextKeyService) contextKeyService: IContextKeyService,
+		@Inject(IConfigurationService) configurationService: IConfigurationService,
+		@Inject(IClipboardService) clipboardService: IClipboardService,
+		@Inject(IQueryEditorService) queryEditorService: IQueryEditorService
 	) {
-		super(el, cd, bootstrapService);
+		super(el, cd, contextMenuService, keybindingService, contextKeyService, configurationService, clipboardService, queryEditorService);
 		this._el.nativeElement.className = 'slickgridContainer';
-		this.rowHeight = bootstrapService.configurationService.getValue<any>('resultsGrid').rowHeight;
+		this.rowHeight = configurationService.getValue<any>('resultsGrid').rowHeight;
-		bootstrapService.configurationService.onDidChangeConfiguration(e => {
+		configurationService.onDidChangeConfiguration(e => {
 			if (e.affectsConfiguration('resultsGrid')) {
-				this.rowHeight = bootstrapService.configurationService.getValue<any>('resultsGrid').rowHeight;
+				this.rowHeight = configurationService.getValue<any>('resultsGrid').rowHeight;
 				this.slickgrids.forEach(i => {
 					i.rowHeight = this.rowHeight;
 				});
@@ -182,7 +194,7 @@ export class QueryComponent extends GridParentComponent implements OnInit, OnDes
 		const self = this;
 
 		this.dataService = this.queryParameters.dataService;
-		this.actionProvider = this._bootstrapService.instantiationService.createInstance(GridActionProvider, this.dataService, this.onGridSelectAll());
+		this.actionProvider = this.instantiationService.createInstance(GridActionProvider, this.dataService, this.onGridSelectAll());
 
 		this.baseInit();
 		this.setupResizeBind();

src/sql/parts/jobManagement/agent/agentView.component.ts

@@ -15,7 +15,6 @@ import { IDisposable } from 'vs/base/common/lifecycle';
 import * as themeColors from 'vs/workbench/common/theme';
 import { DashboardPage } from 'sql/parts/dashboard/common/dashboardPage.component';
 import { ActionBar } from 'vs/base/browser/ui/actionbar/actionbar';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
 import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
 import { AgentJobInfo, AgentJobHistoryInfo } from 'sqlops';
 import { PanelComponent, IPanelOptions, NavigationBarLayout } from 'sql/base/browser/ui/panel/panel.component';

src/sql/parts/jobManagement/common/agentJobUtilities.ts

@@ -11,6 +11,7 @@ export class AgentJobUtilities {
 
 	public static startIconClass: string = 'action-label icon runJobIcon';
 	public static stopIconClass: string = 'action-label icon stopJobIcon';
+	public static jobMessageLength: number = 110;
 
 	public static convertToStatusString(status: number): string {
 		switch(status) {

src/sql/parts/jobManagement/common/media/jobs.css

@@ -76,7 +76,7 @@ jobhistory-component {
     background: green;
 }
 
-#jobsDiv .jobview-jobnameindicatorfailure {
+#jobsDiv .slick-cell.l1.r1 .jobview-jobnameindicatorfailure {
     width: 5px;
     background: red;
 }
@@ -86,15 +86,23 @@ jobhistory-component {
     background: orange;
 }
 
-#jobsDiv .jobview-jobnameindicatorunknown {
+#jobsDiv .jobview-grid .jobview-jobnameindicatorunknown {
     width: 5px;
-    background: yellow;
+    background: grey;
 }
 
-#jobsDiv .jobview-jobnametext {
+#jobsDiv .jobview-grid .slick-cell.l1.r1.error-row .jobview-jobnametext {
     width: 100%;
 }
 
+#jobsDiv .jobview-grid .slick-cell.l1.r1 .jobview-jobnametext {
+    text-overflow: ellipsis;
+    width: 200px;
+    overflow: hidden;
+    white-space: nowrap;
+    display: inline-block;
+}
+
 #jobsDiv .job-with-error {
     border-bottom: none;
 }
@@ -192,4 +200,9 @@ agentview-component .jobview-grid .grid-canvas > .ui-widget-content.slick-row.od
     width: 20px;
     padding-top: 16px;
     padding-left: 15px;
+}
+
+#jobsDiv jobsview-component .jobview-grid .slick-cell.l1.r1.error-row td.jobview-jobnameindicatorfailure {
+    width: 0;
+    background: none;
 }

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

@@ -7,16 +7,12 @@ import 'vs/css!./jobHistory';
 import 'vs/css!sql/media/icons/common-icons';
 import { OnInit, OnChanges, Component, Inject, Input, forwardRef, ElementRef, ChangeDetectorRef, ViewChild, ChangeDetectionStrategy, Injectable } from '@angular/core';
 import { AgentJobHistoryInfo, AgentJobInfo } from 'sqlops';
-import { IThemeService } from 'vs/platform/theme/common/themeService';
+
-import { attachListStyler } from 'vs/platform/theme/common/styler';
+import { Taskbar, ITaskbarContent } from 'sql/base/browser/ui/taskbar/taskbar';
-import { Tree } from 'vs/base/parts/tree/browser/treeImpl';
+import { RunJobAction, StopJobAction } from 'sql/parts/jobManagement/views/jobHistoryActions';
-import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { JobCacheObject } from 'sql/parts/jobManagement/common/jobManagementService';
-import { Disposable, IDisposable } from 'vs/base/common/lifecycle';
+import { AgentJobUtilities } from '../common/agentJobUtilities';
-import { localize } from 'vs/nls';
-import { INotificationService } from 'vs/platform/notification/common/notification';
-import Severity from 'vs/base/common/severity';
 import { PanelComponent } from 'sql/base/browser/ui/panel/panel.component';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
 import { IJobManagementService } from '../common/interfaces';
 import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
 import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
@@ -25,12 +21,19 @@ import { JobHistoryController, JobHistoryDataSource,
 	JobHistoryRenderer, JobHistoryFilter, JobHistoryModel, JobHistoryRow } from 'sql/parts/jobManagement/views/jobHistoryTree';
 import { JobStepsViewComponent } from 'sql/parts/jobManagement/views/jobStepsView.component';
 import { JobStepsViewRow } from './jobStepsViewTree';
-import { JobCacheObject } from 'sql/parts/jobManagement/common/jobManagementService';
+
-import { AgentJobUtilities } from '../common/agentJobUtilities';
+import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
+import { IThemeService } from 'vs/platform/theme/common/themeService';
+import { attachListStyler } from 'vs/platform/theme/common/styler';
+import { Tree } from 'vs/base/parts/tree/browser/treeImpl';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+import { Disposable, IDisposable } from 'vs/base/common/lifecycle';
+import { localize } from 'vs/nls';
+import { INotificationService } from 'vs/platform/notification/common/notification';
+import Severity from 'vs/base/common/severity';
 import { ITreeOptions } from 'vs/base/parts/tree/browser/tree';
 import { ScrollbarVisibility } from 'vs/base/common/scrollable';
-import { Taskbar, ITaskbarContent } from 'sql/base/browser/ui/taskbar/taskbar';
+import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
-import { RunJobAction, StopJobAction } from 'sql/parts/jobManagement/views/jobHistoryActions';
 
 export const DASHBOARD_SELECTOR: string = 'jobhistory-component';
 
@@ -42,7 +45,6 @@ export const DASHBOARD_SELECTOR: string = 'jobhistory-component';
 @Injectable()
 export class JobHistoryComponent extends Disposable implements OnInit {
 
-	private _jobManagementService: IJobManagementService;
 	private _tree: Tree;
 	private _treeController: JobHistoryController;
 	private _treeDataSource: JobHistoryDataSource;
@@ -63,24 +65,25 @@ export class JobHistoryComponent extends Disposable implements OnInit {
 	private _showPreviousRuns: boolean = undefined;
 	private _runStatus: string = undefined;
 	private _jobCacheObject: JobCacheObject;
-	private _notificationService: INotificationService;
 	private _agentJobInfo: AgentJobInfo;
 	private _noJobsAvailable: boolean = false;
 
 	constructor(
-		@Inject(BOOTSTRAP_SERVICE_ID) private bootstrapService: IBootstrapService,
 		@Inject(forwardRef(() => ElementRef)) el: ElementRef,
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _cd: ChangeDetectorRef,
 		@Inject(forwardRef(() => CommonServiceInterface)) private _dashboardService: CommonServiceInterface,
-		@Inject(forwardRef(() => AgentViewComponent)) private _agentViewComponent: AgentViewComponent
+		@Inject(forwardRef(() => AgentViewComponent)) private _agentViewComponent: AgentViewComponent,
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
+		@Inject(INotificationService) private _notificationService: INotificationService,
+		@Inject(IInstantiationService) private instantiationService: IInstantiationService,
+		@Inject(IContextMenuService) private contextMenuService: IContextMenuService,
+		@Inject(IJobManagementService) private _jobManagementService: IJobManagementService
 	) {
 		super();
 		this._treeController = new JobHistoryController();
 		this._treeDataSource = new JobHistoryDataSource();
 		this._treeRenderer = new JobHistoryRenderer();
 		this._treeFilter =  new JobHistoryFilter();
-		this._jobManagementService = bootstrapService.jobManagementService;
-		this._notificationService = bootstrapService.notificationService;
 		let jobCacheObjectMap = this._jobManagementService.jobCacheObjectMap;
 		let serverName = _dashboardService.connectionManagementService.connectionInfo.connectionProfile.serverName;
 		let jobCache = jobCacheObjectMap[serverName];
@@ -129,7 +132,7 @@ export class JobHistoryComponent extends Disposable implements OnInit {
 			filter: this._treeFilter,
 			renderer: this._treeRenderer
 		}, {verticalScrollMode: ScrollbarVisibility.Visible});
-		this._register(attachListStyler(this._tree, this.bootstrapService.themeService));
+		this._register(attachListStyler(this._tree, this.themeService));
 		this._tree.layout(1024);
 		this._initActionBar();
 	}
@@ -267,10 +270,10 @@ export class JobHistoryComponent extends Disposable implements OnInit {
 
 
 	private _initActionBar() {
-		let runJobAction = this.bootstrapService.instantiationService.createInstance(RunJobAction);
+		let runJobAction = this.instantiationService.createInstance(RunJobAction);
-		let stopJobAction = this.bootstrapService.instantiationService.createInstance(StopJobAction);
+		let stopJobAction = this.instantiationService.createInstance(StopJobAction);
 		let taskbar = <HTMLElement>this._actionbarContainer.nativeElement;
-		this._actionBar = new Taskbar(taskbar, this.bootstrapService.contextMenuService);
+		this._actionBar = new Taskbar(taskbar, this.contextMenuService);
 		this._actionBar.context = this;
 		this._actionBar.setContent([
 			{ action: runJobAction },

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

@@ -6,20 +6,23 @@
 import 'vs/css!./jobStepsView';
 
 import { OnInit, Component, Inject, forwardRef, ElementRef, ChangeDetectorRef, ViewChild, Injectable, AfterContentChecked } from '@angular/core';
+
+import { AgentJobHistoryInfo } from 'sqlops';
+
 import { IThemeService } from 'vs/platform/theme/common/themeService';
 import { attachListStyler } from 'vs/platform/theme/common/styler';
 import { Tree } from 'vs/base/parts/tree/browser/treeImpl';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 import { Disposable, IDisposable } from 'vs/base/common/lifecycle';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
+import { ScrollbarVisibility } from 'vs/base/common/scrollable';
+import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
+
 import { IJobManagementService } from '../common/interfaces';
 import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
 import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
-import { AgentJobHistoryInfo } from 'sqlops';
 import { JobStepsViewController, JobStepsViewDataSource, JobStepsViewFilter,
 	JobStepsViewRenderer, JobStepsViewRow, JobStepsViewModel} from 'sql/parts/jobManagement/views/jobStepsViewTree';
 import { JobHistoryComponent } from 'sql/parts/jobManagement/views/jobHistory.component';
-import { ScrollbarVisibility } from 'vs/base/common/scrollable';
 
 export const JOBSTEPSVIEW_SELECTOR: string = 'jobstepsview-component';
 
@@ -29,7 +32,6 @@ export const JOBSTEPSVIEW_SELECTOR: string = 'jobstepsview-component';
 })
 export class JobStepsViewComponent extends Disposable implements OnInit, AfterContentChecked {
 
-	private _jobManagementService: IJobManagementService;
 	private _tree: Tree;
 	private _treeController = new JobStepsViewController();
 	private _treeDataSource = new JobStepsViewDataSource();
@@ -41,14 +43,13 @@ export class JobStepsViewComponent extends Disposable implements OnInit, AfterCo
 
 
 	constructor(
-		@Inject(BOOTSTRAP_SERVICE_ID) private bootstrapService: IBootstrapService,
 		@Inject(forwardRef(() => ElementRef)) el: ElementRef,
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _cd: ChangeDetectorRef,
 		@Inject(forwardRef(() => CommonServiceInterface)) private _dashboardService: CommonServiceInterface,
-		@Inject(forwardRef(() => JobHistoryComponent)) private _jobHistoryComponent: JobHistoryComponent
+		@Inject(forwardRef(() => JobHistoryComponent)) private _jobHistoryComponent: JobHistoryComponent,
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService
 	) {
 		super();
-		this._jobManagementService = bootstrapService.jobManagementService;
 	}
 
 	ngAfterContentChecked() {
@@ -61,7 +62,7 @@ export class JobStepsViewComponent extends Disposable implements OnInit, AfterCo
 					filter: this._treeFilter,
 					renderer: this._treeRenderer
 				}, { verticalScrollMode: ScrollbarVisibility.Visible });
-				this._register(attachListStyler(this._tree, this.bootstrapService.themeService));
+				this._register(attachListStyler(this._tree, this.themeService));
 			}
 			this._tree.layout(JobStepsViewComponent._pageSize);
 			this._tree.setInput(new JobStepsViewModel());
@@ -78,7 +79,7 @@ export class JobStepsViewComponent extends Disposable implements OnInit, AfterCo
 			filter: this._treeFilter,
 			renderer: this._treeRenderer
 		}, {verticalScrollMode: ScrollbarVisibility.Visible});
-		this._register(attachListStyler(this._tree, this.bootstrapService.themeService));
+		this._register(attachListStyler(this._tree, this.themeService));
 	}
 }
 

src/sql/parts/jobManagement/views/jobStepsView.css

@@ -79,4 +79,4 @@
 
 jobstepsview-component {
 	padding-top: 10px;
-}
+}

src/sql/parts/jobManagement/views/jobStepsViewTree.ts

@@ -27,6 +27,7 @@ import { OEAction } from 'sql/parts/objectExplorer/viewlet/objectExplorerActions
 import { Builder, $, withElementById } from 'vs/base/browser/builder';
 import { AgentJobHistoryInfo } from 'sqlops';
 import { Agent } from 'vs/base/node/request';
+import { AgentJobUtilities } from 'sql/parts/jobManagement/common/agentJobUtilities';
 
 export class JobStepsViewRow {
 	public stepID: string;
@@ -111,7 +112,7 @@ export class JobStepsViewRenderer implements tree.IRenderer {
 	private _statusIcon: HTMLElement;
 
 	public getHeight(tree: tree.ITree, element: JobStepsViewRow): number {
-		return 22;
+		return 22 * Math.ceil(element.message.length/AgentJobUtilities.jobMessageLength);
 	}
 
 	public getTemplateId(tree: tree.ITree, element: JobStepsViewRow | JobStepsViewModel): string {

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

@@ -12,21 +12,18 @@ import 'vs/css!../common/media/jobs';
 import 'vs/css!sql/media/icons/common-icons';
 
 import { Component, Inject, forwardRef, ElementRef, ChangeDetectorRef, ViewChild, AfterContentChecked } from '@angular/core';
-import * as Utils from 'sql/parts/connection/common/utils';
+import { FieldType, IObservableCollection, CollectionChange, SlickGrid } from 'angular2-slickgrid';
+
+import * as sqlops from 'sqlops';
+import * as vscode from 'vscode';
+
 import { IColorTheme } from 'vs/workbench/services/themes/common/workbenchThemeService';
 import { IDisposable } from 'vs/base/common/lifecycle';
 import * as themeColors from 'vs/workbench/common/theme';
-import { DashboardPage } from 'sql/parts/dashboard/common/dashboardPage.component';
 import { ActionBar } from 'vs/base/browser/ui/actionbar/actionbar';
-import { IBootstrapService, BOOTSTRAP_SERVICE_ID } from 'sql/services/bootstrap/bootstrapService';
-import { IJobManagementService } from '../common/interfaces';
-import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
-import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
-import * as sqlops from 'sqlops';
-import * as vscode from 'vscode';
 import * as nls from 'vs/nls';
+
 import { IGridDataSet } from 'sql/parts/grid/common/interfaces';
-import { FieldType, IObservableCollection, CollectionChange, SlickGrid } from 'angular2-slickgrid';
 import { Table } from 'sql/base/browser/ui/table/table';
 import { attachTableStyler } from 'sql/common/theme/styler';
 import { JobHistoryComponent } from './jobHistory.component';
@@ -34,6 +31,11 @@ import { AgentViewComponent } from '../agent/agentView.component';
 import { RowDetailView } from 'sql/base/browser/ui/table/plugins/rowdetailview';
 import { JobCacheObject } from 'sql/parts/jobManagement/common/jobManagementService';
 import { AgentJobUtilities } from '../common/agentJobUtilities';
+import * as Utils from 'sql/parts/connection/common/utils';
+import { IJobManagementService } from '../common/interfaces';
+import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
+import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
+import { DashboardPage } from 'sql/parts/dashboard/common/dashboardPage.component';
 
 
 export const JOBSVIEW_SELECTOR: string = 'jobsview-component';
@@ -45,21 +47,20 @@ export const JOBSVIEW_SELECTOR: string = 'jobsview-component';
 
 export class JobsViewComponent implements AfterContentChecked {
 
-	private _jobManagementService: IJobManagementService;
 	private _jobCacheObject: JobCacheObject;
 
 	private _disposables = new Array<vscode.Disposable>();
 
 	private columns: Array<Slick.Column<any>> = [
 		{ name: nls.localize('jobColumns.name','Name'), field: 'name', formatter: this.renderName, width: 200 , id: 'name' },
-		{ name: nls.localize('jobColumns.lastRun','Last Run'), field: 'lastRun', minWidth: 150, id: 'lastRun' },
+		{ name: nls.localize('jobColumns.lastRun','Last Run'), field: 'lastRun', width: 150, id: 'lastRun' },
-		{ name: nls.localize('jobColumns.nextRun','Next Run'), field: 'nextRun', minWidth: 150, id: 'nextRun' },
+		{ name: nls.localize('jobColumns.nextRun','Next Run'), field: 'nextRun', width: 150, id: 'nextRun' },
-		{ name: nls.localize('jobColumns.enabled','Enabled'), field: 'enabled', minWidth: 70, id: 'enabled' },
+		{ name: nls.localize('jobColumns.enabled','Enabled'), field: 'enabled', width: 70, id: 'enabled' },
-		{ name: nls.localize('jobColumns.status','Status'), field: 'currentExecutionStatus', minWidth: 60, id: 'currentExecutionStatus' },
+		{ name: nls.localize('jobColumns.status','Status'), field: 'currentExecutionStatus', width: 60, id: 'currentExecutionStatus' },
-		{ name: nls.localize('jobColumns.category','Category'), field: 'category', minWidth: 150, id: 'category' },
+		{ name: nls.localize('jobColumns.category','Category'), field: 'category', width: 150, id: 'category' },
-		{ name: nls.localize('jobColumns.runnable','Runnable'), field: 'runnable', minWidth: 50, id: 'runnable' },
+		{ name: nls.localize('jobColumns.runnable','Runnable'), field: 'runnable', width: 50, id: 'runnable' },
-		{ name: nls.localize('jobColumns.schedule','Schedule'), field: 'hasSchedule', minWidth: 50, id: 'hasSchedule' },
+		{ name: nls.localize('jobColumns.schedule','Schedule'), field: 'hasSchedule', width: 50, id: 'hasSchedule' },
-		{ name: nls.localize('jobColumns.lastRunOutcome', 'Last Run Outcome'), field: 'lastRunOutcome', minWidth: 150, id: 'lastRunOutcome' },
+		{ name: nls.localize('jobColumns.lastRunOutcome', 'Last Run Outcome'), field: 'lastRunOutcome', width: 150, id: 'lastRunOutcome' },
 	];
 
 	private rowDetail: RowDetailView;
@@ -77,13 +78,12 @@ export class JobsViewComponent implements AfterContentChecked {
 	private _tabHeight: number;
 
 	constructor(
-		@Inject(BOOTSTRAP_SERVICE_ID) private bootstrapService: IBootstrapService,
 		@Inject(forwardRef(() => CommonServiceInterface)) private _dashboardService: CommonServiceInterface,
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _cd: ChangeDetectorRef,
 		@Inject(forwardRef(() => ElementRef)) private _el: ElementRef,
-		@Inject(forwardRef(() => AgentViewComponent)) private _agentViewComponent: AgentViewComponent
+		@Inject(forwardRef(() => AgentViewComponent)) private _agentViewComponent: AgentViewComponent,
+		@Inject(IJobManagementService) private _jobManagementService: IJobManagementService
 	) {
-		this._jobManagementService = bootstrapService.jobManagementService;
 		let jobCacheObjectMap = this._jobManagementService.jobCacheObjectMap;
 		this._serverName = _dashboardService.connectionManagementService.connectionInfo.connectionProfile.serverName;
 		let jobCache = jobCacheObjectMap[this._serverName];
@@ -228,16 +228,26 @@ export class JobsViewComponent implements AfterContentChecked {
 		this._cd.detectChanges();
 		const self = this;
 		this._tabHeight = $('agentview-component #jobsDiv .jobview-grid').get(0).clientHeight;
-		$(window).resize((e) => {
+		$(window).resize(() => {
-			let currentTabHeight = $('agentview-component #jobsDiv .jobview-grid').get(0).clientHeight;
+			let currentTab = $('agentview-component #jobsDiv .jobview-grid').get(0);
-			if (currentTabHeight < self._tabHeight) {
+			if (currentTab) {
-				$('agentview-component #jobsDiv div.ui-widget').css('height', `${currentTabHeight-22}px`);
+				let currentTabHeight = currentTab.clientHeight;
-				self._table.resizeCanvas();
+				if (currentTabHeight < self._tabHeight) {
-			} else {
+					$('agentview-component #jobsDiv div.ui-widget').css('height', `${currentTabHeight-22}px`);
-				$('agentview-component #jobsDiv div.ui-widget').css('height', `${currentTabHeight}px`);
+					self._table.resizeCanvas();
-				self._table.resizeCanvas();
+				} else {
+					$('agentview-component #jobsDiv div.ui-widget').css('height', `${currentTabHeight}px`);
+					self._table.resizeCanvas();
+				}
+				self._tabHeight = currentTabHeight;
 			}
-			self._tabHeight = currentTabHeight;
+		});
+		this._table.grid.onColumnsResized.subscribe((e, data: any) => {
+			let nameWidth: number = data.grid.getColumnWidths()[1];
+			// adjust job name when resized
+			$('#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%');
 		});
 		this.loadJobHistories();
 	}

src/sql/parts/modelComponents/button.component.ts

@@ -13,11 +13,12 @@ import Event, { Emitter } from 'vs/base/common/event';
 
 import { ComponentBase } from 'sql/parts/modelComponents/componentBase';
 import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/parts/modelComponents/interfaces';
-import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
-import { attachListStyler } from 'vs/platform/theme/common/styler';
 import { attachButtonStyler } from 'sql/common/theme/styler';
 import { Button } from 'sql/base/browser/ui/button/button';
+
 import { SIDE_BAR_BACKGROUND } from 'vs/workbench/common/theme';
+import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
+import { attachListStyler } from 'vs/platform/theme/common/styler';
 
 @Component({
 	selector: 'button',
@@ -32,8 +33,9 @@ export default class ButtonComponent extends ComponentBase implements IComponent
 
 	@ViewChild('input', { read: ElementRef }) private _inputContainer: ElementRef;
 	constructor(
-		@Inject(forwardRef(() => CommonServiceInterface)) private _commonService: CommonServiceInterface,
+		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
-		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef) {
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService
+	) {
 		super(changeRef);
 	}
 
@@ -49,7 +51,7 @@ export default class ButtonComponent extends ComponentBase implements IComponent
 			this._button = new Button(this._inputContainer.nativeElement);
 
 			this._register(this._button);
-			this._register(attachButtonStyler(this._button, this._commonService.themeService, {
+			this._register(attachButtonStyler(this._button, this.themeService, {
 				buttonBackground: SIDE_BAR_BACKGROUND, buttonHoverBackground: SIDE_BAR_BACKGROUND
 			}));
 			this._register(this._button.onDidClick(e => {

src/sql/parts/modelComponents/card.component.ts

@@ -9,14 +9,14 @@ import { Component, Input, Inject, ChangeDetectorRef, forwardRef, ComponentFacto
 } from '@angular/core';
 
 import * as sqlops from 'sqlops';
+
 import { ITheme, ICssStyleCollector } from 'vs/platform/theme/common/themeService';
 import * as colors from 'vs/platform/theme/common/colorRegistry';
+import { IColorTheme, IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
 
 import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
 import { ComponentBase } from 'sql/parts/modelComponents/componentBase';
 import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/parts/modelComponents/interfaces';
-import { BOOTSTRAP_SERVICE_ID, IBootstrapService } from 'sql/services/bootstrap/bootstrapService';
-import { IColorTheme } from 'vs/workbench/services/themes/common/workbenchThemeService';
 import { StatusIndicator, CardProperties, ActionDescriptor } from 'sql/workbench/api/common/sqlExtHostTypes';
 
 @Component({
@@ -30,15 +30,15 @@ export default class CardComponent extends ComponentBase implements IComponent,
 
 	constructor(@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
 		@Inject(forwardRef(() => ElementRef)) private _el: ElementRef,
-		@Inject(BOOTSTRAP_SERVICE_ID) private _bootstrapService: IBootstrapService
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService
 	) {
 		super(changeRef);
 	}
 
 	ngOnInit(): void {
 		this.baseInit();
-		this._register(this._bootstrapService.themeService.onDidColorThemeChange(this.updateTheme, this));
+		this._register(this.themeService.onDidColorThemeChange(this.updateTheme, this));
-		this.updateTheme(this._bootstrapService.themeService.getColorTheme());
+		this.updateTheme(this.themeService.getColorTheme());
 
 	}
 

src/sql/parts/modelComponents/checkbox.component.ts

@@ -18,7 +18,7 @@ import { CommonServiceInterface } from 'sql/services/common/commonServiceInterfa
 import { attachInputBoxStyler, attachListStyler } from 'vs/platform/theme/common/styler';
 
 @Component({
-	selector: 'checkbox',
+	selector: 'modelview-checkbox',
 	template: `
 		<div #input style="width: 100%"></div>
 	`
@@ -78,6 +78,11 @@ export default class CheckBoxComponent extends ComponentBase implements ICompone
 		super.setProperties(properties);
 		this._input.checked = this.checked;
 		this._input.label = this.label;
+		if (this.enabled) {
+			this._input.enable();
+		} else {
+			this._input.disable();
+		}
 	}
 
 	// CSS-bound properties
@@ -87,11 +92,7 @@ export default class CheckBoxComponent extends ComponentBase implements ICompone
 	}
 
 	public set value(newValue: boolean) {
-		this.setPropertyFromUI<sqlops.CheckBoxProperties, boolean>(this.setInputBoxProperties, newValue);
+		this.setPropertyFromUI<sqlops.CheckBoxProperties, boolean>((properties, value) => { properties.checked = value; }, newValue);
-	}
-
-	private setInputBoxProperties(properties: sqlops.CheckBoxProperties, value: boolean): void {
-		properties.checked = value;
 	}
 
 	private get label(): string {
@@ -99,10 +100,6 @@ export default class CheckBoxComponent extends ComponentBase implements ICompone
 	}
 
 	private set label(newValue: string) {
-		this.setPropertyFromUI<sqlops.CheckBoxProperties, string>(this.setValueProperties, newValue);
+		this.setPropertyFromUI<sqlops.CheckBoxProperties, string>((properties, label) => { properties.label = label; }, newValue);
-	}
-
-	private setValueProperties(properties: sqlops.CheckBoxProperties, label: string): void {
-		properties.label = label;
 	}
 }

src/sql/parts/modelComponents/componentBase.ts

@@ -94,7 +94,21 @@ export abstract class ComponentBase extends Disposable implements IComponent, On
 	public get enabled(): boolean {
 		let properties = this.getProperties();
 		let enabled = properties['enabled'];
-		return enabled !== undefined ? <boolean>enabled : true;
+		if (enabled === undefined) {
+			enabled = true;
+			properties['enabled'] = enabled;
+			this.fireEvent({
+				eventType: ComponentEventType.PropertiesChanged,
+				args: this.getProperties()
+			});
+		}
+		return <boolean>enabled;
+	}
+
+	public set enabled(value: boolean) {
+		let properties = this.getProperties();
+		properties['enabled'] = value;
+		this.setProperties(properties);
 	}
 
 	public get valid(): boolean {
@@ -148,6 +162,9 @@ export abstract class ContainerBase<T> extends ComponentBase {
 
 	/// IComponent container-related implementation
 	public addToContainer(componentDescriptor: IComponentDescriptor, config: any): void {
+		if (this.items.some(item => item.descriptor.id === componentDescriptor.id && item.descriptor.type === componentDescriptor.type)) {
+			return;
+		}
 		this.items.push(new ItemDescriptor(componentDescriptor, config));
 		this.modelStore.eventuallyRunOnComponent(componentDescriptor.id, component => component.registerEventHandler(event => {
 			if (event.eventType === ComponentEventType.validityChanged) {
@@ -162,5 +179,15 @@ export abstract class ContainerBase<T> extends ComponentBase {
 		this._changeRef.detectChanges();
 	}
 
+	public setProperties(properties: { [key: string]: any; }): void {
+		super.setProperties(properties);
+		this.items.forEach(item => {
+			let component = this.modelStore.getComponent(item.descriptor.id);
+			if (component) {
+				component.enabled = this.enabled;
+			}
+		});
+	}
+
 	abstract setLayout(layout: any): void;
 }

src/sql/parts/modelComponents/components.contribution.ts

@@ -5,11 +5,15 @@
 
 import FlexContainer from './flexContainer.component';
 import FormContainer from './formContainer.component';
+import GroupContainer from './groupContainer.component';
 import CardComponent from './card.component';
 import InputBoxComponent from './inputbox.component';
 import DropDownComponent from './dropdown.component';
 import ButtonComponent from './button.component';
 import CheckBoxComponent from './checkbox.component';
+import RadioButtonComponent from './radioButton.component';
+import WebViewComponent from './webview.component';
+import TextComponent from './text.component';
 import { registerComponentType } from 'sql/platform/dashboard/common/modelComponentRegistry';
 import { ModelComponentTypes } from 'sql/workbench/api/common/sqlExtHostTypes';
 
@@ -19,6 +23,9 @@ registerComponentType(FLEX_CONTAINER, ModelComponentTypes.FlexContainer, FlexCon
 export const FORM_CONTAINER = 'form-container';
 registerComponentType(FORM_CONTAINER, ModelComponentTypes.Form, FormContainer);
 
+export const GROUP_CONTAINER = 'group-container';
+registerComponentType(GROUP_CONTAINER, ModelComponentTypes.Group, GroupContainer);
+
 export const CARD_COMPONENT = 'card-component';
 registerComponentType(CARD_COMPONENT, ModelComponentTypes.Card, CardComponent);
 
@@ -34,3 +41,12 @@ registerComponentType(BUTTON_COMPONENT, ModelComponentTypes.Button, ButtonCompon
 
 export const CHECKBOX_COMPONENT = 'checkbox-component';
 registerComponentType(CHECKBOX_COMPONENT, ModelComponentTypes.CheckBox, CheckBoxComponent);
+
+export const RADIOBUTTON_COMPONENT = 'radiobutton-component';
+registerComponentType(RADIOBUTTON_COMPONENT, ModelComponentTypes.RadioButton, RadioButtonComponent);
+
+export const WEBVIEW_COMPONENT = 'webview-component';
+registerComponentType(WEBVIEW_COMPONENT, ModelComponentTypes.WebView, WebViewComponent);
+
+export const TEXT_COMPONENT = 'text-component';
+registerComponentType(TEXT_COMPONENT, ModelComponentTypes.Text, TextComponent);

src/sql/parts/modelComponents/dropdown.component.ts

@@ -9,40 +9,51 @@ import {
 } from '@angular/core';
 
 import * as sqlops from 'sqlops';
-import Event, { Emitter } from 'vs/base/common/event';
 
 import { ComponentBase } from 'sql/parts/modelComponents/componentBase';
 import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/parts/modelComponents/interfaces';
 import { Dropdown, IDropdownOptions } from 'sql/base/browser/ui/editableDropdown/dropdown';
+import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox';
 import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
+import { attachEditableDropdownStyler , attachSelectBoxStyler} from 'sql/common/theme/styler';
+
+import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
+import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
+import Event, { Emitter } from 'vs/base/common/event';
 import { attachListStyler } from 'vs/platform/theme/common/styler';
-import { attachEditableDropdownStyler } from 'sql/common/theme/styler';
 
 @Component({
-	selector: 'dropdown',
+	selector: 'modelview-dropdown',
 	template: `
-		<div #input style="width: 100%"></div>
+
+	<div>
+		<div [style.display]="getEditableDisplay()"   #editableDropDown style="width: 100%;"></div>
+		<div [style.display]="getNotEditableDisplay()" #dropDown style="width: 100%;"></div>
+	</div>
 	`
 })
 export default class DropDownComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit {
 	@Input() descriptor: IComponentDescriptor;
 	@Input() modelStore: IModelStore;
-	private _dropdown: Dropdown;
+	private _editableDropdown: Dropdown;
+	private _selectBox: SelectBox;
 
-	@ViewChild('input', { read: ElementRef }) private _inputContainer: ElementRef;
+	@ViewChild('editableDropDown', { read: ElementRef }) private _editableDropDownContainer: ElementRef;
+	@ViewChild('dropDown', { read: ElementRef }) private _dropDownContainer: ElementRef;
 	constructor(
-		@Inject(forwardRef(() => CommonServiceInterface)) private _commonService: CommonServiceInterface,
+		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
-		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef) {
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
+		@Inject(IContextViewService) private contextViewService: IContextViewService
+	) {
 		super(changeRef);
 	}
 
 	ngOnInit(): void {
 		this.baseInit();
-
 	}
 
 	ngAfterViewInit(): void {
-		if (this._inputContainer) {
+		if (this._editableDropDownContainer) {
 			let dropdownOptions: IDropdownOptions = {
 				values: [],
 				strictSelection: false,
@@ -50,18 +61,35 @@ export default class DropDownComponent extends ComponentBase implements ICompone
 				maxHeight: 125,
 				ariaLabel: ''
 			};
-
+			this._editableDropdown = new Dropdown(this._editableDropDownContainer.nativeElement, this.contextViewService, this.themeService,
-			this._dropdown = new Dropdown(this._inputContainer.nativeElement, this._commonService.contextViewService, this._commonService.themeService,
 				dropdownOptions);
 
-			this._register(this._dropdown);
+			this._register(this._editableDropdown);
-			this._register(attachEditableDropdownStyler(this._dropdown, this._commonService.themeService));
+			this._register(attachEditableDropdownStyler(this._editableDropdown, this.themeService));
-			this._register(this._dropdown.onValueChange(e => {
+			this._register(this._editableDropdown.onValueChange(e => {
-				this.value = this._dropdown.value;
+				if (this.editable) {
-				this._onEventEmitter.fire({
+					this.value = this._editableDropdown.value;
-					eventType: ComponentEventType.onDidChange,
+					this._onEventEmitter.fire({
-					args: e
+						eventType: ComponentEventType.onDidChange,
-				});
+						args: e
+					});
+				}
+			}));
+		}
+		if (this._dropDownContainer) {
+			this._selectBox = new SelectBox(this.values || [], this.value, this.contextViewService, this._dropDownContainer.nativeElement);
+			this._selectBox.render(this._dropDownContainer.nativeElement);
+			this._register(this._selectBox);
+
+			this._register(attachSelectBoxStyler(this._selectBox, this.themeService));
+			this._register(this._selectBox.onDidSelect(e => {
+				if (!this.editable) {
+					this.value = this._selectBox.value;
+					this._onEventEmitter.fire({
+						eventType: ComponentEventType.onDidChange,
+						args: e
+					});
+				}
 			}));
 		}
 	}
@@ -83,9 +111,20 @@ export default class DropDownComponent extends ComponentBase implements ICompone
 
 	public setProperties(properties: { [key: string]: any; }): void {
 		super.setProperties(properties);
-		this._dropdown.values = this.values ? this.values : [];
+		if (this.editable) {
-		if (this.value) {
+			this._editableDropdown.values = this.values ? this.values : [];
-			this._dropdown.value = this.value;
+			if (this.value) {
+				this._editableDropdown.value = this.value;
+			}
+			this._editableDropdown.enabled = this.enabled;
+		} else {
+			this._selectBox.setOptions(this.values || []);
+			this._selectBox.selectWithOptionName(this.value);
+			if (this.enabled) {
+				this._selectBox.enable();
+			} else {
+				this._selectBox.disable();
+			}
 		}
 	}
 
@@ -95,6 +134,18 @@ export default class DropDownComponent extends ComponentBase implements ICompone
 		return this.getPropertyOrDefault<sqlops.DropDownProperties, string>((props) => props.value, '');
 	}
 
+	private get editable(): boolean {
+		return this.getPropertyOrDefault<sqlops.DropDownProperties, boolean>((props) => props.editable, false);
+	}
+
+	public getEditableDisplay() : string {
+		return this.editable ? '' : 'none';
+	}
+
+	public getNotEditableDisplay() : string {
+		return !this.editable ? '' : 'none';
+	}
+
 	private set value(newValue: string) {
 		this.setPropertyFromUI<sqlops.DropDownProperties, string>(this.setValueProperties, newValue);
 	}

src/sql/parts/modelComponents/flexContainer.component.ts

@@ -15,6 +15,8 @@ import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboar
 import { ContainerBase } from 'sql/parts/modelComponents/componentBase';
 import { ModelComponentWrapper } from 'sql/parts/modelComponents/modelComponentWrapper.component';
 
+import types = require('vs/base/common/types');
+
 class FlexItem {
 	constructor(public descriptor: IComponentDescriptor, public config: FlexItemLayout) {}
 }
@@ -22,7 +24,7 @@ class FlexItem {
 @Component({
 	template: `
 		<div *ngIf="items" class="flexContainer" [style.flexFlow]="flexFlow" [style.justifyContent]="justifyContent"
-				[style.alignItems]="alignItems" [style.alignContent]="alignContent">
+				[style.alignItems]="alignItems" [style.alignContent]="alignContent" [style.height]="height">
 			<div *ngFor="let item of items" [style.flex]="getItemFlex(item)" [style.order]="getItemOrder(item)" >
 				<model-component-wrapper [descriptor]="item.descriptor" [modelStore]="modelStore">
 				</model-component-wrapper>
@@ -37,6 +39,7 @@ export default class FlexContainer extends ContainerBase<FlexItemLayout> impleme
 	private _justifyContent: string;
 	private _alignItems: string;
 	private _alignContent: string;
+	private _height: string;
 
 	@ViewChildren(ModelComponentWrapper) private _componentWrappers: QueryList<ModelComponentWrapper>;
 
@@ -67,9 +70,16 @@ export default class FlexContainer extends ContainerBase<FlexItemLayout> impleme
 
 	public setLayout (layout: FlexLayout): void {
 		this._flexFlow = layout.flexFlow ? layout.flexFlow : '';
-		this._justifyContent= layout.justifyContent ? layout.justifyContent : '';
+		this._justifyContent = layout.justifyContent ? layout.justifyContent : '';
-		this._alignItems= layout.alignItems ? layout.alignItems : '';
+		this._alignItems = layout.alignItems ? layout.alignItems : '';
-		this._alignContent= layout.alignContent ? layout.alignContent : '';
+		this._alignContent = layout.alignContent ? layout.alignContent : '';
+		if (types.isUndefinedOrNull(layout.height)) {
+			this._height = '';
+		} else if (types.isNumber(layout.height)) {
+			this._height = layout.height + 'px';
+		} else {
+			this._height = layout.height;
+		}
 		this.layout();
 	}
 
@@ -86,6 +96,10 @@ export default class FlexContainer extends ContainerBase<FlexItemLayout> impleme
 		return this._alignItems;
 	}
 
+	public get height(): string {
+		return this._height;
+	}
+
 	public get alignContent(): string {
 		return this._alignContent;
 	}

src/sql/parts/modelComponents/flexContainer.css

@@ -1,5 +1,4 @@
 
 .flexContainer {
 	display: flex;
-	padding: 5px;
 }

src/sql/parts/modelComponents/formContainer.component.ts

@@ -22,18 +22,22 @@ export interface TitledFormItemLayout {
 	actions?: string[];
 	isFormComponent: Boolean;
 	horizontal: boolean;
-	width: number;
 	componentWidth: number;
 }
+
+export interface FormLayout {
+	width: number;
+}
+
 class FormItem {
 	constructor(public descriptor: IComponentDescriptor, public config: TitledFormItemLayout) { }
 }
 
 @Component({
 	template: `
-		<div #container *ngIf="items" class="form-table" >
+		<div #container *ngIf="items" class="form-table" [style.width]="getFormWidth()">
 			<ng-container *ngFor="let item of items">
-			<div class="form-row" [style.width]="getFormWidth(item)">
+			<div class="form-row" >
 				<ng-container *ngIf="isFormComponent(item)">
 					<ng-container *ngIf="isHorizontal(item)">
 						<div class="form-cell">{{getItemTitle(item)}}</div>
@@ -77,6 +81,7 @@ export default class FormContainer extends ContainerBase<FormItemLayout> impleme
 
 	private _alignItems: string;
 	private _alignContent: string;
+	private _formLayout: FormLayout;
 
 	@ViewChildren(ModelComponentWrapper) private _componentWrappers: QueryList<ModelComponentWrapper>;
 	@ViewChild('container', { read: ElementRef }) private _container: ElementRef;
@@ -116,9 +121,8 @@ export default class FormContainer extends ContainerBase<FormItemLayout> impleme
 		return this._alignContent;
 	}
 
-	private getFormWidth(item: FormItem): string {
+	private getFormWidth(): string {
-		let itemConfig = item.config;
+		return this._formLayout && this._formLayout.width ? +this._formLayout.width + 'px' : '100%';
-		return itemConfig && itemConfig.width ? +itemConfig.width + 'px' : '100%';
 	}
 
 	private getComponentWidth(item: FormItem): string {
@@ -155,7 +159,8 @@ export default class FormContainer extends ContainerBase<FormItemLayout> impleme
 		return itemConfig && itemConfig.actions !== undefined && itemConfig.actions.length > 0;
 	}
 
-	public setLayout(layout: any): void {
+	public setLayout(layout: FormLayout): void {
+		this._formLayout = layout;
 		this.layout();
 	}
 

src/sql/parts/modelComponents/formLayout.css

@@ -1,8 +1,7 @@
 
 .form-table {
-	width: 100%;
 	display: table;
-	padding: 10px 30px 0px 30px;
+	padding: 5px 30px 0px 30px;
 	box-sizing: border-box;
 }
 
@@ -24,7 +23,7 @@
 }
 
 .form-cell {
-	padding-bottom: 20px;
+	padding-bottom: 10px;
 	padding-right: 5px;
 	display: table-cell;
 }

src/sql/parts/modelComponents/groupContainer.component.ts

@@ -0,0 +1,94 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+import 'vs/css!./groupLayout';
+
+import {
+	Component, Input, Inject, ChangeDetectorRef, forwardRef, ComponentFactoryResolver,
+	ViewChild, ViewChildren, ElementRef, Injector, OnDestroy, QueryList, AfterViewInit
+} from '@angular/core';
+
+import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/parts/modelComponents/interfaces';
+import { GroupLayout, GroupItemLayout } from 'sqlops';
+
+import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
+import { ContainerBase } from 'sql/parts/modelComponents/componentBase';
+import { ModelComponentWrapper } from 'sql/parts/modelComponents/modelComponentWrapper.component';
+import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
+
+@Component({
+	selector: 'modelview-groupContainer',
+	template: `
+		<div *ngIf="hasHeader()" class="modelview-group-header" >
+				{{_containerLayout.header}}
+		</div>
+		<div #container *ngIf="items" class="modelview-group-container" [style.width]="getContainerWidth()">
+			<ng-container *ngFor="let item of items">
+			<div class="modelview-group-row" >
+				<div  class="modelview-group-cell">
+				<model-component-wrapper  [descriptor]="item.descriptor" [modelStore]="modelStore" >
+				</model-component-wrapper>
+				</div>
+			</div>
+			</ng-container>
+		</div>
+	`
+})
+export default class GroupContainer extends ContainerBase<GroupLayout> implements IComponent, OnDestroy, AfterViewInit {
+	@Input() descriptor: IComponentDescriptor;
+	@Input() modelStore: IModelStore;
+
+	private _containerLayout: GroupLayout;
+
+	@ViewChildren(ModelComponentWrapper) private _componentWrappers: QueryList<ModelComponentWrapper>;
+	@ViewChild('container', { read: ElementRef }) private _container: ElementRef;
+
+	constructor(
+		@Inject(forwardRef(() => CommonServiceInterface)) private _commonService: CommonServiceInterface,
+		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef) {
+		super(changeRef);
+	}
+
+	ngOnInit(): void {
+		this.baseInit();
+	}
+
+	ngOnDestroy(): void {
+		this.baseDestroy();
+	}
+
+	ngAfterViewInit(): void {
+	}
+
+	/// IComponent implementation
+
+	public layout(): void {
+		if (this._componentWrappers) {
+			this._componentWrappers.forEach(wrapper => {
+				wrapper.layout();
+			});
+		}
+	}
+
+	public setLayout(layout: GroupLayout): void {
+		this._containerLayout = layout;
+		this.layout();
+	}
+
+	private hasHeader(): boolean {
+		return this._containerLayout && this._containerLayout && this._containerLayout.header !== undefined;
+	}
+
+	private getContainerWidth(): string {
+		if (this._containerLayout && this._containerLayout.width) {
+			let width: string = this._containerLayout.width.toString();
+			if (!width.endsWith('%') && !width.toLowerCase().endsWith('px')) {
+				width = width + 'px';
+			}
+			return width;
+		} else {
+			return '100%';
+		}
+	}
+}

src/sql/parts/modelComponents/groupLayout.css

@@ -0,0 +1,21 @@
+
+.modelview-group-container {
+	display: table;
+	padding: 5px 10px 5px 10px;
+	box-sizing: border-box;
+}
+
+.modelview-group-row {
+	display: table-row;
+
+}
+
+.modelview-group-header {
+	padding-bottom: 5px;
+	font-size: 14px;
+}
+
+.modelview-group-cell {
+	padding-bottom: 5px;
+	display: table-cell;
+}

src/sql/parts/modelComponents/inputbox.component.ts

@@ -9,17 +9,20 @@ import {
 } from '@angular/core';
 
 import * as sqlops from 'sqlops';
-import Event, { Emitter } from 'vs/base/common/event';
-import * as nls from 'vs/nls';
 
 import { ComponentBase } from 'sql/parts/modelComponents/componentBase';
 import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/parts/modelComponents/interfaces';
-import { InputBox, IInputOptions, MessageType } from 'vs/base/browser/ui/inputbox/inputBox';
+
-import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
+import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox';
+import { IInputOptions, MessageType } from 'vs/base/browser/ui/inputbox/inputBox';
 import { attachInputBoxStyler, attachListStyler } from 'vs/platform/theme/common/styler';
+import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
+import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
+import Event, { Emitter } from 'vs/base/common/event';
+import * as nls from 'vs/nls';
 
 @Component({
-	selector: 'inputBox',
+	selector: 'modelview-inputBox',
 	template: `
 		<div #input style="width: 100%"></div>
 	`
@@ -31,8 +34,10 @@ export default class InputBoxComponent extends ComponentBase implements ICompone
 
 	@ViewChild('input', { read: ElementRef }) private _inputContainer: ElementRef;
 	constructor(
-		@Inject(forwardRef(() => CommonServiceInterface)) private _commonService: CommonServiceInterface,
+		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
-		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef) {
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
+		@Inject(IContextViewService) private contextViewService: IContextViewService
+	) {
 		super(changeRef);
 	}
 
@@ -61,11 +66,11 @@ export default class InputBoxComponent extends ComponentBase implements ICompone
 				useDefaultValidation: true
 			};
 
-			this._input = new InputBox(this._inputContainer.nativeElement, this._commonService.contextViewService, inputOptions);
+			this._input = new InputBox(this._inputContainer.nativeElement, this.contextViewService, inputOptions);
 			this._validations.push(() => !this._input.inputElement.validationMessage);
 
 			this._register(this._input);
-			this._register(attachInputBoxStyler(this._input, this._commonService.themeService));
+			this._register(attachInputBoxStyler(this._input, this.themeService));
 			this._register(this._input.onDidChange(e => {
 				this.value = this._input.value;
 				this._onEventEmitter.fire({

src/sql/parts/modelComponents/interfaces.ts

@@ -23,6 +23,7 @@ export interface IComponent {
 	addToContainer?: (componentDescriptor: IComponentDescriptor, config: any) => void;
 	setLayout?: (layout: any) => void;
 	setProperties?: (properties: { [key: string]: any; }) => void;
+	enabled: boolean;
 	readonly valid?: boolean;
 	validate(): Thenable<boolean>;
 }
@@ -63,7 +64,8 @@ export enum ComponentEventType {
 	PropertiesChanged,
 	onDidChange,
 	onDidClick,
-	validityChanged
+	validityChanged,
+	onMessage
 }
 
 export interface IModelStore {

src/sql/parts/modelComponents/modelComponentWrapper.component.ts

@@ -13,12 +13,11 @@ import { ComponentHostDirective } from 'sql/parts/dashboard/common/componentHost
 import { error } from 'sql/base/common/log';
 import { AngularDisposable } from 'sql/base/common/lifecycle';
 import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
-import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
 import { IComponent, IComponentConfig, IComponentDescriptor, IModelStore, COMPONENT_CONFIG } from './interfaces';
 import { Extensions, IComponentRegistry } from 'sql/platform/dashboard/common/modelComponentRegistry';
 
 import { IDisposable } from 'vs/base/common/lifecycle';
-import { IColorTheme } from 'vs/workbench/services/themes/common/workbenchThemeService';
+import { IColorTheme, IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
 import * as colors from 'vs/platform/theme/common/colorRegistry';
 import * as themeColors from 'vs/workbench/common/theme';
 import { Action } from 'vs/base/common/actions';
@@ -53,22 +52,22 @@ export class ModelComponentWrapper extends AngularDisposable implements OnInit {
 	constructor(
 		@Inject(forwardRef(() => ComponentFactoryResolver)) private _componentFactoryResolver: ComponentFactoryResolver,
 		@Inject(forwardRef(() => ElementRef)) private _ref: ElementRef,
-		@Inject(forwardRef(() => CommonServiceInterface)) private _bootstrap: CommonServiceInterface,
 		@Inject(forwardRef(() => ChangeDetectorRef)) private _changeref: ChangeDetectorRef,
-		@Inject(forwardRef(() => Injector)) private _injector: Injector
+		@Inject(forwardRef(() => Injector)) private _injector: Injector,
+		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService
 	) {
 		super();
 	}
 
 	ngOnInit() {
 		let self = this;
-		this._register(self._bootstrap.themeService.onDidColorThemeChange((event: IColorTheme) => {
+		this._register(self.themeService.onDidColorThemeChange((event: IColorTheme) => {
 			self.updateTheme(event);
 		}));
 	}
 
 	ngAfterViewInit() {
-		this.updateTheme(this._bootstrap.themeService.getColorTheme());
+		this.updateTheme(this.themeService.getColorTheme());
 		if (this.componentHost) {
 			this.loadComponent();
 		}

src/sql/parts/modelComponents/modelEditor/modelViewEditor.contribution.ts

@@ -0,0 +1,20 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+import { Registry } from 'vs/platform/registry/common/platform';
+import { EditorDescriptor, IEditorRegistry, Extensions as EditorExtensions } from 'vs/workbench/browser/editor';
+import { SyncDescriptor } from 'vs/platform/instantiation/common/descriptors';
+
+import { ModelViewInput } from 'sql/parts/modelComponents/modelEditor/modelViewInput';
+import { ModelViewEditor } from 'sql/parts/modelComponents/modelEditor/modelViewEditor';
+
+// Model View editor registration
+const viewModelEditorDescriptor = new EditorDescriptor(
+	ModelViewEditor,
+	ModelViewEditor.ID,
+	'ViewModel'
+);
+
+Registry.as<IEditorRegistry>(EditorExtensions.Editors)
+	.registerEditor(viewModelEditorDescriptor, [new SyncDescriptor(ModelViewInput)]);

src/sql/parts/modelComponents/modelEditor/modelViewEditor.ts

@@ -0,0 +1,95 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+import { Builder, $ } from 'vs/base/browser/builder';
+import { TPromise } from 'vs/base/common/winjs.base';
+import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
+import { IThemeService } from 'vs/platform/theme/common/themeService';
+import { BaseEditor } from 'vs/workbench/browser/parts/editor/baseEditor';
+import { Dimension } from 'vs/workbench/services/part/common/partService';
+import { EditorOptions } from 'vs/workbench/common/editor';
+import * as DOM from 'vs/base/browser/dom';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+
+import { ModelViewInput } from 'sql/parts/modelComponents/modelEditor/modelViewInput';
+
+export class ModelViewEditor extends BaseEditor {
+
+	public static ID: string = 'workbench.editor.modelViewEditor';
+
+	private _editorFrame: HTMLElement;
+
+	constructor(
+		@ITelemetryService telemetryService: ITelemetryService,
+		@IThemeService themeService: IThemeService
+	) {
+		super(ModelViewEditor.ID, telemetryService, themeService);
+	}
+
+	/**
+	 * Called to create the editor in the parent builder.
+	 */
+	public createEditor(parent: Builder): void {
+		this._editorFrame = parent.getHTMLElement();
+	}
+
+	/**
+	 * Sets focus on this editor. Specifically, it sets the focus on the hosted text editor.
+	 */
+	public focus(): void {
+	}
+
+	async setInput(input: ModelViewInput, options?: EditorOptions): TPromise<void, any> {
+		if (this.input && this.input.matches(input)) {
+			return TPromise.as(undefined);
+		}
+
+		const parentElement = this.getContainer().getHTMLElement();
+		if (this.input instanceof ModelViewInput) {
+			if (this.input.container) {
+				if (this.input.options && this.input.options.retainContextWhenHidden) {
+					this.input.container.style.visibility = 'hidden';
+				} else {
+					parentElement.removeChild(this.input.container);
+				}
+			}
+		}
+
+		if (!parentElement.contains(input.container)) {
+			parentElement.appendChild(input.container);
+		}
+		input.container.style.visibility = 'visible';
+
+		await super.setInput(input, options);
+		this.doUpdateContainer();
+	}
+
+	private doUpdateContainer() {
+		const modelViewContainer = this.input && (this.input as ModelViewInput).container;
+		if (modelViewContainer) {
+			const frameRect = this._editorFrame.getBoundingClientRect();
+			const containerRect = modelViewContainer.parentElement.getBoundingClientRect();
+
+			modelViewContainer.style.position = 'absolute';
+			modelViewContainer.style.top = `${frameRect.top}px`;
+			modelViewContainer.style.left = `${frameRect.left - containerRect.left}px`;
+			modelViewContainer.style.width = `${frameRect.width}px`;
+			modelViewContainer.style.height = `${frameRect.height}px`;
+		}
+	}
+
+	/**
+	 * Updates the internal variable keeping track of the editor's size, and re-calculates the sash position.
+	 * To be called when the container of this editor changes size.
+	 */
+	public layout(dimension: Dimension): void {
+		if (this.input instanceof ModelViewInput) {
+			if (this.input.container && this.input.dialogPane) {
+				this.doUpdateContainer();
+				// todo: layout this.input.dialogPane (Github issue: #1484)
+			}
+		}
+	}
+
+}

src/sql/parts/modelComponents/modelEditor/modelViewInput.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.
+ *--------------------------------------------------------------------------------------------*/
+
+import { TPromise } from 'vs/base/common/winjs.base';
+import { IEditorModel } from 'vs/platform/editor/common/editor';
+import { EditorInput } from 'vs/workbench/common/editor';
+import * as DOM from 'vs/base/browser/dom';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
+
+import { DialogPane } from 'sql/platform/dialog/dialogPane';
+
+import * as sqlops from 'sqlops';
+export class ModelViewInput extends EditorInput {
+
+	public static ID: string = 'workbench.editorinputs.ModelViewEditorInput';
+	private _container: HTMLElement;
+	private _dialogPane: DialogPane;
+
+	constructor(private _title: string, private _modelViewId: string,
+		private _options: sqlops.ModelViewEditorOptions,
+		@IInstantiationService private _instantiationService: IInstantiationService,
+	) {
+		super();
+	}
+
+	public get title(): string {
+		return this._title;
+	}
+
+	public get modelViewId(): string {
+		return this._modelViewId;
+	}
+
+	public getTypeId(): string {
+		return 'ModelViewEditorInput';
+	}
+
+	public resolve(refresh?: boolean): TPromise<IEditorModel> {
+		return undefined;
+	}
+
+	public getName(): string {
+		return this._title;
+	}
+
+	public get container(): HTMLElement {
+		if (!this._container && !this._dialogPane) {
+			this._container = DOM.$('div.model-view-container');
+			this._dialogPane = new DialogPane(this.title, this.modelViewId, () => undefined, this._instantiationService);
+			this._dialogPane.createBody(this._container);
+		}
+		return this._container;
+	}
+
+	public get dialogPane(): DialogPane {
+		return this._dialogPane;
+	}
+
+	public get options(): sqlops.ModelViewEditorOptions {
+		return this._options;
+	}
+
+	public dispose(): void {
+		if (this._dialogPane) {
+			this._dialogPane.dispose();
+		}
+		if (this._container) {
+			this._container.remove();
+			this._container = undefined;
+		}
+		super.dispose();
+	}
+}

src/sql/parts/modelComponents/modelViewContent.component.ts

@@ -17,14 +17,15 @@ import { TabConfig } from 'sql/parts/dashboard/common/dashboardWidget';
 import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
 import { IModelView } from 'sql/services/model/modelViewService';
 import { AngularDisposable } from 'sql/base/common/lifecycle';
+import { ViewBase } from 'sql/parts/modelComponents/viewBase';
+import { IModelViewService } from 'sql/services/modelComponents/modelViewService';
 
 import * as sqlops from 'sqlops';
-import { ViewBase } from 'sql/parts/modelComponents/viewBase';
 
 @Component({
 	selector: 'modelview-content',
 	template: `
-		<div *ngIf="rootDescriptor">
+		<div *ngIf="rootDescriptor" style="width: 100%; height: 100%;">
 			<model-component-wrapper [descriptor]="rootDescriptor" [modelStore]="modelStore">
 			</model-component-wrapper>
 		</div>
@@ -42,13 +43,14 @@ export class ModelViewContent extends ViewBase implements OnInit, IModelView {
 
 	constructor(
 		@Inject(forwardRef(() => CommonServiceInterface)) private _commonService: CommonServiceInterface,
-		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef
+		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
+		@Inject(IModelViewService) private modelViewService: IModelViewService
 	) {
 		super(changeRef);
 	}
 
 	ngOnInit() {
-		this._commonService.modelViewService.registerModelView(this);
+		this.modelViewService.registerModelView(this);
 		this._register(addDisposableListener(window, EventType.RESIZE, e => {
 			this.layout();
 		}));

src/sql/parts/modelComponents/radioButton.component.ts

@@ -0,0 +1,124 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+import 'vs/css!./radioButton';
+import {
+	Component, Input, Inject, ChangeDetectorRef, forwardRef, ComponentFactoryResolver,
+	ViewChild, ViewChildren, ElementRef, Injector, OnDestroy, QueryList, AfterViewInit
+} from '@angular/core';
+
+import * as sqlops from 'sqlops';
+import Event, { Emitter } from 'vs/base/common/event';
+
+import { ComponentBase } from 'sql/parts/modelComponents/componentBase';
+import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/parts/modelComponents/interfaces';
+import { RadioButton } from 'sql/base/browser/ui/radioButton/radioButton';
+import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
+
+@Component({
+	selector: 'modelview-radioButton',
+	template: `
+		<div #input class="modelview-radiobutton-container">
+
+		</div>
+	`
+})
+export default class RadioButtonComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit {
+	@Input() descriptor: IComponentDescriptor;
+	@Input() modelStore: IModelStore;
+	private _input: RadioButton;
+
+	@ViewChild('input', { read: ElementRef }) private _inputContainer: ElementRef;
+	constructor(
+		@Inject(forwardRef(() => CommonServiceInterface)) private _commonService: CommonServiceInterface,
+		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef) {
+		super(changeRef);
+	}
+
+	ngOnInit(): void {
+		this.baseInit();
+
+	}
+
+	ngAfterViewInit(): void {
+		if (this._inputContainer) {
+			this._input = new RadioButton(this._inputContainer.nativeElement, {
+				label: this.label
+			});
+
+			this._register(this._input);
+			this._register(this._input.onClicked(e => {
+				this.checked = this._input.checked;
+				this._onEventEmitter.fire({
+					eventType: ComponentEventType.onDidClick,
+					args: e
+				});
+			}));
+		}
+	}
+
+	ngOnDestroy(): void {
+		this.baseDestroy();
+	}
+
+	/// IComponent implementation
+
+	public layout(): void {
+		this._changeRef.detectChanges();
+	}
+
+	public setLayout(layout: any): void {
+		// TODO allow configuring the look and feel
+		this.layout();
+	}
+
+	public setProperties(properties: { [key: string]: any; }): void {
+		super.setProperties(properties);
+		this._input.name = this.name;
+		this._input.value = this.value;
+		this._input.label = this.label;
+		this._input.enabled = this.enabled;
+
+		this._input.checked = this.checked;
+	}
+
+	// CSS-bound properties
+
+	public get checked(): boolean {
+		return this.getPropertyOrDefault<sqlops.RadioButtonProperties, boolean>((props) => props.checked, false);
+	}
+
+	public set checked(newValue: boolean) {
+		this.setPropertyFromUI<sqlops.RadioButtonProperties, boolean>((properties, value) => { properties.checked = value; }, newValue);
+	}
+
+	public set value(newValue: string) {
+		this.setPropertyFromUI<sqlops.RadioButtonProperties, string>((properties, value) => { properties.value = value; }, newValue);
+	}
+
+	public get value(): string {
+		return this.getPropertyOrDefault<sqlops.RadioButtonProperties, string>((props) => props.value, '');
+	}
+
+	public getLabel(): string {
+		return this.label;
+	}
+
+	public get label(): string {
+		return this.getPropertyOrDefault<sqlops.RadioButtonProperties, string>((props) => props.label, '');
+	}
+
+	public set label(newValue: string) {
+		this.setPropertyFromUI<sqlops.RadioButtonProperties, string>((properties, label) => { properties.label = label; }, newValue);
+	}
+
+	public get name(): string {
+		return this.getPropertyOrDefault<sqlops.RadioButtonProperties, string>((props) => props.name, '');
+	}
+
+	public set name(newValue: string) {
+		this.setPropertyFromUI<sqlops.RadioButtonProperties, string>((properties, label) => { properties.name = label; }, newValue);
+	}
+}

src/sql/parts/modelComponents/radioButton.css

@@ -0,0 +1,11 @@
+.modelview-radiobutton-container {
+	align-items: flex-start;
+}
+
+.modelview-radiobutton-item {
+	align-self: flex-start ;
+}
+
+.modelview-radiobutton-title {
+
+}

src/sql/parts/modelComponents/text.component.ts

@@ -0,0 +1,67 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+import 'vs/css!./radioButton';
+import {
+	Component, Input, Inject, ChangeDetectorRef, forwardRef, ComponentFactoryResolver,
+	ViewChild, ViewChildren, ElementRef, Injector, OnDestroy, QueryList, AfterViewInit
+} from '@angular/core';
+
+import * as sqlops from 'sqlops';
+import Event, { Emitter } from 'vs/base/common/event';
+
+import { ComponentBase } from 'sql/parts/modelComponents/componentBase';
+import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/parts/modelComponents/interfaces';
+import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
+
+@Component({
+	selector: 'modelview-text',
+	template: `
+		<p>{{getValue()}}</p>`
+})
+export default class TextComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit {
+	@Input() descriptor: IComponentDescriptor;
+	@Input() modelStore: IModelStore;
+
+	constructor(
+		@Inject(forwardRef(() => CommonServiceInterface)) private _commonService: CommonServiceInterface,
+		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef) {
+		super(changeRef);
+	}
+
+	ngOnInit(): void {
+		this.baseInit();
+	}
+
+	ngAfterViewInit(): void {
+	}
+
+	ngOnDestroy(): void {
+		this.baseDestroy();
+	}
+
+	/// IComponent implementation
+
+	public layout(): void {
+		this._changeRef.detectChanges();
+	}
+
+	public setLayout(layout: any): void {
+		// TODO allow configuring the look and feel
+		this.layout();
+	}
+
+	public set value(newValue: string) {
+		this.setPropertyFromUI<sqlops.TextComponentProperties, string>((properties, value) => { properties.value = value; }, newValue);
+	}
+
+	public get value(): string {
+		return this.getPropertyOrDefault<sqlops.TextComponentProperties, string>((props) => props.value, '');
+	}
+
+	public getValue(): string {
+		return this.value;
+	}
+}

src/sql/parts/modelComponents/webview.component.ts

@@ -0,0 +1,138 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+import 'vs/css!./webview';
+import {
+	Component, Input, Inject, ChangeDetectorRef, forwardRef, ComponentFactoryResolver,
+	ViewChild, ViewChildren, ElementRef, Injector, OnDestroy, QueryList
+} from '@angular/core';
+
+import * as sqlops from 'sqlops';
+import Event, { Emitter } from 'vs/base/common/event';
+import { Webview } from 'vs/workbench/parts/html/browser/webview';
+import { addDisposableListener, EventType } from 'vs/base/browser/dom';
+import { Parts, IPartService } from 'vs/workbench/services/part/common/partService';
+import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
+import { IEnvironmentService } from 'vs/platform/environment/common/environment';
+import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
+import { IThemeService } from 'vs/platform/theme/common/themeService';
+
+import { ComponentBase } from 'sql/parts/modelComponents/componentBase';
+import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/parts/modelComponents/interfaces';
+
+@Component({
+	template: '',
+	selector: 'modelview-webview-component'
+})
+export default class WebViewComponent extends ComponentBase implements IComponent, OnDestroy {
+	@Input() descriptor: IComponentDescriptor;
+	@Input() modelStore: IModelStore;
+
+	private _webview: Webview;
+	private _onMessage = new Emitter<any>();
+	private _renderedHtml: string;
+
+	constructor(
+		@Inject(forwardRef(() => CommonServiceInterface)) private _commonService: CommonServiceInterface,
+		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
+		@Inject(forwardRef(() => ElementRef)) private _el: ElementRef,
+		@Inject(IPartService) private partService: IPartService,
+		@Inject(IThemeService) private themeService: IThemeService,
+		@Inject(IEnvironmentService) private environmentService: IEnvironmentService,
+		@Inject(IContextViewService) private contextViewService: IContextViewService
+	) {
+		super(changeRef);
+	}
+
+	ngOnInit(): void {
+		this.baseInit();
+		this._createWebview();
+		this._register(addDisposableListener(window, EventType.RESIZE, e => {
+			this.layout();
+		}));
+	}
+
+	private _createWebview(): void {
+		this._webview = this._register(new Webview(this._el.nativeElement,
+			this.partService.getContainer(Parts.EDITOR_PART),
+			this.themeService,
+			this.environmentService,
+			this.contextViewService,
+			undefined,
+			undefined,
+			{
+				allowScripts: true,
+				enableWrappedPostMessage: true
+			}
+		));
+
+
+		this._register(this._webview.onMessage(e => {
+			this._onEventEmitter.fire({
+				eventType: ComponentEventType.onMessage,
+				args: e
+			});
+		}));
+
+		this._webview.style(this.themeService.getTheme());
+		this.setHtml();
+	}
+
+	ngOnDestroy(): void {
+		this.baseDestroy();
+	}
+
+	/// Webview Functions
+
+	private setHtml(): void {
+		if (this._webview && this.html) {
+			this._renderedHtml = this.html;
+			this._webview.contents = this._renderedHtml;
+			this._webview.layout();
+		}
+	}
+
+	private sendMessage(): void {
+		if (this._webview && this.message) {
+			this._webview.sendMessage(this.message);
+		}
+	}
+
+	/// IComponent implementation
+
+	public layout(): void {
+		this._webview.layout();
+	}
+
+	public setLayout(layout: any): void {
+		// TODO allow configuring the look and feel
+		this.layout();
+	}
+
+	public setProperties(properties: { [key: string]: any; }): void {
+		super.setProperties(properties);
+		if (this.html !== this._renderedHtml) {
+			this.setHtml();
+		}
+		this.sendMessage();
+	}
+
+	// CSS-bound properties
+
+	public get message(): any {
+		return this.getPropertyOrDefault<sqlops.WebViewProperties, any>((props) => props.message, undefined);
+	}
+
+	public set message(newValue: any) {
+		this.setPropertyFromUI<sqlops.WebViewProperties, any>((properties, message) => { properties.message = message; }, newValue);
+	}
+
+	public get html(): string {
+		return this.getPropertyOrDefault<sqlops.WebViewProperties, string>((props) => props.html, undefined);
+	}
+
+	public set html(newValue: string) {
+		this.setPropertyFromUI<sqlops.WebViewProperties, string>((properties, html) => { properties.html = html; }, newValue);
+	}
+}

src/sql/parts/modelComponents/webview.css

@@ -0,0 +1,10 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the Source EULA. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+ modelview-webview-component {
+	height: 100%;
+	width : 100%;
+	display: block;
+}

src/sql/parts/profiler/contrib/profilerActions.contribution.ts

@@ -11,9 +11,16 @@ import { NewProfilerAction } from './profilerActions';
 
 import { Registry } from 'vs/platform/registry/common/platform';
 import { IWorkbenchActionRegistry, Extensions as ActionExtensions } from 'vs/workbench/common/actions';
+import { CommandsRegistry } from 'vs/platform/commands/common/commands';
 import { SyncActionDescriptor } from 'vs/platform/actions/common/actions';
+import { ServicesAccessor, IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 import * as nls from 'vs/nls';
 import { IJSONSchema } from 'vs/base/common/jsonSchema';
+import { IWorkbenchEditorService } from 'vs/workbench/services/editor/common/editorService';
+import { IConnectionManagementService } from 'sql/parts/connection/common/connectionManagement';
+import { IConnectionProfile } from 'sql/parts/connection/common/interfaces';
+import { ProfilerInput } from 'sql/parts/profiler/editor/profilerInput';
+import { TPromise } from 'vs/base/common/winjs.base';
 
 // Contribute Global Actions
 const category = nls.localize('profilerCategory', "Profiler");
@@ -24,8 +31,27 @@ const newProfilerSchema: IJSONSchema = {
 	default: null
 };
 
-if (process.env['VSCODE_DEV']) {
+CommandsRegistry.registerCommand({
-	const registry = Registry.as<IWorkbenchActionRegistry>(ActionExtensions.WorkbenchActions);
+	id: 'profiler.newProfiler',
-	registry.registerWorkbenchAction(new SyncActionDescriptor(GlobalNewProfilerAction, GlobalNewProfilerAction.ID, GlobalNewProfilerAction.LABEL), 'Profiler: New Profiler', category);
+	handler: (accessor: ServicesAccessor) => {
-	new NewProfilerAction().registerTask();
+		let editorService: IWorkbenchEditorService = accessor.get(IWorkbenchEditorService);
-}
+		let instantiationService: IInstantiationService = accessor.get(IInstantiationService);
+		let connectionService: IConnectionManagementService = accessor.get(IConnectionManagementService);
+
+		// TODO: for test-only, grab the first MSSQL active connection for the profiler session
+		// TODO: when finishing the feature the connection should come from the launch context
+		let connectionProfile: IConnectionProfile;
+		let activeConnections = connectionService.getActiveConnections();
+		if (activeConnections) {
+			for (let i = 0; i < activeConnections.length; ++i) {
+				if (activeConnections[i].providerName === 'MSSQL') {
+					connectionProfile = activeConnections[i];
+					break;
+				}
+			}
+		}
+
+		let profilerInput = instantiationService.createInstance(ProfilerInput, connectionProfile);
+		return editorService.openEditor(profilerInput, { pinned: true }, false).then(() => TPromise.as(true));
+	}
+});

src/sql/parts/profiler/contrib/profilerActions.ts

@@ -228,7 +228,7 @@ export class ProfilerFindPrevious implements IEditorAction {
 }
 
 export class NewProfilerAction extends Task {
-	public static readonly ID = 'newProfiler';
+	public static readonly ID = 'profiler.newProfiler';
 	public static readonly LABEL = nls.localize('profilerAction.newProfiler', 'New Profiler');
 	public static readonly ICON = 'profile';
 

src/sql/parts/query/editor/queryResultsEditor.ts

@@ -21,10 +21,11 @@ import * as types from 'vs/base/common/types';
 
 import { QueryResultsInput } from 'sql/parts/query/common/queryResultsInput';
 import { IQueryModelService } from 'sql/parts/query/execution/queryModel';
-import { IBootstrapService } from 'sql/services/bootstrap/bootstrapService';
+import { bootstrapAngular } from 'sql/services/bootstrap/bootstrapService';
-import { QueryComponentParams } from 'sql/services/bootstrap/bootstrapParams';
+import { IQueryComponentParams } from 'sql/services/bootstrap/bootstrapParams';
 import { QueryOutputModule } from 'sql/parts/query/views/queryOutput.module';
 import { QUERY_OUTPUT_SELECTOR } from 'sql/parts/query/views/queryOutput.component';
+import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 
 export const RESULTS_GRID_DEFAULTS = {
 	cellPadding: [6, 10, 5],
@@ -99,8 +100,8 @@ export class QueryResultsEditor extends BaseEditor {
 		@ITelemetryService telemetryService: ITelemetryService,
 		@IThemeService themeService: IThemeService,
 		@IQueryModelService private _queryModelService: IQueryModelService,
-		@IBootstrapService private _bootstrapService: IBootstrapService,
+		@IConfigurationService private _configurationService: IConfigurationService,
-		@IConfigurationService private _configurationService: IConfigurationService
+		@IInstantiationService private _instantiationService: IInstantiationService
 	) {
 		super(QueryResultsEditor.ID, telemetryService, themeService);
 		this._rawOptions = BareResultsGridInfo.createFromRawSettings(this._configurationService.getValue('resultsGrid'), getZoomLevel());
@@ -168,8 +169,8 @@ export class QueryResultsEditor extends BaseEditor {
 		// Note: pass in input so on disposal this is cleaned up.
 		// Otherwise many components will be left around and be subscribed
 		// to events from the backing data service
-		let params: QueryComponentParams = { dataService: dataService };
+		let params: IQueryComponentParams = { dataService: dataService };
-		this._bootstrapService.bootstrap(
+		this._instantiationService.invokeFunction(bootstrapAngular,
 			QueryOutputModule,
 			this.getContainer().getHTMLElement(),
 			QUERY_OUTPUT_SELECTOR,

src/sql/parts/query/views/queryOutput.component.html

@@ -22,7 +22,7 @@
 		</ng-template>
 	</tab>
 
-	<tab *ngIf="hasQueryPlan" [visibilityType]="'visibility'" class="fullsize" [title]="topOperationsTitle">
+	<tab *ngIf="hasQueryPlan" [visibilityType]="'visibility'" class="fullsize" [title]="topOperationsTitle" [identifier]="topOperationsTabIdentifier">
 		<ng-template>
 			<div id="topOperationsDiv" class="fullsize">
 				<top-operations-component class="fullsize" style="display: block" [queryParameters]="queryParameters"></top-operations-component>