diff --git a/.travis.yml b/.travis.yml
index 6ced7c80dc..cee138f045 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,10 +1,19 @@
 language: node_js
+dist: trusty
+sudo: false
 node_js:
     - '6.9.4'
+python:
+  - "3.6"
+
+before_install:
+  - python3 --version
 
 install:
   - npm install -g yarn
   - yarn install
+  - python3 --version
+  - pip3 install -r python/requirements.txt
 
 before_script:
   - export DISPLAY=:99.0
@@ -13,6 +22,7 @@ before_script:
 
 script:
     - ./scripts/travis/build-and-test.sh
+    - pylint python/main.py
 
 branches:
   only:
diff --git a/.vscode/launch.json b/.vscode/launch.json
index 7e6aa67d53..af07c791e8 100644
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@@ -5,11 +5,11 @@
       "name": "Launch",
       "type": "node",
       "request": "launch",
-      "program": "${workspaceRoot}/client/main.ts",
+      "program": "${workspaceRoot}/src/client/main.ts",
       "stopOnEntry": false,
       "args": [],
       "cwd": "${workspaceRoot}",
-      "preLaunchTask": "build-node-ts",
+      "preLaunchTask": "build-client",
       "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron",
       "windows": {
         "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron.cmd"
diff --git a/.vscode/settings.json b/.vscode/settings.json
index 52dfcfca77..350e7df15e 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -12,6 +12,9 @@
     "release/**": true,
     "dll/**": true
   },
+  "python.autoComplete.extraPaths": [
+    "${workspaceRoot}/python"
+  ],
   "tslint.jsEnable": true,
   "tslint.autoFixOnSave": true,
   "vsicons.presets.angular": true,
diff --git a/.vscode/tasks.json b/.vscode/tasks.json
index 0f1d008c52..ab51b12e95 100644
--- a/.vscode/tasks.json
+++ b/.vscode/tasks.json
@@ -9,7 +9,7 @@
   ],
   "tasks": [
     {
-      "taskName": "build-node-ts",
+      "taskName": "build-client",
       "args": [],
       "isBuildCommand": true
     },
diff --git a/CHANGELOG.md b/CHANGELOG.md
index bd666aff6a..e7090e07b7 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,19 @@
+# Version 0.5.0(Beta)
+[All items](https://github.com/Azure/BatchLabs/milestone/5?closed=1)
+
+### Features
+* Link Storage account in batch labs [\#385](https://github.com/Azure/BatchLabs/issues/385)
+* New actions buttons [\#408](https://github.com/Azure/BatchLabs/issues/408)
+* Low priority VMs [\#414](https://github.com/Azure/BatchLabs/issues/414)
+* Details now refresh automatically every 10 seconds [\#428](https://github.com/Azure/BatchLabs/issues/428)
+* Show batch account quotas [\#413](https://github.com/Azure/BatchLabs/issues/413)
+* Job show manager task details [\#447](https://github.com/Azure/BatchLabs/issues/447)
+* Preview images(and gif) and code files in labs  [\#417](https://github.com/Azure/BatchLabs/issues/417)
+* Setup python support for ncj [\#439](https://github.com/Azure/BatchLabs/issues/439)
+* Task output quick add otherfiles for debug [\#184](https://github.com/Azure/BatchLabs/issues/184)
+* Job prep/release task status read experience [\#429](https://github.com/Azure/BatchLabs/issues/429)
+* Start task failed show error banner on node details [\#476](https://github.com/Azure/BatchLabs/issues/476)
+
 # Version 0.4.0(Beta)
 [All items](https://github.com/Azure/BatchLabs/milestone/3?closed=1)
 
diff --git a/Readme.md b/Readme.md
index 2edee30dd0..201e6d9183 100644
--- a/Readme.md
+++ b/Readme.md
@@ -3,12 +3,12 @@
 
 **Note: BatchLabs is in beta. We don't provide any installer/packaged binaries as of now. You will need to build this app yourself.**
 
-This is the readme for master branch is contains the latest changes. Stable might be slightly different [Stable readme](https://github.com/Azure/BatchLabs/tree/stable)
+This is the readme for the 'master' branch which contains the latest changes, 'stable' may differ from this [Stable readme](https://github.com/Azure/BatchLabs/tree/stable)
 
 ## Description
 
-Batch Labs is a tool to manage your Azure Batch accounts. The goal is to implement some great user experience that will help you debug, monitor and manage your pools, jobs and tasks.
-It will also include expermiental features such as `No Code Job` in the aim to improve your Batch experience. We are open to any feedback, ideas and contribution you might have.
+Batch Labs is a tool to manage your Azure Batch accounts. The goal is to implement a great user experience that will help you debug, monitor and manage your pools, jobs and tasks.
+It will also include expermiental features such as `Batch Templates` in the aim to improve your Batch experience. We are open to any feedback, ideas and contributions you might have.
 
 ## Getting started
 #### 1. Prerequisites
@@ -24,7 +24,7 @@ Move to the directory `cd BatchLabs`
 ```bash
 yarn install
 ```
-Note: You can also use `npm install` at your own risk. However please do not submit an issue if you didn't use `yarn install`. Yarn will make sure you have the exact same set of dependencies as everybody which remove any unexpected third party bugs problems.
+Note: You can also use `npm install` at your own risk. However please do not submit an issue if you didn't use `yarn install`. Yarn will make sure you have the right set of dependencies, which reduces the likelihood of any unexpected build issues relating to third party packages.
 
 #### 4. Build and run the application
 ```bash
@@ -44,7 +44,7 @@ npm run electron
 [Dev docs](docs/readme.md)
 
 For developers, you can set up a development environment as follows:
-**Use `yarn install` instead of `npm install` this will makes sure everybody has the same exact set of depenencies [Migrating from npm to yarn](https://yarnpkg.com/lang/en/docs/migrating-from-npm/)**
+**Use `yarn install` instead of `npm install`. This ensures a consistent build environment with the right set of dependencies [Migrating from npm to yarn](https://yarnpkg.com/lang/en/docs/migrating-from-npm/)**
 
 Start the dev server
 ```bash
@@ -61,7 +61,7 @@ npm run dev-electron
 
 The dev-server and dev-electron support hot reload for a better development experience. Simply saving a file will cause the UI to refresh to your updated changes.
 
-*Note:* Changes to any files in the node client directory ('\client\') require restarting the application.
+*Note:* Changes to any files in the node client directory ('src/client') require restarting the application.
 
 If you're using VSCode (recommended) we suggest you use the following extensions:
 * Debugger for Chrome
@@ -79,7 +79,7 @@ Please also take a look at the [coding guidelines](coding-guidelines.md) for thi
 In vscode install the editorconfig extension
 
 ## Detailed commands:
-**Magic command(Starts the server and electron in dev mode)**
+**Magic command (starts the server and electron in dev mode)**
 ```
 npm run dev
 ```
@@ -94,17 +94,17 @@ Run app
 npm run electron
 ```
 
-Run watch(This will build files on save)
+Run watch (this will build files on save)
 ```
 npm run watch
 ```
 
-Run dev server(This will handle the refresh of files and later should have live reloead)
+Run dev server (this will handle the refresh of files and later should have live reload)
 ```
 npm run dev-server
 ```
 
-Run dev electron(To use the dev server you need to run this)
+Run dev electron (to use the dev server you need to run this)
 ```
 npm run dev-electron
 ```
diff --git a/app/app.component.ts b/app/app.component.ts
index 0dfd14a2f2..573a8a0529 100644
--- a/app/app.component.ts
+++ b/app/app.component.ts
@@ -7,7 +7,8 @@ import { DomSanitizer } from "@angular/platform-browser";
 import { registerIcons } from "app/config";
 import {
     AccountService, AdalService, AutoscaleFormulaService, CommandService, NodeService,
-    PredefinedFormulaService, SSHKeyService, SettingsService, SubscriptionService, VmSizeService,
+    PredefinedFormulaService, PricingService, PythonRpcService, SSHKeyService, SettingsService, SubscriptionService,
+    VmSizeService,
 } from "app/services";
 import { SidebarContentComponent, SidebarManager } from "./components/base/sidebar";
 
@@ -44,17 +45,21 @@ export class AppComponent implements AfterViewInit, OnInit {
         private subscriptionService: SubscriptionService,
         private nodeService: NodeService,
         private sshKeyService: SSHKeyService,
+        pythonRpcService: PythonRpcService,
         private vmSizeService: VmSizeService,
-        private predefinedFormulaService: PredefinedFormulaService) {
+        private pricingService: PricingService,
+        private predefinedFormulaService: PredefinedFormulaService,
+        ) {
         this.autoscaleFormulaService.init();
         this.settingsService.init();
         this.sshKeyService.init();
         this.commandService.init();
-        // Init the pricing when good to go.
-        // this.pricingService.init();
+        this.pricingService.init();
         this.vmSizeService.init();
         this.adalService.init(adalConfig);
         this.accountService.loadInitialData();
+        pythonRpcService.init();
+
         this.predefinedFormulaService.init();
         this.hasAccount = accountService.currentAccount.map((x) => Boolean(x));
 
diff --git a/app/app.module.ts b/app/app.module.ts
index 7e70fd00a9..04cbd96092 100644
--- a/app/app.module.ts
+++ b/app/app.module.ts
@@ -28,6 +28,8 @@ import { TaskModule } from "app/components/task/task.module";
 import { BatchLabsErrorHandler } from "app/error-handler";
 
 // services
+import { HttpModule } from "@angular/http";
+import { PollService } from "app/services/core";
 import {
     AccountService,
     AdalService,
@@ -37,12 +39,14 @@ import {
     AzureHttpService,
     BatchClientService,
     CommandService,
+    ComputeService,
     ElectronRemote,
     ElectronShell,
     FileService,
     FileSystemService,
     GithubDataService,
     HttpUploadService,
+    JobHookTaskService,
     JobService,
     LocalFileStorage,
     NodeService,
@@ -50,8 +54,10 @@ import {
     PoolService,
     PredefinedFormulaService,
     PricingService,
+    PythonRpcService,
     SSHKeyService,
     SettingsService,
+    StorageAccountService,
     StorageClientService,
     StorageService,
     SubscriptionService,
@@ -82,6 +88,7 @@ const modules = [
         FormsModule,
         MaterialModule,
         ReactiveFormsModule,
+        HttpModule,
         RouterModule.forRoot(routes, { useHash: true }),
         BaseModule,
         ...modules,
@@ -96,19 +103,24 @@ const modules = [
         ArmHttpService,
         BatchClientService,
         CommandService,
+        ComputeService,
         ElectronRemote,
         ElectronShell,
         FileService,
         FileSystemService,
         GithubDataService,
         HttpUploadService,
+        JobHookTaskService,
         JobService,
         LocalFileStorage,
         NodeService,
         NodeUserService,
+        PollService,
         PoolService,
         PricingService,
+        PythonRpcService,
         SettingsService,
+        StorageAccountService,
         StorageClientService,
         StorageService,
         SSHKeyService,
diff --git a/app/app.ts b/app/app.ts
index 5d02e0ffae..5e8ddefccb 100644
--- a/app/app.ts
+++ b/app/app.ts
@@ -1,5 +1,6 @@
 import { platformBrowserDynamic } from "@angular/platform-browser-dynamic";
 import { remote } from "electron";
+import * as MouseTrap from "mousetrap";
 
 import { log } from "app/utils";
 import { AppModule } from "./app.module";
@@ -25,3 +26,11 @@ platform.bootstrapModule(AppModule)
         log.error("Bootstrapping failed :: ", error);
         handleCoreError(error);
     });
+
+MouseTrap.bind("ctrl+shift+i", () => {
+    if (remote.getCurrentWindow().webContents.isDevToolsOpened()) {
+        remote.getCurrentWindow().webContents.closeDevTools();
+    } else {
+        remote.getCurrentWindow().webContents.openDevTools();
+    }
+});
diff --git a/app/components/account/account.module.ts b/app/components/account/account.module.ts
index b0a557e9ec..b189c63363 100644
--- a/app/components/account/account.module.ts
+++ b/app/components/account/account.module.ts
@@ -1,16 +1,21 @@
 import { NgModule } from "@angular/core";
 
 import { commonModules } from "app/common";
-import { AccountCreateDialogComponent } from "app/components/account/action/add/account-create-dialog.component";
-import { DeleteAccountDialogComponent } from "app/components/account/action/delete/delete-account-dialog.component";
-import { AccountBrowseModule } from "app/components/account/browse";
-import { AccountDefaultComponent, AccountDetailsComponent } from "app/components/account/details";
-import { AccountHomeComponent } from "app/components/account/home";
+import { EditStorageAccountFormComponent } from "app/components/account/action/edit-storage-account";
+import { StorageAccountPickerComponent } from "app/components/account/base/storage-account-picker";
 import { PoolDetailsModule } from "app/components/pool/details";
+import { AccountCreateDialogComponent } from "./action/add/account-create-dialog.component";
+import { DeleteAccountDialogComponent } from "./action/delete/delete-account-dialog.component";
+import { AccountBrowseModule } from "./browse";
+import { AccountDefaultComponent, AccountDetailsComponent } from "./details";
+import { AccountQuotasCardComponent } from "./details/account-quotas-card";
+import { StorageAccountCardComponent } from "./details/storage-account-card";
+import { AccountHomeComponent } from "./home";
 
 const components = [
     AccountCreateDialogComponent, AccountDefaultComponent, AccountDetailsComponent,
-    AccountHomeComponent, DeleteAccountDialogComponent,
+    AccountHomeComponent, DeleteAccountDialogComponent, StorageAccountCardComponent,
+    EditStorageAccountFormComponent, StorageAccountPickerComponent, AccountQuotasCardComponent,
 ];
 
 const modules = [
@@ -24,6 +29,7 @@ const modules = [
     entryComponents: [
         AccountCreateDialogComponent,
         DeleteAccountDialogComponent,
+        EditStorageAccountFormComponent,
     ],
 })
 export class AccountModule {
diff --git a/app/components/account/action/edit-storage-account/edit-storage-account-form.component.ts b/app/components/account/action/edit-storage-account/edit-storage-account-form.component.ts
new file mode 100644
index 0000000000..263508e25e
--- /dev/null
+++ b/app/components/account/action/edit-storage-account/edit-storage-account-form.component.ts
@@ -0,0 +1,45 @@
+import { Component } from "@angular/core";
+import { FormControl } from "@angular/forms";
+import { autobind } from "core-decorators";
+import { Observable } from "rxjs";
+
+import { SidebarRef } from "app/components/base/sidebar";
+import { AccountResource } from "app/models";
+import { AccountPatchDto } from "app/models/dtos";
+import { AccountService } from "app/services";
+
+import "./edit-storage-account-form.scss";
+
+@Component({
+    selector: "bl-edit-storage-account-form",
+    templateUrl: "edit-storage-account-form.html",
+})
+export class EditStorageAccountFormComponent {
+    public set account(account: AccountResource) {
+        this._account = account;
+        if (account) {
+            const props = account.properties;
+            this.storageAccountId.patchValue(props.autoStorage && props.autoStorage.storageAccountId);
+        }
+    }
+    public get account() { return this._account; }
+
+    public storageAccountId = new FormControl();
+
+    private _account: AccountResource;
+
+    constructor(
+        private accountService: AccountService,
+        public sidebarRef: SidebarRef<EditStorageAccountFormComponent>,
+    ) { }
+
+    @autobind()
+    public submit(): Observable<any> {
+        const dto = new AccountPatchDto({ autoStorage: { storageAccountId: this.storageAccountId.value } });
+        const obs = this.accountService.patch(this.account.id, dto);
+        obs.subscribe(() => {
+            this.accountService.getOnce(this.account.id);
+        });
+        return obs;
+    }
+}
diff --git a/app/components/account/action/edit-storage-account/edit-storage-account-form.html b/app/components/account/action/edit-storage-account/edit-storage-account-form.html
new file mode 100644
index 0000000000..c16050b462
--- /dev/null
+++ b/app/components/account/action/edit-storage-account/edit-storage-account-form.html
@@ -0,0 +1,6 @@
+<bl-simple-form [submit]="submit" [containerRef]="sidebarRef" [formGroup]="storageAccountId" [multiUse]="false" title="Update the storage account"
+    cancelText="Close" subtitle="Pick a storage account that will be assigned with this batch account.">
+    <form *ngIf="account">
+        <bl-storage-account-picker [formControl]="storageAccountId" [account]="account"></bl-storage-account-picker>
+    </form>
+</bl-simple-form>
diff --git a/app/components/account/action/edit-storage-account/edit-storage-account-form.scss b/app/components/account/action/edit-storage-account/edit-storage-account-form.scss
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/app/components/account/action/edit-storage-account/index.ts b/app/components/account/action/edit-storage-account/index.ts
new file mode 100644
index 0000000000..c48bfb5816
--- /dev/null
+++ b/app/components/account/action/edit-storage-account/index.ts
@@ -0,0 +1 @@
+export * from "./edit-storage-account-form.component";
diff --git a/app/components/account/base/storage-account-picker/index.ts b/app/components/account/base/storage-account-picker/index.ts
new file mode 100644
index 0000000000..93d03a0f03
--- /dev/null
+++ b/app/components/account/base/storage-account-picker/index.ts
@@ -0,0 +1 @@
+export * from "./storage-account-picker.component";
diff --git a/app/components/account/base/storage-account-picker/storage-account-picker.component.ts b/app/components/account/base/storage-account-picker/storage-account-picker.component.ts
new file mode 100644
index 0000000000..aa3230268d
--- /dev/null
+++ b/app/components/account/base/storage-account-picker/storage-account-picker.component.ts
@@ -0,0 +1,94 @@
+import { Component, Input, OnInit, forwardRef } from "@angular/core";
+import { ControlValueAccessor, FormControl, NG_VALIDATORS, NG_VALUE_ACCESSOR } from "@angular/forms";
+import { List } from "immutable";
+
+import { LoadingStatus } from "app/components/base/loading";
+import { AccountResource, StorageAccount } from "app/models";
+import { StorageAccountService } from "app/services";
+
+import "./storage-account-picker.scss";
+
+@Component({
+    selector: "bl-storage-account-picker",
+    templateUrl: "storage-account-picker.html",
+    providers: [
+        // tslint:disable:no-forward-ref
+        { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => StorageAccountPickerComponent), multi: true },
+        { provide: NG_VALIDATORS, useExisting: forwardRef(() => StorageAccountPickerComponent), multi: true },
+    ],
+})
+export class StorageAccountPickerComponent implements OnInit, ControlValueAccessor {
+    public noSelectionKey = "-1";
+
+    @Input()
+    public account: AccountResource;
+
+    public preferedAccounts: List<StorageAccount> = List([]);
+    public otherAccounts: List<StorageAccount> = List([]);
+    public loadingStatus = LoadingStatus.Loading;
+    public pickedStorageAccountId: string;
+    public pickedName: string;
+
+    private _propagateChange: (value: string) => void;
+    constructor(private storageAccountService: StorageAccountService) {
+
+    }
+
+    public ngOnInit() {
+        this.storageAccountService.list(this.account.subscription.subscriptionId).subscribe((storageAccounts) => {
+            this._processStorageAccounts(storageAccounts);
+            this.loadingStatus = LoadingStatus.Ready;
+        });
+    }
+
+    public writeValue(value: string) {
+        this.pickedStorageAccountId = value || this.noSelectionKey;
+
+    }
+
+    public registerOnChange(fn) {
+        this._propagateChange = fn;
+    }
+
+    public registerOnTouched() {
+        // Do nothing
+    }
+
+    public validate(c: FormControl) {
+        return null;
+    }
+
+    public pickStorageAccount(storageAccountId: string) {
+        const same = this.pickedStorageAccountId === storageAccountId;
+        this.pickedStorageAccountId = storageAccountId;
+        if (this._propagateChange && storageAccountId && !same) {
+            if (storageAccountId === this.noSelectionKey) {
+                this._propagateChange(null);
+            } else {
+                this._propagateChange(storageAccountId);
+            }
+        }
+    }
+
+    public clearSelection() {
+        this.pickedStorageAccountId = null;
+        if (this._propagateChange) {
+            this._propagateChange(null);
+        }
+    }
+
+    private _processStorageAccounts(storageAccounts: List<StorageAccount>) {
+        const prefered = [];
+        const others = [];
+        storageAccounts.forEach((account) => {
+            if (account.location.toLowerCase() === this.account.location.toLowerCase()) {
+                prefered.push(account);
+            } else {
+                others.push(account);
+            }
+        });
+
+        this.preferedAccounts = List(prefered);
+        this.otherAccounts = List(others);
+    }
+}
diff --git a/app/components/account/base/storage-account-picker/storage-account-picker.html b/app/components/account/base/storage-account-picker/storage-account-picker.html
new file mode 100644
index 0000000000..a5238c2393
--- /dev/null
+++ b/app/components/account/base/storage-account-picker/storage-account-picker.html
@@ -0,0 +1,43 @@
+<bl-loading [status]="loadingStatus">
+    <div *ngIf="loadingStatus">
+        <h3>Storage accounts in the same region as your batch account({{account.location}})</h3>
+        <bl-table *ngIf="preferedAccounts.size > 0" [activeItem]="pickedStorageAccountId.toLowerCase()" (activeItemChange)="pickStorageAccount($event)"
+            class="prefered">
+            <bl-thead>
+                <bl-column [sortable]="true">Name</bl-column>
+                <bl-column [sortable]="true">Region</bl-column>
+                <bl-column [sortable]="false"></bl-column>
+            </bl-thead>
+            <bl-row [key]="noSelectionKey">
+                <bl-cell>No storage account</bl-cell>
+                <bl-cell></bl-cell>
+                <bl-cell></bl-cell>
+            </bl-row>
+            <bl-row *ngFor="let account of preferedAccounts" [key]="account.id.toLowerCase()">
+                <bl-cell [value]="account.name"></bl-cell>
+                <bl-cell [value]="account.location"></bl-cell>
+                <bl-cell [value]="account.isClassic">{{account.isClassic ? "Classic" : ""}}</bl-cell>
+            </bl-row>
+        </bl-table>
+        <div *ngIf="preferedAccounts.size === 0" class="no-prefered-account">
+            You have no accounts in the same region!
+        </div>
+
+        <div *ngIf="otherAccounts.size > 0">
+            <h3>Other regions</h3>
+            <bl-table [activeItem]="pickedStorageAccountId.toLowerCase()" (activeItemChange)="pickStorageAccount($event)" class="others">
+                <bl-thead>
+                    <bl-column [sortable]="true">Name</bl-column>
+                    <bl-column [sortable]="true">Region</bl-column>
+                    <bl-column [sortable]="false"></bl-column>
+
+                </bl-thead>
+                <bl-row *ngFor="let account of otherAccounts" [key]="account.id.toLowerCase()">
+                    <bl-cell [value]="account.name"></bl-cell>
+                    <bl-cell [value]="account.location"></bl-cell>
+                    <bl-cell [value]="account.isClassic">{{account.isClassic ? "Classic" : ""}}</bl-cell>
+                </bl-row>
+            </bl-table>
+        </div>
+    </div>
+</bl-loading>
diff --git a/app/components/account/base/storage-account-picker/storage-account-picker.scss b/app/components/account/base/storage-account-picker/storage-account-picker.scss
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/app/components/account/browse/account-dropdown.component.ts b/app/components/account/browse/account-dropdown.component.ts
index 057fd7bb56..0af1ee6df0 100644
--- a/app/components/account/browse/account-dropdown.component.ts
+++ b/app/components/account/browse/account-dropdown.component.ts
@@ -1,7 +1,7 @@
 import { AfterViewInit, ChangeDetectorRef, Component } from "@angular/core";
-import { Router } from "@angular/router";
 import { AccountResource } from "app/models";
 import { AccountService, AccountStatus } from "app/services";
+import { ArmResourceUtils } from "app/utils";
 
 @Component({
     selector: "bl-account-dropdown",
@@ -17,15 +17,12 @@ export class AccountDropDownComponent implements AfterViewInit {
 
     constructor(
         private accountService: AccountService,
-        private changeDetection: ChangeDetectorRef,
-        router: Router) {
+        private changeDetection: ChangeDetectorRef) {
 
         accountService.currentAccountId.subscribe((accountId) => {
             if (accountId) {
                 this.selectedId = accountId;
-                this.selectedAccountAlias = accountService.getNameFromAccountId(accountId);
-                // this.router.navigate(["/accounts", this.selectedId]);
-
+                this.selectedAccountAlias = ArmResourceUtils.getAccountNameFromResourceId(accountId);
             } else {
                 this.selectedAccountAlias = "No account selected!";
             }
diff --git a/app/components/account/browse/account-dropdown.html b/app/components/account/browse/account-dropdown.html
index 314294380f..f372876c58 100644
--- a/app/components/account/browse/account-dropdown.html
+++ b/app/components/account/browse/account-dropdown.html
@@ -8,7 +8,7 @@
     </div>
     <div bl-dropdown-content>
         <div *ngFor="let account of accountService.accountFavorites | async" class="dropdown-item" [routerLink]="['/accounts', account.id]"
-            (click)="selectAccount(account)" [class.selected]="account.id === selectedId">
+            (click)="selectAccount(account)" [class.selected]="account.id === selectedId" [title]="account.id">
             <div class="main">
                 <div class="alias">{{account.name}}</div>
                 <div class="url">{{account.properties.accountEndpoint}}</div>
diff --git a/app/components/account/details/account-default.component.ts b/app/components/account/details/account-default.component.ts
index 17c54cd968..316deefadd 100644
--- a/app/components/account/details/account-default.component.ts
+++ b/app/components/account/details/account-default.component.ts
@@ -1,4 +1,7 @@
-import { Component } from "@angular/core";
+import { Component, OnDestroy, OnInit } from "@angular/core";
+import { Router } from "@angular/router";
+import { AccountService } from "app/services";
+import { Subscription } from "rxjs";
 
 @Component({
     selector: "bl-account-details-home",
@@ -10,8 +13,29 @@ import { Component } from "@angular/core";
     `,
 })
 
-export class AccountDefaultComponent {
+export class AccountDefaultComponent implements OnInit, OnDestroy {
     public static breadcrumb() {
         return { name: "Accounts" };
     }
+
+    private accountChangeSubscription: Subscription;
+
+    constructor(
+        private accountService: AccountService,
+        private router: Router) {
+    }
+
+    public ngOnInit(): void {
+        // Subscribe to the current account id. If it has been set elsewhere (e.g. the top nav)
+        // then navigate the component to that account
+        this.accountChangeSubscription = this.accountService.currentAccountId.subscribe((accountId) => {
+            if (accountId) {
+                this.router.navigate(["/accounts", accountId]);
+            }
+        });
+    }
+
+    public ngOnDestroy(): void {
+        this.accountChangeSubscription.unsubscribe();
+    }
 }
diff --git a/app/components/account/details/account-details.component.ts b/app/components/account/details/account-details.component.ts
index 319ecadad9..c2a6e0e52b 100644
--- a/app/components/account/details/account-details.component.ts
+++ b/app/components/account/details/account-details.component.ts
@@ -4,10 +4,12 @@ import { autobind } from "core-decorators";
 import { Subscription } from "rxjs";
 
 import { AccountResource, Application, Job, Pool, ServerError } from "app/models";
-import { AccountService, ApplicationService, JobService, PoolService } from "app/services";
-import { RxListProxy } from "app/services/core";
+import { AccountParams, AccountService, ApplicationService, JobService, PoolService } from "app/services";
+import { RxEntityProxy, RxListProxy } from "app/services/core";
 import { Constants } from "app/utils";
 
+import "./account-details.scss";
+
 @Component({
     selector: "bl-account-details",
     templateUrl: "account-details.html",
@@ -19,16 +21,16 @@ export class AccountDetailsComponent implements OnInit, OnDestroy {
             const split = id.split("/");
             name = split[split.length - 1];
         }
-
         return { name: name, label: "Account" };
     }
 
     public account: AccountResource;
     public accountId: string;
-    public loading: boolean = true;
     public loadingError: any;
     public noLinkedStorage: boolean = false;
 
+    public data: RxEntityProxy<AccountParams, AccountResource>;
+
     public applicationData: RxListProxy<{}, Application>;
     public jobData: RxListProxy<{}, Job>;
     public poolData: RxListProxy<{}, Pool>;
@@ -45,34 +47,21 @@ export class AccountDetailsComponent implements OnInit, OnDestroy {
         private poolService: PoolService,
         zone: NgZone,
         viewContainerRef: ViewContainerRef) {
+        this.data = this.accountService.get(null);
+        this.data.item.subscribe((account) => {
+            this.account = account;
+            if (account) {
+                this._loadQuickAccessLists();
+            }
+        });
     }
 
     public ngOnInit() {
         this._paramsSubscriber = this.activatedRoute.params.subscribe(params => {
             this.accountId = params["id"];
             this.selectAccount(this.accountId);
-            this.loading = true;
-            this.accountService.getAccount(this.accountId).subscribe({
-                next: (x) => {
-                    this.account = x;
-                    this.loading = false;
-                    this.applicationData = this.applicationService.list(this.initialOptions, (error: ServerError) => {
-                        let handled = false;
-                        if (error && error.body.code === Constants.APIErrorCodes.accountNotEnabledForAutoStorage) {
-                            this.noLinkedStorage = true;
-                            handled = true;
-                        }
-
-                        return !handled;
-                    });
-                    this.applicationData.fetchNext();
-
-                    this.jobData = this.jobService.list(this.initialOptions);
-                    this.jobData.fetchNext();
-
-                    this.poolData = this.poolService.list(this.initialOptions);
-                    this.poolData.fetchNext();
-                },
+            this.data.params = { id: this.accountId };
+            this.data.fetch().subscribe({
                 error: (error) => {
                     this.loadingError = error;
                 },
@@ -86,11 +75,40 @@ export class AccountDetailsComponent implements OnInit, OnDestroy {
 
     @autobind()
     public refresh() {
-        return this.accountService.refresh();
+        return this.data.refresh();
     }
 
     public selectAccount(accountId: string): void {
         this.noLinkedStorage = false;
         this.accountService.selectAccount(accountId);
     }
+
+    private _loadQuickAccessLists() {
+        this.applicationData = this.applicationService.list(this.initialOptions, (error: ServerError) => {
+            let handled = false;
+            if (this._isAutoStorageError(error)) {
+                this.noLinkedStorage = true;
+                handled = true;
+            }
+
+            return !handled;
+        });
+        this.applicationData.fetchNext();
+
+        this.jobData = this.jobService.list(this.initialOptions);
+        this.jobData.fetchNext();
+
+        this.poolData = this.poolService.list(this.initialOptions);
+        this.poolData.fetchNext();
+    }
+
+    /**
+     * There is a difference in the error response body between classic and standard storage API's
+     * @param error - error JSON object
+     */
+    private _isAutoStorageError(error: any): boolean {
+        return error &&
+            (error.body.code === Constants.APIErrorCodes.accountNotEnabledForAutoStorage ||
+            (error.body.error && error.body.error.code === Constants.APIErrorCodes.accountNotEnabledForAutoStorage));
+    }
 }
diff --git a/app/components/account/details/account-details.html b/app/components/account/details/account-details.html
index b71becc81e..4e06075f24 100644
--- a/app/components/account/details/account-details.html
+++ b/app/components/account/details/account-details.html
@@ -1,38 +1,43 @@
-<bl-loading [status]="loading">
+<bl-loading [status]="data.status">
     <div *ngIf="account">
         <md-card class="overview">
-            <md-card-title-group style="margin: 0px;">
-                <div style="align-items:center;">
+            <div class="actions">
+                <bl-action-btn-group>
                     <bl-refresh-btn [refresh]="refresh"></bl-refresh-btn>
-                </div>
-                <div style="margin-left:12px; margin-right:auto;">
-                    <md-card-title>{{account.name}}</md-card-title>
-                    <md-card-subtitle><i class="fa fa-link"></i> {{account.properties.accountEndpoint}}</md-card-subtitle>
-                </div>
-            </md-card-title-group>
-            <md-card-content>
-            </md-card-content>
-            <md-card-actions layout="row" layout-align="end center">
-            </md-card-actions>
+                </bl-action-btn-group>
+            </div>
+            <div class="content">
+                <md-card-title>{{account.name}}</md-card-title>
+                <md-card-subtitle>{{account.properties.accountEndpoint}}</md-card-subtitle>
+            </div>
+            <div class="tile">
+                <bl-account-quotas-card [account]="account"></bl-account-quotas-card>
+            </div>
+            <div class="tile">
+                <bl-storage-account-card [account]="account">
+                </bl-storage-account-card>
+            </div>
         </md-card>
-
         <div class="account-cards">
             <md-card class="account-card">
                 <md-card-header>
-                    <md-card-title><h2>Job status</h2></md-card-title>
+                    <md-card-title>
+                        <h2>Job status</h2>
+                    </md-card-title>
                 </md-card-header>
                 <md-card-content class="account-card-content">
                     <div>
                         <bl-loading [status]="jobData.status | async">
                             <bl-no-item [itemCount]="(jobData.items | async).size" [status]="jobData.status | async">
                                 <p description>
-                                    There are no jobs in the account. Click <a href="#" routerLink="/jobs">here</a> to add one.
+                                    There are no jobs in the account. Click <a href="#" routerLink="/jobs">here</a> to add
+                                    one.
                                 </p>
                             </bl-no-item>
                             <bl-table class="dashboard">
                                 <bl-row *ngFor="let job of (jobData.items | async)" [link]="['/jobs/', job.id]" [key]="job.id">
-                                    <bl-cell style="width:77%" [value]="job.id"></bl-cell>
-                                    <bl-cell style="text-align:right; color:steelblue;width:21%" [value]="job.state"></bl-cell>
+                                    <bl-cell [value]="job.id"></bl-cell>
+                                    <bl-cell style="text-align:right; color:steelblue;width:75px" [value]="job.state"></bl-cell>
                                 </bl-row>
                             </bl-table>
                         </bl-loading>
@@ -45,21 +50,24 @@
 
             <md-card class="account-card" routerLink="/pools" (click)="selectAccount(account.id)">
                 <md-card-header>
-                    <md-card-title><h2>Pool status</h2></md-card-title>
+                    <md-card-title>
+                        <h2>Pool status</h2>
+                    </md-card-title>
                 </md-card-header>
                 <md-card-content class="account-card-content">
                     <div>
                         <bl-loading [status]="poolData.status | async">
                             <bl-no-item [itemCount]="(poolData.items | async).size" [status]="poolData.status | async">
                                 <p description>
-                                    There are no pools in the account. Click <a href="#" routerLink="/pools">here</a> to add one.
+                                    There are no pools in the account. Click <a href="#" routerLink="/pools">here</a> to
+                                    add one.
                                 </p>
                             </bl-no-item>
                             <bl-table class="dashboard">
                                 <bl-row *ngFor="let pool of (poolData.items | async)" [link]="['/pools/', pool.id]" [key]="pool.id">
-                                    <bl-cell style="width:68%;" [value]="pool.id"></bl-cell>
-                                    <bl-cell style="width:10%;"><i aria-hidden="true" class="fa fa-{{pool.osIconName()}}"></i></bl-cell>
-                                    <bl-cell style="text-align: right; width:19%;">
+                                    <bl-cell [value]="pool.id"></bl-cell>
+                                    <bl-cell style="width: 20px"><i aria-hidden="true" class="fa fa-{{pool.osIconName()}}"></i></bl-cell>
+                                    <bl-cell style="text-align: right; width: 60px">
                                         <bl-pool-nodes-preview [pool]="pool"></bl-pool-nodes-preview>
                                     </bl-cell>
                                 </bl-row>
@@ -74,7 +82,9 @@
 
             <md-card class="account-card" routerLink="/applications" (click)="selectAccount(account.id)">
                 <md-card-header>
-                    <md-card-title><h2>App packages</h2></md-card-title>
+                    <md-card-title>
+                        <h2>App packages</h2>
+                    </md-card-title>
                 </md-card-header>
                 <md-card-content class="account-card-content">
                     <bl-banner *ngIf="noLinkedStorage" height="expand" type="notice">
@@ -84,7 +94,8 @@
                         <bl-loading [status]="applicationData.status | async">
                             <bl-no-item [itemCount]="(applicationData.items | async).size" [status]="applicationData.status | async">
                                 <p description>
-                                    There are no application packages in the account. Click <a href="#" routerLink="/applications">here</a> to add one.
+                                    There are no application packages in the account. Click <a href="#" routerLink="/applications">here</a> to
+                                    add one.
                                 </p>
                             </bl-no-item>
                             <bl-table class="dashboard">
diff --git a/app/styles/account/details.scss b/app/components/account/details/account-details.scss
similarity index 76%
rename from app/styles/account/details.scss
rename to app/components/account/details/account-details.scss
index a8dfa80d27..bf8b11850a 100644
--- a/app/styles/account/details.scss
+++ b/app/components/account/details/account-details.scss
@@ -1,3 +1,5 @@
+@import "app/styles/variables";
+
 bl-account-details {
     .account-cards {
         margin: 0 auto;
@@ -12,10 +14,17 @@ bl-account-details {
             text-align: justify;
             margin-top: 8px;
             margin-right: 4px;
+            padding: 12px;
 
             .account-card-content {
                 height: 300px;
             }
         }
     }
+
+    bl-table.dashboard {
+        bl-cell {
+            padding: 0 5px;
+        }
+    }
 }
diff --git a/app/components/account/details/account-quotas-card/account-quotas-card.component.ts b/app/components/account/details/account-quotas-card/account-quotas-card.component.ts
new file mode 100644
index 0000000000..39104103e3
--- /dev/null
+++ b/app/components/account/details/account-quotas-card/account-quotas-card.component.ts
@@ -0,0 +1,33 @@
+import { Component, Input, OnInit } from "@angular/core";
+
+import { AccountResource } from "app/models";
+import { ComputeService } from "app/services";
+
+import "./account-quotas-card.scss";
+
+@Component({
+    selector: "bl-account-quotas-card",
+    templateUrl: "account-quotas-card.html",
+})
+export class AccountQuotasCardComponent implements OnInit {
+    @Input()
+    public account: AccountResource;
+
+    public dedicatedCoreQuota: string;
+    public lowPriorityCoreQuota: string;
+
+    constructor(private computeService: ComputeService) { }
+
+    public ngOnInit() {
+        if (this.account.isBatchManaged) {
+            this.dedicatedCoreQuota = this.account.properties.dedicatedCoreQuota.toString();
+            this.lowPriorityCoreQuota = this.account.properties.lowPriorityCoreQuota.toString();
+        } else {
+            this.dedicatedCoreQuota = "Loading. ";
+            this.lowPriorityCoreQuota = "N/A";
+            this.computeService.getCoreQuota().subscribe((dedicatedCoreQuota) => {
+                this.dedicatedCoreQuota = dedicatedCoreQuota.toString();
+            });
+        }
+    }
+}
diff --git a/app/components/account/details/account-quotas-card/account-quotas-card.html b/app/components/account/details/account-quotas-card/account-quotas-card.html
new file mode 100644
index 0000000000..51a1dd8d41
--- /dev/null
+++ b/app/components/account/details/account-quotas-card/account-quotas-card.html
@@ -0,0 +1,20 @@
+<div>
+    <div class="quota">
+        <div class="label">Pool quota</div>
+        <div class="value">{{account.properties.poolQuota}}</div>
+    </div>
+    <div class="quota">
+        <div class="label">Job quota</div>
+        <div class="value">{{account.properties.activeJobAndJobScheduleQuota}}</div>
+    </div>
+</div>
+<div>
+    <div class="quota">
+        <div class="label">Dedicated core quota</div>
+        <div class="value">{{dedicatedCoreQuota}}</div>
+    </div>
+    <div class="quota" title="Low priority VMs only works with pools allocated with the Batch Service">
+        <div class="label">Low-pri core quota</div>
+        <div class="value">{{lowPriorityCoreQuota}}</div>
+    </div>
+</div>
diff --git a/app/components/account/details/account-quotas-card/account-quotas-card.scss b/app/components/account/details/account-quotas-card/account-quotas-card.scss
new file mode 100644
index 0000000000..9989cd34d8
--- /dev/null
+++ b/app/components/account/details/account-quotas-card/account-quotas-card.scss
@@ -0,0 +1,31 @@
+@import "app/styles/variables";
+
+bl-account-quotas-card {
+    > div {
+        height: 50%;
+        &:not(:last-child) {
+            border-bottom: 1px solid $border-color;
+        }
+    }
+    .quota {
+        display: inline-block;
+        width: 120px;
+        height: 100%;
+        padding: 3px 5px 0;
+
+        > .label {
+            font-size: 11px;
+            color: $dusty-grey;
+        }
+
+        > .value {
+            font-size: 20px;
+            text-align: center;
+            color: map-get($primary, 500);
+        }
+
+        &:not(:last-child) {
+            border-right: 1px solid $border-color;
+        }
+    }
+}
diff --git a/app/components/account/details/account-quotas-card/index.ts b/app/components/account/details/account-quotas-card/index.ts
new file mode 100644
index 0000000000..70b9729055
--- /dev/null
+++ b/app/components/account/details/account-quotas-card/index.ts
@@ -0,0 +1 @@
+export * from "./account-quotas-card.component";
diff --git a/app/components/account/details/index.ts b/app/components/account/details/index.ts
index e61034ada8..b2c70ca8f0 100644
--- a/app/components/account/details/index.ts
+++ b/app/components/account/details/index.ts
@@ -1,2 +1,3 @@
 export * from "./account-default.component";
 export * from "./account-details.component";
+export * from "./storage-account-card";
diff --git a/app/components/account/details/storage-account-card/index.ts b/app/components/account/details/storage-account-card/index.ts
new file mode 100644
index 0000000000..78e4f79046
--- /dev/null
+++ b/app/components/account/details/storage-account-card/index.ts
@@ -0,0 +1 @@
+export * from "./storage-account-card.component";
diff --git a/app/components/account/details/storage-account-card/storage-account-card.component.ts b/app/components/account/details/storage-account-card/storage-account-card.component.ts
new file mode 100644
index 0000000000..39c8175c69
--- /dev/null
+++ b/app/components/account/details/storage-account-card/storage-account-card.component.ts
@@ -0,0 +1,55 @@
+import { Component, Input, OnChanges } from "@angular/core";
+
+import { EditStorageAccountFormComponent } from "app/components/account/action/edit-storage-account";
+import { SidebarManager } from "app/components/base/sidebar";
+import { AccountResource, ServerError, StorageAccount } from "app/models";
+import { StorageAccountService } from "app/services";
+
+import "./storage-account-card.scss";
+
+@Component({
+    selector: "bl-storage-account-card",
+    templateUrl: "storage-account-card.html",
+})
+export class StorageAccountCardComponent implements OnChanges {
+    @Input()
+    public account: AccountResource;
+    public storageAccountId: string;
+
+    public error: ServerError;
+    public storageAccount: StorageAccount;
+
+    constructor(
+        private sidebarManager: SidebarManager,
+        private storageAccountService: StorageAccountService) {
+    }
+
+    public ngOnChanges(changes) {
+        if (changes.account) {
+            const props = this.account.properties;
+            this.storageAccountId = props.autoStorage && props.autoStorage.storageAccountId;
+            this.storageAccount = null;
+            this._loadStorageAccount();
+        }
+    }
+
+    public edit() {
+        const sidebarRef = this.sidebarManager.open("edit-storage-account", EditStorageAccountFormComponent);
+        sidebarRef.component.account = this.account;
+    }
+
+    private _loadStorageAccount() {
+        const storageAccountId = this.storageAccountId;
+        if (!storageAccountId) {
+            return;
+        }
+        this.storageAccountService.get(storageAccountId).subscribe({
+            next: (account) => {
+                this.storageAccount = account;
+            },
+            error: (error: ServerError) => {
+                this.error = error;
+            },
+        });
+    }
+}
diff --git a/app/components/account/details/storage-account-card/storage-account-card.html b/app/components/account/details/storage-account-card/storage-account-card.html
new file mode 100644
index 0000000000..2f974d90ad
--- /dev/null
+++ b/app/components/account/details/storage-account-card/storage-account-card.html
@@ -0,0 +1,31 @@
+<div class="storage-account-card">
+    <div class="content">
+        <div class="icon">
+            <span class="fa fa-hdd-o"></span>
+        </div>
+        <div class="details">
+            <h2 class="title">Storage account</h2>
+            <div *ngIf="storageAccountId">
+                <div *ngIf="storageAccount">
+                    {{storageAccount.name}}
+                </div>
+                    <div *ngIf="!storageAccount && error" class="error" [title]="error.body?.error?.message">
+                    {{error.statusText}}
+                </div>
+                <div *ngIf="!storageAccount && !error">
+                    Loading...
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="actions">
+        <button class="edit" (click)="edit()">
+            <span *ngIf="storageAccountId">
+                Edit
+            </span>
+            <span *ngIf="!storageAccountId">
+                Setup
+            </span>
+        </button>
+    </div>
+</div>
diff --git a/app/components/account/details/storage-account-card/storage-account-card.scss b/app/components/account/details/storage-account-card/storage-account-card.scss
new file mode 100644
index 0000000000..9a3a7f167a
--- /dev/null
+++ b/app/components/account/details/storage-account-card/storage-account-card.scss
@@ -0,0 +1,44 @@
+@import "app/styles/variables";
+
+bl-storage-account-card > .storage-account-card {
+    margin-top: 5px;
+    padding: 5px 10px;
+
+    > .content {
+        display: flex;
+        align-items: center;
+        > .icon {
+            font-size: 48px;
+            margin-right: 10px;
+            color: $mineshaft-grey;
+        }
+
+        > .details {
+            flex: 1;
+
+            > .title {
+                font-size: 16px;
+            }
+            .error {
+                color: map-get($danger, 500);
+            }
+        }
+    }
+
+    > .actions {
+        margin-left: 10px;
+        text-align: center;
+
+        button {
+            padding: 2px 10px;
+            cursor: pointer;
+            height: 28px;
+            color: $mineshaft-grey;
+
+            &:hover {
+                color: $whitesmoke;
+                background: map-get($primary, 300);
+            }
+        }
+    }
+}
diff --git a/app/components/application/browse/application-list.component.ts b/app/components/application/browse/application-list.component.ts
index 40d4abd8ec..9680e58077 100644
--- a/app/components/application/browse/application-list.component.ts
+++ b/app/components/application/browse/application-list.component.ts
@@ -53,7 +53,7 @@ export class ApplicationListComponent extends ListOrTableBase implements OnInit,
 
         this.status = this.data.status;
         this._subs.push(applicationService.onApplicationAdded.subscribe((applicationId) => {
-            this.data.loadNewItem(applicationService.get(applicationId));
+            this.data.loadNewItem(applicationService.getOnce(applicationId));
         }));
     }
 
diff --git a/app/components/application/browse/application-list.html b/app/components/application/browse/application-list.html
index b7e7611544..30c9599680 100644
--- a/app/components/application/browse/application-list.html
+++ b/app/components/application/browse/application-list.html
@@ -20,7 +20,7 @@ <h4 bl-quick-list-item-title>{{application.id}}</h4>
     </bl-thead>
     <bl-row *ngFor="let application of displayedApplications" [link]="['/applications/', application.id]" [key]="application.id">
         <bl-cell>{{application.id}}</bl-cell>
-        <bl-cell>{{application.packages?.length}}</bl-cell>
+        <bl-cell>{{application.packages?.size}}</bl-cell>
         <bl-cell>{{application.defaultVersion}}</bl-cell>
         <bl-cell>{{application.allowUpdates}}</bl-cell>
     </bl-row>
diff --git a/app/components/application/details/application-details.html b/app/components/application/details/application-details.html
index 92fc80e146..69ea78dc99 100644
--- a/app/components/application/details/application-details.html
+++ b/app/components/application/details/application-details.html
@@ -1,25 +1,22 @@
 <bl-loading [status]="data.newDataStatus | async">
     <div *ngIf="application">
         <md-card class="overview">
-            <md-card-title-group style="margin: 0px;">
-                <div style="align-items:center;">
+            <div class="actions">
+                <bl-action-btn-group>
                     <bl-refresh-btn [refresh]="refresh"></bl-refresh-btn>
-                </div>
-                <div style="margin-left:12px; margin-right:auto;">
-                    <md-card-title>{{decorator.id}}</md-card-title>
-                    <md-card-subtitle>
-                        <i class="fa" [ngClass]="application.allowUpdates ? 'fa-unlock-alt' : 'fa-lock'"></i> {{decorator.displayName}}
-                        <div *ngIf="application.allowUpdates"> <b>(unlocked)</b></div>
-                        <div *ngIf="!application.allowUpdates"> <b>(locked)</b></div>
-                    </md-card-subtitle>
-                </div>
-            </md-card-title-group>
-            <md-card-content></md-card-content>
-            <md-card-actions layout="row" layout-align="end center">
-                <bl-add-button title="Add package" (click)="addPackage()"></bl-add-button>
-                <bl-edit-button (click)="editApplication()"></bl-edit-button>
-                <bl-delete-button [entity]="application" (click)="deleteApplication()"></bl-delete-button>
-            </md-card-actions>
+                    <bl-add-button title="Add package" (click)="addPackage()"></bl-add-button>
+                    <bl-edit-button (click)="editApplication()"></bl-edit-button>
+                    <bl-delete-button [entity]="application" (click)="deleteApplication()"></bl-delete-button>
+                </bl-action-btn-group>
+            </div>
+            <div class="content">
+                <md-card-title>{{decorator.id}}</md-card-title>
+                <md-card-subtitle>
+                    <i class="fa" [ngClass]="application.allowUpdates ? 'fa-unlock-alt' : 'fa-lock'"></i> {{decorator.displayName}}
+                    <div *ngIf="application.allowUpdates"> <b>(unlocked)</b></div>
+                    <div *ngIf="!application.allowUpdates"> <b>(locked)</b></div>
+                </md-card-subtitle>
+            </div>
         </md-card>
         <bl-application-error-display [application]="application"></bl-application-error-display>
         <md-card class="details">
diff --git a/app/components/application/errors/application-error-display.component.ts b/app/components/application/errors/application-error-display.component.ts
index 84538c3b21..1d960f0bee 100644
--- a/app/components/application/errors/application-error-display.component.ts
+++ b/app/components/application/errors/application-error-display.component.ts
@@ -1,9 +1,10 @@
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnInit } from "@angular/core";
 import { autobind } from "core-decorators";
 
+import { EditStorageAccountFormComponent } from "app/components/account/action/edit-storage-account";
+import { SidebarManager } from "app/components/base/sidebar";
 import { AccountResource, Application } from "app/models";
-import { AccountService, ElectronShell } from "app/services";
-import { ExternalLinks } from "app/utils/constants";
+import { AccountService } from "app/services";
 
 @Component({
     selector: "bl-application-error-display",
@@ -23,7 +24,7 @@ export class ApplicationErrorDisplayComponent implements OnInit {
     constructor(
         private accountService: AccountService,
         private changeDetector: ChangeDetectorRef,
-        private shell: ElectronShell) {
+        private sidebarManager: SidebarManager) {
     }
 
     public get hasLinkedStorageAccountIssue(): boolean {
@@ -45,6 +46,7 @@ export class ApplicationErrorDisplayComponent implements OnInit {
 
     @autobind()
     public setupLinkedStorage() {
-        this.shell.openExternal(ExternalLinks.setupStorageAccount.format(this._batchAccount.id));
+        const sidebarRef = this.sidebarManager.open("edit-storage-account", EditStorageAccountFormComponent);
+        sidebarRef.component.account = this._batchAccount;
     }
 }
diff --git a/app/components/application/home/application-home.html b/app/components/application/home/application-home.html
index 6104978686..4a4fd27f2e 100644
--- a/app/components/application/home/application-home.html
+++ b/app/components/application/home/application-home.html
@@ -1,8 +1,7 @@
 <bl-list-and-show-layout #layout (listScrolledToBottom)="applicationList.onScrollToBottom()" [list]="applicationList">
     <div bl-list-buttons>
-        <button md-mini-fab color="primary" title="Add an application" (click)="addApplication()">
-            <i class="fa fa-plus spin-hover"></i>
-        </button>
+        <bl-action-btn type="round" icon="fa fa-plus spin-hover" color="primary" title="Add an application" (action)="addApplication()">
+        </bl-action-btn>
     </div>
     <div bl-list-content>
         <bl-focus-section>
diff --git a/app/components/base/abstract-list/abstract-list-base.ts b/app/components/base/abstract-list/abstract-list-base.ts
index b78f49b33f..4df56e4c88 100644
--- a/app/components/base/abstract-list/abstract-list-base.ts
+++ b/app/components/base/abstract-list/abstract-list-base.ts
@@ -31,6 +31,7 @@ export class AbstractListBase implements AfterViewInit, OnDestroy {
 
     @Input()
     public set activeItem(key) {
+        this._activeItemInput = key;
         this.setActiveItem(key);
     }
 
@@ -62,13 +63,18 @@ export class AbstractListBase implements AfterViewInit, OnDestroy {
     public get selectedItems() { return Object.keys(this._selectedItems); }
 
     public listFocused: boolean = false;
-    public focusedItem  = new BehaviorSubject<string>(null);
+    public focusedItem = new BehaviorSubject<string>(null);
 
     /**
      * Map of the selected items. Used for better performance to check if an item is selected.
      */
     private _selectedItems: { [key: string]: boolean } = {};
     private _activeItemKey = new BehaviorSubject<ActivatedItemChangeEvent>(null);
+
+    /**
+     * Save the value provided in the activeItem input
+     */
+    private _activeItemInput = null;
     private _subs: Subscription[] = [];
 
     constructor(
@@ -79,7 +85,9 @@ export class AbstractListBase implements AfterViewInit, OnDestroy {
         this._subs.push(this._activeItemKey.subscribe(x => {
             this.selectedItems = x ? [x.key] : [];
             this.activatedItemChange.emit(x);
-            this.activeItemChange.emit(x && x.key);
+            if (!x || x.key !== this._activeItemInput) {
+                this.activeItemChange.emit(x && x.key);
+            }
 
             if (this.listFocused) {
                 this.focusedItem.next(x && x.key);
@@ -108,7 +116,6 @@ export class AbstractListBase implements AfterViewInit, OnDestroy {
         } else {
             this.items.changes.first().subscribe((newItems: QueryList<AbstractListItemBase>) => {
                 this._processInitialItems(newItems);
-
             });
         }
 
diff --git a/app/components/base/banner/banner.component.ts b/app/components/base/banner/banner.component.ts
index 462212e0e4..f1720bb32a 100644
--- a/app/components/base/banner/banner.component.ts
+++ b/app/components/base/banner/banner.component.ts
@@ -1,5 +1,5 @@
 import { Component, ContentChildren, Directive, Input, OnChanges, QueryList } from "@angular/core";
-import { Observable } from "rxjs";
+import { Observable, Subscription } from "rxjs";
 
 export enum ErrorState {
     Error,
@@ -68,8 +68,16 @@ export class BannerComponent implements OnChanges {
 
     public showOtherFixes = false;
 
+    /**
+     * Subscription when listening to the fixing method observable
+     */
+    private _fixingSub: Subscription;
+
     public ngOnChanges(inputs) {
         this.state = ErrorState.Error;
+        if (this._fixingSub) {
+            this._fixingSub.unsubscribe();
+        }
     }
 
     public triggerFix(otherFix?: BannerOtherFixDirective) {
@@ -78,7 +86,7 @@ export class BannerComponent implements OnChanges {
         const fixMethod = otherFix ? otherFix.fix : this.fix;
         const fixObs = fixMethod();
         if (fixObs) {
-            fixObs.subscribe(() => {
+            this._fixingSub = fixObs.subscribe(() => {
                 this._markFixed();
             });
         } else {
diff --git a/app/components/base/banner/banner.scss b/app/components/base/banner/banner.scss
index 198327a5ef..ccfa5e0459 100644
--- a/app/components/base/banner/banner.scss
+++ b/app/components/base/banner/banner.scss
@@ -85,7 +85,7 @@ bl-banner > md-card.mat-card {
 
     > .details-container {
         padding: 10px 24px;
-        border-top: 1px solid $red-dark;
+        border-top: 1px solid map-get($danger, 800);
         font-weight: 500;
     }
 }
@@ -134,12 +134,12 @@ bl-banner > md-card.mat-card {
 }
 
 bl-banner > md-card.error {
-    @include banner-scheme($red, $red-dark);
+    @include banner-scheme(map-get($danger, 500), map-get($danger, 800));
     color: $whiteSmoke-darker;
 }
 
 bl-banner > md-card.warning {
-    @include banner-scheme($yellow, $yellow-dark);
+    @include banner-scheme(map-get($warn, 500), map-get($warn, 800));
     color: $whiteSmoke-darker;
 }
 
diff --git a/app/components/base/buttons/action-button.component.ts b/app/components/base/buttons/action-button.component.ts
new file mode 100644
index 0000000000..adf3e0b3a8
--- /dev/null
+++ b/app/components/base/buttons/action-button.component.ts
@@ -0,0 +1,75 @@
+import { Component, EventEmitter, HostBinding, HostListener, Input, OnChanges, Output } from "@angular/core";
+
+import "./action-buttons.scss";
+
+type ButtonType = "normal" | "round" | "wide";
+type ButtonColor = "primary" | "danger" | "warn";
+
+@Component({
+    selector: "bl-action-btn",
+    template: `
+        <span class="action-btn" [ngClass]="type" [mdTooltip]="title" mdTooltipPosition="right">
+            <i [class]="icon"></i>
+            <ng-content></ng-content>
+        </span>
+    `,
+})
+export class ActionButtonComponent implements OnChanges {
+    @Output()
+    public action = new EventEmitter();
+
+    @HostBinding("tabindex")
+    public tabindex = "0";
+
+    @Input()
+    public icon: string;
+
+    @Input()
+    public title: string;
+
+    @Input()
+    @HostBinding("class.disabled")
+    public disabled = false;
+
+    @Input()
+    @HostBinding("attr.type")
+    public type: ButtonType = "normal";
+
+    @Input()
+    @HostBinding("attr.color")
+    public color: ButtonColor = "primary";
+
+    @Input()
+    public routerLink: string;
+
+    @HostListener("click")
+    public handleAction() {
+        if (this.disabled) {
+            return;
+        }
+        this.action.emit();
+    }
+
+    @HostListener("keydown", ["$event"])
+    public onkeydown(event: KeyboardEvent) {
+        if (event.code === "Space" || event.code === "Enter") {
+            this.handleAction();
+            event.preventDefault();
+        }
+    }
+
+    public ngOnChanges(changes) {
+        if ("disabled" in changes) {
+            this.tabindex = this.disabled ? "-1" : "0";
+        }
+    }
+}
+
+@Component({
+    selector: "bl-action-btn-group",
+    template: `
+        <ng-content></ng-content>
+    `,
+})
+export class ActionButtonGroupComponent {
+}
diff --git a/app/components/base/buttons/action-buttons.scss b/app/components/base/buttons/action-buttons.scss
new file mode 100644
index 0000000000..e036289153
--- /dev/null
+++ b/app/components/base/buttons/action-buttons.scss
@@ -0,0 +1,77 @@
+@import "app/styles/variables";
+
+bl-action-btn-group {
+    text-align: center;
+    border-right: 1px solid $border-color;
+    display: block;
+
+    bl-action-btn {
+        border-bottom: 1px solid $border-color;
+    }
+}
+
+bl-action-btn {
+    display: inline-block;
+    height: $action-btn-size;
+    outline: none;
+    cursor: pointer;
+    font-size: 20px;
+    text-align: center;
+    vertical-align: middle;
+    line-height: $action-btn-size;
+
+    &.disabled[color] {
+        cursor: not-allowed;
+        color: #d5d5d5;
+        background: #f5f5f5;
+
+        &:hover {
+            color: #d5d5d5;
+            background: #f5f5f5;
+        }
+    }
+
+    &[type="normal"], &[type="round"] {
+        width: $action-btn-size;
+    }
+
+    &[type="round"] {
+        border-radius: 99%;
+    }
+
+    &[type="wide"] {
+        padding: 0 5px;
+    }
+
+    &[color="primary"] {
+        background: white;
+        color: map-get($primary, 500);
+
+        &:hover, &:focus {
+            background: $alto;
+            color: map-get($primary, 200);
+        }
+
+        &[type="round"] {
+            border: 1px solid $border-color;
+        }
+    }
+
+    &[color="danger"] {
+        background: map-get($danger, 500);
+        color: $whitesmoke;
+
+        &:hover, &:focus {
+            background: map-get($danger, 800);
+        }
+    }
+
+    &[color="warn"] {
+        background: map-get($warn, 500);
+        color: $whitesmoke;
+
+        &:hover, &:focus {
+            background: map-get($warn, 800);
+        }
+    }
+}
diff --git a/app/components/base/buttons/buttons.component.ts b/app/components/base/buttons/buttons.component.ts
index 4f7e089d01..5bb9c992ae 100644
--- a/app/components/base/buttons/buttons.component.ts
+++ b/app/components/base/buttons/buttons.component.ts
@@ -1,30 +1,40 @@
-import { Component, Input } from "@angular/core";
+import { Component, EventEmitter, Input, Output } from "@angular/core";
 
 import { Job, JobState } from "app/models";
 
+export class BaseButton {
+    @Output()
+    public action = new EventEmitter();
+}
+
 @Component({
     selector: "bl-loading-button",
-    template: `<button md-raised-button color="primary">
-        <ng-content *ngIf="!loading"></ng-content>
-        <i class="fa fa-spinner fa-spin" *ngIf="loading"></i>
-    </button>`,
+    template: `
+        <bl-action-btn color="primary" type="wide" (action)="action.emit()">
+            <ng-content *ngIf="!loading"></ng-content>
+            <i class="fa fa-spinner fa-spin" *ngIf="loading"></i>
+        </bl-action-btn>
+    `,
 })
-export class LoadingButtonComponent {
+export class LoadingButtonComponent extends BaseButton {
     @Input()
     public loading: boolean = false;
 }
 
 @Component({
     selector: "bl-clear-list-selection",
-    template: `<button md-mini-fab color="accent" (click)="onClick()" md-tooltip="Clear selection">
-        <i class="fa fa-check-square-o"></i>
-    </button>`,
+    template: `
+        <bl-action-btn color="accent" (action)="onClick()" md-tooltip="Clear selection">
+            <i class="fa fa-check-square-o"></i>
+        </bl-action-btn>
+    `,
 })
-export class ClearListSelectionButtonComponent {
+export class ClearListSelectionButtonComponent extends BaseButton {
     @Input()
     public list: any;
 
     public onClick() {
+        this.action.emit();
         this.list.clearSelection();
     }
 }
@@ -35,9 +45,9 @@ export class ClearListSelectionButtonComponent {
  */
 @Component({
     selector: "bl-add-button",
-    template: `<button md-button><i class="fa fa-plus"></i> {{title}}</button>`,
+    template: `<bl-action-btn icon="fa fa-plus" [title]="title" (action)="action.emit()"></bl-action-btn>`,
 })
-export class AddButtonComponent {
+export class AddButtonComponent extends BaseButton {
     @Input()
     public set title(value: string) {
         this._title = value;
@@ -51,9 +61,12 @@ export class AddButtonComponent {
 
 @Component({
     selector: "bl-add-task-button",
-    template: `<button md-button [disabled]="!enabled"><i class="fa fa-plus"></i> {{title}}</button>`,
+    template: `
+        <bl-action-btn (action)="action.emit()" [disabled]="!enabled" [title]="title" icon="fa fa-plus">
+        </bl-action-btn>
+    `,
 })
-export class AddTaskButtonComponent {
+export class AddTaskButtonComponent extends BaseButton {
     @Input()
     public job: Job;
 
@@ -79,9 +92,12 @@ export class AddTaskButtonComponent {
 
 @Component({
     selector: "bl-terminate-button",
-    template: `<button md-button [disabled]="!enabled"><i class="fa fa-times"></i> Terminate</button>`,
+    template: `
+        <bl-action-btn (action)="action.emit()" [disabled]="!enabled" icon="fa fa-stop" title="Terminate">
+        </bl-action-btn>
+    `,
 })
-export class TerminateButtonComponent {
+export class TerminateButtonComponent extends BaseButton {
     @Input()
     public entity: any;
 
@@ -95,9 +111,12 @@ export class TerminateButtonComponent {
 
 @Component({
     selector: "bl-delete-button",
-    template: `<button md-button [disabled]="!enabled"><i class="fa fa-trash-o"></i> Delete</button>`,
+    template: `
+        <bl-action-btn (action)="action.emit()" [disabled]="!enabled" title="Delete" icon="fa fa-trash-o">
+        </bl-action-btn>
+    `,
 })
-export class DeleteButtonComponent {
+export class DeleteButtonComponent extends BaseButton {
     @Input()
     public entity: any;
 
@@ -114,9 +133,13 @@ export class DeleteButtonComponent {
 
 @Component({
     selector: "bl-disable-button",
-    template: `<button md-button *ngIf="visible" [disabled]="!enabled"><i class="fa fa-pause"></i> Disable</button>`,
+    template: `
+        <bl-action-btn (action)="action.emit()" *ngIf="visible" icon="fa fa-pause"
+            [disabled]="!enabled" title="Disable">
+        </bl-action-btn>
+    `,
 })
-export class DisableButtonComponent {
+export class DisableButtonComponent extends BaseButton {
     @Input()
     public job: Job;
 
@@ -134,9 +157,12 @@ export class DisableButtonComponent {
 
 @Component({
     selector: "bl-enable-button",
-    template: `<button md-button *ngIf="visible" [disabled]="!enabled"><i class="fa fa-play"></i> Enable</button>`,
+    template: `
+        <bl-action-btn *ngIf="visible" (action)="action.emit()" [disabled]="!enabled" title="Enable" icon="fa fa-play">
+        </bl-action-btn>
+    `,
 })
-export class EnableButtonComponent {
+export class EnableButtonComponent extends BaseButton {
     @Input()
     public job: Job;
 
@@ -151,9 +177,9 @@ export class EnableButtonComponent {
 
 @Component({
     selector: "bl-clone-button",
-    template: `<button md-button><i class="fa fa-clone"></i> {{title}}</button>`,
+    template: `<bl-action-btn (action)="action.emit()" [title]="title" icon="fa fa-clone"></bl-action-btn>`,
 })
-export class CloneButtonComponent {
+export class CloneButtonComponent extends BaseButton {
     @Input()
     public set title(value: string) {
         this._title = value;
@@ -167,9 +193,12 @@ export class CloneButtonComponent {
 
 @Component({
     selector: "bl-download-button",
-    template: `<button md-button [disabled]="!enabled"><i class="fa fa-download"></i> Download</button>`,
+    template: `
+        <bl-action-btn (action)="action.emit()" [disabled]="!enabled" title="Download" icon="fa fa-download">
+        </bl-action-btn>
+    `,
 })
-export class DownloadButtonComponent {
+export class DownloadButtonComponent extends BaseButton {
     @Input()
     public set enabled(value: boolean) {
         this._enabled = value;
@@ -183,14 +212,14 @@ export class DownloadButtonComponent {
 
 @Component({
     selector: "bl-resize-button",
-    template: `<button md-button><i class="fa fa-arrows-v"></i> Resize</button>`,
+    template: `<bl-action-btn (action)="action.emit()" title="Resize" icon="fa fa-arrows-v"></bl-action-btn>`,
 })
-export class ResizeButtonComponent {
+export class ResizeButtonComponent extends BaseButton {
 }
 
 @Component({
     selector: "bl-edit-button",
-    template: `<button md-button><i class="fa fa-pencil-square-o"></i> Edit</button>`,
+    template: `<bl-action-btn (action)="action.emit()" title="Edit" icon="fa fa-pencil-square-o"></bl-action-btn>`,
 })
-export class EditButtonComponent {
+export class EditButtonComponent extends BaseButton {
 }
diff --git a/app/components/base/buttons/buttons.module.ts b/app/components/base/buttons/buttons.module.ts
index 7fe1516e6f..5f99180764 100644
--- a/app/components/base/buttons/buttons.module.ts
+++ b/app/components/base/buttons/buttons.module.ts
@@ -5,6 +5,7 @@ import { RouterModule } from "@angular/router";
 
 import { SubmitButtonComponent } from "./submit-btn.component";
 
+import { ActionButtonComponent, ActionButtonGroupComponent } from "./action-button.component";
 import {
     AddButtonComponent,
     AddTaskButtonComponent,
@@ -21,6 +22,8 @@ import {
 } from "./buttons.component";
 
 const components = [
+    ActionButtonComponent,
+    ActionButtonGroupComponent,
     AddButtonComponent,
     AddTaskButtonComponent,
     ClearListSelectionButtonComponent,
diff --git a/app/components/base/buttons/submit-btn.html b/app/components/base/buttons/submit-btn.html
index 8cb626fbe8..b0fc28e0d4 100644
--- a/app/components/base/buttons/submit-btn.html
+++ b/app/components/base/buttons/submit-btn.html
@@ -1,4 +1,4 @@
-<button md-raised-button color="{{color}}" type="button" (click)="onClick()" [disabled]="disabled || status !== statuses.Idle" [ngSwitch]="status">
+<button md-raised-button [color]="color" type="button" (click)="onClick()" [disabled]="disabled || status !== statuses.Idle" [ngSwitch]="status">
     <ng-content                      *ngSwitchCase="statuses.Idle"></ng-content>
     <i class="fa fa-spinner fa-spin" *ngSwitchCase="statuses.Submitting"></i>
     <i class="fa fa-warning" *ngSwitchCase="statuses.Failed"></i>
diff --git a/app/components/base/editor/editor-languages.ts b/app/components/base/editor/editor-languages.ts
index 1c3af006ca..bd7f5090ec 100644
--- a/app/components/base/editor/editor-languages.ts
+++ b/app/components/base/editor/editor-languages.ts
@@ -1,4 +1,3 @@
-
 export type EditorLanguage = "json";
 export const EditorLanguage = {
     active: "json" as EditorLanguage,
diff --git a/app/components/base/editor/editor.component.ts b/app/components/base/editor/editor.component.ts
index 555e478198..bf713b928d 100644
--- a/app/components/base/editor/editor.component.ts
+++ b/app/components/base/editor/editor.component.ts
@@ -1,6 +1,6 @@
 import {
     AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter,
-    HostListener, Input, Output, ViewChild, forwardRef,
+    HostListener, Input, OnChanges, Output, ViewChild, forwardRef,
 } from "@angular/core";
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from "@angular/forms";
 import "app/utils/autoscale";
@@ -8,6 +8,7 @@ import * as CodeMirror from "codemirror";
 import "codemirror/addon/display/autorefresh";
 import "codemirror/addon/display/placeholder";
 import "codemirror/addon/hint/show-hint";
+import "./editor.scss";
 
 @Component({
     selector: "bl-editor",
@@ -18,47 +19,42 @@ import "codemirror/addon/hint/show-hint";
             useExisting: forwardRef(() => EditorComponent),
             multi: true,
         }],
-    template: `
-        <textarea #host placeholder="enter autoscale formula" placeholder="Please enter {{label}}">
-        </textarea>
-        <div class="mat-input-underline">
-            <span class="mat-input-ripple" [class.mat-focused]="isFocused"></span>
-        </div>
-    `,
+    templateUrl: "editor.html",
     changeDetection: ChangeDetectionStrategy.OnPush,
 })
 
-export class EditorComponent implements ControlValueAccessor, AfterViewInit {
-    @Input()
-    public config;
-    @Input()
-    public label: string;
-    @Output()
-    public change = new EventEmitter();
-    @Output()
-    public focus = new EventEmitter();
-    @Output()
-    public blur = new EventEmitter();
+export class EditorComponent implements ControlValueAccessor, AfterViewInit, OnChanges {
+    @Input() public config: CodeMirror.EditorConfiguration;
+    @Input() public label: string;
+
+    @Output() public change = new EventEmitter();
+    @Output() public focus = new EventEmitter();
+    @Output() public blur = new EventEmitter();
 
     @ViewChild("host")
     public host;
 
-    @Output()
-    public instance = null;
+    public instance: CodeMirror.EditorFromTextArea = null;
     public isFocused = false;
+    public placeholder: string;
     private _value = "";
 
     get value() { return this._value; }
 
     @Input() set value(v) {
         if (v !== this._value) {
-            this._value = v;
+            this.writeValue(v);
             this.onChange(v);
         }
     }
 
     constructor(private changeDetector: ChangeDetectorRef) { }
 
+    public ngOnChanges(changes) {
+        if (changes.config) {
+            this._updatePlaceHolder();
+        }
+    }
     public ngAfterViewInit() {
         this.config = this.config || {};
         this.codemirrorInit(this.config);
@@ -72,7 +68,7 @@ export class EditorComponent implements ControlValueAccessor, AfterViewInit {
             this.updateValue(this.instance.getValue());
 
             if (change.origin !== "complete" && change.origin !== "setValue") {
-                this.instance.showHint({ hint: CodeMirror.hint.autoscale, completeSingle: false });
+                (this.instance as any).showHint({ hint: (CodeMirror as any).hint.autoscale, completeSingle: false });
             }
         });
 
@@ -114,4 +110,12 @@ export class EditorComponent implements ControlValueAccessor, AfterViewInit {
     public onTouched() { }
     public registerOnChange(fn) { this.onChange = fn; }
     public registerOnTouched(fn) { this.onTouched = fn; }
+
+    private _updatePlaceHolder() {
+        if (!this.label || (this.config && this.config.readOnly)) {
+            this.placeholder = "";
+        } else {
+            this.placeholder = `Please enter ${this.label}`;
+        }
+    }
 }
diff --git a/app/components/base/editor/editor.html b/app/components/base/editor/editor.html
new file mode 100644
index 0000000000..c722809e14
--- /dev/null
+++ b/app/components/base/editor/editor.html
@@ -0,0 +1,4 @@
+<textarea #host placeholder="enter autoscale formula" [placeholder]="placeholder"></textarea>
+<div class="mat-input-underline">
+    <span class="mat-input-ripple" [class.mat-focused]="isFocused"></span>
+</div>
diff --git a/app/components/base/editor/editor.scss b/app/components/base/editor/editor.scss
new file mode 100644
index 0000000000..942124e0bd
--- /dev/null
+++ b/app/components/base/editor/editor.scss
@@ -0,0 +1,5 @@
+bl-editor {
+    .CodeMirror {
+        height: auto;
+    }
+}
diff --git a/app/components/base/focus-section/focus-section.component.ts b/app/components/base/focus-section/focus-section.component.ts
index dd077a5273..6665677389 100644
--- a/app/components/base/focus-section/focus-section.component.ts
+++ b/app/components/base/focus-section/focus-section.component.ts
@@ -22,6 +22,7 @@ export class FocusSectionComponent {
     }
 
     public focus() {
+        this.onFocus.emit();
         this.elementRef.nativeElement.focus();
     }
 
diff --git a/app/components/base/focus-section/focus-section.module.ts b/app/components/base/focus-section/focus-section.module.ts
index f90b557d74..61d3ac3a24 100644
--- a/app/components/base/focus-section/focus-section.module.ts
+++ b/app/components/base/focus-section/focus-section.module.ts
@@ -16,7 +16,7 @@ import { FocusSectionComponent } from "./focus-section.component";
         BrowserModule,
         FormsModule,
         RouterModule,
-        MaterialModule.forRoot(),
+        MaterialModule,
     ],
 })
 export class FocusSectionModule {
diff --git a/app/components/base/form/editable-table/editable-table.scss b/app/components/base/form/editable-table/editable-table.scss
index 056ceed350..17dded8034 100644
--- a/app/components/base/form/editable-table/editable-table.scss
+++ b/app/components/base/form/editable-table/editable-table.scss
@@ -16,7 +16,7 @@ bl-editable-table {
         }
 
         td {
-            border: 1px solid #d5d5d5;
+            border: 1px solid $border-color;
             padding: 0;
             margin: 0;
             height: 20px;
@@ -40,7 +40,7 @@ bl-editable-table {
 
             &:focus {
                 background: white;
-                border-bottom: 2px solid map-get($md-prussian-blue, 500);
+                border-bottom: 2px solid map-get($primary, 500);
             }
         }
 
@@ -56,18 +56,18 @@ bl-editable-table {
             outline: none;
 
             > .fa {
-                color: $red;
+                color: map-get($danger, 500);
             }
 
             &:focus, &:hover {
-                background: $red;
+                background: map-get($danger, 500);
                 > .fa {
                     color: $whitesmoke;
                 }
             }
 
             &:active {
-                background: $red-dark;
+                background: map-get($danger, 800);
                 > .fa {
                     color: $whitesmoke;
                 }
diff --git a/app/components/base/form/form-page/form-page.scss b/app/components/base/form/form-page/form-page.scss
index 03d21d0f38..19e85718e4 100644
--- a/app/components/base/form/form-page/form-page.scss
+++ b/app/components/base/form/form-page/form-page.scss
@@ -13,7 +13,7 @@
             height: 30px;
             line-height: 30px;
             text-align: center;
-            background: map-get($md-prussian-blue, 300);
+            background: map-get($primary, 300);
             border-radius: 99%;
             font-size: 14px;
             color: $whitesmoke;
diff --git a/app/components/base/form/form-picker/form-picker.scss b/app/components/base/form/form-picker/form-picker.scss
index fca98d1d5f..b67dce9b20 100644
--- a/app/components/base/form/form-picker/form-picker.scss
+++ b/app/components/base/form/form-picker/form-picker.scss
@@ -22,8 +22,8 @@
     }
 
     &:hover, &:focus {
-        border-color: map-get($md-prussian-blue, 300);
-        color: map-get($md-prussian-blue, 300);
+        border-color: map-get($primary, 300);
+        color: map-get($primary, 300);
     }
 
 
diff --git a/app/components/base/form/form.module.ts b/app/components/base/form/form.module.ts
index 021d461f8d..3fc13df601 100644
--- a/app/components/base/form/form.module.ts
+++ b/app/components/base/form/form.module.ts
@@ -43,7 +43,7 @@ const components = [
         BrowserModule,
         ButtonsModule,
         FormsModule,
-        MaterialModule.forRoot(),
+        MaterialModule,
         ReactiveFormsModule,
         RouterModule,
         ...modules,
diff --git a/app/components/base/list-and-show-layout/entity-details-list.html b/app/components/base/list-and-show-layout/entity-details-list.html
index c8dfac724f..d07a257848 100644
--- a/app/components/base/list-and-show-layout/entity-details-list.html
+++ b/app/components/base/list-and-show-layout/entity-details-list.html
@@ -7,13 +7,10 @@
 </div>
 <hr />
 <div class="context-button-bar">
-    <button *ngIf="showExpandButton" md-mini-fab color="primary" [routerLink]="baseLink" title="{{expandButtonHoverText}}">
-        <i class="fa fa-expand spin-hover"></i>
-    </button>
-    <bl-refresh-btn *ngIf="showRefreshButton" [refresh]="refresh" title="{{refreshButtonHoverText}}"></bl-refresh-btn>
-    <button *ngIf="showAddButton" (click)="onAdd($event)" md-mini-fab color="primary" title="{{addButtonHoverText}}">
-        <i class="fa fa-plus spin-hover"></i>
-    </button>
+    <bl-action-btn type="round" icon="fa fa-expand spin-hover" *ngIf="showExpandButton" color="primary" [routerLink]="baseLink"
+        title="{{expandButtonHoverText}}">
+    </bl-action-btn>
+    <bl-refresh-btn *ngIf="showRefreshButton" type="round" [refresh]="refresh" title="{{refreshButtonHoverText}}"></bl-refresh-btn>
     <ng-content select="[bl-list-buttons]"></ng-content>
 </div>
 <ng-content></ng-content>
diff --git a/app/components/base/list-and-show-layout/list-and-show-layout.html b/app/components/base/list-and-show-layout/list-and-show-layout.html
index 2027817682..c2b2d0bbda 100644
--- a/app/components/base/list-and-show-layout/list-and-show-layout.html
+++ b/app/components/base/list-and-show-layout/list-and-show-layout.html
@@ -16,12 +16,11 @@
                 </div>
                 <hr />
                 <div class="context-button-bar left">
-                    <button md-mini-fab color="warn" *ngIf="deleteSelectedIsEnabled && selectedItems.length > 0" (click)="deleteSelectedItems()">
-                        <i class="fa fa-trash"></i>
-                    </button>
+                    <bl-action-btn type="round" icon="fa fa-trash" color="danger" *ngIf="deleteSelectedIsEnabled && selectedItems.length > 0" (action)="deleteSelectedItems()">
+                    </bl-action-btn>
                 </div>
                 <div class="context-button-bar right">
-                    <bl-refresh-btn [refresh]="refresh" *ngIf="refresh"></bl-refresh-btn>
+                    <bl-refresh-btn [refresh]="refresh" *ngIf="refresh" type="round"></bl-refresh-btn>
                     <ng-content select="[bl-list-buttons]"></ng-content>
                 </div>
             </div>
diff --git a/app/components/base/loading/loading.component.ts b/app/components/base/loading/loading.component.ts
index f06640a2e4..663fbdcce7 100644
--- a/app/components/base/loading/loading.component.ts
+++ b/app/components/base/loading/loading.component.ts
@@ -7,16 +7,16 @@ import {
 import { BehaviorSubject } from "rxjs";
 
 export enum LoadingStatus {
-    Loading = 1,
-    Ready = 2,
-    Error = 3,
+    Loading = 0,
+    Ready = 1,
+    Error = 2,
 }
 
 export enum DisplayStatus {
-    Loading = 1,
-    Ready = 2,
-    Error = 3,
-    ParentLoading = 4,
+    Loading = 0,
+    Ready = 1,
+    Error = 2,
+    ParentLoading = 3,
 }
 
 @Component({
diff --git a/app/components/base/property-list/property-group.component.ts b/app/components/base/property-list/property-group.component.ts
index bdba47c809..4b5d3ad563 100644
--- a/app/components/base/property-list/property-group.component.ts
+++ b/app/components/base/property-list/property-group.component.ts
@@ -17,6 +17,9 @@ export class PropertyGroupComponent {
     @Input()
     public warningMessage: string = null;
 
+    @Input()
+    public collapsable: boolean = true;
+
     @Input()
     public set collapsed(collapsed) {
         this._collapsed = collapsed;
@@ -30,6 +33,8 @@ export class PropertyGroupComponent {
     private _collapsed = false;
 
     public toogleCollapsed() {
-        this.collapsed = !this.collapsed;
+        if (this.collapsable) {
+            this.collapsed = !this.collapsed;
+        }
     }
 }
diff --git a/app/components/base/property-list/property-group.html b/app/components/base/property-list/property-group.html
index 22f6e94fa7..bddefbd8fc 100644
--- a/app/components/base/property-list/property-group.html
+++ b/app/components/base/property-list/property-group.html
@@ -1,5 +1,5 @@
 <div class="group-header" (click)="toogleCollapsed()" *ngIf="label">
-    <div class="collapse-icon">
+    <div class="collapse-icon" *ngIf="collapsable">
         <i class="fa fa-caret-right"*ngIf="collapsed"></i>
         <i class="fa fa-caret-down" *ngIf="!collapsed"></i>
     </div>
diff --git a/app/components/base/property-list/property-list.scss b/app/components/base/property-list/property-list.scss
index 068af659a0..612b224ab5 100644
--- a/app/components/base/property-list/property-list.scss
+++ b/app/components/base/property-list/property-list.scss
@@ -57,15 +57,15 @@ bl-property-group {
     width: 100%;
 
     &:not(:last-child) {
-        border-bottom: 1px solid $alto;
+        border-bottom: 1px solid $border-color;
     }
 
     .warning-message {
-        color: $yellow;
+        color: map-get($warn, 500);
         margin-bottom: 10px;
 
         > .fa {
-            color: $yellow;
+            color: map-get($warn, 500);
         }
     }
 
@@ -82,7 +82,7 @@ bl-property-group {
             align-items: center;
             margin-right: 5px;
             font-size: 20px;
-            color: map-get($md-prussian-blue, 500);
+            color: map-get($primary, 500);
             width: 15px;
         }
 
@@ -139,7 +139,7 @@ bl-property-group {
             }
 
             &.link {
-                color: map-get($md-prussian-blue, 400);
+                color: map-get($primary, 400);
                 i {
                     padding-left: 4px;
                 }
@@ -166,7 +166,7 @@ bl-property-group {
             }
 
             &:active {
-                color: map-get($md-prussian-blue, 200);
+                color: map-get($primary, 200);
             }
         }
 
@@ -220,7 +220,7 @@ bl-property-group {
                 .copied-notification {
                     top: 0;
                     z-index: 1;
-                    background: $green;
+                    background: map-get($success, 500);
                     position: absolute;
                     color: $whitesmoke;
                     padding: 5px;
@@ -254,7 +254,7 @@ bl-property-group {
                 width: 26px !important;
                 height: 26px !important;
                 font-size: 16px;
-                color: map-get($md-prussian-blue, 500);
+                color: map-get($primary, 500);
             }
         }
     }
@@ -263,7 +263,7 @@ bl-property-group {
 bl-bool-property {
     &.enabled {
         .fa-toggle-on {
-            color: $green;
+            color: map-get($success, 500);
         }
     }
 }
diff --git a/app/components/base/quick-list/quick-list.module.ts b/app/components/base/quick-list/quick-list.module.ts
index 29019cb3d7..19c5094092 100644
--- a/app/components/base/quick-list/quick-list.module.ts
+++ b/app/components/base/quick-list/quick-list.module.ts
@@ -26,7 +26,7 @@ import { QuickListComponent, QuickListItemStatusComponent } from "./quick-list.c
         BrowserModule,
         FormsModule,
         RouterModule,
-        MaterialModule.forRoot(),
+        MaterialModule,
         ContextMenuModule,
     ],
 })
diff --git a/app/components/base/refresh-btn/refresh-btn.component.ts b/app/components/base/refresh-btn/refresh-btn.component.ts
index 5ac18a689a..f1ea3ea8c0 100644
--- a/app/components/base/refresh-btn/refresh-btn.component.ts
+++ b/app/components/base/refresh-btn/refresh-btn.component.ts
@@ -26,6 +26,9 @@ export class RefreshButtonComponent {
     @Input()
     public refresh: () => Observable<any>;
 
+    @Input()
+    public type: string = "normal";
+
     public status = RefreshStatus.Idle;
 
     public onClick() {
diff --git a/app/components/base/refresh-btn/refresh-btn.html b/app/components/base/refresh-btn/refresh-btn.html
index d9d8aefe32..a9d3ca7e34 100644
--- a/app/components/base/refresh-btn/refresh-btn.html
+++ b/app/components/base/refresh-btn/refresh-btn.html
@@ -1,4 +1,4 @@
-<button md-mini-fab color="secondary" title="Refresh" (click)="onClick()" [disabled]="status !== statuses.Idle">
+<bl-action-btn type="round" [type]="type" title="Refresh" (action)="onClick()" [disabled]="status !== statuses.Idle">
     <span class="icon-container" [ngSwitch]="status">
         <i class="fa fa-refresh shake-hover"    *ngSwitchCase="statuses.Idle"></i>
         <i class="fa fa-refresh fa-spin"        *ngSwitchCase="statuses.Refreshing"></i>
@@ -7,4 +7,4 @@
         </span>
         <i class="fa fa-warning"                *ngSwitchCase="statuses.Failed"></i>
     </span>
-</button>
+</bl-action-btn>
diff --git a/app/components/base/sidebar/sidebar.ts b/app/components/base/sidebar/sidebar.ts
index c708e25d61..9c96fe5106 100644
--- a/app/components/base/sidebar/sidebar.ts
+++ b/app/components/base/sidebar/sidebar.ts
@@ -24,7 +24,7 @@ import { SidebarPageComponent } from "./sidebar-page";
     imports: [
         BrowserModule,
         FormsModule,
-        MaterialModule.forRoot(),
+        MaterialModule,
     ],
     providers: [
         SidebarManager,
diff --git a/app/components/base/table/table.scss b/app/components/base/table/table.scss
index 87aca221fb..1e8f152a8f 100644
--- a/app/components/base/table/table.scss
+++ b/app/components/base/table/table.scss
@@ -15,6 +15,7 @@ bl-table {
         border-collapse: collapse;
         overflow: hidden;
         display: table;
+        table-layout: fixed;
     }
 
     bl-thead {
@@ -35,7 +36,7 @@ bl-table {
             height: $table-row-height;
 
             &.selected {
-                background-color: map-get($md-prussian-blue, 100);
+                background-color: map-get($primary, 100);
 
                 p {
                     color: $mineShaftGray;
@@ -43,7 +44,7 @@ bl-table {
             }
 
             &.focused {
-                background-color: map-get($md-prussian-blue, 200);
+                background-color: map-get($primary, 200);
             }
 
             &:hover:not(.selected) {
@@ -93,9 +94,9 @@ bl-table {
         }
 
         &.sorting {
-            color: map-get($md-prussian-blue, 500);
+            color: map-get($primary, 500);
             > .sort-icon {
-                color: map-get($md-prussian-blue, 500);
+                color: map-get($primary, 500);
             }
         }
     }
@@ -114,48 +115,6 @@ bl-table {
     }
 }
 
-/*
- * Specifically for tables on the dashboard that need display: block & inline-block
- * instead of display: table.
- */
-bl-table.dashboard {
-    table {
-        display: block;
-    }
-
-    bl-thead {
-        display: block;
-    }
-
-    tbody {
-        display: block;
-
-        > tr {
-            display: block;
-            padding: 6px;
-        }
-    }
-
-    bl-cell,
-    bl-column {
-        &:first-child {
-            padding: 0;
-        }
-
-        &:last-child {
-            padding: 0;
-        }
-    }
-
-    bl-column {
-        display: inline-block;
-    }
-
-    bl-cell {
-        display: inline-block;
-    }
-}
-
 .cell-spinner {
-    color: map-get($md-prussian-blue, 400);
+    color: map-get($primary, 400);
 }
diff --git a/app/components/base/tabs/tab-group.component.ts b/app/components/base/tabs/tab-group.component.ts
index 772cd57b79..89620322f5 100644
--- a/app/components/base/tabs/tab-group.component.ts
+++ b/app/components/base/tabs/tab-group.component.ts
@@ -1,5 +1,5 @@
 import {
-    AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChildren, Input, OnInit, QueryList,
+    AfterViewInit, ChangeDetectorRef, Component, ContentChildren, Input, OnInit, QueryList,
 } from "@angular/core";
 import { ActivatedRoute, Router } from "@angular/router";
 
@@ -8,7 +8,6 @@ import { TabComponent } from "./tab.component";
 @Component({
     selector: "bl-tab-group",
     templateUrl: "tab-group.html",
-    changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class TabGroupComponent implements AfterViewInit, OnInit {
     @Input()
@@ -57,6 +56,10 @@ export class TabGroupComponent implements AfterViewInit, OnInit {
         });
     }
 
+    public detectChanges() {
+        this.changeDetector.markForCheck();
+    }
+
     private _updateSelectedTab() {
         if (!this.tabs) {
             return;
diff --git a/app/components/base/tags/tags.scss b/app/components/base/tags/tags.scss
index e67b0999ab..43fe47da8e 100644
--- a/app/components/base/tags/tags.scss
+++ b/app/components/base/tags/tags.scss
@@ -7,7 +7,7 @@
     .tag {
         font-size: 11px;
         color: white;
-        background: map-get($md-prussian-blue, 300);
+        background: map-get($primary, 300);
         padding: 2px 5px;
         border-radius: 3px;
 
@@ -18,13 +18,13 @@
 
     .expand-tags {
         font-size: 16px;
-        color: map-get($md-prussian-blue, 300);
+        color: map-get($primary, 300);
         padding: 0 5px;
         border-radius: 3px;
 
         &:hover {
-            color: map-get($md-prussian-blue, 50);
-            background: map-get($md-prussian-blue, 300);
+            color: map-get($primary, 50);
+            background: map-get($primary, 300);
         }
     }
 }
@@ -53,10 +53,10 @@ bl-tags {
 
         .fa-pencil {
             cursor: pointer;
-            color: map-get($md-prussian-blue, 500);
+            color: map-get($primary, 500);
 
             &:hover {
-                color: map-get($md-prussian-blue, 300);
+                color: map-get($primary, 300);
             }
         }
 
@@ -66,11 +66,11 @@ bl-tags {
         }
 
         .fa-check:hover {
-            color: $green;
+            color: map-get($success, 500);;
         }
 
         .fa-times:hover {
-            color: $red-light;
+            color: map-get($danger, 400);
         }
     }
 
diff --git a/app/components/file/browse/display/file-list-display.component.ts b/app/components/file/browse/display/file-list-display.component.ts
index f5e71b2bc0..dcb878515b 100644
--- a/app/components/file/browse/display/file-list-display.component.ts
+++ b/app/components/file/browse/display/file-list-display.component.ts
@@ -35,7 +35,8 @@ export class FileListDisplayComponent {
     public isBlob: boolean = false;
 
     public prettyFileSize(size: string) {
-        return prettyBytes(parseInt(size, 10));
+        // having falsy issues with contentLength = 0
+        return prettyBytes(parseInt(size || "0", 10));
     }
 
     /**
@@ -48,10 +49,6 @@ export class FileListDisplayComponent {
     }
 
     public isErrorState(file: any) {
-        // if (node.state === "startTaskFailed") {
-        //     return true;
-        // }
-
         return false;
     }
 }
diff --git a/app/components/file/browse/display/file-list-display.html b/app/components/file/browse/display/file-list-display.html
index 6644623bd4..2c89ae505b 100644
--- a/app/components/file/browse/display/file-list-display.html
+++ b/app/components/file/browse/display/file-list-display.html
@@ -11,12 +11,12 @@ <h4 bl-quick-list-item-title>{{file.name}}</h4>
 
     <bl-table *ngIf="!quickList">
         <bl-thead>
-            <bl-column style="width: 60%">Name</bl-column>
-            <bl-column style="width: 40%">Content Length</bl-column>
+            <bl-column>Name</bl-column>
+            <bl-column style="width: 200px">Content Length</bl-column>
         </bl-thead>
         <bl-row *ngFor="let file of files | fileDirectoryFilter" [link]="urlToFile(file.name)" [key]="file.url">
-            <bl-cell>{{file.name}}</bl-cell>
-            <bl-cell>{{prettyFileSize(file.properties.contentLength)}}</bl-cell>
+            <bl-cell [value]="file.name"></bl-cell>
+            <bl-cell [value]="prettyFileSize(file.properties.contentLength)"></bl-cell>
         </bl-row>
     </bl-table>
     <bl-no-item [itemCount]="(files  | fileDirectoryFilter).size" [filter]="filter" [status]="status">
diff --git a/app/components/file/browse/persisted-file-list.component.ts b/app/components/file/browse/persisted-file-list.component.ts
index 0efc090f38..93b2b8046f 100644
--- a/app/components/file/browse/persisted-file-list.component.ts
+++ b/app/components/file/browse/persisted-file-list.component.ts
@@ -32,6 +32,7 @@ export class PersistedFileListComponent implements OnChanges, OnDestroy {
     public data: RxListProxy<BlobListParams, File>;
     public status = new BehaviorSubject(LoadingStatus.Loading);
     public LoadingStatus = LoadingStatus;
+    public hasAutoStorage: boolean;
     public containerNotFound: boolean;
     public authFailed: boolean;
 
@@ -58,7 +59,9 @@ export class PersistedFileListComponent implements OnChanges, OnDestroy {
             this.status.next(status);
         });
 
+        this.hasAutoStorage = false;
         this._autoStorageSub = storageService.hasAutoStorage.subscribe((hasAutoStorage) => {
+            this.hasAutoStorage = hasAutoStorage;
             if (!hasAutoStorage) {
                 this.status.next(LoadingStatus.Ready);
             }
@@ -103,10 +106,6 @@ export class PersistedFileListComponent implements OnChanges, OnDestroy {
         return "Filter by blob name (case sensitive)";
     }
 
-    public get hasAutoStorage(): Observable<boolean> {
-        return this.storageService.hasAutoStorage;
-    }
-
     private _loadFiles() {
         this.authFailed = false;
         this.containerNotFound = false;
diff --git a/app/components/file/browse/persisted-file-list.html b/app/components/file/browse/persisted-file-list.html
index 7f0cd89155..f5718ff864 100644
--- a/app/components/file/browse/persisted-file-list.html
+++ b/app/components/file/browse/persisted-file-list.html
@@ -1,4 +1,4 @@
-<div *ngIf="!containerNotFound && !authFailed && hasAutoStorage | async">
+<div *ngIf="!containerNotFound && !authFailed && hasAutoStorage">
     <bl-server-error class="error-in-list" [error]="data.error | async" *ngIf="(status | async) === LoadingStatus.Error"></bl-server-error>
     <bl-file-list-display [files]="data.items | async" [status]="status | async" [quickList]="quickList" [baseUrl]="baseUrl" [isBlob]="true"
         [filter]="filter"></bl-file-list-display>
@@ -14,10 +14,10 @@
     </p>
 </div>
 
-<div *ngIf="containerNotFound" class="notfound-message top-margin">
-    No storage container was found for this job.
+<div *ngIf="!hasAutoStorage" class="notfound-message top-margin">
+    No linked storage account configured for this Batch account.
 </div>
 
-<div *ngIf="!hasAutoStorage | async" class="notfound-message top-margin">
-    No linked storage account configured for this Batch account.
+<div *ngIf="containerNotFound" class="notfound-message top-margin">
+    No storage container was found for this job.
 </div>
diff --git a/app/components/file/details/code-file-viewer/code-file-viewer.component.ts b/app/components/file/details/code-file-viewer/code-file-viewer.component.ts
new file mode 100644
index 0000000000..d19a5f7f24
--- /dev/null
+++ b/app/components/file/details/code-file-viewer/code-file-viewer.component.ts
@@ -0,0 +1,50 @@
+import { Component, Input, OnChanges } from "@angular/core";
+
+import { LoadingStatus } from "app/components/base/loading";
+import { File } from "app/models";
+import { FileLoader } from "app/services/file";
+import "./code-file-viewer.scss";
+
+const maxSize = 100000; // 100KB
+
+@Component({
+    selector: "bl-code-file-viewer",
+    templateUrl: "code-file-viewer.html",
+})
+export class CodeFileViewerComponent implements OnChanges {
+    @Input() public fileLoader: FileLoader;
+
+    public value: string = "";
+    public file: File;
+    public loadingStatus: LoadingStatus = LoadingStatus.Loading;
+    public fileTooLarge: boolean;
+
+    public config: CodeMirror.EditorConfiguration = {
+        readOnly: true,
+        lineNumbers: true,
+    };
+
+    public ngOnChanges(changes) {
+        this._loadImage();
+    }
+
+    private _loadImage() {
+        this.fileTooLarge = false;
+        this.loadingStatus = LoadingStatus.Loading;
+        this.fileLoader.properties().subscribe((file: File) => {
+            this.file = file;
+            const contentLength = file.properties.contentLength;
+            if (contentLength > maxSize) {
+                this.fileTooLarge = true;
+                this.loadingStatus = LoadingStatus.Ready;
+                return;
+            }
+
+            this.fileLoader.content().subscribe((result) => {
+                this.value = result.content.toString();
+                this.loadingStatus = LoadingStatus.Ready;
+            });
+        });
+
+    }
+}
diff --git a/app/components/file/details/code-file-viewer/code-file-viewer.html b/app/components/file/details/code-file-viewer/code-file-viewer.html
new file mode 100644
index 0000000000..d0f423709b
--- /dev/null
+++ b/app/components/file/details/code-file-viewer/code-file-viewer.html
@@ -0,0 +1,4 @@
+<bl-loading [status]="loadingStatus">
+    <bl-editor [value]="value" [config]="config" *ngIf="!fileTooLarge"></bl-editor>
+    <bl-file-too-large [file]="file" [fileLoader]="fileLoader" *ngIf="fileTooLarge"></bl-file-too-large>
+</bl-loading>
diff --git a/app/components/file/details/code-file-viewer/code-file-viewer.scss b/app/components/file/details/code-file-viewer/code-file-viewer.scss
new file mode 100644
index 0000000000..95490fc4d1
--- /dev/null
+++ b/app/components/file/details/code-file-viewer/code-file-viewer.scss
@@ -0,0 +1,5 @@
+bl-code-file-viewer {
+    display: block;
+    min-height: 100px;
+    position: relative;
+}
diff --git a/app/components/file/details/code-file-viewer/index.ts b/app/components/file/details/code-file-viewer/index.ts
new file mode 100644
index 0000000000..6c6706fb51
--- /dev/null
+++ b/app/components/file/details/code-file-viewer/index.ts
@@ -0,0 +1 @@
+export * from "./code-file-viewer.component";
diff --git a/app/components/file/details/file-content.component.ts b/app/components/file/details/file-content.component.ts
index a22e5c30fc..0208047a28 100644
--- a/app/components/file/details/file-content.component.ts
+++ b/app/components/file/details/file-content.component.ts
@@ -1,87 +1,58 @@
-import { AfterViewInit, Component, ElementRef, Input, OnChanges, OnDestroy } from "@angular/core";
-import { Observable, Subscription } from "rxjs";
+import { Component, Input, OnChanges, OnInit, SimpleChanges } from "@angular/core";
 
-import { ScrollableComponent, ScrollableService } from "app/components/base/scrollable";
-import { File, ServerError } from "app/models";
-import { FileService, StorageService, TaskService } from "app/services";
-import { Constants, log } from "app/utils";
+import { FileService, StorageService } from "app/services";
+import { FileLoader } from "app/services/file";
+import "./file-content.scss";
+
+enum FileType {
+    log,
+    image,
+    code,
+}
+
+const fileTypes = {
+    [FileType.log]: ["txt", "log"],
+    [FileType.image]: ["png", "jpg", "gif"],
+    [FileType.code]: ["json", "ts2", "js", "java", "cs", "cpp", "h", "hpp", "py", "xml", "sh", "cmd", "bat"],
+};
 
 @Component({
     selector: "bl-file-content",
     templateUrl: "file-content.html",
 })
-export class FileContentComponent implements OnChanges, OnDestroy, AfterViewInit {
-    @Input()
-    public jobId: string;
+export class FileContentComponent implements OnChanges, OnInit {
+    public FileType = FileType;
 
-    @Input()
-    public taskId: string;
+    @Input() public jobId: string;
 
-    @Input()
-    public poolId: string;
+    @Input() public taskId: string;
 
-    @Input()
-    public nodeId: string;
+    @Input() public poolId: string;
 
-    @Input()
-    public filename: string;
+    @Input() public nodeId: string;
 
-    @Input()
-    public outputKind: string;
+    @Input() public filename: string;
 
-    public followingLog = false;
-    public lastContentLength = 0;
-    public lines = [];
-    public loading = true;
-    public scrollable: ScrollableComponent;
-    public currentSubscription: Subscription;
+    @Input() public outputKind: string;
 
-    public nodeNotFound = false;
-    public fileContentFailure = false;
-
-    private _refreshInterval;
+    public fileLoader: FileLoader = null;
+    public fileType: FileType;
 
     constructor(
         private storageService: StorageService,
-        private scrollableService: ScrollableService,
-        taskService: TaskService,
-        private fileService: FileService,
-        private element: ElementRef) {
+        private fileService: FileService) {
     }
 
-    public ngAfterViewInit() {
-        this.scrollable = this.scrollableService.getParentSrollable(this.element.nativeElement);
+    public ngOnInit() {
+        this.setupFileLoad();
     }
 
-    public ngOnChanges(inputs) {
-        if (this._refreshInterval) {
-            clearInterval(this._refreshInterval);
-        }
-
-        if (this.currentSubscription) {
-            this.currentSubscription.unsubscribe();
+    public ngOnChanges(changes: SimpleChanges) {
+        if (changes.filename) {
+            this._findFileType();
         }
 
-        this.lines = [];
-        this.loading = true;
-        this.lastContentLength = 0;
-        this.nodeNotFound = false;
-        this.fileContentFailure = false;
-
-        this._updateFileContent();
-        this._setRefreshInterval();
-    }
-
-    public ngOnDestroy() {
-        // clear the refresh when the user navigates away
-        clearInterval(this._refreshInterval);
-    }
-
-    public toggleFollowLog() {
-        this.followingLog = !this.followingLog;
-        if (this.followingLog) {
-            this._scrollToBottom();
-        }
+        this.setupFileLoad();
     }
 
     public get isJob() {
@@ -96,141 +67,39 @@ export class FileContentComponent implements OnChanges, OnDestroy, AfterViewInit
         return this.jobId && this.taskId && this.outputKind;
     }
 
-    /**
-     * Set the interval for refresh only if checking a task file.
-     */
-    private _setRefreshInterval() {
-        if (this.poolId || this.nodeId) {
-            return;
-        }
-
-        this._refreshInterval = setInterval(() => {
-            this._updateFileContent();
-        }, 5000);
-    }
-
-    private _updateFileContent() {
-        let data;
-        if (this.isJob) {
-            data = this.fileService.getFilePropertiesFromTask(this.jobId, this.taskId, this.filename);
-        } else if (this.isPool) {
-            data = this.fileService.getFilePropertiesFromComputeNode(this.poolId, this.nodeId, this.filename);
-        } else if (this.isBlob) {
-            data = this.storageService.getBlobProperties(this.jobId, this.taskId, this.outputKind, this.filename);
-        } else {
-            return;
-        }
-
-        this.currentSubscription = data.fetch().subscribe({
-            next: (result: any) => {
-                this._processProperties(result);
-            },
-            error: (e) => {
-                this._processError(e);
-            },
-        });
+    public openAs(type: FileType) {
+        this.fileType = type;
     }
 
-    /**
-     * Load the content of the file up to the given byte from the last number it loaded.
-     * @param newContentLength Number of bytes to get the content to
-     *
-     * @example
-     * this._loadUpTo(100); //=> Loads bytes 0-100
-     * this._loadUpTo(300); //=> Loads bytes 100-300
-     */
-    private _loadUpTo(newContentLength: number) {
-        let obs: Observable<any>;
-        const ocpRange = `bytes=${this.lastContentLength}-${newContentLength}`;
+    private setupFileLoad() {
+        let obs: FileLoader;
 
         if (this.isJob) {
-            obs = this.fileService.getFileContentFromTask(this.jobId, this.taskId, this.filename, {
-                fileGetFromTaskOptions: { ocpRange },
-            });
+            obs = this.fileService.fileFromTask(this.jobId, this.taskId, this.filename);
         } else if (this.isPool) {
-            obs = this.fileService.getFileContentFromComputeNode(this.poolId, this.nodeId, this.filename, {
-                fileGetFromComputeNodeOptions: { ocpRange },
-            });
+            obs = this.fileService.fileFromNode(this.poolId, this.nodeId, this.filename);
         } else if (this.isBlob) {
-            const blobName = `${this.taskId}/${this.outputKind}/${this.filename}`;
-            obs = this.storageService.getBlobContent(this.jobId, blobName, {
-                rangeStart: this.lastContentLength,
-                rangeEnd: newContentLength,
-            });
+            obs = this.storageService.blobContent(this.jobId, this.taskId, this.outputKind, this.filename);
         } else {
             return;
         }
-
-        this.currentSubscription = obs.subscribe((result) => {
-            this._processFileContent(result, newContentLength);
-        }, (error) => {
-            this._processError(error);
-        });
-    }
-
-    /**
-     * Process the properties of the file and check if we need to load more content.
-     */
-    private _processProperties(file: File) {
-        if (file && file.properties) {
-            const newContentLength = file.properties.contentLength;
-            if (newContentLength === 0) {
-                this.loading = false;
-            } else if (newContentLength !== this.lastContentLength) {
-                this._loadUpTo(newContentLength);
-            }
-        }
+        this.fileLoader = obs;
     }
 
-    private _processFileContent(result: any, newContentLength: number) {
-        this.lastContentLength = newContentLength;
-        const newLines = result.content.toString().split("\n");
-        let first = "";
-        if (newLines.length > 1) {
-            first = newLines.shift();
+    private _findFileType() {
+        if (!this.filename) {
+            throw new Error(`Expect filename to be a valid string but was "${this.filename}"`);
         }
-
-        if (this.lines.length === 0) {
-            this.lines = [first];
-        } else {
-            this.lines[this.lines.length - 1] += first;
-        }
-
-        this.lines = this.lines.concat(newLines);
-        if (this.followingLog) {
-            setTimeout(() => {
-                this._scrollToBottom();
-            });
-        }
-
-        this.loading = false;
-        this.currentSubscription = null;
-    }
-
-    private _processError(e: ServerError) {
-        this.currentSubscription = null;
-        this.loading = false;
-
-        clearInterval(this._refreshInterval);
-        if (e.status === Constants.HttpCode.NotFound) {
-            this.nodeNotFound = true;
-            return;
-        } else if (e.status === Constants.HttpCode.Conflict) {
-            this.nodeNotFound = true;
-            return;
-        } else if (!e.status && e.body.message.startsWith("An incorrect number of bytes")) {
-            // gets an undefined error code for binary files.
-            this.fileContentFailure = true;
-            return;
-        }
-
-        log.error(`[FileContent.component] Error is ${e.status}`, e);
-    }
-
-    private _scrollToBottom() {
-        if (this.scrollable) {
-            // TODO: make a scrollToBottom
-            this.scrollable.scrollToBottom();
+        const filename = this.filename.toLowerCase();
+        for (let type of Object.keys(fileTypes)) {
+            const extensions = fileTypes[type];
+            for (let ext of extensions) {
+                if (filename.endsWith(`.${ext}`)) {
+                    this.fileType = type as any;
+                    return;
+                }
+            }
         }
+        this.fileType = null;
     }
 }
diff --git a/app/components/file/details/file-content.html b/app/components/file/details/file-content.html
index 66ade54c75..5634a65131 100644
--- a/app/components/file/details/file-content.html
+++ b/app/components/file/details/file-content.html
@@ -1,25 +1,22 @@
-<div class="log-console" *ngIf="!nodeNotFound && !fileContentFailure">
-    <div class="follow-log-btn" [class.following]="followingLog" (click)="toggleFollowLog()">
-        <i class="fa fa-circle"></i>
-        <span>Follow log</span>
+<div *ngIf="!fileLoader">
+    Error this file is neither a node, task or blob file.
+</div>
+<div *ngIf="fileLoader" [ngSwitch]="fileType">
+    <div *ngSwitchCase="FileType.log">
+        <bl-log-file-viewer [fileLoader]="fileLoader" [tail]="false"></bl-log-file-viewer>
     </div>
-    <div class="log-container">
-        <bl-simple-loading *ngIf="loading"></bl-simple-loading>
-        <div class="line" *ngFor="let line of lines">
-            <span class="line-nb"></span>
-            <span class="line-content">{{line}}</span>
-        </div>
+    <div *ngSwitchCase="FileType.image">
+        <bl-image-file-viewer [fileLoader]="fileLoader"></bl-image-file-viewer>
     </div>
-    <div class="follow-log-btn bottom" [class.following]="followingLog" (click)="followingLog = !followingLog">
-        <i class="fa fa-circle"></i>
-        <span>Follow log</span>
+    <div *ngSwitchCase="FileType.code">
+        <bl-code-file-viewer [fileLoader]="fileLoader"></bl-code-file-viewer>
     </div>
-</div>
-
-<div *ngIf="nodeNotFound" class="notfound-message">
-    The node this task ran on was not found.
-</div>
-
-<div *ngIf="fileContentFailure" class="notfound-message">
-    The contents of the file was unable to be read. Try downloading the file.
+    <md-card *ngSwitchDefault class="unknown-file-type">
+        <h2 class="title">This file is not a known extension. Do you still want to open it?</h2>
+        <div class="options">
+            <button class="log" (click)="openAs(FileType.log)">Log</button>
+            <button class="code" (click)="openAs(FileType.code)">Code</button>
+            <button class="image" (click)="openAs(FileType.image)">Image</button>
+        </div>
+    </md-card>
 </div>
diff --git a/app/components/file/details/file-content.scss b/app/components/file/details/file-content.scss
new file mode 100644
index 0000000000..60292e9672
--- /dev/null
+++ b/app/components/file/details/file-content.scss
@@ -0,0 +1,23 @@
+@import "app/styles/variables";
+
+bl-file-content {
+    .unknown-file-type {
+        display: flex;
+        align-items: center;
+
+        .title {
+            flex: 1;
+        }
+
+        .options > button {
+            padding: 10px;
+            cursor: pointer;
+            background: map-get($primary, 300);
+            color: $whitesmoke;
+
+            &:hover {
+                background: map-get($primary, 500);
+            }
+        }
+    }
+}
diff --git a/app/components/file/details/file-details.component.ts b/app/components/file/details/file-details.component.ts
index 05572d0262..44b0d4d233 100644
--- a/app/components/file/details/file-details.component.ts
+++ b/app/components/file/details/file-details.component.ts
@@ -2,21 +2,20 @@ import { Component, OnDestroy, OnInit } from "@angular/core";
 import { ActivatedRoute } from "@angular/router";
 import { autobind } from "core-decorators";
 import { remote } from "electron";
-import { writeFile } from "fs";
 import { Observable, Subscription } from "rxjs";
 
 import { NotificationService } from "app/components/base/notifications";
 import { File, ServerError } from "app/models";
-import { FileService, StorageService } from "app/services";
+import { ElectronShell, FileService, StorageService } from "app/services";
 import { RxEntityProxy } from "app/services/core";
-import { Constants, FileUrlUtils, log, prettyBytes } from "app/utils";
+import { Constants, FileUrlUtils, prettyBytes } from "app/utils";
 
 @Component({
     selector: "bl-file-details",
     templateUrl: "file-details.html",
 })
 export class FileDetailsComponent implements OnInit, OnDestroy {
-    public static breadcrumb({filename}) {
+    public static breadcrumb({ filename }) {
         return { name: filename, label: "File", invertName: true };
     }
 
@@ -37,6 +36,7 @@ export class FileDetailsComponent implements OnInit, OnDestroy {
     constructor(
         private route: ActivatedRoute,
         private fileService: FileService,
+        private shell: ElectronShell,
         private notificationService: NotificationService,
         private storageService: StorageService) {
         this.downloadEnabled = true;
@@ -68,6 +68,7 @@ export class FileDetailsComponent implements OnInit, OnDestroy {
         return Observable.of({});
     }
 
+    @autobind()
     public downloadFile() {
         const dialog = remote.dialog;
         const localPath = dialog.showSaveDialog({
@@ -77,7 +78,7 @@ export class FileDetailsComponent implements OnInit, OnDestroy {
         });
 
         if (localPath) {
-            this._saveFile(localPath);
+            return this._saveFile(localPath);
         }
     }
 
@@ -118,21 +119,14 @@ export class FileDetailsComponent implements OnInit, OnDestroy {
         }
 
         const obj = FileUrlUtils.parseRelativePath(this.url);
+        let obs;
         if (obj.type === Constants.FileSourceTypes.Job) {
-            this.fileService.getFileContentFromTask(
-                this.jobId, this.taskId, this.filename).subscribe((data) => {
-                    this._writeToFile(pathToFile, data.content);
-                });
-
+            obs = this.fileService.fileFromTask(this.jobId, this.taskId, this.filename).download(pathToFile);
         } else if (this._sourceType === Constants.FileSourceTypes.Pool) {
-            this.fileService.getFileContentFromComputeNode(
-                this.poolId, this.nodeId, this.filename).subscribe((data) => {
-                    this._writeToFile(pathToFile, data.content);
-                });
-
+            obs = this.fileService.fileFromNode(this.poolId, this.nodeId, this.filename).download(pathToFile);
         } else if (this._sourceType === Constants.FileSourceTypes.Blob) {
             const blobName = `${this.taskId}/${this.outputKind}/${this.filename}`;
-            this.storageService.saveBlobToFile(this.jobId, blobName, pathToFile).subscribe({
+            obs = this.storageService.saveBlobToFile(this.jobId, blobName, pathToFile).subscribe({
                 error: (error: ServerError) => {
                     this.notificationService.error(
                         "Download failed",
@@ -144,15 +138,11 @@ export class FileDetailsComponent implements OnInit, OnDestroy {
         } else {
             throw new Error("Unrecognised source type: " + this._sourceType);
         }
-    }
 
-    private _writeToFile(filename: string, data: any): void {
-        writeFile(filename, data.content, (error) => {
-            // Callback to get rid of the following console error
-            // DeprecationWarning: Calling an asynchronous function without callback is deprecated.
-            if (error) {
-                log.error("[FileDetails.component] writeFile error:", error);
-            }
+        obs.subscribe(() => {
+            this.shell.showItemInFolder(pathToFile);
+            this.notificationService.success("Download complete!", `File was saved locally at ${pathToFile}`);
         });
+        return obs;
     }
 }
diff --git a/app/components/file/details/file-details.html b/app/components/file/details/file-details.html
index 2f4329c72b..833c5df1dc 100644
--- a/app/components/file/details/file-details.html
+++ b/app/components/file/details/file-details.html
@@ -1,24 +1,20 @@
 <div *ngIf="filename">
     <md-card class="overview">
-        <md-card-title-group style="margin: 0px;">
-            <div style="align-items:center;">
+        <div class="actions">
+            <bl-action-btn-group>
                 <bl-refresh-btn [refresh]="refresh"></bl-refresh-btn>
-            </div>
-            <div style="margin-left:12px; margin-right:auto;">
-                <md-card-title>{{filename}}</md-card-title>
-                <md-card-subtitle>{{contentSize}}</md-card-subtitle>
-            </div>
-        </md-card-title-group>
-        <md-card-content>
-            <p>Url: {{url}}</p>
-        </md-card-content>
-        <md-card-actions layout="row" layout-align="end center">
-            <bl-download-button [enabled]="downloadEnabled" (click)="downloadFile()"></bl-download-button>
-        </md-card-actions>
+                <bl-download-button [enabled]="downloadEnabled" (action)="downloadFile()"></bl-download-button>
+            </bl-action-btn-group>
+        </div>
+        <div class="content">
+            <md-card-title>{{filename}}</md-card-title>
+            <md-card-subtitle>{{url}}</md-card-subtitle>
+            <md-card-subtitle>{{contentSize}}</md-card-subtitle>
+        </div>
     </md-card>
-    <md-card class="details">
+    <div class="details" style="margin-top: 5px">
         <bl-file-content *ngIf="jobId && taskId && !outputKind" [jobId]="jobId" [taskId]="taskId" [filename]="filename"></bl-file-content>
         <bl-file-content *ngIf="jobId && taskId && outputKind" [jobId]="jobId" [taskId]="taskId" [outputKind]="outputKind" [filename]="filename"></bl-file-content>
         <bl-file-content *ngIf="poolId && nodeId" [poolId]="poolId" [nodeId]="nodeId" [filename]="filename"></bl-file-content>
-    </md-card>
+    </div>
 </div>
diff --git a/app/components/file/details/file-details.module.ts b/app/components/file/details/file-details.module.ts
index a6e081a16c..25e4d4651c 100644
--- a/app/components/file/details/file-details.module.ts
+++ b/app/components/file/details/file-details.module.ts
@@ -1,10 +1,15 @@
 import { NgModule } from "@angular/core";
 
 import { commonModules } from "app/common";
+import { FileTooLargeComponent } from "app/components/file/details/file-too-large";
+import { CodeFileViewerComponent } from "./code-file-viewer";
 import { FileContentComponent } from "./file-content.component";
 import { FileDetailsComponent } from "./file-details.component";
+import { ImageFileViewerComponent } from "./image-file-viewer";
+import { LogFileViewerComponent } from "./log-file-viewer";
 
-const components = [FileContentComponent, FileDetailsComponent];
+const components = [FileContentComponent, FileDetailsComponent, FileTooLargeComponent,
+ LogFileViewerComponent, ImageFileViewerComponent, CodeFileViewerComponent];
 
 @NgModule({
     declarations: components,
diff --git a/app/components/file/details/file-too-large/file-too-large.component.ts b/app/components/file/details/file-too-large/file-too-large.component.ts
new file mode 100644
index 0000000000..3b9cdc9345
--- /dev/null
+++ b/app/components/file/details/file-too-large/file-too-large.component.ts
@@ -0,0 +1,56 @@
+import { Component, Input } from "@angular/core";
+import { ElectronRemote, ElectronShell } from "app/services";
+
+import { NotificationService } from "app/components/base/notifications";
+import { File } from "app/models";
+import { FileLoader } from "app/services/file";
+import "./file-too-large.scss";
+
+@Component({
+    selector: "bl-file-too-large",
+    templateUrl: "file-too-large.html",
+})
+export class FileTooLargeComponent {
+    @Input()
+    public file: File;
+
+    @Input()
+    public fileLoader: FileLoader;
+
+    public downloading = false;
+
+    constructor(
+        private shell: ElectronShell,
+        private remote: ElectronRemote,
+        private notificationService: NotificationService,
+    ) { }
+
+    public download() {
+        this.downloading = true;
+        const dialog = this.remote.dialog;
+        const pathToFile = dialog.showSaveDialog({
+            buttonLabel: "Download",
+            // Set default filename of file to download
+            defaultPath: this.file.name,
+        });
+
+        if (!pathToFile) {
+            return;
+        }
+        this.fileLoader.download(pathToFile).subscribe(() => {
+            this.downloading = false;
+
+            this.shell.showItemInFolder(pathToFile);
+            this.notificationService.success("Download complete!", `File was saved locally at ${pathToFile}`);
+        });
+    }
+
+    public open() {
+        this.downloading = true;
+
+        this.fileLoader.cache().subscribe((pathToFile) => {
+            this.downloading = false;
+            this.shell.openExternal(pathToFile);
+        });
+    }
+}
diff --git a/app/components/file/details/file-too-large/file-too-large.html b/app/components/file/details/file-too-large/file-too-large.html
new file mode 100644
index 0000000000..1e240f1d5e
--- /dev/null
+++ b/app/components/file/details/file-too-large/file-too-large.html
@@ -0,0 +1,11 @@
+<md-card>
+    <h2> This file is too large to preview in as code.</h2>
+
+    <button (click)="open()" [disabled]="downloading">
+        Open
+    </button>
+
+    <button (click)="download()" [disabled]="downloading">
+        Download
+    </button>
+</md-card>
diff --git a/app/components/file/details/file-too-large/file-too-large.scss b/app/components/file/details/file-too-large/file-too-large.scss
new file mode 100644
index 0000000000..8a3dbbeb6d
--- /dev/null
+++ b/app/components/file/details/file-too-large/file-too-large.scss
@@ -0,0 +1,19 @@
+@import "app/styles/variables";
+
+bl-file-too-large {
+    button {
+        padding: 10px;
+        cursor: pointer;
+        background: map-get($primary, 300);
+        color: $whitesmoke;
+
+        &:hover {
+            background: map-get($primary, 500);
+        }
+
+        &[disabled] {
+            cursor: not-allowed;
+            background: $alto;
+        }
+    }
+}
diff --git a/app/components/file/details/file-too-large/index.ts b/app/components/file/details/file-too-large/index.ts
new file mode 100644
index 0000000000..1dc7c5eeb2
--- /dev/null
+++ b/app/components/file/details/file-too-large/index.ts
@@ -0,0 +1 @@
+export * from "./file-too-large.component";
diff --git a/app/components/file/details/image-file-viewer/image-file-viewer.component.ts b/app/components/file/details/image-file-viewer/image-file-viewer.component.ts
new file mode 100644
index 0000000000..cfa69e5847
--- /dev/null
+++ b/app/components/file/details/image-file-viewer/image-file-viewer.component.ts
@@ -0,0 +1,28 @@
+import { Component, Input, OnChanges } from "@angular/core";
+
+import { LoadingStatus } from "app/components/base/loading";
+import { FileLoader } from "app/services/file";
+import "./image-file-viewer.scss";
+
+@Component({
+    selector: "bl-image-file-viewer",
+    templateUrl: "image-file-viewer.html",
+})
+export class ImageFileViewerComponent implements OnChanges {
+    @Input() public fileLoader: FileLoader;
+
+    public src: string;
+    public loadingStatus = LoadingStatus.Loading;
+
+    public ngOnChanges(changes) {
+        this._loadImage();
+    }
+
+    private _loadImage() {
+        this.loadingStatus = LoadingStatus.Loading;
+        this.fileLoader.cache().subscribe((destination) => {
+            this.src = `file://${destination}`;
+            this.loadingStatus = LoadingStatus.Ready;
+        });
+    }
+}
diff --git a/app/components/file/details/image-file-viewer/image-file-viewer.html b/app/components/file/details/image-file-viewer/image-file-viewer.html
new file mode 100644
index 0000000000..95a86ffdd8
--- /dev/null
+++ b/app/components/file/details/image-file-viewer/image-file-viewer.html
@@ -0,0 +1,5 @@
+<bl-loading [status]="loadingStatus">
+    <div class="img-container">
+        <img [src]="src" *ngIf="src">
+    </div>
+</bl-loading>
diff --git a/app/components/file/details/image-file-viewer/image-file-viewer.scss b/app/components/file/details/image-file-viewer/image-file-viewer.scss
new file mode 100644
index 0000000000..1a5951cbab
--- /dev/null
+++ b/app/components/file/details/image-file-viewer/image-file-viewer.scss
@@ -0,0 +1,16 @@
+bl-image-file-viewer {
+    display: block;
+    min-height: 100px;
+    position: relative;
+
+    .img-container {
+        display: flex;
+        align-items: center;
+        width: 100%;
+        justify-content: center;
+    }
+
+    img {
+        max-width: calc(100% - 5px);
+    }
+}
diff --git a/app/components/file/details/image-file-viewer/index.ts b/app/components/file/details/image-file-viewer/index.ts
new file mode 100644
index 0000000000..e56b31b7a7
--- /dev/null
+++ b/app/components/file/details/image-file-viewer/index.ts
@@ -0,0 +1 @@
+export * from "./image-file-viewer.component";
diff --git a/app/components/file/details/log-file-viewer/index.ts b/app/components/file/details/log-file-viewer/index.ts
new file mode 100644
index 0000000000..dd3a2eda57
--- /dev/null
+++ b/app/components/file/details/log-file-viewer/index.ts
@@ -0,0 +1 @@
+export * from "./log-file-viewer.component";
diff --git a/app/components/file/details/log-file-viewer/log-file-viewer.component.ts b/app/components/file/details/log-file-viewer/log-file-viewer.component.ts
new file mode 100644
index 0000000000..a5d8c68c67
--- /dev/null
+++ b/app/components/file/details/log-file-viewer/log-file-viewer.component.ts
@@ -0,0 +1,199 @@
+import { AfterViewInit, Component, ElementRef, Input, OnChanges, OnDestroy } from "@angular/core";
+import { Subscription } from "rxjs";
+
+import { ScrollableComponent, ScrollableService } from "app/components/base/scrollable";
+import { File, ServerError } from "app/models";
+import { TaskService } from "app/services";
+import { FileLoader } from "app/services/file";
+import { Constants, log } from "app/utils";
+
+import "./log-file-viewer.scss";
+
+const maxSize = 300000; // 300KB
+
+@Component({
+    selector: "bl-log-file-viewer",
+    templateUrl: "log-file-viewer.html",
+})
+export class LogFileViewerComponent implements OnChanges, OnDestroy, AfterViewInit {
+    @Input() public fileLoader: FileLoader;
+
+    @Input() public tail: boolean = false;
+
+    public file: File;
+    public fileTooLarge = false;
+    public followingLog = false;
+    public lastContentLength = 0;
+    public lines = [];
+    public loading = true;
+    public scrollable: ScrollableComponent;
+    public currentSubscription: Subscription;
+
+    public nodeNotFound = false;
+    public fileCleanupOperation = false;
+    public fileContentFailure = false;
+
+    private _refreshInterval;
+
+    constructor(
+        private scrollableService: ScrollableService,
+        taskService: TaskService,
+        private element: ElementRef) {
+    }
+
+    public ngAfterViewInit() {
+        this.scrollable = this.scrollableService.getParentSrollable(this.element.nativeElement);
+    }
+
+    public ngOnChanges(changes) {
+        if (this._refreshInterval) {
+            clearInterval(this._refreshInterval);
+        }
+
+        if (this.currentSubscription) {
+            this.currentSubscription.unsubscribe();
+        }
+
+        this.lines = [];
+        this.loading = true;
+        this.lastContentLength = 0;
+        this.nodeNotFound = false;
+        this.fileCleanupOperation = false;
+        this.fileContentFailure = false;
+
+        this._updateFileContent();
+        this._setRefreshInterval();
+    }
+
+    public ngOnDestroy() {
+        // clear the refresh when the user navigates away
+        clearInterval(this._refreshInterval);
+    }
+
+    public toggleFollowLog() {
+        this.followingLog = !this.followingLog;
+        if (this.followingLog) {
+            this._scrollToBottom();
+        }
+    }
+
+    /**
+     * Set the interval for refresh only if checking a task file.
+     */
+    private _setRefreshInterval() {
+        if (!this.tail) {
+            return;
+        }
+
+        this._refreshInterval = setInterval(() => {
+            this._updateFileContent();
+        }, 5000);
+    }
+
+    private _updateFileContent() {
+        this.fileTooLarge = false;
+        this.currentSubscription = this.fileLoader.properties().subscribe({
+            next: (file: File) => {
+                this.file = file;
+                this._processProperties(file);
+            },
+            error: (e) => {
+                this._processError(e);
+            },
+        });
+    }
+
+    /**
+     * Load the content of the file up to the given byte from the last number it loaded.
+     * @param newContentLength Number of bytes to get the content to
+     *
+     * @example
+     * this._loadUpTo(100); //=> Loads bytes 0-100
+     * this._loadUpTo(300); //=> Loads bytes 100-300
+     */
+    private _loadUpTo(newContentLength: number) {
+        const options = {
+            rangeStart: this.lastContentLength,
+            rangeEnd: newContentLength,
+        };
+
+        this.currentSubscription = this.fileLoader.content(options).subscribe((result) => {
+            this._processFileContent(result, newContentLength);
+        }, (error) => {
+            this._processError(error);
+        });
+    }
+
+    /**
+     * Process the properties of the file and check if we need to load more content.
+     */
+    private _processProperties(file: File) {
+        if (!(file && file.properties)) {
+            return;
+        }
+        const contentLength = file.properties.contentLength;
+        if (contentLength > maxSize) {
+            this.loading = false;
+            this.fileTooLarge = true;
+            return;
+        }
+
+        if (contentLength === 0) {
+            this.loading = false;
+        } else if (contentLength !== this.lastContentLength) {
+            this._loadUpTo(contentLength);
+        }
+    }
+
+    private _processFileContent(result: any, newContentLength: number) {
+        this.lastContentLength = newContentLength;
+        const newLines = result.content.toString().split("\n");
+        let first = "";
+        if (newLines.length > 1) {
+            first = newLines.shift();
+        }
+
+        if (this.lines.length === 0) {
+            this.lines = [first];
+        } else {
+            this.lines[this.lines.length - 1] += first;
+        }
+
+        this.lines = this.lines.concat(newLines);
+        if (this.followingLog) {
+            setTimeout(() => {
+                this._scrollToBottom();
+            });
+        }
+
+        this.loading = false;
+        this.currentSubscription = null;
+    }
+
+    private _processError(e: ServerError) {
+        this.currentSubscription = null;
+        this.loading = false;
+
+        clearInterval(this._refreshInterval);
+        if (e.status === Constants.HttpCode.NotFound) {
+            this.nodeNotFound = true;
+            return;
+        } else if (e.status === Constants.HttpCode.Conflict) {
+            this.fileCleanupOperation = true;
+            return;
+        } else if (!e.status && e.body.message.startsWith("An incorrect number of bytes")) {
+            // gets an undefined error code for binary files.
+            this.fileContentFailure = true;
+            return;
+        }
+
+        log.error(`[FileContent.component] Error is ${e.status}`, e);
+    }
+
+    private _scrollToBottom() {
+        if (this.scrollable) {
+            // TODO: make a scrollToBottom
+            this.scrollable.scrollToBottom();
+        }
+    }
+}
diff --git a/app/components/file/details/log-file-viewer/log-file-viewer.html b/app/components/file/details/log-file-viewer/log-file-viewer.html
new file mode 100644
index 0000000000..ebd0241b4b
--- /dev/null
+++ b/app/components/file/details/log-file-viewer/log-file-viewer.html
@@ -0,0 +1,30 @@
+<div class="log-console" *ngIf="!nodeNotFound && !fileContentFailure && !fileCleanupOperation && !fileTooLarge">
+    <div class="follow-log-btn" [class.following]="followingLog" (click)="toggleFollowLog()">
+        <i class="fa fa-circle"></i>
+        <span>Follow log</span>
+    </div>
+    <div class="log-container">
+        <bl-simple-loading *ngIf="loading"></bl-simple-loading>
+        <div class="line" *ngFor="let line of lines">
+            <span class="line-nb"></span>
+            <span class="line-content">{{line}}</span>
+        </div>
+    </div>
+    <div class="follow-log-btn bottom" [class.following]="followingLog" (click)="followingLog = !followingLog">
+        <i class="fa fa-circle"></i>
+        <span>Follow log</span>
+    </div>
+</div>
+
+<div *ngIf="nodeNotFound" class="notfound-message">
+    The node this task ran on, or the file was not found.
+</div>
+
+<div *ngIf="fileCleanupOperation" class="notfound-message">
+    The files for the specified task have been cleaned from the node.
+</div>
+
+<div *ngIf="fileContentFailure" class="notfound-message">
+    The contents of the file was unable to be read. Try downloading the file.
+</div>
+<bl-file-too-large [file]="file" [fileLoader]="fileLoader" *ngIf="fileTooLarge"></bl-file-too-large>
diff --git a/app/styles/file/log.scss b/app/components/file/details/log-file-viewer/log-file-viewer.scss
similarity index 95%
rename from app/styles/file/log.scss
rename to app/components/file/details/log-file-viewer/log-file-viewer.scss
index c2520bc054..a59f861cc0 100644
--- a/app/styles/file/log.scss
+++ b/app/components/file/details/log-file-viewer/log-file-viewer.scss
@@ -1,3 +1,5 @@
+@import "app/styles/variables";
+
 .log-console {
     $file-content-bg: #222;
 
@@ -68,7 +70,7 @@
         }
 
         &.following {
-            background: $green;
+            background: map-get($success, 500);
             color: $whiteSmoke-darker;
         }
     }
diff --git a/app/components/job/action/add/pool-picker.component.ts b/app/components/job/action/add/pool-picker.component.ts
index 410d11f2c8..8bbcf83be4 100644
--- a/app/components/job/action/add/pool-picker.component.ts
+++ b/app/components/job/action/add/pool-picker.component.ts
@@ -91,7 +91,7 @@ export class PoolPickerComponent implements ControlValueAccessor, OnInit, OnDest
 
     public poolCoreCount(pool: Pool) {
         const cores = this.poolCores[pool.id] || 1;
-        return cores * pool.targetDedicated;
+        return cores * pool.targetNodes;
     }
 
     private _computeOptions(query: string = null) {
diff --git a/app/components/job/action/delete/delete-job-action.ts b/app/components/job/action/delete/delete-job-action.ts
index eaa99f322f..7255d2d326 100644
--- a/app/components/job/action/delete/delete-job-action.ts
+++ b/app/components/job/action/delete/delete-job-action.ts
@@ -47,23 +47,17 @@ export class WaitForDeleteJobPoller {
     @autobind()
     public start(progress: BehaviorSubject<any>): Observable<any> {
         const obs = new AsyncSubject();
-        const data = this.jobService.get(this.jobId);
-        const errorCallback = (e) => {
-            progress.next(100);
-            clearInterval(interval);
-            obs.complete();
-        };
-
         let interval = setInterval(() => {
-            data.fetch().subscribe({
-                error: errorCallback,
+            this.jobService.getOnce(this.jobId).subscribe({
+                error: (e) => {
+                    progress.next(100);
+                    clearInterval(interval);
+                    obs.complete();
+                },
             });
         }, 5000);
 
         progress.next(-1);
-        data.item.subscribe({
-            error: errorCallback,
-        });
 
         return obs;
     }
diff --git a/app/components/job/browse/job-list.component.ts b/app/components/job/browse/job-list.component.ts
index e0254368e9..7f67b04aa6 100644
--- a/app/components/job/browse/job-list.component.ts
+++ b/app/components/job/browse/job-list.component.ts
@@ -12,7 +12,7 @@ import { QuickListComponent, QuickListItemStatus } from "app/components/base/qui
 import { ListOrTableBase } from "app/components/base/selectable-list";
 import { TableComponent } from "app/components/base/table";
 import { Job, JobState } from "app/models";
-import { SchedulingErrorDecorator } from "app/models/decorators";
+import { FailureInfoDecorator } from "app/models/decorators";
 import { JobService } from "app/services";
 import { RxListProxy } from "app/services/core";
 import { Filter } from "app/utils/filter-builder";
@@ -73,7 +73,7 @@ export class JobListComponent extends ListOrTableBase implements OnInit, OnDestr
         this.data = this.jobService.list(this._baseOptions);
         this.status = this.data.status;
         this._onJobAddedSub = jobService.onJobAdded.subscribe((jobId) => {
-            this.data.loadNewItem(jobService.get(jobId));
+            this.data.loadNewItem(jobService.getOnce(jobId));
         });
     }
 
@@ -91,7 +91,7 @@ export class JobListComponent extends ListOrTableBase implements OnInit, OnDestr
     }
 
     public jobStatus(job: Job): QuickListItemStatus {
-        if (job.executionInfo && job.executionInfo.schedulingError) {
+        if (job.executionInfo && job.executionInfo.failureInfo) {
             return QuickListItemStatus.warning;
         } else {
             switch (job.state) {
@@ -112,8 +112,8 @@ export class JobListComponent extends ListOrTableBase implements OnInit, OnDestr
     }
 
     public jobStatusText(job: Job): string {
-        if (job.executionInfo && job.executionInfo.schedulingError) {
-            return new SchedulingErrorDecorator(job.executionInfo.schedulingError).summary;
+        if (job.executionInfo && job.executionInfo.failureInfo) {
+            return new FailureInfoDecorator(job.executionInfo.failureInfo).summary;
         } else {
             switch (job.state) {
                 case JobState.completed:
diff --git a/app/components/job/details/error-display/job-error-display.component.ts b/app/components/job/details/error-display/job-error-display.component.ts
index 2fda17cfd7..bb9b78f939 100644
--- a/app/components/job/details/error-display/job-error-display.component.ts
+++ b/app/components/job/details/error-display/job-error-display.component.ts
@@ -23,9 +23,9 @@ export class JobErrorDisplayComponent {
         return this.job && this.job.executionInfo;
     }
 
-    public get schedulingError() {
+    public get failureInfo() {
         const info = this.executionInfo;
-        return info && info.schedulingError;
+        return info && info.failureInfo;
     }
 
     public get jobFailed() {
diff --git a/app/components/job/details/error-display/job-error-display.html b/app/components/job/details/error-display/job-error-display.html
index 3ba95cd1db..4f301835c7 100644
--- a/app/components/job/details/error-display/job-error-display.html
+++ b/app/components/job/details/error-display/job-error-display.html
@@ -4,13 +4,13 @@
 <bl-banner *ngIf="jobTimeout" type="warning">
     <div message>Job timed out after running for {{jobRunningTime}}.</div>
 </bl-banner>
-<bl-banner *ngIf="schedulingError" type="warning">
-    <div message>{{schedulingError.message}}</div>
-    <div code>{{schedulingError.code}}</div>
-    <div message>{{schedulingError.message}}</div>
-    <div details *ngIf="schedulingError.details.size !== 0">
-        <div *ngFor="let entry of schedulingError.details">
-            <div>{{entry.key}}: {{entry.value}}</div>
+<bl-banner *ngIf="failureInfo" type="warning">
+    <div message>{{failureInfo.message}}</div>
+    <div code>{{failureInfo.code}}</div>
+    <div message>{{failureInfo.message}}</div>
+    <div details *ngIf="failureInfo.details.size !== 0">
+        <div *ngFor="let entry of failureInfo.details">
+            <div>{{entry.name}}: {{entry.value}}</div>
         </div>
     </div>
 </bl-banner>
diff --git a/app/components/job/details/job-configuration.component.ts b/app/components/job/details/job-configuration.component.ts
index ef1ab7e003..1a53f4440c 100644
--- a/app/components/job/details/job-configuration.component.ts
+++ b/app/components/job/details/job-configuration.component.ts
@@ -18,11 +18,6 @@ export class JobConfigurationComponent {
     @Input()
     public set job(job: Job) {
         this._job = job;
-        if (job && job.executionInfo) {
-            this.hasStartTime = Boolean(job.executionInfo.startTime);
-            this.hasEndTime = Boolean(job.executionInfo.endTime);
-        }
-
         this.refresh(job);
     }
     public get job() { return this._job; }
@@ -33,11 +28,9 @@ export class JobConfigurationComponent {
     public managerTask: JobManagerTaskDecorator;
     public prepTask: JobPreparationTaskDecorator;
     public releaseTask: JobReleaseTaskDecorator;
-    public environmentSettings: NameValuePair[] = [];
+    public environmentSettings: List<NameValuePair> = List([]);
     public jobMetadata: List<Metadata> = List([]);
     public poolInfo: any = {};
-    public hasStartTime: boolean;
-    public hasEndTime: boolean;
 
     private _job: Job;
 
@@ -50,7 +43,7 @@ export class JobConfigurationComponent {
             this.prepTask = this.decorator.jobPreparationTask;
             this.releaseTask = this.decorator.jobReleaseTask;
             this.poolInfo = this.decorator.poolInfo || {};
-            this.environmentSettings = this.job.commonEnvironmentSettings || [];
+            this.environmentSettings = this.job.commonEnvironmentSettings;
             this.jobMetadata = this.job.metadata;
         }
     }
diff --git a/app/components/job/details/job-configuration.html b/app/components/job/details/job-configuration.html
index eb3e0d6a58..9b7267aa66 100644
--- a/app/components/job/details/job-configuration.html
+++ b/app/components/job/details/job-configuration.html
@@ -22,32 +22,68 @@
 
     <bl-property-group label="Environment settings" class="wide" [collapsed]="true">
         <div collapsed-preview>
-            <span>{{environmentSettings?.length}} environment settings</span>
+            <span>{{environmentSettings?.size}} environment settings</span>
         </div>
         <bl-text-property *ngFor="let setting of environmentSettings" label="{{setting.name}}" [value]="setting.value"></bl-text-property>
-        <bl-no-item [itemCount]="environmentSettings.length" [slimline]="true">
+        <bl-no-item [itemCount]="environmentSettings.size" [slimline]="true">
             <span no-filter>This job contains no environment settings</span>
         </bl-no-item>
     </bl-property-group>
 
     <bl-property-group label="Execution information" class="wide" [collapsed]="true">
         <div collapsed-preview>
-            <span *ngIf="!hasStartTime">Job not started</span>
-            <span *ngIf="hasStartTime">Job started {{executionInfo.startTime}}</span>
-            <span *ngIf="hasEndTime"> and ended {{executionInfo.endTime}}</span>
+            <span *ngIf="!executionInfo.runtime">Job not started</span>
+            <span *ngIf="executionInfo.runtime && !job?.executionInfo?.endTime">Currently active for: {{ executionInfo.runtime }}</span>
+            <span *ngIf="job?.executionInfo?.endTime">Completed in: {{ executionInfo.runtime }}</span>
         </div>
 
         <bl-text-property label="Start time" [value]="executionInfo.startTime"></bl-text-property>
         <bl-text-property label="End time" [value]="executionInfo.endTime"></bl-text-property>
+        <bl-text-property label="Execution time" [value]="executionInfo.runtime"></bl-text-property>
         <bl-text-property label="Termination reason" [value]="executionInfo.terminateReason"></bl-text-property>
     </bl-property-group>
 
     <bl-property-group *ngIf="job.jobManagerTask" label="Job manager task" class="wide" [collapsed]="true">
         <div collapsed-preview></div>
-        <bl-void-link-property label="Id" [value]="managerTask.id"></bl-void-link-property>
+        <bl-link-property label="Id" [value]="managerTask.id" [link]="['/jobs', job.id, 'tasks', managerTask.id]"></bl-link-property>
+        <bl-text-property label="Display name" [value]="managerTask.displayName" *ngIf="managerTask.displayName"></bl-text-property>
+        <bl-text-property label="Command line" [value]="managerTask.commandLine"></bl-text-property>
+        <bl-text-property label="Max task retry count" [value]="managerTask.constraints.maxTaskRetryCount"></bl-text-property>
+        <bl-text-property label="Max wall-clock time" [value]="managerTask.constraints.maxWallClockTime"></bl-text-property>
+        <bl-text-property label="Retention time" [value]="managerTask.constraints.retentionTime"></bl-text-property>
         <bl-bool-property label="Kill job on completion" [value]="managerTask.killJobOnCompletion" YesNo="true"></bl-bool-property>
         <bl-bool-property label="Run elevated" [value]="managerTask.runElevated" YesNo="true"></bl-bool-property>
         <bl-bool-property label="Run exclusive" [value]="managerTask.runExclusive" YesNo="true"></bl-bool-property>
+        <bl-table-property *ngIf="managerTask.applicationPackageReferences.length > 0" label="Package references">
+            <bl-table-property-header>
+                <div tp-column>Application</div>
+                <div tp-column>Version</div>
+            </bl-table-property-header>
+            <bl-table-property-row *ngFor="let package of managerTask.applicationPackageReferences">
+                <bl-tp-cell [value]="package.applicationId"></bl-tp-cell>
+                <bl-tp-cell [value]="package.version"></bl-tp-cell>
+            </bl-table-property-row>
+        </bl-table-property>
+        <bl-table-property *ngIf="managerTask.environmentSettings.length > 0" label="Environment settings">
+            <bl-table-property-header>
+                <div tp-column>Key</div>
+                <div tp-column>Value</div>
+            </bl-table-property-header>
+            <bl-table-property-row *ngFor="let setting of managerTask.environmentSettings">
+                <bl-tp-cell [value]="setting.name"></bl-tp-cell>
+                <bl-tp-cell [value]="setting.value"></bl-tp-cell>
+            </bl-table-property-row>
+        </bl-table-property>
+        <bl-table-property *ngIf="managerTask.resourceFiles.length > 0" label="Resource files">
+            <bl-table-property-header>
+                <div tp-column>Blob source</div>
+                <div tp-column>File path</div>
+            </bl-table-property-header>
+            <bl-table-property-row *ngFor="let file of managerTask.resourceFiles">
+                <bl-tp-cell [value]="file.blobSource"></bl-tp-cell>
+                <bl-tp-cell [value]="file.filePath"></bl-tp-cell>
+            </bl-table-property-row>
+        </bl-table-property>
     </bl-property-group>
 
     <bl-property-group *ngIf="job.jobPreparationTask" label="Job preparation task" class="wide" [collapsed]="true">
@@ -60,7 +96,7 @@
         <bl-bool-property label="Wait for success" [value]="prepTask.waitForSuccess" YesNo="true"></bl-bool-property>
         <bl-bool-property label="Run elevated" [value]="prepTask.runElevated" YesNo="true"></bl-bool-property>
         <bl-bool-property label="Re-run on node reboot" [value]="prepTask.rerunOnNodeRebootAfterSuccess" YesNo="true"></bl-bool-property>
-        <bl-table-property label="Resource files">
+        <bl-table-property *ngIf="prepTask.resourceFiles.length > 0" label="Resource files">
             <bl-table-property-header>
                 <div tp-column>Blob source</div>
                 <div tp-column>File path</div>
@@ -70,7 +106,7 @@
                 <bl-tp-cell [value]="file.filePath"></bl-tp-cell>
             </bl-table-property-row>
         </bl-table-property>
-        <bl-table-property label="Environment settings">
+        <bl-table-property *ngIf="prepTask.environmentSettings.length > 0" label="Environment settings">
             <bl-table-property-header>
                 <div tp-column>Key</div>
                 <div tp-column>Value</div>
@@ -89,7 +125,7 @@
         <bl-text-property label="Max wall-clock time" [value]="releaseTask.maxWallClockTime"></bl-text-property>
         <bl-text-property label="Retention time" [value]="releaseTask.retentionTime"></bl-text-property>
         <bl-bool-property label="Run elevated" [value]="releaseTask.runElevated" YesNo="true"></bl-bool-property>
-        <bl-table-property label="Resource files">
+        <bl-table-property *ngIf="releaseTask.resourceFiles.length > 0" label="Resource files">
             <bl-table-property-header>
                 <div tp-column>Blob source</div>
                 <div tp-column>File path</div>
@@ -99,7 +135,7 @@
                 <bl-tp-cell [value]="file.filePath"></bl-tp-cell>
             </bl-table-property-row>
         </bl-table-property>
-        <bl-table-property label="Environment settings">
+        <bl-table-property *ngIf="releaseTask.environmentSettings.length > 0" label="Environment settings">
             <bl-table-property-header>
                 <div tp-column>Key</div>
                 <div tp-column>Value</div>
@@ -113,10 +149,10 @@
 
     <bl-property-group label="Metadata" class="wide" [collapsed]="true">
         <div collapsed-preview>
-            <span>{{jobMetadata?.length}} meta items</span>
+            <span>{{jobMetadata?.size}} meta items</span>
         </div>
         <bl-text-property *ngFor="let metaItem of jobMetadata" label="{{metaItem.name}}" [value]="metaItem.value"></bl-text-property>
-        <bl-no-item [itemCount]="jobMetadata.length" [slimline]="true">
+        <bl-no-item [itemCount]="jobMetadata.size" [slimline]="true">
             <span no-filter>This job contains no metadata</span>
         </bl-no-item>
     </bl-property-group>
diff --git a/app/components/job/details/job-details.component.ts b/app/components/job/details/job-details.component.ts
index 0b10dda18f..e391655f19 100644
--- a/app/components/job/details/job-details.component.ts
+++ b/app/components/job/details/job-details.component.ts
@@ -38,6 +38,8 @@ export class JobDetailsComponent implements OnInit, OnDestroy {
     public decorator: JobDecorator;
     public data: RxEntityProxy<JobParams, Job>;
 
+    public hasHookTask = false;
+
     private _paramsSubscriber: Subscription;
 
     constructor(
@@ -51,6 +53,7 @@ export class JobDetailsComponent implements OnInit, OnDestroy {
         this.data = this.jobService.get(null, {});
         this.data.item.subscribe((job) => {
             this.job = job;
+            this.hasHookTask = Boolean(job && job.jobPreparationTask);
             if (job) {
                 this.decorator = new JobDecorator(job);
             }
@@ -73,6 +76,7 @@ export class JobDetailsComponent implements OnInit, OnDestroy {
 
     public ngOnDestroy() {
         this._paramsSubscriber.unsubscribe();
+        this.data.dispose();
     }
 
     public get filterPlaceholderText() {
diff --git a/app/components/job/details/job-details.html b/app/components/job/details/job-details.html
index ff4d685f58..7b9ab124c3 100644
--- a/app/components/job/details/job-details.html
+++ b/app/components/job/details/job-details.html
@@ -1,34 +1,28 @@
 <bl-loading [status]="data.newDataStatus | async">
     <div *ngIf="job">
         <md-card class="overview">
-            <div class="main-content">
+            <div class="actions">
+                <bl-action-btn-group>
+                    <bl-refresh-btn [refresh]="refresh"></bl-refresh-btn>
+                    <bl-add-task-button title="Add task" [job]="job" (action)="addTask()"></bl-add-task-button>
+                    <bl-terminate-button [entity]="job" (action)="terminateJob()"></bl-terminate-button>
+                    <bl-delete-button [entity]="job" (action)="deleteJob()"></bl-delete-button>
+                    <bl-disable-button [job]="job" (action)="disableJob()"></bl-disable-button>
+                    <bl-enable-button [job]="job" (action)="enableJob()"></bl-enable-button>
+                    <bl-clone-button (action)="cloneJob()"></bl-clone-button>
+                </bl-action-btn-group>
+            </div>
+            <div class="content">
                 <div class="info">
-                    <md-card-title-group style="margin: 0px;">
-                        <div style="align-items:center;">
-                            <bl-refresh-btn [refresh]="refresh"></bl-refresh-btn>
-                        </div>
-                        <div style="margin-left:12px; margin-right:auto;">
-                            <md-card-title>{{decorator.id}}</md-card-title>
-                            <md-card-subtitle><i class="fa" [ngClass]="decorator.stateIcon"></i> {{decorator.state}}</md-card-subtitle>
-                        </div>
-                    </md-card-title-group>
-                    <div class="additional-info">
-                        Pool: <a [routerLink]="['/pools', job.poolId]">{{job.poolId}}</a>
-                        <bl-tags [tags]="job.tags" [editable]="true" [save]="updateTags" noTagsMessage="No tags."></bl-tags>
-                    </div>
+                    <md-card-title>{{decorator.id}}</md-card-title>
+                    <md-card-subtitle><i class="fa" [ngClass]="decorator.stateIcon"></i> {{decorator.state}}</md-card-subtitle>
+                    Pool: <a [routerLink]="['/pools', job.poolId]">{{job.poolId}}</a>
+                    <bl-tags [tags]="job.tags" [editable]="job.editable" [save]="updateTags" noTagsMessage="No tags."></bl-tags>
                 </div>
-                <md-card-content>
-                    <bl-job-progress-status [job]="job" [poolId]="job.poolId"></bl-job-progress-status>
-                </md-card-content>
             </div>
-            <md-card-actions layout="row" layout-align="end center">
-                <bl-add-task-button title="Add task" [job]="job" (click)="addTask()"></bl-add-task-button>
-                <bl-terminate-button [entity]="job" (click)="terminateJob()"></bl-terminate-button>
-                <bl-delete-button [entity]="job" (click)="deleteJob()"></bl-delete-button>
-                <bl-disable-button [job]="job" (click)="disableJob()"></bl-disable-button>
-                <bl-enable-button [job]="job" (click)="enableJob()"></bl-enable-button>
-                <bl-clone-button (click)="cloneJob()"></bl-clone-button>
-            </md-card-actions>
+            <div class="tile">
+                <bl-job-progress-status [job]="job" [poolId]="job.poolId"></bl-job-progress-status>
+            </div>
         </md-card>
         <bl-job-error-display [job]="job"></bl-job-error-display>
         <md-card class="details">
@@ -46,6 +40,10 @@
                     <bl-tab-label>Configuration</bl-tab-label>
                     <bl-job-configuration [job]="job"></bl-job-configuration>
                 </bl-tab>
+                <bl-tab key="hooktasks" [disabled]="!hasHookTask">
+                    <bl-tab-label>Prep/Release tasks</bl-tab-label>
+                    <bl-job-hook-task-browser [job]="job" *ngIf="hasHookTask"></bl-job-hook-task-browser>
+                </bl-tab>
             </bl-tab-group>
         </md-card>
     </div>
diff --git a/app/components/job/details/job-details.module.ts b/app/components/job/details/job-details.module.ts
index 53e993e00e..f94d7f957d 100644
--- a/app/components/job/details/job-details.module.ts
+++ b/app/components/job/details/job-details.module.ts
@@ -5,6 +5,7 @@ import { BaseModule } from "app/components/base";
 import { FileBrowseModule } from "app/components/file/browse";
 import { FileDetailsModule } from "app/components/file/details";
 import { TaskBrowseModule } from "app/components/task/browse";
+import { JobHookTaskModule } from "../job-hook-task";
 import { JobErrorDisplayComponent } from "./error-display";
 import { JobConfigurationComponent } from "./job-configuration.component";
 import { JobDefaultComponent } from "./job-default.component";
@@ -20,7 +21,7 @@ const components = [
 ];
 
 const modules = [
-    BaseModule, FileBrowseModule, FileDetailsModule, TaskBrowseModule,
+    BaseModule, FileBrowseModule, FileDetailsModule, TaskBrowseModule, JobHookTaskModule,
 ];
 
 @NgModule({
diff --git a/app/components/job/details/job-progress-status/job-progress-status.component.ts b/app/components/job/details/job-progress-status/job-progress-status.component.ts
index fae715e0bb..8590d9abad 100644
--- a/app/components/job/details/job-progress-status/job-progress-status.component.ts
+++ b/app/components/job/details/job-progress-status/job-progress-status.component.ts
@@ -3,9 +3,9 @@ import { List } from "immutable";
 import { Subscription } from "rxjs";
 
 import { GaugeConfig } from "app/components/base/graphs/gauge";
-import { Job, Node, Pool } from "app/models";
-import { NodeListParams, NodeService, PoolParams, PoolService } from "app/services";
-import { PollObservable, RxEntityProxy, RxListProxy } from "app/services/core";
+import { Job, Node, Pool, TaskState } from "app/models";
+import { NodeListParams, NodeService, PoolParams, PoolService, TaskService } from "app/services";
+import { PollObservable, PollService, RxEntityProxy, RxListProxy } from "app/services/core";
 
 const refreshRate = 5000;
 
@@ -33,19 +33,25 @@ export class JobProgressStatusComponent implements OnChanges, OnDestroy {
 
     private _polls: PollObservable[] = [];
     private _subs: Subscription[] = [];
-
-    constructor(poolService: PoolService, nodeService: NodeService) {
+    private _runningTaskCountForJob: number = 0;
+
+    constructor(
+        poolService: PoolService,
+        nodeService: NodeService,
+        private taskService: TaskService,
+        pollService: PollService,
+    ) {
         this.poolData = poolService.get(null);
         this.data = nodeService.list(null, {
             pageSize: 1000,
-            select: "recentTasks,id,state",
+            select: "id,state,runningTasksCount",
         });
 
         this.updateGaugeOptions();
 
         this._subs.push(this.poolData.item.subscribe((pool) => {
             this.pool = pool;
-            this.maxRunningTasks = pool ? pool.targetDedicated * pool.maxTasksPerNode : 1;
+            this.maxRunningTasks = pool ? pool.targetNodes * pool.maxTasksPerNode : 1;
             this.updateGaugeOptions();
         }));
 
@@ -59,6 +65,8 @@ export class JobProgressStatusComponent implements OnChanges, OnDestroy {
         }));
 
         this._polls.push(this.data.startPoll(refreshRate));
+
+        this._polls.push(pollService.startPoll("count-tasks", 10000, () => this._updateJobRunningTasks()));
     }
 
     public ngOnChanges(changes) {
@@ -66,24 +74,27 @@ export class JobProgressStatusComponent implements OnChanges, OnDestroy {
             this.poolData.params = ({ id: this.poolId });
             this.poolData.refresh();
             this.data.updateParams({ poolId: this.poolId });
-            this.data.refresh(false);
+            this.data.refreshAll(false);
+        }
+
+        if (changes.job) {
+            this._updateJobRunningTasks();
         }
     }
 
     public ngOnDestroy() {
         this._polls.forEach(x => x.destroy());
         this._subs.forEach(x => x.unsubscribe());
+        this.poolData.dispose();
     }
 
     public countRunningTasks() {
-        let taskCountPerNode;
         if (this.showAllPoolTasks) {
-            taskCountPerNode = this.nodes.map(x => x.runningTasks.size);
+            const taskCountPerNode = this.nodes.map(x => x.runningTasksCount);
+            this.runningTasksCount = taskCountPerNode.reduce((a, b) => a + b, 0);
         } else {
-            taskCountPerNode = this.nodes.map(x => x.runningTasks.filter(task => task.jobId === this.job.id).size);
+            this.runningTasksCount = this._runningTaskCountForJob;
         }
-
-        this.runningTasksCount = taskCountPerNode.reduce((a, b) => a + b, 0);
     }
 
     public updateGaugeOptions() {
@@ -104,4 +115,14 @@ export class JobProgressStatusComponent implements OnChanges, OnDestroy {
         this.countRunningTasks();
         this.updateGaugeOptions();
     }
+
+    private _updateJobRunningTasks() {
+        const obs = this.taskService.countTasks(this.job.id, TaskState.running);
+
+        obs.subscribe((x) => {
+            this._runningTaskCountForJob = x;
+            this.countRunningTasks();
+        });
+        return obs;
+    }
 }
diff --git a/app/components/job/home/job-home.html b/app/components/job/home/job-home.html
index 57b6aeaef3..13dda39be1 100644
--- a/app/components/job/home/job-home.html
+++ b/app/components/job/home/job-home.html
@@ -1,8 +1,7 @@
 <bl-list-and-show-layout #layout (listScrolledToBottom)="jobList.onScrollToBottom()" [list]="jobList">
     <div bl-list-buttons>
-        <button md-mini-fab color="primary" title="Add a job" (click)="addJob()">
-            <i class="fa fa-plus spin-hover"></i>
-        </button>
+        <bl-action-btn color="primary" type="round" icon="fa fa-plus spin-hover" title="Add a job" (action)="addJob()">
+        </bl-action-btn>
     </div>
     <div bl-list-content>
         <bl-focus-section>
diff --git a/app/components/job/job-hook-task/index.ts b/app/components/job/job-hook-task/index.ts
new file mode 100644
index 0000000000..51df75ee09
--- /dev/null
+++ b/app/components/job/job-hook-task/index.ts
@@ -0,0 +1 @@
+export * from "./job-hook-task.module";
diff --git a/app/components/job/job-hook-task/job-hook-task-browser/index.ts b/app/components/job/job-hook-task/job-hook-task-browser/index.ts
new file mode 100644
index 0000000000..d764f60008
--- /dev/null
+++ b/app/components/job/job-hook-task/job-hook-task-browser/index.ts
@@ -0,0 +1 @@
+export * from "./job-hook-task-browser.component";
diff --git a/app/components/job/job-hook-task/job-hook-task-browser/job-hook-task-browser.component.ts b/app/components/job/job-hook-task/job-hook-task-browser/job-hook-task-browser.component.ts
new file mode 100644
index 0000000000..20d760d1d0
--- /dev/null
+++ b/app/components/job/job-hook-task/job-hook-task-browser/job-hook-task-browser.component.ts
@@ -0,0 +1,125 @@
+import { Component, Input, OnChanges, OnDestroy, SimpleChanges } from "@angular/core";
+import { FormControl } from "@angular/forms";
+import { List } from "immutable";
+import { Subscription } from "rxjs";
+
+import { Job, JobHookTask, JobHookTaskResult, JobHookTaskState } from "app/models";
+import { JobHookTaskListParams, JobHookTaskService } from "app/services";
+import { RxListProxy } from "app/services/core";
+import { DateUtils } from "app/utils";
+import { FilterBuilder } from "app/utils/filter-builder";
+
+import "./job-hook-task-browser.scss";
+
+type HookTaskType = "preparationTask" | "releaseTask";
+const HookTaskType = {
+    preparationTask: "preparationTask" as HookTaskType,
+    releaseTask: "releaseTask" as HookTaskType,
+};
+
+@Component({
+    selector: "bl-job-hook-task-browser",
+    templateUrl: "job-hook-task-browser.html",
+})
+export class JobHookTaskBrowserComponent implements OnDestroy, OnChanges {
+    public HookTaskType = HookTaskType;
+
+    public onlyFailedControl = new FormControl(false);
+
+    @Input()
+    public job: Job;
+
+    public data: RxListProxy<JobHookTaskListParams, JobHookTask>;
+
+    public tasks: List<JobHookTask>;
+    public displayItems: any[];
+    public pickedTaskId: string;
+    public pickedTask: JobHookTask;
+
+    public type: HookTaskType = "preparationTask";
+    private _sub: Subscription;
+
+    constructor(jobHookTaskService: JobHookTaskService) {
+        this.data = jobHookTaskService.list();
+        this.data.items.subscribe((items) => {
+            this.tasks = items;
+            this._computeDisplayItems();
+        });
+
+        this._sub = this.onlyFailedControl.valueChanges.subscribe((onlyFailed) => {
+            const filter = FilterBuilder.prop("jobPreparationTaskExecutionInfo/exitCode").ne(0).toOData();
+            this.data.patchOptions({
+                filter: filter,
+            });
+            this.data.fetchNext();
+        });
+    }
+
+    public ngOnChanges(changes: SimpleChanges) {
+        if (changes.job) {
+            const { previousValue, currentValue } = changes.job;
+            if (previousValue && currentValue && previousValue.id === currentValue.id) {
+                return;
+            }
+            this.data.params = { jobId: this.job.id };
+            this.data.refresh();
+        }
+    }
+
+    public ngOnDestroy() {
+        this.data.dispose();
+        this._sub.unsubscribe();
+    }
+
+    public formatDate(date: Date) {
+        return DateUtils.prettyDate(date, 7);
+    }
+
+    public updateType(type) {
+        if (type === HookTaskType.releaseTask && !this.hasReleaseTask) {
+            return;
+        }
+        this.type = type;
+        this._computeDisplayItems();
+    }
+
+    public status(task: JobHookTask) {
+        const info = task[this.type];
+
+        if (!info) {
+            return "waiting";
+        }
+        const { state, result } = info;
+
+        if (state === JobHookTaskState.running) {
+            return "runnning";
+        } else if (result === JobHookTaskResult.success) {
+            return "success";
+        } else {
+            return "failure";
+        }
+    }
+
+    public pickTask(id: string) {
+        this.pickedTaskId = id;
+        this.pickedTask = this.tasks.filter(x => x.id === id).first();
+    }
+
+    public get hasReleaseTask() {
+        return Boolean(this.job.jobReleaseTask);
+    }
+
+    private _computeDisplayItems() {
+        this.displayItems = this.tasks.map((task) => {
+            const info = task[this.type];
+            return {
+                id: task.id,
+                nodeId: task.nodeId,
+                status: this.status(task),
+                startTime: this.formatDate(info && info.startTime),
+                endTime: this.formatDate(info && info.endTime),
+                exitCode: info && info.exitCode,
+            };
+        }).toArray();
+    }
+}
diff --git a/app/components/job/job-hook-task/job-hook-task-browser/job-hook-task-browser.html b/app/components/job/job-hook-task/job-hook-task-browser/job-hook-task-browser.html
new file mode 100644
index 0000000000..65bae66381
--- /dev/null
+++ b/app/components/job/job-hook-task/job-hook-task-browser/job-hook-task-browser.html
@@ -0,0 +1,39 @@
+<div class="filters">
+    <div style="padding: 10px; flex: 1">
+        <md-checkbox [formControl]="onlyFailedControl">Only failed</md-checkbox>
+    </div>
+    <div class="type-toggle">
+        <div class="option" (click)="updateType(HookTaskType.preparationTask)" [class.active]="type === HookTaskType.preparationTask">
+            Preparation Tasks
+        </div>
+        <div class="option" (click)="updateType(HookTaskType.releaseTask)" [class.active]="type === HookTaskType.releaseTask" [class.disabled]="!hasReleaseTask">
+            Release tasks
+        </div>
+    </div>
+</div>
+<div class="content">
+    <bl-table class="list" [activeItem]="pickedTaskId" (activeItemChange)="pickTask($event)">
+        <bl-thead>
+            <bl-column>NodeId</bl-column>
+            <bl-column style="width: 45px">Status</bl-column>
+            <bl-column style="width: 100px" *ngIf="!pickedTask">Started</bl-column>
+            <bl-column style="width: 100px" *ngIf="!pickedTask">Completed</bl-column>
+            <bl-column style="width: 100px">Exit code</bl-column>
+        </bl-thead>
+
+        <bl-row *ngFor="let task of displayItems; trackBy: task?.id" [key]="task.id">
+            <bl-cell>{{task.nodeId}}</bl-cell>
+            <bl-cell style="width: 45px" [title]="task.status">
+                <span *ngIf="task.status === 'running'" class="fa fa-spinner"></span>
+                <span *ngIf="task.status === 'success'" class="fa fa-check-circle"></span>
+                <span *ngIf="task.status === 'failure'" class="fa fa-times-circle"></span>
+            </bl-cell>
+            <bl-cell style="width: 100px" *ngIf="!pickedTask">{{task.startTime}}</bl-cell>
+            <bl-cell style="width: 100px" *ngIf="!pickedTask">{{task.endTime}}</bl-cell>
+            <bl-cell style="width: 100px">{{task.exitCode}}</bl-cell>
+        </bl-row>
+    </bl-table>
+    <div *ngIf="pickedTask" class="details">
+        <bl-job-hook-task-details [task]="pickedTask" [type]="type"></bl-job-hook-task-details>
+    </div>
+</div>
diff --git a/app/components/job/job-hook-task/job-hook-task-browser/job-hook-task-browser.scss b/app/components/job/job-hook-task/job-hook-task-browser/job-hook-task-browser.scss
new file mode 100644
index 0000000000..22a8ce7e6c
--- /dev/null
+++ b/app/components/job/job-hook-task/job-hook-task-browser/job-hook-task-browser.scss
@@ -0,0 +1,37 @@
+@import "app/styles/variables";
+
+bl-job-hook-task-browser {
+    .filters {
+        display: flex;
+    }
+
+    .content {
+        display: flex;
+        border-top: 1px solid #d5d5d5;
+
+        > .details {
+            padding-top: 10px;
+            border-left: 1px solid $border-color;
+            width: 600px;
+        }
+    }
+
+    .type-toggle {
+        margin: 10px;
+        text-align: right;
+        cursor: pointer;
+        > .option {
+            display: inline-block;
+        }
+
+        > .option.active {
+            text-decoration: underline;
+            cursor: default;
+        }
+
+        > .option.disabled {
+            opacity: 0.5;
+            cursor: default;
+        }
+    }
+}
diff --git a/app/components/job/job-hook-task/job-hook-task-details/index.ts b/app/components/job/job-hook-task/job-hook-task-details/index.ts
new file mode 100644
index 0000000000..0919a7edfc
--- /dev/null
+++ b/app/components/job/job-hook-task/job-hook-task-details/index.ts
@@ -0,0 +1 @@
+export * from "./job-hook-task-details.component";
diff --git a/app/components/job/job-hook-task/job-hook-task-details/job-hook-task-details.component.ts b/app/components/job/job-hook-task/job-hook-task-details/job-hook-task-details.component.ts
new file mode 100644
index 0000000000..3d2de3e517
--- /dev/null
+++ b/app/components/job/job-hook-task/job-hook-task-details/job-hook-task-details.component.ts
@@ -0,0 +1,21 @@
+import { Component, Input } from "@angular/core";
+import { JobHookTask } from "app/models";
+
+import "./job-hook-task-details.scss";
+
+@Component({
+    selector: "bl-job-hook-task-details",
+    templateUrl: "job-hook-task-details.html",
+})
+export class JobHookTaskDetailsComponent {
+    @Input()
+    public task: JobHookTask;
+
+    @Input()
+    public type: string = "preparationTask";
+
+    public get currentFolder() {
+        const info = this.task[this.type];
+        return info && info.taskRootDirectory;
+    }
+}
diff --git a/app/components/job/job-hook-task/job-hook-task-details/job-hook-task-details.html b/app/components/job/job-hook-task/job-hook-task-details/job-hook-task-details.html
new file mode 100644
index 0000000000..13cad4c69f
--- /dev/null
+++ b/app/components/job/job-hook-task/job-hook-task-details/job-hook-task-details.html
@@ -0,0 +1,9 @@
+    <div *ngIf="task">
+    <bl-property-group>
+        <bl-link-property label="Pool" [value]="task.poolId" [link]="['/pools', task.poolId]"></bl-link-property>
+        <bl-link-property label="Node" [value]="task.nodeId" [link]="['/pools', task.poolId, 'nodes', task.nodeId]"></bl-link-property>
+
+        <bl-node-file-list #list [poolId]="task.poolId" [nodeId]="task.nodeId" [quickList]="false" [folder]="currentFolder" [manualLoading]="true" *ngIf="currentFolder">
+        </bl-node-file-list>
+    </bl-property-group>
+</div>
diff --git a/app/components/job/job-hook-task/job-hook-task-details/job-hook-task-details.scss b/app/components/job/job-hook-task/job-hook-task-details/job-hook-task-details.scss
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/app/components/job/job-hook-task/job-hook-task.module.ts b/app/components/job/job-hook-task/job-hook-task.module.ts
new file mode 100644
index 0000000000..d0f7dc2263
--- /dev/null
+++ b/app/components/job/job-hook-task/job-hook-task.module.ts
@@ -0,0 +1,26 @@
+import { NgModule } from "@angular/core";
+
+import { commonModules } from "app/common";
+import { FileBrowseModule } from "app/components/file/browse";
+import { JobHookTaskBrowserComponent } from "./job-hook-task-browser";
+import { JobHookTaskDetailsComponent } from "./job-hook-task-details";
+
+const components = [
+    JobHookTaskBrowserComponent,
+    JobHookTaskDetailsComponent,
+];
+
+const modules = [
+    FileBrowseModule,
+    ...commonModules,
+];
+
+@NgModule({
+    declarations: components,
+    exports: [...modules, ...components],
+    imports: [...modules],
+    entryComponents: [
+    ],
+})
+export class JobHookTaskModule {
+}
diff --git a/app/components/job/job.module.ts b/app/components/job/job.module.ts
index d8cfffa30d..aa96ba00e3 100644
--- a/app/components/job/job.module.ts
+++ b/app/components/job/job.module.ts
@@ -7,13 +7,14 @@ import { JobAdvancedFilterComponent } from "app/components/job/browse/filter/job
 import { JobListComponent } from "app/components/job/browse/job-list.component";
 import { JobDetailsModule } from "app/components/job/details";
 import { JobHomeComponent } from "app/components/job/home/job-home.component";
+import { JobHookTaskModule } from "./job-hook-task";
 
 const components = [
     JobAdvancedFilterComponent, JobHomeComponent, JobListComponent, JobStatsPreviewComponent,
 ];
 
 const modules = [
-    JobActionModule, JobDetailsModule, ...commonModules,
+    JobActionModule, JobDetailsModule, JobHookTaskModule, ...commonModules,
 ];
 
 @NgModule({
diff --git a/app/components/node/browse/display/node-list-display.html b/app/components/node/browse/display/node-list-display.html
index e1a200fe29..394da53139 100644
--- a/app/components/node/browse/display/node-list-display.html
+++ b/app/components/node/browse/display/node-list-display.html
@@ -11,13 +11,12 @@ <h4 bl-quick-list-item-title>{{node.id}}</h4>
 
     <bl-table *ngIf="!quickList">
         <bl-thead>
-            <bl-column>Id</bl-column>
+            <bl-column style="width: 300px">Id</bl-column>
             <bl-column>State</bl-column>
             <bl-column>Scheduling State</bl-column>
             <bl-column>VmSize</bl-column>
             <bl-column>Total task run</bl-column>
         </bl-thead>
-
         <bl-row *ngFor="let node of nodes" [link]="['/pools', poolId, 'nodes', node.id]" [key]="node.id">
             <bl-cell>{{node.id}}</bl-cell>
             <bl-cell>{{node.state}}</bl-cell>
diff --git a/app/components/node/connect/download-rdp.component.ts b/app/components/node/connect/download-rdp.component.ts
index 37ea1383c3..75aada6dc4 100644
--- a/app/components/node/connect/download-rdp.component.ts
+++ b/app/components/node/connect/download-rdp.component.ts
@@ -73,7 +73,7 @@ export class DownloadRdpComponent {
         const content = this._computeFullRdpFile();
         const directory = this.downloadFolder;
         const filename = `${this.nodeId}.rdp`;
-        return Observable.fromPromise(this.fsService.saveFile(filename, content, directory));
+        return Observable.fromPromise(this.fsService.saveFile(path.join(directory, filename), content));
     }
 
     private _computeFullRdpFile() {
diff --git a/app/components/node/connect/node-connect.component.ts b/app/components/node/connect/node-connect.component.ts
index 631122aae0..0f99bac084 100644
--- a/app/components/node/connect/node-connect.component.ts
+++ b/app/components/node/connect/node-connect.component.ts
@@ -6,6 +6,7 @@ import { SidebarRef } from "app/components/base/sidebar";
 import { Node, NodeAgentSku, NodeConnectionSettings, Pool } from "app/models";
 import { AddNodeUserAttributes, NodeService, NodeUserService } from "app/services";
 import { PoolUtils, SecureUtils } from "app/utils";
+import "./node-connect.scss";
 
 enum CredentialSource {
     Generated,
diff --git a/app/styles/node/connect.scss b/app/components/node/connect/node-connect.scss
similarity index 83%
rename from app/styles/node/connect.scss
rename to app/components/node/connect/node-connect.scss
index 9368699360..e6f04f75bf 100644
--- a/app/styles/node/connect.scss
+++ b/app/components/node/connect/node-connect.scss
@@ -1,4 +1,9 @@
+@import "app/styles/variables";
+
 bl-node-connect {
+    display: block;
+    padding: 15px;
+
     .connect-content {
         min-height: calc(100% - 85px);
     }
@@ -8,7 +13,7 @@ bl-node-connect {
     justify-content: center;
 
     > bl-submit-btn > button {
-        @extend .noselect;
+        user-select: none;
         width: 150px;
         height: 75px;
         font-size: 20px;
@@ -18,12 +23,12 @@ bl-node-connect {
 
         &:hover {
             color: $whitesmoke;
-            background-color: map-get($md-prussian-blue, 400);
+            background-color: map-get($primary, 400);
         }
 
         &:active {
             color: $whitesmoke;
-            background-color: map-get($md-prussian-blue, 500);
+            background-color: map-get($primary, 500);
         }
     }
 }
@@ -67,8 +72,8 @@ bl-ssh-key-picker > .ssh-key-picker {
         .saved-keys-wrapper {
             height: 120px;
             overflow: auto;
-            border-top: 1px solid #d5d5d5;
-            border-bottom: 1px solid #d5d5d5;
+            border-top: 1px solid $border-color;
+            border-bottom: 1px solid $border-color;
 
             > .key {
                 display: flex;
@@ -81,7 +86,7 @@ bl-ssh-key-picker > .ssh-key-picker {
                 }
 
                 &:not(:last-child) {
-                    border-bottom: 1px solid #d5d5d5;
+                    border-bottom: 1px solid $border-color;
                 }
 
                 &:hover {
@@ -98,7 +103,7 @@ bl-ssh-key-picker > .ssh-key-picker {
                 .fa-key {
                     font-size: 30px;
                     margin-bottom: 10px;
-                    color: map-get($md-prussian-blue, 400);
+                    color: map-get($primary, 400);
                 }
             }
 
diff --git a/app/components/node/details/error/start-task-error-display.component.ts b/app/components/node/details/error/start-task-error-display.component.ts
new file mode 100644
index 0000000000..210e017c07
--- /dev/null
+++ b/app/components/node/details/error/start-task-error-display.component.ts
@@ -0,0 +1,41 @@
+import { ChangeDetectionStrategy, Component, Input, OnChanges, SimpleChanges } from "@angular/core";
+
+import { FailureInfo, StartTaskInfo } from "app/models";
+import { FailureInfoDecorator } from "app/models/decorators";
+
+@Component({
+    selector: "bl-start-task-error-display",
+    templateUrl: "start-task-error-display.html",
+    changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class StartTaskErrorDisplayComponent implements OnChanges {
+    @Input()
+    public startTaskInfo: StartTaskInfo;
+
+    public failureInfo: FailureInfo;
+    public errorMessage: string;
+    public errorCode: string;
+
+    public ngOnChanges(changes: SimpleChanges) {
+        if (changes.startTaskInfo) {
+            this.failureInfo = this.startTaskInfo && this.startTaskInfo.failureInfo;
+            this._computeErrorMessage();
+        } else {
+            this.errorMessage = this.errorCode = "";
+            this.failureInfo = null;
+        }
+    }
+
+    private _computeErrorMessage() {
+        if (!this.failureInfo) {
+            this.errorMessage = this.errorCode = "";
+            return;
+        }
+
+        const decorator = new FailureInfoDecorator(this.failureInfo);
+        if (decorator.exists) {
+            this.errorCode = decorator.code;
+            this.errorMessage = decorator.message;
+        }
+    }
+}
diff --git a/app/components/node/details/error/start-task-error-display.html b/app/components/node/details/error/start-task-error-display.html
new file mode 100644
index 0000000000..4058fd4678
--- /dev/null
+++ b/app/components/node/details/error/start-task-error-display.html
@@ -0,0 +1,9 @@
+<bl-banner *ngIf="failureInfo" type="error">
+    <div code>{{errorCode}}</div>
+    <div message>{{errorMessage}}</div>
+    <div details *ngIf="failureInfo.details.size > 0">
+        <div *ngFor="let entry of failureInfo.details">
+            <div>{{entry.name}}: {{entry.value}}</div>
+        </div>
+    </div>
+</bl-banner>
diff --git a/app/components/node/details/index.ts b/app/components/node/details/index.ts
index 3c1375f987..1fa6f12ac9 100644
--- a/app/components/node/details/index.ts
+++ b/app/components/node/details/index.ts
@@ -1,3 +1,4 @@
+export * from "./error/start-task-error-display.component";
 export * from "./node-configuration.component";
 export * from "./node-default.component";
 export * from "./node-details.component";
diff --git a/app/components/node/details/node-configuration.component.ts b/app/components/node/details/node-configuration.component.ts
index 439984b1c6..a0be7374f9 100644
--- a/app/components/node/details/node-configuration.component.ts
+++ b/app/components/node/details/node-configuration.component.ts
@@ -21,7 +21,6 @@ export class NodeConfigurationComponent implements OnChanges {
     public get node() { return this._node; }
 
     public decorator: NodeDecorator;
-
     public externalIpAdress;
 
     private _node: Node;
diff --git a/app/components/node/details/node-configuration.html b/app/components/node/details/node-configuration.html
index f9951b70b6..b82aa1da1a 100644
--- a/app/components/node/details/node-configuration.html
+++ b/app/components/node/details/node-configuration.html
@@ -1,14 +1,33 @@
 <bl-property-list>
     <bl-property-group label="General" class="wide">
         <bl-text-property label="Id" [value]="decorator.id"></bl-text-property>
-        <bl-text-property label="Display name" [value]="decorator.displayName"></bl-text-property>
         <bl-text-property label="Url" [value]="decorator.url"></bl-text-property>
         <bl-text-property label="State" [value]="decorator.state"></bl-text-property>
+        <bl-text-property label="State transition time" [value]="decorator.stateTransitionTime"></bl-text-property>
+        <bl-text-property label="Scheduling state" [value]="decorator.schedulingState"></bl-text-property>
         <bl-text-property label="Vm Size" [value]="decorator.vmSize"></bl-text-property>
+        <bl-text-property label="Last boot time" [value]="decorator.lastBootTime"></bl-text-property>
+        <bl-text-property label="Allocation time" [value]="decorator.allocationTime"></bl-text-property>
+        <bl-text-property label="Running task count" [value]="decorator.runningTasksCount"></bl-text-property>
         <bl-text-property label="Total task run" [value]="decorator.totalTasksRun"></bl-text-property>
+        <bl-text-property label="Total succeeded tasks count" [value]="decorator.totalTasksSucceeded"></bl-text-property>
         <bl-text-property label="Internal Ip Adress" [value]="decorator.ipAddress"></bl-text-property>
         <bl-text-property label="External Ip Adress" [value]="externalIpAdress" *ngIf="externalIpAdress"></bl-text-property>
-        <bl-text-property label="State transition time" [value]="decorator.stateTransitionTime"></bl-text-property>
-        <bl-text-property label="Last boot time" [value]="decorator.lastBootTime"></bl-text-property>
+        <bl-bool-property label="Is dedicated" [value]="node.isDedicated" [YesNo]="true"></bl-bool-property>
+    </bl-property-group>
+
+    <bl-property-group label="Start task execution" class="wide" [collapsed]="true" *ngIf="node.startTaskInfo">
+        <div collapsed-preview>
+            <span *ngIf="!decorator.startTaskInfo.runtime">Start task not started</span>
+            <span *ngIf="decorator.startTaskInfo.runtime && !node?.startTaskInfo?.endTime">Currently running for: {{ decorator.startTaskInfo.runtime }}</span>
+            <span *ngIf="node?.startTaskInfo?.endTime">Completed in: {{ decorator.startTaskInfo.runtime }}</span>
+        </div>
+
+        <bl-text-property label="State" [value]="decorator.startTaskInfo.state"></bl-text-property>
+        <bl-text-property label="Start time" [value]="decorator.startTaskInfo.startTime"></bl-text-property>
+        <bl-text-property label="End time" [value]="decorator.startTaskInfo.endTime"></bl-text-property>
+        <bl-text-property label="Execution time" [value]="decorator.startTaskInfo.runtime"></bl-text-property>
+        <bl-text-property label="Exit code" [value]="decorator.startTaskInfo.exitCode"></bl-text-property>
+        <bl-text-property label="Retry count" [value]="decorator.startTaskInfo.retryCount"></bl-text-property>
     </bl-property-group>
 </bl-property-list>
diff --git a/app/components/node/details/node-details.component.ts b/app/components/node/details/node-details.component.ts
index 0548be0cd2..7e0516e9a6 100644
--- a/app/components/node/details/node-details.component.ts
+++ b/app/components/node/details/node-details.component.ts
@@ -77,6 +77,8 @@ export class NodeDetailsComponent implements OnInit, OnDestroy {
 
     public ngOnDestroy() {
         this._paramsSubscribers.forEach(x => x.unsubscribe());
+        this.poolData.dispose();
+        this.data.dispose();
     }
 
     @autobind()
diff --git a/app/components/node/details/node-details.html b/app/components/node/details/node-details.html
index db3add65d4..b917e59cd7 100644
--- a/app/components/node/details/node-details.html
+++ b/app/components/node/details/node-details.html
@@ -1,24 +1,19 @@
 <bl-loading [status]="data.newDataStatus | async">
     <div *ngIf="pool && node">
         <md-card class="overview">
-            <md-card-title-group style="margin: 0px;">
-                <div style="align-items:center;">
+            <div class="actions">
+                <bl-action-btn-group>
                     <bl-refresh-btn [refresh]="refresh"></bl-refresh-btn>
-                </div>
-                <div style="margin-left:12px; margin-right:auto;">
-                    <md-card-title>{{node.id}}</md-card-title>
-                    <md-card-subtitle> {{node.state}}</md-card-subtitle>
-                </div>
-            </md-card-title-group>
-            <md-card-content>
+                    <bl-action-btn (action)="connect()" icon="fa fa-plug"></bl-action-btn>
+                </bl-action-btn-group>
+            </div>
+            <div class="content">
+                <md-card-title>{{node.id}}</md-card-title>
+                <md-card-subtitle> {{node.state}}</md-card-subtitle>
                 <p>Pool: {{poolId}}</p>
-            </md-card-content>
-            <md-card-actions layout="row" layout-align="end center">
-                <button md-button (click)="connect()">
-                    <i class="fa fa-plug"></i> Connect
-                </button>
-            </md-card-actions>
+            </div>
         </md-card>
+        <bl-start-task-error-display [startTaskInfo]="node?.startTaskInfo"></bl-start-task-error-display>
         <md-card class="details">
             <bl-tab-group>
                 <bl-tab key="configuration">
diff --git a/app/components/node/node.module.ts b/app/components/node/node.module.ts
index 91e013267b..662a1dfa78 100644
--- a/app/components/node/node.module.ts
+++ b/app/components/node/node.module.ts
@@ -5,10 +5,12 @@ import { FileBrowseModule } from "app/components/file/browse";
 import { NodeBrowseModule } from "app/components/node/browse";
 import { NodeConnectModule } from "app/components/node/connect";
 import { NodeConfigurationComponent, NodeDefaultComponent, NodeDetailsComponent } from "app/components/node/details";
+import { StartTaskErrorDisplayComponent } from "app/components/node/details";
 import { NodeHomeComponent } from "app/components/node/home";
 
 const components = [
     NodeConfigurationComponent, NodeDefaultComponent, NodeDetailsComponent, NodeHomeComponent,
+    StartTaskErrorDisplayComponent,
 ];
 
 const modules = [
diff --git a/app/components/pool/action/add/pool-create-basic-dialog.component.ts b/app/components/pool/action/add/pool-create-basic-dialog.component.ts
index da645d6543..23fa57c8e5 100644
--- a/app/components/pool/action/add/pool-create-basic-dialog.component.ts
+++ b/app/components/pool/action/add/pool-create-basic-dialog.component.ts
@@ -18,6 +18,7 @@ import { PoolService, VmSizeService } from "app/services";
 })
 export class PoolCreateBasicDialogComponent extends DynamicForm<Pool, PoolCreateDto> implements OnDestroy {
     public osSource: PoolOsSources = PoolOsSources.IaaS;
+    public osType: "linux" | "windows" = "linux";
     public NodeFillType = NodeFillType;
 
     private _osControl: FormControl;
@@ -52,6 +53,17 @@ export class PoolCreateBasicDialogComponent extends DynamicForm<Pool, PoolCreate
 
         this._sub = this._osControl.valueChanges.subscribe((value) => {
             this.osSource = value.source;
+            if (value.source === PoolOsSources.PaaS) {
+                this.osType = "windows";
+            } else {
+                const config = value.virtualMachineConfiguration;
+                const agentId: string = config && config.nodeAgentSKUId;
+                if (agentId && agentId.toLowerCase().indexOf("windows") !== -1) {
+                    this.osType = "windows";
+                } else {
+                    this.osType = "linux";
+                }
+            }
         });
     }
 
diff --git a/app/components/pool/action/add/pool-create-basic-dialog.html b/app/components/pool/action/add/pool-create-basic-dialog.html
index 687900592b..53e52964d6 100644
--- a/app/components/pool/action/add/pool-create-basic-dialog.html
+++ b/app/components/pool/action/add/pool-create-basic-dialog.html
@@ -53,7 +53,7 @@
 
         <bl-form-section title="Choose a virtual machine size" subtitle="Choose the virtual machine based on CPU, RAM and Disk capacity">
             <div class="form-element element-spacer">
-                <bl-vm-size-picker formControlName="vmSize" [osSource]="osSource"></bl-vm-size-picker>
+                <bl-vm-size-picker formControlName="vmSize" [osSource]="osSource" [osType]="osType"></bl-vm-size-picker>
                 <bl-error controlName="vmSize" code="required">You must select a VM size</bl-error>
             </div>
         </bl-form-section>
diff --git a/app/components/pool/action/add/vm-size-picker.component.ts b/app/components/pool/action/add/vm-size-picker.component.ts
index c66872ee48..89670cf093 100644
--- a/app/components/pool/action/add/vm-size-picker.component.ts
+++ b/app/components/pool/action/add/vm-size-picker.component.ts
@@ -65,6 +65,10 @@ export class VmSizeDecorator {
 export class VmSizePickerComponent implements ControlValueAccessor, OnInit, OnChanges, OnDestroy {
     @Input()
     public osSource: PoolOsSources;
+
+    @Input()
+    public osType: "linux" | "windows";
+
     public pickedSize: string;
 
     public categoryNames: string[];
@@ -107,6 +111,10 @@ export class VmSizePickerComponent implements ControlValueAccessor, OnInit, OnCh
                 this._categorizeSizes();
             });
         }
+
+        if (inputs.osType) {
+            this._loadPrices();
+        }
     }
 
     public ngOnDestroy() {
@@ -194,7 +202,7 @@ export class VmSizePickerComponent implements ControlValueAccessor, OnInit, OnCh
 
     private _loadPrices() {
         this.accountService.currentAccount.flatMap((account) => {
-            const os = "linux"; // TODO update this.
+            const os = this.osType || "linux";
             return this.pricingService.getPrices(account.location, os);
         }).subscribe((prices: List<SpecCost>) => {
             const map: StringMap<SpecCost> = {};
diff --git a/app/components/pool/action/add/vm-size-picker.html b/app/components/pool/action/add/vm-size-picker.html
index a96bbc0f0b..26e0e2f3c6 100644
--- a/app/components/pool/action/add/vm-size-picker.html
+++ b/app/components/pool/action/add/vm-size-picker.html
@@ -4,18 +4,18 @@
             <bl-table [activeItem]="pickedSize" (activeItemChange)="pickSize($event)">
                 <bl-thead>
                     <bl-column [sortable]="true">Name</bl-column>
-                    <!--<bl-column [sortable]="true">Price per node(Monthly)</bl-column>-->
-                    <bl-column [sortable]="true">Cores</bl-column>
-                    <bl-column [sortable]="true">RAM</bl-column>
-                    <bl-column [sortable]="true">OS Disk</bl-column>
+                    <bl-column [sortable]="true">Price per node(Monthly)</bl-column>
+                    <bl-column style="width: 60px" [sortable]="true">Cores</bl-column>
+                    <bl-column style="width: 60px" [sortable]="true">RAM</bl-column>
+                    <bl-column style="width: 70px" [sortable]="true">OS Disk</bl-column>
                     <bl-column [sortable]="true">Resource/Temp Disk</bl-column>
                 </bl-thead>
-                <bl-row *ngFor="let size of categories[category]" [key]="size.vmSize.name">
+                <bl-row *ngFor="let size of categories[category]" [key]="size.vmSize.id">
                     <bl-cell [value]="size.vmSize.name">{{size.title}}</bl-cell>
-                    <!--<bl-cell [value]="size.price">{{size.prettyPrice}}</bl-cell>-->
-                    <bl-cell [value]="size.vmSize.numberOfCores"></bl-cell>
-                    <bl-cell [value]="size.vmSize.memoryInMB">{{size.prettyRAM}}</bl-cell>
-                    <bl-cell [value]="size.vmSize.osDiskSizeInMB">{{size.prettyOSDiskSize}}</bl-cell>
+                    <bl-cell [value]="size.price">{{size.prettyPrice}}</bl-cell>
+                    <bl-cell style="width: 60px" [value]="size.vmSize.numberOfCores"></bl-cell>
+                    <bl-cell style="width: 60px" [value]="size.vmSize.memoryInMB">{{size.prettyRAM}}</bl-cell>
+                    <bl-cell style="width: 70px" [value]="size.vmSize.osDiskSizeInMB">{{size.prettyOSDiskSize}}</bl-cell>
                     <bl-cell [value]="size.vmSize.resourceDiskSizeInMB">{{size.prettyResourceDiskSize}}</bl-cell>
                 </bl-row>
             </bl-table>
diff --git a/app/components/pool/action/delete/delete-pool-task.ts b/app/components/pool/action/delete/delete-pool-task.ts
index 101ed29544..36076b8c45 100644
--- a/app/components/pool/action/delete/delete-pool-task.ts
+++ b/app/components/pool/action/delete/delete-pool-task.ts
@@ -7,7 +7,7 @@ import { PoolService } from "app/services";
 import { LongRunningDeleteAction } from "app/services/core";
 
 export class DeletePoolTask extends LongRunningDeleteAction {
-    constructor(private poolService: PoolService,  poolIds: string[]) {
+    constructor(private poolService: PoolService, poolIds: string[]) {
         super("pool", poolIds);
     }
 
@@ -18,7 +18,7 @@ export class DeletePoolTask extends LongRunningDeleteAction {
     protected waitForDelete(id: string, taskManager?: BackgroundTaskService) {
         this.poolService.getOnce(id).subscribe({
             next: (pool: Pool) => {
-                const task = new WaitForDeletePoolPollTask(this.poolService, id, pool.currentDedicated);
+                const task = new WaitForDeletePoolPollTask(this.poolService, id, pool.currentNodes);
                 if (taskManager) {
                     taskManager.startTask(`Deleting pool '${id}'`, (bTask) => {
                         return task.start(bTask.progress);
@@ -53,31 +53,25 @@ export class WaitForDeletePoolPollTask {
     @autobind()
     public start(progress: BehaviorSubject<any>): Observable<any> {
         const obs = new AsyncSubject();
-        const data = this.poolService.get(this.poolId);
         let interval;
 
-        const errorCallback = (e) => {
-            progress.next(100);
-            clearInterval(interval);
-            obs.complete();
-        };
-
         interval = setInterval(() => {
-            data.fetch().subscribe({
-                error: errorCallback,
+            this.poolService.getOnce(this.poolId).subscribe({
+                next: (pool: Pool) => {
+                    if (pool) {
+                        const currentNodes = pool.currentNodes;
+                        progress.next(this._getProgress(currentNodes));
+                    }
+                },
+                error: (e) => {
+                    progress.next(100);
+                    clearInterval(interval);
+                    obs.complete();
+                },
             });
         }, this.refreshRate);
 
         progress.next(10);
-        data.item.subscribe({
-            next: (pool: Pool) => {
-                if (pool) {
-                    const currentNodes = pool.currentDedicated;
-                    progress.next(this._getProgress(currentNodes));
-                }
-            },
-            error: errorCallback,
-        });
 
         return obs;
     }
diff --git a/app/components/pool/action/resize/pool-resize-dialog.component.ts b/app/components/pool/action/resize/pool-resize-dialog.component.ts
index c93f04e37b..9cc54380e9 100644
--- a/app/components/pool/action/resize/pool-resize-dialog.component.ts
+++ b/app/components/pool/action/resize/pool-resize-dialog.component.ts
@@ -7,7 +7,7 @@ import { Observable } from "rxjs";
 import { NotificationService } from "app/components/base/notifications";
 import { SidebarRef } from "app/components/base/sidebar";
 import { Pool } from "app/models";
-import { PoolEnableAutoScaleDto } from "app/models/dtos";
+import { PoolEnableAutoScaleDto, PoolResizeDto } from "app/models/dtos";
 import { PoolScaleModel } from "app/models/forms";
 import { PoolService } from "app/services";
 
@@ -22,7 +22,8 @@ export class PoolResizeDialogComponent {
             this._pool = pool;
             const interval = pool.autoScaleEvaluationInterval ? pool.autoScaleEvaluationInterval.asMinutes() : 15;
             this.scale.patchValue({
-                targetDedicated: pool.targetDedicated,
+                targetDedicatedNodes: pool.targetDedicatedNodes,
+                targetLowPriorityNodes: pool.targetLowPriorityNodes,
                 enableAutoScale: pool.enableAutoScale,
                 autoScaleFormula: pool.autoScaleFormula,
                 autoScaleEvaluationInterval: interval,
@@ -52,15 +53,19 @@ export class PoolResizeDialogComponent {
         if (value.enableAutoScale) {
             obs = this._enableAutoScale(value);
         } else {
-            const targetDedicated = value.targetDedicated;
-            obs = this._disableAutoScale().flatMap(() => this.poolService.resize(id, targetDedicated));
+            const targetDedicatedNodes = value.targetDedicatedNodes;
+            const targetLowPriorityNodes = value.targetLowPriorityNodes;
+            obs = this._disableAutoScale()
+                .flatMap(() => this.poolService.resize(id, new PoolResizeDto({
+                    targetDedicatedNodes, targetLowPriorityNodes,
+                })));
         }
 
         const finalObs = obs.flatMap(() => this.poolService.getOnce(this.pool.id)).share();
         finalObs.subscribe({
             next: (pool) => {
                 this.notificationService.success("Pool resize started!",
-                    `Pool '${id}' will resize to ${pool.targetDedicated} nodes!`);
+                    `Pool '${id}' will resize to ${pool.targetNodes} nodes!`);
             },
             error: () => null,
         });
diff --git a/app/components/pool/action/scale/autoscale-formula-picker.scss b/app/components/pool/action/scale/autoscale-formula-picker.scss
index 788a5b19c4..2e4905726c 100644
--- a/app/components/pool/action/scale/autoscale-formula-picker.scss
+++ b/app/components/pool/action/scale/autoscale-formula-picker.scss
@@ -75,7 +75,7 @@
                 .fa-file-code-o {
                     font-size: 30px;
                     margin-bottom: 10px;
-                    color: map-get($md-prussian-blue, 400);
+                    color: map-get($primary, 400);
                 }
             }
         }
@@ -100,3 +100,35 @@
         }
     }
 }
+
+
+bl-autoscale-formula-picker {
+    display: flex;
+    .CodeMirror {
+        font-size: 12px;
+        height: 300px !important;
+    }
+
+    .CodeMirror pre.CodeMirror-placeholder {
+        font-family: Roboto, "Helvetica Neue", sans-serif;
+        line-height: normal;
+        text-align: left;
+        color: rgba(0, 0, 0, 0.38);
+    }
+
+    .cm-variables {
+        color: map-get($success, 800);
+    }
+
+    .cm-functions {
+        color: map-get($danger, 800);
+    }
+
+    .cm-math {
+        color: map-get($primary, 700);
+    }
+
+    .cm-builtin {
+        color: map-get($primary, 800);
+    }
+}
diff --git a/app/components/pool/action/scale/pool-scale-picker.component.ts b/app/components/pool/action/scale/pool-scale-picker.component.ts
index a1ef3e07d5..61c7c6064a 100644
--- a/app/components/pool/action/scale/pool-scale-picker.component.ts
+++ b/app/components/pool/action/scale/pool-scale-picker.component.ts
@@ -25,7 +25,8 @@ export class PoolScalePickerComponent implements OnDestroy, ControlValueAccessor
         this.form = formBuilder.group({
             enableAutoScale: false,
             autoScaleFormula: ["", this._invalidAutoscaleFormula()],
-            targetDedicated: [0, this._invalidTargetDedicated()],
+            targetDedicatedNodes: [0, this._invalidTargetNodes()],
+            targetLowPriorityNodes: [0, this._invalidTargetNodes()],
             autoScaleEvaluationInterval: [15],
         });
 
@@ -87,7 +88,7 @@ export class PoolScalePickerComponent implements OnDestroy, ControlValueAccessor
         };
     }
 
-    private _invalidTargetDedicated() {
+    private _invalidTargetNodes() {
         return (control: FormControl): { [key: string]: any } => {
             if (!this.form || this.form.controls.enableAutoScale.value) {
                 return null;
diff --git a/app/components/pool/action/scale/pool-scale-picker.html b/app/components/pool/action/scale/pool-scale-picker.html
index 4422bef751..8ab831c568 100644
--- a/app/components/pool/action/scale/pool-scale-picker.html
+++ b/app/components/pool/action/scale/pool-scale-picker.html
@@ -1,16 +1,27 @@
 <div [formGroup]="form">
     <md-tab-group class="form-tabs" [selectedIndex]="selectedModeTab" (selectChange)="changeScaleModeTab($event)">
         <md-tab label="Fixed">
-            <md-input-container>
-                <input mdInput formControlName="targetDedicated" placeholder="Number of virtual machines in pool" type="number" min="0"/>
-            </md-input-container>
-            <bl-error controlName="targetDedicated" code="required">Target size is a required field</bl-error>
+            <div class="grow">
+                <div class="gcol">
+                    <md-input-container class="form-element">
+                        <input mdInput formControlName="targetDedicatedNodes" placeholder="Dedicated nodes" type="number" min="0" />
+                    </md-input-container>
+                </div>
+                <div class="gcol">
+                    <md-input-container class="form-element">
+                        <input mdInput formControlName="targetLowPriorityNodes" placeholder="Low priority nodes" type="number" min="0" />
+                    </md-input-container>
+                </div>
+            </div>
+            <bl-error controlName="targetDedicatedNodes" code="required">Target dedicated is a required field</bl-error>
+            <bl-error controlName="targetLowPriorityNodes" code="required">Target low priority is a required field</bl-error>
         </md-tab>
         <md-tab label="Auto Scale">
             <bl-autoscale-formula-picker formControlName="autoScaleFormula"></bl-autoscale-formula-picker>
             <bl-error controlName="autoScaleFormula" code="required">Auto scale formula is a required field</bl-error>
             <md-input-container>
-                <input mdInput formControlName="autoScaleEvaluationInterval" placeholder="Evaluation interval(In minutes)" type="number" />
+                <input mdInput formControlName="autoScaleEvaluationInterval" placeholder="Evaluation interval(In minutes)" type="number"
+                />
             </md-input-container>
         </md-tab>
     </md-tab-group>
diff --git a/app/components/pool/base/pool-nodes-preview.component.ts b/app/components/pool/base/pool-nodes-preview.component.ts
index cebc154dd4..14666cbc3e 100644
--- a/app/components/pool/base/pool-nodes-preview.component.ts
+++ b/app/components/pool/base/pool-nodes-preview.component.ts
@@ -1,6 +1,6 @@
 import { Component, HostBinding, Input, OnChanges } from "@angular/core";
 
-import { Pool } from "app/models";
+import { Pool, PoolAllocationState } from "app/models";
 
 import "./pool-nodes-preview.scss";
 
@@ -25,18 +25,18 @@ export class PoolNodesPreviewComponent implements OnChanges {
     public ngOnChanges(inputs) {
         if (inputs.pool) {
             this.tooltipMessage = this._getTooltipMessage();
-            this.hasResizeError = Boolean(this.pool.resizeError);
+            this.hasResizeError = this.pool.resizeErrors.size > 0;
         }
     }
 
     private _getTooltipMessage() {
         const pool = this.pool;
-        if (pool.resizeError) {
+        if (this.hasResizeError) {
             return "There was a resize error";
-        } else if (pool.currentDedicated !== pool.targetDedicated) {
-            return `Pool is resizing from ${pool.currentDedicated} to ${pool.targetDedicated} nodes`;
+        } else if (pool.allocationState === PoolAllocationState.resizing) {
+            return `Pool is resizing from ${pool.currentNodes} to ${pool.targetNodes} nodes`;
         } else {
-            return `Pool has ${pool.currentDedicated} nodes`;
+            return `Pool has ${pool.currentNodes} nodes`;
         }
     }
 }
diff --git a/app/components/pool/base/pool-nodes-preview.html b/app/components/pool/base/pool-nodes-preview.html
index 6862f91f62..826e203385 100644
--- a/app/components/pool/base/pool-nodes-preview.html
+++ b/app/components/pool/base/pool-nodes-preview.html
@@ -1,8 +1,8 @@
 <div md-tooltip="{{tooltipMessage}}" tooltip-position="{{tooltipPosition}}">
     <i class="fa fa-tv" [ngClass]="largeIcon ? 'fa-2' : ''"></i>
-    <span>{{pool.currentDedicated}}</span>
-    <span *ngIf="pool.currentDedicated !== pool.targetDedicated">
+    <span>{{pool.currentNodes}}</span>
+    <span *ngIf="pool.currentNodes !== pool.targetNodes">
         <span >⇾</span>
-        <span>{{pool.targetDedicated}}</span>
+        <span>{{pool.targetNodes}}</span>
     </span>
 </div>
diff --git a/app/components/pool/base/pool-nodes-preview.scss b/app/components/pool/base/pool-nodes-preview.scss
index bdb6ec8acc..b5e3661a6c 100644
--- a/app/components/pool/base/pool-nodes-preview.scss
+++ b/app/components/pool/base/pool-nodes-preview.scss
@@ -11,7 +11,7 @@ bl-pool-nodes-preview {
     }
 
     &.resize-error {
-        color: $red;
+        color: map-get($danger, 500);
         font-weight: bold;
     }
 }
diff --git a/app/components/pool/browse/pool-list.component.ts b/app/components/pool/browse/pool-list.component.ts
index 00b8b2fa89..d019bd6647 100644
--- a/app/components/pool/browse/pool-list.component.ts
+++ b/app/components/pool/browse/pool-list.component.ts
@@ -4,6 +4,7 @@ import {
 import { MdDialog } from "@angular/material";
 import { ActivatedRoute, Router } from "@angular/router";
 import { autobind } from "core-decorators";
+import { List } from "immutable";
 import { Observable, Subscription } from "rxjs";
 
 import { BackgroundTaskService } from "app/components/base/background-task";
@@ -14,6 +15,7 @@ import { ListOrTableBase } from "app/components/base/selectable-list";
 import { SidebarManager } from "app/components/base/sidebar";
 import { TableComponent } from "app/components/base/table";
 import { Pool } from "app/models";
+import { PoolDecorator } from "app/models/decorators";
 import { PoolService } from "app/services";
 import { RxListProxy } from "app/services/core";
 import { Filter } from "app/utils/filter-builder";
@@ -57,8 +59,9 @@ export class PoolListComponent extends ListOrTableBase implements OnInit, OnDest
     }
     public get filter(): Filter { return this._filter; }
 
+    public pools: List<PoolDecorator> = List([]);
     private _filter: Filter;
-    private _onPoolAddedSub: Subscription;
+    private _subs: Subscription[] = [];
 
     constructor(
         private poolService: PoolService,
@@ -71,9 +74,12 @@ export class PoolListComponent extends ListOrTableBase implements OnInit, OnDest
         super(dialog);
         this.data = this.poolService.list();
         this.status = this.data.status;
-        this._onPoolAddedSub = poolService.onPoolAdded.subscribe((poolId) => {
-            this.data.loadNewItem(poolService.get(poolId));
-        });
+        this._subs.push(poolService.onPoolAdded.subscribe((poolId) => {
+            this.data.loadNewItem(poolService.getOnce(poolId));
+        }));
+        this._subs.push(this.data.items.subscribe((pools) => {
+            this.pools = List<PoolDecorator>(pools.map(x => new PoolDecorator(x)));
+        }));
     }
 
     public ngOnInit() {
@@ -81,7 +87,7 @@ export class PoolListComponent extends ListOrTableBase implements OnInit, OnDest
     }
 
     public ngOnDestroy() {
-        this._onPoolAddedSub.unsubscribe();
+        this._subs.forEach(x => x.unsubscribe());
     }
 
     @autobind()
@@ -90,11 +96,11 @@ export class PoolListComponent extends ListOrTableBase implements OnInit, OnDest
     }
 
     public poolStatus(pool: Pool): QuickListItemStatus {
-        return pool.resizeError ? QuickListItemStatus.warning : null;
+        return pool.resizeErrors.size > 0 ? QuickListItemStatus.warning : null;
     }
 
     public poolStatusText(pool: Pool): string {
-        if (pool.resizeError) {
+        if (pool.resizeErrors.size > 0) {
             return "Pool has a resize error";
         }
 
diff --git a/app/components/pool/browse/pool-list.html b/app/components/pool/browse/pool-list.html
index 7ad29de4ac..7eb09eb7c2 100644
--- a/app/components/pool/browse/pool-list.html
+++ b/app/components/pool/browse/pool-list.html
@@ -21,16 +21,16 @@ <h4 bl-quick-list-item-title>{{pool.id}}</h4>
         <bl-column>State</bl-column>
         <bl-column>Allocation State</bl-column>
         <bl-column>VmSize</bl-column>
-        <bl-column numericField>Current <i class="fa fa-tv"></i></bl-column>
-        <bl-column numericField>Target <i class="fa fa-tv"></i></bl-column>
+        <bl-column>Dedicated <i class="fa fa-tv"></i></bl-column>
+        <bl-column>Low priority <i class="fa fa-tv"></i></bl-column>
     </bl-thead>
-    <bl-row *ngFor="let pool of data.items | async" [link]="['/pools/', pool.id]" [key]="pool.id" [contextmenu]="contextmenu(pool)">
+    <bl-row *ngFor="let pool of pools, trackBy: pool?.id" [link]="['/pools/', pool.id]" [key]="pool.id" [contextmenu]="contextmenu(pool)">
         <bl-cell>{{pool.id}}</bl-cell>
         <bl-cell>{{pool.state}}</bl-cell>
         <bl-cell>{{pool.allocationState}}</bl-cell>
         <bl-cell>{{pool.vmSize}}</bl-cell>
-        <bl-cell numericField>{{pool.currentDedicated}}</bl-cell>
-        <bl-cell numericField>{{pool.targetDedicated}}</bl-cell>
+        <bl-cell [value]="pool.targetDedicatedNodes">{{pool.dedicatedNodes}}</bl-cell>
+        <bl-cell [value]="pool.targetLowPriorityNodes">{{pool.lowPriorityNodes}}</bl-cell>
     </bl-row>
 </bl-table>
 
diff --git a/app/components/pool/details/error-display/pool-error-display.component.ts b/app/components/pool/details/error-display/pool-error-display.component.ts
index f7fac67795..1b728692f0 100644
--- a/app/components/pool/details/error-display/pool-error-display.component.ts
+++ b/app/components/pool/details/error-display/pool-error-display.component.ts
@@ -3,6 +3,7 @@ import { autobind } from "core-decorators";
 import { shell } from "electron";
 
 import { Pool, ResizeErrorCode } from "app/models";
+import { PoolResizeDto } from "app/models/dtos";
 import { AccountService, PoolService } from "app/services";
 import { ExternalLinks } from "app/utils/constants";
 
@@ -12,27 +13,28 @@ import { ExternalLinks } from "app/utils/constants";
     changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class PoolErrorDisplayComponent {
+    public ResizeErrorCode = ResizeErrorCode;
+
     @Input()
     public pool: Pool;
 
     constructor(private poolService: PoolService, private accountService: AccountService) {
     }
 
-    public get hasResizeError(): boolean {
-        return Boolean(this.pool && this.pool.resizeError);
-    }
-
-    public get hasQuotaReachedError(): boolean {
-        return this.hasResizeError && Boolean(this.pool.resizeError.code === ResizeErrorCode.accountCoreQuotaReached);
+    public get dedicatedQuota() {
+        return this.accountService.currentAccount.map(x => x.properties.dedicatedCoreQuota); // TODO low pri too
     }
 
-    public get quota() {
-        return this.accountService.currentAccount.map(x => x.properties.coreQuota);
+    public get lowPriorityQuota() {
+        return this.accountService.currentAccount.map(x => x.properties.lowPriorityCoreQuota); // TODO low pri too
     }
 
     @autobind()
     public fixStopResizeError() {
-        const obs = this.poolService.resize(this.pool.id, this.pool.targetDedicated);
+        const obs = this.poolService.resize(this.pool.id, new PoolResizeDto({
+            targetDedicatedNodes: this.pool.targetDedicatedNodes,
+            targetLowPriorityNodes: this.pool.targetLowPriorityNodes,
+        }));
         obs.subscribe(() => {
             this.refreshPool();
         });
diff --git a/app/components/pool/details/error-display/pool-error-display.html b/app/components/pool/details/error-display/pool-error-display.html
index 82c0b76663..d3593b68f5 100644
--- a/app/components/pool/details/error-display/pool-error-display.html
+++ b/app/components/pool/details/error-display/pool-error-display.html
@@ -1,21 +1,33 @@
-<div *ngIf="hasResizeError">
-    <bl-banner *ngIf="!hasQuotaReachedError" fixMessage="Rescale" [fix]="fixStopResizeError">
-        <div code>{{pool.resizeError.code}}</div>
-        <div message>{{pool.resizeError.message}}</div>
-        <div details *ngIf="pool.resizeError.vals.size !== 0">
-            <div *ngFor="let entry of pool.resizeError.vals">
-                <div>{{entry.key}}: {{entry.value}}</div>
+<div *ngIf="pool">
+    <div *ngFor="let resizeError of pool.resizeErrors" [ngSwitch]="resizeError.code">
+        <bl-banner *ngSwitchCase="ResizeErrorCode.accountCoreQuotaReached" fixMessage="Increase quota" [fix]="increaseQuota">
+            <div [other-fix]="fixStopResizeError" fixMessage="Rescale"></div>
+            <div code>{{resizeError.code}}</div>
+            <div message>{{resizeError.message}} ({{dedicatedQuota | async}} cores)</div>
+            <div details *ngIf="resizeError.values.size !== 0">
+                <div *ngFor="let entry of resizeError.values.vals">
+                    <div>{{entry.key}}: {{entry.value}}</div>
+                </div>
             </div>
-        </div>
-    </bl-banner>
-    <bl-banner *ngIf="hasQuotaReachedError" fixMessage="Increase quota" [fix]="increaseQuota">
-        <div [other-fix]="fixStopResizeError" fixMessage="Rescale"></div>
-        <div code>{{pool.resizeError.code}}</div>
-        <div message>{{pool.resizeError.message}} ({{quota | async}} cores)</div>
-        <div details *ngIf="pool.resizeError.vals.size !== 0">
-            <div *ngFor="let entry of pool.resizeError.vals">
-                <div>{{entry.key}}: {{entry.value}}</div>
+        </bl-banner>
+        <bl-banner *ngSwitchCase="ResizeErrorCode.accountLowPriorityCoreQuotaReached" fixMessage="Increase quota" [fix]="increaseQuota">
+            <div [other-fix]="fixStopResizeError" fixMessage="Rescale"></div>
+            <div code>{{resizeError.code}}</div>
+            <div message>{{resizeError.message}} ({{lowPriorityQuota | async}} cores)</div>
+            <div details *ngIf="resizeError.values.size !== 0">
+                <div *ngFor="let entry of resizeError.values.vals">
+                    <div>{{entry.key}}: {{entry.value}}</div>
+                </div>
             </div>
-        </div>
-    </bl-banner>
+        </bl-banner>
+        <bl-banner *ngSwitchDefault fixMessage="Rescale" [fix]="fixStopResizeError">
+            <div code>{{resizeError.code}}</div>
+            <div message>{{resizeError.message}}</div>
+            <div details *ngIf="resizeError.values.size !== 0">
+                <div *ngFor="let entry of resizeError.values.vals">
+                    <div>{{entry.key}}: {{entry.value}}</div>
+                </div>
+            </div>
+        </bl-banner>
+    </div>
 </div>
diff --git a/app/components/pool/details/pool-configuration.component.ts b/app/components/pool/details/pool-configuration.component.ts
index 9dba4aee8c..efe614ca5a 100644
--- a/app/components/pool/details/pool-configuration.component.ts
+++ b/app/components/pool/details/pool-configuration.component.ts
@@ -1,6 +1,7 @@
 import { Component, Input } from "@angular/core";
+import { List } from "immutable";
 
-import { Pool } from "app/models";
+import { ApplicationPackageReference, CertificateReference, Metadata, Pool } from "app/models";
 import { PoolDecorator } from "app/models/decorators";
 
 @Component({
@@ -11,30 +12,23 @@ export class PoolConfigurationComponent {
     @Input()
     public set pool(value: Pool) {
         this._pool = value;
-        this.decorator = new PoolDecorator(this._pool);
+        this._refresh(this._pool);
     }
     public get pool() { return this._pool; }
 
     public decorator: PoolDecorator;
+    public certificates: List<CertificateReference>;
+    public appPackages: List<ApplicationPackageReference>;
+    public metadata: List<Metadata> = List([]);
 
     private _pool: Pool;
 
-    // /* @input parameter change */
-    // public ngOnChanges() {
-    //     if (this.poolId) {
-    //         this.loading = true;
-    //         this.jobService.get(this.poolId).subscribe(
-    //             (job: Pool) => {
-    //                 this.job = job;
-    //                 this.constraints = job.constraints || {};
-    //                 this.executionInfo = job.executionInfo || {};
-    //                 this.jobManagerTask = job.jobManagerTask || {};
-    //                 this.jobPreparationTask = job.jobPreparationTask || {};
-    //                 this.jobReleaseTask = job.jobReleaseTask || {};
-    //                 this.poolInfo = job.poolInfo || {};
-    //                 this.loading = false;
-    //             }
-    //         );
-    //     }
-    // }
+    private _refresh(pool: Pool) {
+        if (pool) {
+            this.decorator = new PoolDecorator(this._pool);
+            this.appPackages = this.decorator.applicationPackageReferences;
+            this.certificates = this.decorator.certificateReferences;
+            this.metadata = pool.metadata;
+        }
+    }
 }
diff --git a/app/components/pool/details/pool-configuration.html b/app/components/pool/details/pool-configuration.html
index 42b48dcd30..3a6855644b 100644
--- a/app/components/pool/details/pool-configuration.html
+++ b/app/components/pool/details/pool-configuration.html
@@ -3,8 +3,10 @@
 		<bl-property-group label="General" class="wide">
 			<bl-text-property label="Id" [value]="decorator.id"></bl-text-property>
 			<bl-text-property label="VM size" [value]="decorator.vmSize"></bl-text-property>
-			<bl-text-property label="Current dedicated" [value]="decorator.currentDedicated"></bl-text-property>
-			<bl-text-property label="Target dedicated" [value]="decorator.targetDedicated"></bl-text-property>
+			<bl-text-property label="Current dedicated" [value]="decorator.currentDedicatedNodes"></bl-text-property>
+			<bl-text-property label="Target dedicated" [value]="decorator.targetDedicatedNodes"></bl-text-property>
+			<bl-text-property label="Current low priority" [value]="decorator.currentLowPriorityNodes"></bl-text-property>
+			<bl-text-property label="Target low priority" [value]="decorator.targetLowPriorityNodes"></bl-text-property>
 			<bl-text-property label="State" [value]="decorator.state"></bl-text-property>
 			<bl-text-property label="State transistion Time" [value]="decorator.stateTransitionTime"></bl-text-property>
 			<bl-text-property label="Allocation state" [value]="decorator.allocationState"></bl-text-property>
@@ -22,15 +24,24 @@
             <bl-text-property label="Task scheduling policy" [value]="decorator.taskSchedulingPolicy.nodeFillType"></bl-text-property>
             <bl-text-property label="Url" [value]="decorator.url"></bl-text-property>
             <bl-text-property label="User accounts" [value]="decorator.userAccounts"></bl-text-property>
+            <bl-text-property label="Network subnet" [value]="decorator.networkSubnetId" *ngIf="decorator.networkSubnetId"></bl-text-property>
 		</bl-property-group>
 
 		<bl-property-group label="Cloud service configuration" class="wide" [collapsed]="true" *ngIf="pool.cloudServiceConfiguration">
+            <div collapsed-preview>
+                <span>{{decorator.poolOs}}</span>
+            </div>
+
 			<bl-text-property label="OS family" [value]="decorator.cloudServiceConfiguration.osFamily"></bl-text-property>
 			<bl-text-property label="Curent OS version" [value]="decorator.cloudServiceConfiguration.currentOSVersion"></bl-text-property>
 			<bl-text-property label="Target OS version" [value]="decorator.cloudServiceConfiguration.targetOSVersion"></bl-text-property>
 		</bl-property-group>
 
 		<bl-property-group label="Virtual machine configuration" class="wide" [collapsed]="true" *ngIf="pool.virtualMachineConfiguration">
+            <div collapsed-preview>
+                <span>{{decorator.poolOs}}</span>
+            </div>
+
 			<bl-text-property label="Publisher" [value]="decorator.virtualMachineConfiguration.imageReference.publisher"></bl-text-property>
 			<bl-text-property label="Offer" [value]="decorator.virtualMachineConfiguration.imageReference.offer"></bl-text-property>
             <bl-text-property label="Sku" [value]="decorator.virtualMachineConfiguration.imageReference.sku"></bl-text-property>
@@ -39,5 +50,57 @@
             <bl-text-property *ngIf="decorator.virtualMachineConfiguration.windowsConfiguration"
                 label="Enable automatic updates" [value]="decorator.virtualMachineConfiguration.windowsConfiguration.enableAutomaticUpdates"></bl-text-property>
 		</bl-property-group>
+
+        <bl-property-group label="Application packages" class="wide" [collapsed]="true">
+            <div collapsed-preview>
+                <span>{{appPackages?.size}} application package references</span>
+            </div>
+            <bl-table-property *ngIf="appPackages.size > 0" label="Package references">
+                <bl-table-property-header>
+                    <div tp-column>Application</div>
+                    <div tp-column>Version</div>
+                </bl-table-property-header>
+                <bl-table-property-row *ngFor="let package of appPackages">
+                    <bl-tp-cell [value]="package.applicationId"></bl-tp-cell>
+                    <bl-tp-cell [value]="package.version"></bl-tp-cell>
+                </bl-table-property-row>
+            </bl-table-property>
+            <bl-no-item [itemCount]="appPackages.size" [slimline]="true">
+                <span no-filter>This pool contains no application package references</span>
+            </bl-no-item>
+        </bl-property-group>
+
+        <bl-property-group label="Certificates" class="wide" [collapsed]="true">
+            <div collapsed-preview>
+                <span>{{certificates?.size}} certificate references</span>
+            </div>
+            <bl-table-property *ngIf="certificates.size > 0" label="Certificate references">
+                <bl-table-property-header>
+                    <div tp-column>Thumbprint</div>
+                    <div tp-column>Store</div>
+                    <div tp-column>Store name</div>
+                    <div tp-column>Visibility</div>
+                </bl-table-property-header>
+                <bl-table-property-row *ngFor="let certificate of certificates">
+                    <bl-tp-cell [value]="certificate.thumbprint"></bl-tp-cell>
+                    <bl-tp-cell [value]="certificate.storeLocation"></bl-tp-cell>
+                    <bl-tp-cell [value]="certificate.storeName"></bl-tp-cell>
+                    <bl-tp-cell [value]="certificate.visibility"></bl-tp-cell>
+                </bl-table-property-row>
+            </bl-table-property>
+            <bl-no-item [itemCount]="certificates.size" [slimline]="true">
+                <span no-filter>This pool contains no certificate references</span>
+            </bl-no-item>
+        </bl-property-group>
+
+        <bl-property-group label="Metadata" class="wide" [collapsed]="true">
+            <div collapsed-preview>
+                <span>{{metadata?.size}} meta items</span>
+            </div>
+            <bl-text-property *ngFor="let metaItem of metadata" label="{{metaItem.name}}" [value]="metaItem.value"></bl-text-property>
+            <bl-no-item [itemCount]="metadata.size" [slimline]="true">
+                <span no-filter>This pool contains no metadata</span>
+            </bl-no-item>
+        </bl-property-group>
 	</bl-property-list>
 </div>
diff --git a/app/components/pool/details/pool-details.component.ts b/app/components/pool/details/pool-details.component.ts
index bc70343ecc..c0c087141d 100644
--- a/app/components/pool/details/pool-details.component.ts
+++ b/app/components/pool/details/pool-details.component.ts
@@ -69,6 +69,7 @@ export class PoolDetailsComponent implements OnInit, OnDestroy {
 
     public ngOnDestroy() {
         this._paramsSubscriber.unsubscribe();
+        this.data.dispose();
     }
 
     public get filterPlaceholderText() {
@@ -106,16 +107,6 @@ export class PoolDetailsComponent implements OnInit, OnDestroy {
         });
     }
 
-    public get nodesTooltipMessage() {
-        if (this.pool.resizeError) {
-            return "There was a resize error";
-        } else if (this.pool.currentDedicated !== this.pool.targetDedicated) {
-            return `Pool is resizing from ${this.pool.currentDedicated} to ${this.pool.targetDedicated} nodes`;
-        } else {
-            return `Pool has ${this.pool.currentDedicated} nodes`;
-        }
-    }
-
     @autobind()
     public updateTags(newTags: List<string>) {
         return this.poolService.updateTags(this.pool, newTags).flatMap(() => {
diff --git a/app/components/pool/details/pool-details.html b/app/components/pool/details/pool-details.html
index f801a98d83..4ae8e67a41 100644
--- a/app/components/pool/details/pool-details.html
+++ b/app/components/pool/details/pool-details.html
@@ -1,29 +1,25 @@
 <bl-loading [status]="data.newDataStatus | async">
     <div *ngIf="pool && poolDecorator">
         <md-card class="overview">
-            <md-card-title-group style="margin: 0px;">
-                <div style="align-items:center;">
+            <div class="actions">
+                <bl-action-btn-group>
                     <bl-refresh-btn [refresh]="refreshPool"></bl-refresh-btn>
-                </div>
-                <div style="margin-left:12px; margin-right:auto;">
-                    <md-card-title>{{pool.id}}</md-card-title>
-                    <md-card-subtitle>{{pool.vmSize}}, {{pool.allocationState}}</md-card-subtitle>
-                </div>
-                <div>
-                    <bl-pool-nodes-preview [pool]="pool" size="large"></bl-pool-nodes-preview>
-                </div>
-            </md-card-title-group>
-            <md-card-content>
+                    <bl-add-button title="Add job" (action)="addJob()"></bl-add-button>
+                    <bl-resize-button (action)="resizePool()"></bl-resize-button>
+                    <bl-clone-button (action)="clonePool()"></bl-clone-button>
+                    <bl-delete-button [entity]="pool" (action)="deletePool()"></bl-delete-button>
+                </bl-action-btn-group>
+            </div>
+            <div class="content">
+                <md-card-title>{{pool.id}}</md-card-title>
+                <md-card-subtitle>{{pool.vmSize}}, {{pool.allocationState}}</md-card-subtitle>
                 <p>Last resized {{poolDecorator.lastResized}}</p>
                 <p><i class="fa fa-{{poolDecorator.poolOsIcon}}" aria-hidden="true"></i> {{poolDecorator.poolOs}}</p>
                 <bl-tags [tags]="pool.tags" [editable]="true" [save]="updateTags" noTagsMessage="No tags."></bl-tags>
-            </md-card-content>
-            <md-card-actions layout="row" layout-align="end center">
-                <bl-add-button title="Add job" (click)="addJob()"></bl-add-button>
-                <bl-resize-button (click)="resizePool()"></bl-resize-button>
-                <bl-clone-button (click)="clonePool()"></bl-clone-button>
-                <bl-delete-button [entity]="pool" (click)="deletePool()"></bl-delete-button>
-            </md-card-actions>
+            </div>
+            <div style="padding: 10px">
+                <bl-pool-nodes-preview [pool]="pool" size="large"></bl-pool-nodes-preview>
+            </div>
         </md-card>
         <bl-pool-error-display [pool]="pool"></bl-pool-error-display>
         <md-card class="details">
diff --git a/app/components/pool/graphs/heatmap-color.ts b/app/components/pool/graphs/heatmap-color.ts
index 330cd5ccc2..43cee600a3 100644
--- a/app/components/pool/graphs/heatmap-color.ts
+++ b/app/components/pool/graphs/heatmap-color.ts
@@ -8,6 +8,8 @@ interface ColorMap { [key: string]: string; }
  * It also handles showing different colors for categories and substates
  */
 export class HeatmapColor {
+    public keys: string[];
+
     private _colors: ColorMap = {};
     private _lastHighlightedState: string = null;
 
@@ -32,6 +34,7 @@ export class HeatmapColor {
         } else {
             this._colors = this._colorsForHighlight(highlightedState);
         }
+        this.keys = Object.keys(this._colors);
         this._lastHighlightedState = highlightedState;
     }
 
diff --git a/app/components/pool/graphs/history-data/running-tasks-history-data.ts b/app/components/pool/graphs/history-data/running-tasks-history-data.ts
index 80c9d87b19..c72b21af7b 100644
--- a/app/components/pool/graphs/history-data/running-tasks-history-data.ts
+++ b/app/components/pool/graphs/history-data/running-tasks-history-data.ts
@@ -9,7 +9,7 @@ export class RunningTasksHistoryData extends HistoryDataBase {
         if (!this.hasTimePassed(time)) {
             return;
         }
-        const runningTask = nodes.map(x => x.runningTasks.size).reduce((a, b) => a + b, 0);
+        const runningTask = nodes.map(x => x.runningTasksCount).reduce((a, b) => a + b, 0);
         this.history = this.history.concat([{
             time: time,
             y: runningTask,
diff --git a/app/components/pool/graphs/nodes-heatmap.component.ts b/app/components/pool/graphs/nodes-heatmap.component.ts
index cdc9ed4033..336a32db6e 100644
--- a/app/components/pool/graphs/nodes-heatmap.component.ts
+++ b/app/components/pool/graphs/nodes-heatmap.component.ts
@@ -1,12 +1,13 @@
 import {
-    AfterViewInit, ChangeDetectionStrategy, Component, ElementRef, HostBinding, Input, OnChanges, OnDestroy, ViewChild,
+    AfterViewInit, ChangeDetectionStrategy, Component, ElementRef,
+    HostBinding, Input, OnChanges, OnDestroy, SimpleChanges, ViewChild,
 } from "@angular/core";
 import * as d3 from "d3";
 import * as elementResizeDetectorMaker from "element-resize-detector";
 import { List } from "immutable";
 import { BehaviorSubject } from "rxjs";
 
-import { Node, NodeState, Pool } from "app/models";
+import { Job, Node, NodeState, Pool } from "app/models";
 import { log } from "app/utils";
 import { HeatmapColor } from "./heatmap-color";
 import { StateTree } from "./state-tree";
@@ -65,6 +66,9 @@ export class NodesHeatmapComponent implements AfterViewInit, OnChanges, OnDestro
     @Input()
     public showLegend: boolean = true;
 
+    @Input()
+    public showRunningTasks: boolean = true;
+
     @Input()
     @HostBinding("class.interactive")
     public interactive: boolean = true;
@@ -75,16 +79,14 @@ export class NodesHeatmapComponent implements AfterViewInit, OnChanges, OnDestro
     @ViewChild("heatmap")
     public heatmapEl: ElementRef;
 
+    @ViewChild("svg")
+    public svgEl: ElementRef;
+
     @Input()
-    public set nodes(nodes: List<Node>) {
-        if (nodes.size > maxNodes) {
-            log.warn(`Only supporting up to ${maxNodes} nodes for now!`);
-        }
-        this._nodes = List<Node>(nodes.slice(0, this.limitNode || maxNodes));
-        this._buildNodeMap();
-        this._processNewNodes();
-    }
-    public get nodes() { return this._nodes; }
+    public nodes: List<Node>;
+
+    @Input()
+    public jobs: List<Job> = List([]);
 
     public colors: HeatmapColor;
     public selectedNodeId = new BehaviorSubject<string>(null);
@@ -101,8 +103,8 @@ export class NodesHeatmapComponent implements AfterViewInit, OnChanges, OnDestro
     private _svg: d3.Selection<any, any, any, any>;
     private _width: number = 0;
     private _height: number = 0;
-    private _nodeMap: { [id: string]: Node } = {};
     private _nodes: List<Node>;
+    private _nodeMap: { [id: string]: Node } = {};
 
     constructor(private elementRef: ElementRef) {
         this.colors = new HeatmapColor(stateTree);
@@ -111,13 +113,27 @@ export class NodesHeatmapComponent implements AfterViewInit, OnChanges, OnDestro
         });
     }
 
-    public ngOnChanges(changes) {
+    public ngOnChanges(changes: SimpleChanges) {
         if (changes.pool) {
+            const prev = changes.pool.previousValue;
+            const cur = changes.pool.currentValue;
+            if (prev && cur && prev.id === cur.id) {
+                return;
+            }
             this.selectedNodeId.next(null);
             if (this._svg) {
                 this._svg.selectAll("g.node-group").remove();
             }
         }
+
+        if (changes.nodes) {
+            if (this.nodes.size > maxNodes) {
+                log.warn(`Only supporting up to ${maxNodes} nodes for now!`);
+            }
+            this._nodes = List<Node>(this.nodes.slice(0, this.limitNode || maxNodes));
+            this._buildNodeMap();
+            this._processNewData();
+        }
     }
 
     public ngAfterViewInit() {
@@ -129,11 +145,11 @@ export class NodesHeatmapComponent implements AfterViewInit, OnChanges, OnDestro
             this.containerSizeChanged();
         });
 
-        this._svg = d3.select(this.heatmapEl.nativeElement).append("svg")
+        this._svg = d3.select(this.svgEl.nativeElement)
             .attr("width", this._width)
             .attr("height", this._height);
 
-        this._processNewNodes();
+        this._processNewData();
     }
 
     public ngOnDestroy() {
@@ -149,11 +165,11 @@ export class NodesHeatmapComponent implements AfterViewInit, OnChanges, OnDestro
 
     public selectState(state: string) {
         this.highlightedState = state;
+        this.colors.updateColors(this.highlightedState);
         this.redraw();
     }
 
     public redraw() {
-        this.colors.updateColors(this.highlightedState);
         this._computeDimensions();
         const tiles = this._nodes.map((node, index) => ({ node, index }));
         const groups = this._svg.selectAll("g.node-group").data(tiles.toJS());
@@ -161,7 +177,7 @@ export class NodesHeatmapComponent implements AfterViewInit, OnChanges, OnDestro
         this._updateSvg(groups);
     }
 
-    private _processNewNodes() {
+    private _processNewData() {
         if (!this._svg) {
             return;
         }
@@ -172,22 +188,6 @@ export class NodesHeatmapComponent implements AfterViewInit, OnChanges, OnDestro
         const z = Math.max(this.dimensions.tileSize - 6, 0);
         const nodeEnter = groups.enter().append("g")
             .attr("class", "node-group")
-            .on("mouseenter", (tile, index, nodes) => {
-                if (!this.interactive) {
-                    return;
-                }
-                const group = d3.select(nodes[index]);
-                groups.selectAll("text").remove();
-                group.append("text")
-                    .attr("dx", 5)
-                    .attr("dy", "1.5em")
-                    .attr("text-anchor", "start")
-                    .text(`${tile.node.runningTasks.size} task running`);
-            })
-            .on("mouseleave", (tile, index, nodes) => {
-                const group = d3.select(nodes[index]);
-                group.selectAll("text").remove();
-            })
             .on("click", (tile) => {
                 if (!this.interactive) {
                     return;
@@ -202,9 +202,13 @@ export class NodesHeatmapComponent implements AfterViewInit, OnChanges, OnDestro
 
         const backgroundGroup = nodeEnter.append("g").classed("bg", true).merge(groups.select("g.bg"));
         const runningTaskGroup = nodeEnter.append("g").classed("tasks", true).merge(groups.select("g.tasks"));
+        const lowPriOverlayGroup = nodeEnter.append("g").classed("lowpri", true).merge(groups.select("g.lowpri"));
+        const title = nodeEnter.append("title").merge(groups.select("title"));
 
         this._displayNodeBackground(backgroundGroup, z);
         this._displayRunningTasks(runningTaskGroup, z);
+        this._displayLowPriOverlay(lowPriOverlayGroup, z);
+        this._displayTileTooltip(title);
     }
 
     private _displayNodeBackground(backgroundGroup, z) {
@@ -213,13 +217,26 @@ export class NodesHeatmapComponent implements AfterViewInit, OnChanges, OnDestro
             .attr("width", z)
             .attr("height", z)
             .style("fill", (tile: any) => {
-                let color;
-                if (tile.node.state === NodeState.running) {
-                    color = idleColor;
+                return this._tileBgColor(tile.node);
+            })
+            .style("stroke-width", (tile: any) => {
+                return tile.node.id === this.selectedNodeId.value ? "2px" : "0";
+            });
+
+        nodeBackground.exit().remove();
+    }
+
+    private _displayLowPriOverlay(lowPriGroup, z) {
+        const nodeBackground = lowPriGroup.selectAll("rect").data((d) => [d]);
+        nodeBackground.enter().append("rect").merge(nodeBackground)
+            .attr("width", z)
+            .attr("height", z)
+            .style("fill", (tile: any) => {
+                if (tile.node.isDedicated) {
+                    return "transparent";
                 } else {
-                    color = this.colors.get(tile.node.state);
+                    return "url(#low-pri-stripes)";
                 }
-                return d3.color(color) as any;
             })
             .style("stroke-width", (tile: any) => {
                 return tile.node.id === this.selectedNodeId.value ? "2px" : "0";
@@ -228,23 +245,44 @@ export class NodesHeatmapComponent implements AfterViewInit, OnChanges, OnDestro
         nodeBackground.exit().remove();
     }
 
+    /**
+     * Get the color of the tile given the node it is assigned
+     * @param node Node for the given tile
+     *
+     * It will use the color of the state of the node unless the node is running.
+     * In the case the node is running it will use the idle background color as the tasks will be displayed above
+     * unless tasks are not loaded yet and so it will use the running color.
+     *
+     * If the node is low priority it will use a dashed pattern.
+     * If the node is dedicated it will fill the bg with the color.
+     */
+    private _tileBgColor(node: Node) {
+        const showTaskOverlay = node.state === NodeState.running;
+        const color = showTaskOverlay ? idleColor : this.colors.get(node.state);
+        return d3.color(color) as any;
+    }
+
     private _displayRunningTasks(taskGroup, z) {
         const maxTaskPerNode = this.pool.maxTasksPerNode;
         const taskWidth = Math.floor(z / maxTaskPerNode);
-
+        if (z === 0) { // When switching between the graphs there is a moment where the width/height is 0
+            return;
+        }
         const runningTaskRects = taskGroup.selectAll("rect")
             .data((d) => {
                 const node: Node = d.node;
                 if (node.state !== NodeState.running || !node.recentTasks) {
                     return [];
                 }
-                return node.runningTasks.map((task, index) => ({ task, index })).toJS();
+                const count = node.runningTasksCount;
+                const array = new Array(count).fill(0).map((task, index) => ({ node, index }));
+                return array;
             });
 
         runningTaskRects.enter().append("rect")
             .attr("transform", (data) => {
                 const index = data.index;
-                const x = (maxTaskPerNode - index - 1) * taskWidth + 1;
+                const x = z - (index + 1) * taskWidth;
                 return `translate(0,${x})`;
             })
             .attr("width", z)
@@ -254,6 +292,13 @@ export class NodesHeatmapComponent implements AfterViewInit, OnChanges, OnDestro
         runningTaskRects.exit().remove();
     }
 
+    private _displayTileTooltip(titleNode) {
+        titleNode.text((tile) => {
+            const count = tile.node.runningTasksCount;
+            return `${count} tasks running on this node`;
+        });
+    }
+
     /**
      * Compute the dimension of the heatmap.
      *  - rows
diff --git a/app/components/pool/graphs/nodes-heatmap.html b/app/components/pool/graphs/nodes-heatmap.html
index cf09d8f7f4..9df59f10cf 100644
--- a/app/components/pool/graphs/nodes-heatmap.html
+++ b/app/components/pool/graphs/nodes-heatmap.html
@@ -3,5 +3,13 @@
         <bl-nodes-heatmap-legend [poolId]="pool.id" [nodes]="nodes" [colors]="colors" (selectedStateChange)="selectState($event)"></bl-nodes-heatmap-legend>
         <bl-node-preview-card [poolId]="pool.id" [node]="selectedNode | async" *ngIf="selectedNode | async" (close)="selectedNodeId.next(null)"></bl-node-preview-card>
     </div>
-    <div #heatmap class="heatmap-container"></div>
+    <div class="heatmap-container" #heatmap>
+        <svg #svg>
+            <defs>
+                <pattern id="low-pri-stripes" width="10" height="10" patternUnits="userSpaceOnUse" patternTransform="rotate(45 50 50)">
+                    <line stroke="#fff" stroke-width="2px" y2="10"></line>
+                </pattern>
+            </defs>
+        </svg>
+    </div>
 </div>
diff --git a/app/components/pool/graphs/pool-graphs.component.ts b/app/components/pool/graphs/pool-graphs.component.ts
index 343335846d..b439d38b27 100644
--- a/app/components/pool/graphs/pool-graphs.component.ts
+++ b/app/components/pool/graphs/pool-graphs.component.ts
@@ -1,13 +1,14 @@
-import { Component, Input, OnChanges, OnDestroy } from "@angular/core";
+import { Component, Input, OnChanges, OnDestroy, SimpleChanges } from "@angular/core";
 import { FormControl } from "@angular/forms";
 import { Router } from "@angular/router";
 import { autobind } from "core-decorators";
 import { List } from "immutable";
 import { Subscription } from "rxjs";
 
-import { Node, NodeState, Pool } from "app/models";
-import { NodeListParams, NodeService } from "app/services";
+import { Job, JobState, Node, NodeState, Pool, Task } from "app/models";
+import { JobService, NodeListParams, NodeService } from "app/services";
 import { PollObservable, RxListProxy } from "app/services/core";
+import { FilterBuilder } from "app/utils/filter-builder";
 import { NodesStateHistoryData, RunningTasksHistoryData } from "./history-data";
 import { StateCounter } from "./state-counter";
 
@@ -24,6 +25,7 @@ const HistoryLength = {
 };
 
 const refreshRate = 5000;
+
 @Component({
     selector: "bl-pool-graphs",
     templateUrl: "pool-graphs.html",
@@ -38,6 +40,12 @@ export class PoolGraphsComponent implements OnChanges, OnDestroy {
     public data: RxListProxy<NodeListParams, Node>;
 
     public nodes: List<Node> = List([]);
+    /**
+     * List of jobs running on this pool
+     */
+    public jobs: List<Job> = List([]);
+    public tasks: List<Task> = List([]);
+
     public startTaskFailedError: any;
 
     public runningTaskHistory = new RunningTasksHistoryData();
@@ -47,15 +55,20 @@ export class PoolGraphsComponent implements OnChanges, OnDestroy {
     public focusedGraph = AvailableGraph.Heatmap;
     public selectedHistoryLength = new FormControl(HistoryLength.TenMinute);
 
+    private _jobData: RxListProxy<{}, Job>;
     private _stateCounter = new StateCounter();
 
     private _poll: PollObservable;
     private _nodesSub: Subscription;
 
-    constructor(private nodeService: NodeService, private router: Router) {
+    constructor(
+        private nodeService: NodeService,
+        jobService: JobService,
+        private router: Router,
+    ) {
         this.data = nodeService.list(null, {
             pageSize: 1000,
-            select: "recentTasks,id,state",
+            select: "id,state,runningTasksCount,isDedicated",
         });
         this._nodesSub = this.data.items.subscribe((nodes) => {
             if (nodes.size !== 0) {
@@ -66,19 +79,36 @@ export class PoolGraphsComponent implements OnChanges, OnDestroy {
             }
             this._scanForProblems();
         });
+        this._jobData = jobService.list({
+            select: "id",
+        });
+
+        this._jobData.items.subscribe((jobs) => {
+            this.jobs = jobs;
+        });
 
         this.selectedHistoryLength.valueChanges.subscribe((value) => {
             this.runningNodesHistory.setHistorySize(value);
             this.runningTaskHistory.setHistorySize(value);
         });
-        this._poll = this.data.startPoll(refreshRate);
+        this._poll = this.data.startPoll(refreshRate, true);
     }
 
-    public ngOnChanges(changes) {
+    public ngOnChanges(changes: SimpleChanges) {
         if (changes.pool) {
+            const prev = changes.pool.previousValue;
+            const cur = changes.pool.currentValue;
+            this.maxRunningTasks = this.pool ? this.pool.targetNodes * this.pool.maxTasksPerNode : 0;
+            if (prev && cur && prev.id === cur.id) {
+                return;
+            }
             this.data.updateParams({ poolId: this.pool.id });
-            this.data.refresh(false);
-            this.maxRunningTasks = this.pool ? this.pool.targetDedicated * this.pool.maxTasksPerNode : 0;
+            this.data.refreshAll(false);
+
+            this._jobData.patchOptions({
+                filter: this._buildJobFilter(),
+            });
+            this._jobData.refreshAll();
             this.runningNodesHistory.reset();
             this.runningTaskHistory.reset();
         }
@@ -87,6 +117,8 @@ export class PoolGraphsComponent implements OnChanges, OnDestroy {
     public ngOnDestroy() {
         this._poll.destroy();
         this._nodesSub.unsubscribe();
+        this.data.dispose();
+        this._jobData.dispose();
     }
 
     @autobind()
@@ -122,4 +154,10 @@ export class PoolGraphsComponent implements OnChanges, OnDestroy {
         }
     }
 
+    private _buildJobFilter(): string {
+        return FilterBuilder.and(
+            FilterBuilder.prop("state").eq(JobState.active),
+            FilterBuilder.prop("executionInfo/poolId").eq(this.pool.id),
+        ).toOData();
+    }
 }
diff --git a/app/components/pool/graphs/pool-graphs.html b/app/components/pool/graphs/pool-graphs.html
index cbd0419d7d..f911d769f6 100644
--- a/app/components/pool/graphs/pool-graphs.html
+++ b/app/components/pool/graphs/pool-graphs.html
@@ -7,12 +7,12 @@
     <div class="preview" (click)="focusGraph(AvailableGraph.Heatmap)" [class.focused]="focusedGraph === AvailableGraph.Heatmap">
         <div class="label">Heatmap</div>
         <div class="small-preview">
-            <bl-nodes-heatmap [pool]="pool" [nodes]="nodes" [showLegend]="false" [interactive]="false" [limitNode]="10"></bl-nodes-heatmap>
+            <bl-nodes-heatmap [pool]="pool" [nodes]="nodes" [showRunningTasks]="false"[showLegend]="false" [interactive]="false" [limitNode]="10"></bl-nodes-heatmap>
         </div>
     </div>
     <div class="preview" (click)="focusGraph(AvailableGraph.AvailableNodes)" [class.focused]="focusedGraph === AvailableGraph.AvailableNodes">
         <div class="label">Available nodes</div>
-        <bl-history-graph [max]="pool.targetDedicated" class="small-preview" [history]="runningNodesHistory.history" [interactive]="false" [historySize]="selectedHistoryLength.value">
+        <bl-history-graph [max]="pool.targetNodes" class="small-preview" [history]="runningNodesHistory.history" [interactive]="false" [historySize]="selectedHistoryLength.value">
         </bl-history-graph>
     </div>
     <div class="preview" (click)="focusGraph(AvailableGraph.RunningTasks)" [class.focused]="focusedGraph === AvailableGraph.RunningTasks">
@@ -31,10 +31,10 @@
 
 <div class="focused-graph" [ngSwitch]="focusedGraph">
     <div *ngSwitchCase="AvailableGraph.Heatmap" class="full-display-heatmap">
-        <bl-nodes-heatmap [pool]="pool" [nodes]="nodes"></bl-nodes-heatmap>
+        <bl-nodes-heatmap [pool]="pool" [nodes]="nodes" [jobs]="jobs"></bl-nodes-heatmap>
     </div>
     <div *ngSwitchCase="AvailableGraph.AvailableNodes" class="full-display">
-        <bl-history-graph [max]="pool.targetDedicated" class="full-display" [history]="runningNodesHistory.history" [historySize]="selectedHistoryLength.value">
+        <bl-history-graph [max]="pool.targetNodes" class="full-display" [history]="runningNodesHistory.history" [historySize]="selectedHistoryLength.value">
         </bl-history-graph>
     </div>
     <div *ngSwitchCase="AvailableGraph.RunningTasks" class="full-display">
diff --git a/app/components/pool/home/pool-home.html b/app/components/pool/home/pool-home.html
index 98dee76a51..bd0fea300c 100644
--- a/app/components/pool/home/pool-home.html
+++ b/app/components/pool/home/pool-home.html
@@ -1,8 +1,7 @@
 <bl-list-and-show-layout #layout (listScrolledToBottom)="poolList.onScrollToBottom()" [list]="poolList">
     <div bl-list-buttons>
-        <button md-mini-fab color="primary" title="Add a pool" (click)="addPool()">
-            <i class="fa fa-plus spin-hover"></i>
-        </button>
+        <bl-action-btn color="primary" type="round" icon="fa fa-plus spin-hover" title="Add a pool" (action)="addPool()">
+        </bl-action-btn>
     </div>
     <div bl-list-content>
         <bl-focus-section>
diff --git a/app/components/pool/start-task/start-task-edit-form.component.ts b/app/components/pool/start-task/start-task-edit-form.component.ts
index 7427732ea5..40db82cb04 100644
--- a/app/components/pool/start-task/start-task-edit-form.component.ts
+++ b/app/components/pool/start-task/start-task-edit-form.component.ts
@@ -18,10 +18,12 @@ export class StartTaskEditFormComponent {
     public set pool(pool: Pool) {
         this._pool = pool;
         this._startTask = pool.startTask;
-        this.form.patchValue({
-            enableStartTask: Boolean(pool.startTask),
-            startTask: pool.startTask && pool.startTask.toJS(),
-        });
+        if (!this.form.dirty) {
+            this.form.patchValue({
+                enableStartTask: Boolean(pool.startTask),
+                startTask: pool.startTask && pool.startTask.toJS(),
+            });
+        }
     }
 
     public get pool() { return this._pool; }
diff --git a/app/components/pool/start-task/start-task-picker.html b/app/components/pool/start-task/start-task-picker.html
index 7b0fe9401b..90e5d4f832 100644
--- a/app/components/pool/start-task/start-task-picker.html
+++ b/app/components/pool/start-task/start-task-picker.html
@@ -16,15 +16,16 @@
             Wait for success
         </md-slide-toggle>
     </div>
-
-    <div class="form-element">
+    <div class="form-element pad-top">
         <bl-user-identity-picker formControlName="userIdentity" [userAccounts]="userAccounts">
         </bl-user-identity-picker>
     </div>
-
-    <h4>Resource files</h4>
-    <bl-resourcefile-picker formControlName="resourceFiles"></bl-resourcefile-picker>
-
-    <h4>Environment variables</h4>
-    <bl-key-value-picker formControlName="environmentSettings"></bl-key-value-picker>
+    <div class="form-element pad-top">
+        <h4>Resource files</h4>
+        <bl-resourcefile-picker formControlName="resourceFiles"></bl-resourcefile-picker>
+    </div>
+    <div class="form-element pad-top">
+        <h4>Environment variables</h4>
+        <bl-key-value-picker formControlName="environmentSettings"></bl-key-value-picker>
+    </div>
 </div>
diff --git a/app/components/pool/start-task/start-task-properties.html b/app/components/pool/start-task/start-task-properties.html
index 67d8159f37..993503f2d0 100644
--- a/app/components/pool/start-task/start-task-properties.html
+++ b/app/components/pool/start-task/start-task-properties.html
@@ -3,13 +3,13 @@
 </button>
 
 <bl-property-list *ngIf="startTask && !edit">
-    <bl-property-group class="wide">
+    <bl-property-group label="Start task settings" [collapsable]="false" class="wide">
         <bl-text-property label="Command line" [value]="startTask.commandLine"></bl-text-property>
         <bl-text-property label="Max retry count" [value]="startTask.maxTaskRetryCount"></bl-text-property>
         <bl-text-property label="User identity" [value]="decorator.userIdentitySummary"></bl-text-property>
         <bl-bool-property label="Wait for success" [value]="startTask.waitForSuccess" YesNo="true"></bl-bool-property>
 
-        <bl-table-property label="Resource files">
+        <bl-table-property label="Resource files" *ngIf="startTask.resourceFiles.size > 0">
             <bl-table-property-header>
                 <div tp-column>Blob source</div>
                 <div tp-column>File path</div>
@@ -19,7 +19,8 @@
                 <bl-tp-cell [value]="file.filePath"></bl-tp-cell>
             </bl-table-property-row>
         </bl-table-property>
-        <bl-table-property label="Environment settings">
+
+        <bl-table-property label="Environment settings" *ngIf="startTask.environmentSettings.size > 0">
             <bl-table-property-header>
                 <div tp-column>Key</div>
                 <div tp-column>Value</div>
diff --git a/app/components/shared/main-navigation.html b/app/components/shared/main-navigation.html
index 3cbae2b080..eb2dffa58e 100644
--- a/app/components/shared/main-navigation.html
+++ b/app/components/shared/main-navigation.html
@@ -1,14 +1,18 @@
 <ul>
     <li>
-        <a href="#" [routerLink]="['/accounts', selectedId]" routerLinkActive="active"><i class="fa fa-th fa-lg"></i><span>Dash</span></a>
+        <a href="#" [routerLink]="['/accounts', selectedId]" routerLinkActive="active" title="Dashboard">
+            <i class="fa fa-th fa-lg"></i><div class="label">Dash</div>
+        </a>
     </li>
     <li>
-        <a href="#" routerLink="jobs" routerLinkActive="active"><i class="fa fa-tasks fa-lg"></i><span>Jobs</span></a>
+        <a href="#" routerLink="jobs" routerLinkActive="active"><i class="fa fa-tasks fa-lg"></i><div class="label">Jobs</div></a>
     </li>
     <li>
-        <a href="#" routerLink="pools" routerLinkActive="active"><i class="fa fa-database fa-lg"></i><span>Pools</span></a>
+        <a href="#" routerLink="pools" routerLinkActive="active"><i class="fa fa-database fa-lg"></i><div class="label">Pools</div></a>
     </li>
     <li>
-        <a href="#" routerLink="applications" routerLinkActive="active"><i class="fa fa-file-archive-o fa-lg"></i><span>App Packages</span></a>
+        <a href="#" routerLink="applications" routerLinkActive="active" title="Application packages">
+            <i class="fa fa-file-archive-o fa-lg"></i><div class="label">Packages</div>
+        </a>
     </li>
 </ul>
diff --git a/app/components/task/action/add/task-create-basic-dialog.component.ts b/app/components/task/action/add/task-create-basic-dialog.component.ts
index c719e5a4ef..518cfabb1f 100644
--- a/app/components/task/action/add/task-create-basic-dialog.component.ts
+++ b/app/components/task/action/add/task-create-basic-dialog.component.ts
@@ -29,7 +29,7 @@ export class TaskCreateBasicDialogComponent extends DynamicForm<Task, TaskCreate
 
     constructor(
         private formBuilder: FormBuilder,
-        sidebarRef: SidebarRef<TaskCreateBasicDialogComponent>,
+        public sidebarRef: SidebarRef<TaskCreateBasicDialogComponent>,
         protected taskService: TaskService,
         private notificationService: NotificationService) {
         super(TaskCreateDto);
diff --git a/app/components/task/action/delete/delete-task-action.ts b/app/components/task/action/delete/delete-task-action.ts
index a787c27748..5500bb210d 100644
--- a/app/components/task/action/delete/delete-task-action.ts
+++ b/app/components/task/action/delete/delete-task-action.ts
@@ -48,24 +48,17 @@ export class WaitForDeleteTaskPoller {
     @autobind()
     public start(progress: BehaviorSubject<any>): Observable<any> {
         const obs = new AsyncSubject();
-        const data = this.taskService.get(this.jobId, this.taskId);
-        const errorCallback = (e) => {
-            progress.next(100);
-            clearInterval(interval);
-            obs.complete();
-        };
-
         let interval = setInterval(() => {
-            data.fetch().subscribe({
-                error: errorCallback,
+            this.taskService.getOnce(this.jobId, this.taskId).subscribe({
+                error: (e) => {
+                    progress.next(100);
+                    clearInterval(interval);
+                    obs.complete();
+                },
             });
         }, 5000);
 
         progress.next(-1);
-        data.item.subscribe({
-            error: errorCallback,
-        });
-
         return obs;
     }
 }
diff --git a/app/components/task/browse/display/task-list-display.component.ts b/app/components/task/browse/display/task-list-display.component.ts
index 44c05716ae..8d08487f9d 100644
--- a/app/components/task/browse/display/task-list-display.component.ts
+++ b/app/components/task/browse/display/task-list-display.component.ts
@@ -9,7 +9,7 @@ import { ListOrTableBase } from "app/components/base/selectable-list";
 import { TableComponent } from "app/components/base/table";
 import { DeleteTaskDialogComponent, TerminateTaskDialogComponent } from "app/components/task/action";
 import { Task, TaskState } from "app/models";
-import { SchedulingErrorDecorator } from "app/models/decorators";
+import { FailureInfoDecorator } from "app/models/decorators";
 import { TaskService } from "app/services";
 import { DateUtils } from "app/utils";
 
@@ -46,8 +46,8 @@ export class TaskListDisplayComponent extends ListOrTableBase {
     }
 
     public taskStatusText(task: Task): string {
-        if (task.executionInfo && task.executionInfo.schedulingError) {
-            return new SchedulingErrorDecorator(task.executionInfo.schedulingError).summary;
+        if (task.executionInfo && task.executionInfo.failureInfo) {
+            return new FailureInfoDecorator(task.executionInfo.failureInfo).summary;
         } else if (task.executionInfo && task.executionInfo.exitCode !== 0) {
             return `Task failed with exitCode:  ${task.executionInfo.exitCode}`;
         }
diff --git a/app/components/task/browse/task-list.component.ts b/app/components/task/browse/task-list.component.ts
index 45cbcca3b5..2d9f878f85 100644
--- a/app/components/task/browse/task-list.component.ts
+++ b/app/components/task/browse/task-list.component.ts
@@ -68,7 +68,7 @@ export class TaskListComponent extends SelectableList implements OnInit {
         super();
 
         this._onTaskAddedSub = taskService.onTaskAdded.subscribe((item: TaskParams) => {
-            this.data.loadNewItem(taskService.get(item.jobId, item.id));
+            this.data.loadNewItem(taskService.getOnce(item.jobId, item.id));
         });
     }
 
diff --git a/app/components/task/details/output/task-log.component.ts b/app/components/task/details/output/task-log.component.ts
index e446935bdc..7f9e097ec8 100644
--- a/app/components/task/details/output/task-log.component.ts
+++ b/app/components/task/details/output/task-log.component.ts
@@ -1,58 +1,194 @@
-import { Component, Input, OnChanges, OnDestroy } from "@angular/core";
-import { Subscription } from "rxjs";
+import { Component, Input, OnChanges, OnDestroy, OnInit } from "@angular/core";
+import { FormControl } from "@angular/forms";
+import { BehaviorSubject, Observable, Subscription } from "rxjs";
 
-import { File, Task } from "app/models";
+import { File, ServerError, Task, TaskState } from "app/models";
 import { FileService } from "app/services";
+import { PollObservable } from "app/services/core";
 import { prettyBytes } from "app/utils";
 
-const outputFileNames = ["stdout.txt", "stderr.txt"];
+const defaultOutputFileNames = ["stdout.txt", "stderr.txt"];
 
 @Component({
     selector: "bl-task-log",
     templateUrl: "task-log.html",
 })
-export class TaskLogComponent implements OnChanges, OnDestroy {
+export class TaskLogComponent implements OnInit, OnChanges, OnDestroy {
     @Input()
     public jobId: string;
 
     @Input()
     public task: Task;
 
-    public outputFileNames = outputFileNames;
-    public outputFilename: "stdout.txt" | "stderr.txt" = "stdout.txt";
+    public outputFileNames = defaultOutputFileNames.slice();
+    public selectedOutputFile: "stdout.txt" | "stderr.txt" = defaultOutputFileNames[0] as any;
     public fileSizes: { [filename: string]: string } = {};
+    public filterControl = new FormControl();
+    public filteredOptions: Observable<string[]>;
+    public addingFile = false;
 
-    private _dataSubs: Subscription[] = [];
+    private _fileSizeSubs: Subscription[] = [];
+    private _taskFileSubscription: Subscription;
+    private _initialQueryOptions = { maxItems: 500 };
+    private _options: BehaviorSubject<string[]>;
+    private _currentTaskId: string = null;
+    private _poller: PollObservable;
+    private _refreshInterval: number = 5000;
+    private _fileMap = {};
 
     constructor(private fileService: FileService) {
+        this._options = new BehaviorSubject<string[]>([]);
+        this.filteredOptions = this._options;
     }
 
+   public ngOnInit() {
+      this.filteredOptions = this.filterControl.valueChanges
+         .map((nameFilter) => {
+             return nameFilter
+                ? this._options.value.filter(option => new RegExp(`${nameFilter}`, "gi").test(option))
+                : this._options.value;
+        });
+   }
+
     public ngOnChanges(inputs) {
         if (inputs.jobId || inputs.task) {
-            this._updateFileData();
+            /**
+             * ngOnChanges is fired multiple times for the same task selection
+             * so this should cut down on chatter.
+             */
+            if (this.task && this._currentTaskId !== this.task.id) {
+                this._currentTaskId = this.task.id;
+                this.fileSizes = {};
+                this.addingFile = false;
+
+                this._loadTaskFilesData();
+                this._updateFileData();
+            }
         }
     }
 
+    /**
+     * Navigating away from the job and task so reset the tabs
+     */
     public ngOnDestroy() {
-        this._clearSubscriptions();
+        this.resetTabs();
+        this._clearTaskFilesSubscription();
+        this._clearFileSizeSubscriptions();
+        if (this._poller) {
+            this._poller.destroy();
+        }
     }
 
-    private _updateFileData() {
-        this._clearSubscriptions();
-        outputFileNames.map((filename) => {
-            const data = this.fileService.getFilePropertiesFromTask(this.jobId, this.task.id, filename);
-            this._dataSubs.push(data.item.subscribe((file: File) => {
-                if (file) {
-                    const props = file.properties;
-                    this.fileSizes[filename] = prettyBytes(props && props.contentLength);
+    /**
+     * Enable/disable the filter control
+     */
+    public toggleFilter() {
+        this.addingFile = !this.addingFile;
+        this.filterControl.setValue(null);
+    }
+
+    /**
+     * Fires when an item is selected from the autocomplete option list
+     * @param event - the selection event
+     * @param item - selected item, add this to a tab if it doesn't already exist
+     */
+    public optionSelected($event: any, item: string) {
+        if (item && !this.outputFileNames.find(existing => existing === item)) {
+            this.outputFileNames.push(item);
+            this.selectedOutputFile = item as any;
+            this.toggleFilter();
+            this._updateFileData();
+        }
+    }
+
+    public resetTabs() {
+        this.addingFile = false;
+        this.outputFileNames = defaultOutputFileNames.slice();
+        this.selectedOutputFile = defaultOutputFileNames[0] as any;
+    }
+
+    /**
+     * Get the task files from the node so we can use them to populate
+     * the autocomplete control.
+     */
+    private _loadTaskFilesData() {
+        this._clearTaskFilesSubscription();
+        const taskFileData = this.fileService.listFromTask(
+            this.jobId,
+            this.task.id,
+            true,
+            this._initialQueryOptions,
+            (error: ServerError) => {
+                // todo: should i ignore all errors for this call?
+                return false;
+            },
+        );
+
+        // poll for files if the job has not completed
+        if (this.task.state !== TaskState.completed) {
+            this._poller = taskFileData.startPoll(this._refreshInterval);
+        }
+
+        this._taskFileSubscription = taskFileData.items.subscribe((items) => {
+            items.map((file: File) => {
+                if (this._canAddFileToMap(file)) {
+                    this._fileMap[file.name] = {};
                 }
-            }));
+            });
+
+            this._options.next(Object.keys(this._fileMap));
+        });
+
+        taskFileData.fetchNext(true);
+    }
+
+    /**
+     * Get the sizes for the output file name collection
+     */
+    private _updateFileData() {
+        this._clearFileSizeSubscriptions();
+        this.outputFileNames.map((filename) => {
+            if (this._shouldGetFileSize(filename)) {
+                const data = this.fileService.getFilePropertiesFromTask(this.jobId, this.task.id, filename);
+                this._fileSizeSubs.push(data.item.subscribe((file: File) => {
+                    if (file) {
+                        const props = file.properties;
+                        this.fileSizes[filename] = prettyBytes(props && props.contentLength);
+                    }
+                }));
 
-            data.fetch();
+                data.fetch();
+            }
         });
     }
 
-    private _clearSubscriptions() {
-        this._dataSubs.forEach(x => x.unsubscribe());
+    /**
+     * Only get the size of this file if either the task hasn't completed, or
+     * we don't have the current file size for the file.
+     */
+    private _shouldGetFileSize(filename: string) {
+        return this.task.state !== TaskState.completed || !this.fileSizes[filename];
+    }
+
+    /**
+     * Ignore directories and any file that is either already in the map, or
+     * is one of the defaults.
+     */
+    private _canAddFileToMap(file: File) {
+        return !file.isDirectory &&
+            !(file.name in this._fileMap) &&
+            file.name !== defaultOutputFileNames[0] &&
+            file.name !== defaultOutputFileNames[1];
+    }
+
+    private _clearFileSizeSubscriptions() {
+        this._fileSizeSubs.forEach(x => x.unsubscribe());
+    }
+
+    private _clearTaskFilesSubscription() {
+        this._fileMap = {};
+        if (this._taskFileSubscription) {
+            this._taskFileSubscription.unsubscribe();
+        }
     }
 }
diff --git a/app/components/task/details/output/task-log.html b/app/components/task/details/output/task-log.html
index 63dc54ab95..747ca18dfe 100644
--- a/app/components/task/details/output/task-log.html
+++ b/app/components/task/details/output/task-log.html
@@ -1,13 +1,25 @@
 <div class="file-tabs">
-    <div class="file-tab" *ngFor="let filename of outputFileNames" [class.active]="filename === outputFilename" (click)="outputFilename = filename">
+    <div class="file-tab" *ngFor="let filename of outputFileNames" [class.active]="filename === selectedOutputFile" (click)="selectedOutputFile = filename">
         {{filename}} ({{fileSizes[filename] || " - B"}})
     </div>
-
-    <!-- TODO when material2 autocomplete is here add a quick add another file -->
-    <!--<div class="file-tab-more">
-        <i class="fa fa-plus"></i>
-    </div>-->
+    <div class="file-tab" *ngIf="addingFile" [class.active]="addingFile">
+        <md-input-container>
+            <input type="text" mdInput [formControl]="filterControl" [mdAutocomplete]="auto">
+        </md-input-container>
+    </div>
+    <div class="file-tab-more" (click)="toggleFilter()" title="Select additional file">
+        <i class="fa" [ngClass]="!addingFile ? 'fa-plus' : 'fa-minus'"></i>
+    </div>
+    <div class="file-tab" *ngIf="outputFileNames.length > 2" (click)="resetTabs()" title="Reset to default">
+        <i class="fa fa-reply"></i>
+    </div>
 </div>
-<div *ngFor="let filename of outputFileNames" [hidden]="filename !== outputFilename">
+<div *ngFor="let filename of outputFileNames" [hidden]="filename !== selectedOutputFile">
     <bl-file-content [jobId]="jobId" [taskId]="task.id" [filename]="filename"></bl-file-content>
 </div>
+
+<md-autocomplete #auto="mdAutocomplete">
+   <md-option *ngFor="let option of filteredOptions | async" [value]="option" (onSelectionChange)="optionSelected($event, option)">
+      {{ option }}
+   </md-option>
+</md-autocomplete>
diff --git a/app/components/task/details/sub-tasks/sub-task-display-list.component.ts b/app/components/task/details/sub-tasks/sub-task-display-list.component.ts
index 6f5b195abd..aa45be35c4 100644
--- a/app/components/task/details/sub-tasks/sub-task-display-list.component.ts
+++ b/app/components/task/details/sub-tasks/sub-task-display-list.component.ts
@@ -5,7 +5,7 @@ import { LoadingStatus } from "app/components/base/loading";
 import { QuickListComponent, QuickListItemStatus } from "app/components/base/quick-list";
 import { SelectableList } from "app/components/base/selectable-list";
 import { SubtaskInformation, TaskState } from "app/models";
-import { SchedulingErrorDecorator } from "app/models/decorators";
+import { FailureInfoDecorator } from "app/models/decorators";
 
 @Component({
     selector: "bl-sub-task-display-list",
@@ -43,8 +43,8 @@ export class SubTaskDisplayListComponent extends SelectableList {
     }
 
     public taskStatusText(task: SubtaskInformation): string {
-        if (task.schedulingError) {
-            return new SchedulingErrorDecorator(task.schedulingError).summary;
+        if (task.failureInfo) {
+            return new FailureInfoDecorator(task.failureInfo).summary;
         } else if (task.exitCode !== 0) {
             return `Subtask failed with exitCode:  ${task.exitCode}`;
         }
diff --git a/app/components/task/details/sub-tasks/sub-task-properties.component.ts b/app/components/task/details/sub-tasks/sub-task-properties.component.ts
index 9099e92f6d..d196d748d8 100644
--- a/app/components/task/details/sub-tasks/sub-task-properties.component.ts
+++ b/app/components/task/details/sub-tasks/sub-task-properties.component.ts
@@ -12,11 +12,11 @@ export class SubTaskPropertiesComponent {
     @Input()
     public set task(value: SubtaskInformation) {
         this.decorator = new SubTaskDecorator(value || {} as any);
-        this.schedulingError = this.decorator.schedulingError || {};
+        this.failureInfo = this.decorator.failureInfo || {};
         this.nodeInfo = this.decorator.nodeInfo || {};
     }
 
     public decorator: SubTaskDecorator;
-    public schedulingError: any;
+    public failureInfo: any;
     public nodeInfo: any;
 }
diff --git a/app/components/task/details/sub-tasks/sub-task-properties.html b/app/components/task/details/sub-tasks/sub-task-properties.html
index 257a5548eb..7aa211b06a 100644
--- a/app/components/task/details/sub-tasks/sub-task-properties.html
+++ b/app/components/task/details/sub-tasks/sub-task-properties.html
@@ -19,10 +19,10 @@
         <bl-text-property label="Task root directory URL" [value]="nodeInfo.taskRootDirectoryUrl"></bl-text-property>
     </bl-property-group>
 
-    <bl-property-group label="Scheduling Error" class="wide" *ngIf="schedulingError.exists">
-        <bl-text-property label="Category" [value]="schedulingError.category"></bl-text-property>
-        <bl-text-property label="Code" [value]="schedulingError.code"></bl-text-property>
-        <bl-text-property label="Message" [value]="schedulingError.message"></bl-text-property>
-        <bl-text-property label="Detals" [value]="schedulingError.details"></bl-text-property>
+    <bl-property-group label="Scheduling Error" class="wide" *ngIf="failureInfo.exists">
+        <bl-text-property label="Category" [value]="failureInfo.category"></bl-text-property>
+        <bl-text-property label="Code" [value]="failureInfo.code"></bl-text-property>
+        <bl-text-property label="Message" [value]="failureInfo.message"></bl-text-property>
+        <bl-text-property label="Detals" [value]="failureInfo.details"></bl-text-property>
     </bl-property-group>
 </bl-property-list>
diff --git a/app/components/task/details/task-configuration.component.ts b/app/components/task/details/task-configuration.component.ts
index 7edeea1446..248b4db4f1 100644
--- a/app/components/task/details/task-configuration.component.ts
+++ b/app/components/task/details/task-configuration.component.ts
@@ -1,4 +1,5 @@
 import { ChangeDetectionStrategy, Component, Input } from "@angular/core";
+import { List } from "immutable";
 
 import { ExitOptions, Job, NameValuePair, Task } from "app/models";
 import { TaskDecorator } from "app/models/decorators";
@@ -16,11 +17,6 @@ export class TaskConfigurationComponent {
     @Input()
     public set task(task: Task) {
         this._task = task;
-        if (task && task.executionInfo) {
-            this.hasStartTime = Boolean(this.task.executionInfo.startTime);
-            this.hasEndTime = Boolean(this.task.executionInfo.endTime);
-        }
-
         this.processExitConditionData();
         this._refresh(task);
     }
@@ -31,10 +27,8 @@ export class TaskConfigurationComponent {
     public constraints: any;
     public executionInfo: any;
     public exitConditionData: any;
-    public environmentSettings: NameValuePair[] = [];
+    public environmentSettings: List<NameValuePair> = List([]);
     public nodeInfo: any;
-    public hasStartTime: boolean;
-    public hasEndTime: boolean;
 
     private _task: Task;
 
@@ -79,14 +73,14 @@ export class TaskConfigurationComponent {
         this.exitConditionData = {
             noAction,
             terminateJob,
-            schedulingError: this._jobActionString(this._task.exitConditions.schedulingError),
+            failureInfo: this._jobActionString(this._task.exitConditions.failureInfo),
             default: this._jobActionString(this._task.exitConditions.default),
         };
     }
 
     private _refresh(task: Task) {
         if (task) {
-            this.environmentSettings = task.environmentSettings || [];
+            this.environmentSettings = task.environmentSettings;
 
             this.decorator = new TaskDecorator(task);
             this.appPackages = this.decorator.applicationPackageReferences || [];
diff --git a/app/components/task/details/task-configuration.html b/app/components/task/details/task-configuration.html
index 5a245e137d..f5864d357e 100644
--- a/app/components/task/details/task-configuration.html
+++ b/app/components/task/details/task-configuration.html
@@ -59,13 +59,14 @@
 
     <bl-property-group label="Execution information" class="wide" [collapsed]="true">
         <div collapsed-preview>
-            <span *ngIf="!hasStartTime">Task not started</span>
-            <span *ngIf="hasStartTime">Task started {{executionInfo.startTime}}</span>
-            <span *ngIf="hasEndTime"> and ended {{executionInfo.endTime}}</span>
+            <span *ngIf="!executionInfo.runtime">Task not started</span>
+            <span *ngIf="executionInfo.runtime && !task?.executionInfo?.endTime">Currently running for: {{ executionInfo.runtime }}</span>
+            <span *ngIf="task?.executionInfo?.endTime">Completed in: {{ executionInfo.runtime }}</span>
         </div>
 
         <bl-text-property label="Start time" [value]="executionInfo.startTime"></bl-text-property>
         <bl-text-property label="End time" [value]="executionInfo.endTime"></bl-text-property>
+        <bl-text-property label="Execution time" [value]="executionInfo.runtime"></bl-text-property>
         <bl-text-property label="Exit code" [value]="executionInfo.exitCode"></bl-text-property>
         <bl-text-property label="Retry count" [value]="executionInfo.retryCount"></bl-text-property>
         <bl-text-property label="Last retry time" [value]="executionInfo.lastRetryTime" *ngIf="executionInfo.retryCount > 0"></bl-text-property>
@@ -76,7 +77,7 @@
     <bl-property-group label="Exit conditions" [warningMessage]="exitConditionWarningMessage" [collapsed]="true">
         <bl-text-property label="Exit codes that do nothing" [value]="exitConditionData.noAction.join(', ')"></bl-text-property>
         <bl-text-property label="Exit codes that terminate the job" [value]="exitConditionData.terminateJob.join(', ')"></bl-text-property>
-        <bl-text-property label="On scheduling error" [value]="exitConditionData.schedulingError"></bl-text-property>
+        <bl-text-property label="On scheduling error" [value]="exitConditionData.failureInfo"></bl-text-property>
         <bl-text-property *ngIf="exitConditionData.default" label="default" [value]="exitConditionData.default"></bl-text-property>
     </bl-property-group>
 </bl-property-list>
diff --git a/app/components/task/details/task-details.component.ts b/app/components/task/details/task-details.component.ts
index 9ede2f01e3..bec8fa1d50 100644
--- a/app/components/task/details/task-details.component.ts
+++ b/app/components/task/details/task-details.component.ts
@@ -82,6 +82,8 @@ export class TaskDetailsComponent implements OnInit, OnDestroy {
 
     public ngOnDestroy() {
         this._paramsSubscribers.forEach(x => x.unsubscribe());
+        this.jobData.dispose();
+        this.data.dispose();
     }
 
     @autobind()
diff --git a/app/components/task/details/task-details.html b/app/components/task/details/task-details.html
index bdb2a971f1..28b9f922d3 100644
--- a/app/components/task/details/task-details.html
+++ b/app/components/task/details/task-details.html
@@ -4,29 +4,22 @@
     </md-card>
     <div *ngIf="task && job">
         <md-card class="overview">
-            <div class="summary">
-                <div class="main-info">
-                    <md-card-title-group style="margin: 0px;">
-                        <div style="align-items:center;">
-                            <bl-refresh-btn [refresh]="refresh"></bl-refresh-btn>
-                        </div>
-                        <div style="margin-left:12px; margin-right:auto;">
-                            <md-card-title>{{task.id}} <span *ngIf="!!task.displayName"> - {{task.displayName}}</span> </md-card-title>
-                            <md-card-subtitle><i class="fa" [ngClass]="decorator.stateIcon"></i> {{task.state}}</md-card-subtitle>
-                        </div>
-                    </md-card-title-group>
-                    <md-card-content>
-                        <p>Job: {{jobId}}</p>
-                    </md-card-content>
-                </div>
+            <div class="actions">
+                <bl-action-btn-group>
+                    <bl-refresh-btn [refresh]="refresh"></bl-refresh-btn>
+                    <bl-terminate-button [entity]="task" (action)="terminateTask()"></bl-terminate-button>
+                    <bl-delete-button [entity]="task" (action)="deleteTask()"></bl-delete-button>
+                    <bl-clone-button (action)="cloneTask()"></bl-clone-button>
+                </bl-action-btn-group>
+            </div>
+            <div class="content">
+                <md-card-title>{{task.id}} <span *ngIf="!!task.displayName"> - {{task.displayName}}</span> </md-card-title>
+                <md-card-subtitle><i class="fa" [ngClass]="decorator.stateIcon"></i> {{task.state}}</md-card-subtitle>
+                <p>Job: {{jobId}}</p>
+            </div>
+            <div style="padding: 10px">
                 <bl-task-timeline [job]="job" [task]="task"></bl-task-timeline>
             </div>
-            <md-card-actions layout="row" layout-align="end center">
-                <bl-add-button (click)="addTask()"></bl-add-button>
-                <bl-terminate-button [entity]="task" (click)="terminateTask()"></bl-terminate-button>
-                <bl-delete-button [entity]="task" (click)="deleteTask()"></bl-delete-button>
-                <bl-clone-button (click)="cloneTask()"></bl-clone-button>
-            </md-card-actions>
         </md-card>
         <bl-task-error-display [jobId]="jobId" [task]="task"></bl-task-error-display>
         <md-card class="details">
diff --git a/app/components/task/details/task-error-display.component.ts b/app/components/task/details/task-error-display.component.ts
index 0e25d3bdb0..05c2338f65 100644
--- a/app/components/task/details/task-error-display.component.ts
+++ b/app/components/task/details/task-error-display.component.ts
@@ -1,9 +1,9 @@
-import { ChangeDetectionStrategy, Component, Input } from "@angular/core";
+import { ChangeDetectionStrategy, Component, Input, OnChanges, SimpleChanges } from "@angular/core";
 import { autobind } from "core-decorators";
 
 import { SidebarManager } from "app/components/base/sidebar";
 import { RerunTaskFormComponent } from "app/components/task/action";
-import { Task, TaskState } from "app/models";
+import { FailureInfo, Task, TaskState } from "app/models";
 import { TaskService } from "app/services";
 import { DateUtils, ObservableUtils } from "app/utils";
 
@@ -12,36 +12,40 @@ import { DateUtils, ObservableUtils } from "app/utils";
     templateUrl: "task-error-display.html",
     changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class TaskErrorDisplayComponent {
+export class TaskErrorDisplayComponent implements OnChanges {
     @Input()
     public jobId: string;
 
     @Input()
     public task: Task;
 
+    public hasCompleted: boolean = false;
+    public failureInfo: FailureInfo;
+    public code: number;
+    public hasFailureExitCode: boolean = false;
+    public errorMessage: string;
+
     constructor(
         private taskService: TaskService,
         private sidebarManager: SidebarManager) {
     }
 
-    public get hasCompleted(): boolean {
-        return Boolean(this.task && this.task.state === TaskState.completed);
-    }
+    public ngOnChanges(changes: SimpleChanges) {
+        if (changes.task) {
+            if (this.task) {
 
-    public get code() {
-        return this.task && this.task.executionInfo && this.task.executionInfo.exitCode;
-    }
-
-    public get hasFailureExitCode(): boolean {
-        return this.hasCompleted && this.code !== 0;
-    }
-
-    public get exitCodeMessage(): string {
-        if (this.task.didTimeout) {
-            const time: any = this.task.constraints && this.task.constraints.maxWallClockTime;
-            return `Task timed out after running for ${DateUtils.prettyDuration(time)}`;
-        } else {
-            return `Task completed with exit code '${this.code}'`;
+                const exec = this.task.executionInfo;
+                this.failureInfo = exec && exec.failureInfo;
+                this.hasCompleted = Boolean(this.task && this.task.state === TaskState.completed);
+                this.code = exec && this.task.executionInfo.exitCode;
+                this.hasFailureExitCode = this.hasCompleted && this.code !== 0;
+                this._computeExitCodeMessage();
+            } else {
+                this.failureInfo = null;
+                this.code = null;
+                this.hasFailureExitCode = false;
+                this.errorMessage = "";
+            }
         }
     }
 
@@ -59,4 +63,20 @@ export class TaskErrorDisplayComponent {
         ref.component.jobId = this.jobId;
         ref.component.setValueFromEntity(this.task);
     }
+
+    private _computeExitCodeMessage() {
+        if (!this.failureInfo) {
+            this.errorMessage = "";
+            return;
+        }
+
+        if (this.task.didTimeout) {
+            const time: any = this.task.constraints && this.task.constraints.maxWallClockTime;
+            this.errorMessage = `Task timed out after running for ${DateUtils.prettyDuration(time)}`;
+        } else if (this.failureInfo.code === "FailureExitCode") {
+            this.errorMessage = `Task completed with exit code '${this.code}'`;
+        } else {
+            this.errorMessage = this.failureInfo.message;
+        }
+    }
 }
diff --git a/app/components/task/details/task-error-display.html b/app/components/task/details/task-error-display.html
index eaf109293d..69c47664f4 100644
--- a/app/components/task/details/task-error-display.html
+++ b/app/components/task/details/task-error-display.html
@@ -1,4 +1,9 @@
-<bl-banner [id]="task.id" *ngIf="hasFailureExitCode" fixMessage="Rerun task" [fix]="rerun" type="warning">
+<!--<bl-banner [id]="task.id" *ngIf="hasFailureExitCode" fixMessage="Rerun task" [fix]="rerun" type="warning">
     <div [other-fix]="rerunDifferent" fixMessage="Rerun with different attributes"></div>
     <div message>{{exitCodeMessage}}</div>
+</bl-banner>z-->
+<bl-banner [id]="task.id" *ngIf="failureInfo" fixMessage="Rerun task" [fix]="rerun" type="warning">
+    <div code>{{failureInfo.code}}</div>
+    <div [other-fix]="rerunDifferent" fixMessage="Rerun with different attributes"></div>
+    <div message>{{errorMessage}}</div>
 </bl-banner>
diff --git a/app/components/task/details/task-resource-files.component.ts b/app/components/task/details/task-resource-files.component.ts
index bf9708245f..48c9c3e6eb 100644
--- a/app/components/task/details/task-resource-files.component.ts
+++ b/app/components/task/details/task-resource-files.component.ts
@@ -1,4 +1,5 @@
 import { Component, Input } from "@angular/core";
+import { List } from "immutable";
 
 import { ResourceFile, Task } from "app/models";
 
@@ -15,13 +16,13 @@ export class TaskResourceFilesComponent {
     }
     public get task() { return this._task; }
 
-    public resourceFiles: ResourceFile[] = [];
+    public resourceFiles: List<ResourceFile> = List([]);
 
     private _task: Task;
 
     public refresh(task: Task) {
         if (this.task) {
-            this.resourceFiles = this.task.resourceFiles || [];
+            this.resourceFiles = this.task.resourceFiles;
         }
     }
 }
diff --git a/app/components/task/details/task-resource-files.html b/app/components/task/details/task-resource-files.html
index 78c4ba7035..c4e365617e 100644
--- a/app/components/task/details/task-resource-files.html
+++ b/app/components/task/details/task-resource-files.html
@@ -1,16 +1,16 @@
 <bl-table>
     <bl-thead>
         <bl-column>Blob source</bl-column>
-        <bl-column>Local file path</bl-column>
-        <bl-column>File mode</bl-column>
+        <bl-column style="width: 400px">Local file path</bl-column>
+        <bl-column style="width: 100px">File mode</bl-column>
     </bl-thead>
     <bl-row *ngFor="let file of resourceFiles" [key]="file.blobSource">
-        <bl-cell style="width: 60%" [value]="file.blobSource"></bl-cell>
-        <bl-cell style="width: 25%" [value]="file.filePath"></bl-cell>
-        <bl-cell style="width: 15%" [value]="file.fileMode"></bl-cell>
+        <bl-cell [value]="file.blobSource"></bl-cell>
+        <bl-cell [value]="file.filePath"></bl-cell>
+        <bl-cell [value]="file.fileMode"></bl-cell>
     </bl-row>
 </bl-table>
-<bl-no-item [itemCount]="resourceFiles.length">
+<bl-no-item [itemCount]="resourceFiles.size">
     <i icon class="fa fa-file-text-o"></i>
     <span no-filter>This task contains no resource files</span>
 </bl-no-item>
diff --git a/app/components/task/home/task-home.html b/app/components/task/home/task-home.html
index 1cea5f363c..d1ef08bc89 100644
--- a/app/components/task/home/task-home.html
+++ b/app/components/task/home/task-home.html
@@ -1,8 +1,7 @@
 <bl-list-and-show-layout #layout (listScrolledToBottom)="taskList.loadMore()" [list]="taskList">
     <div bl-list-buttons>
-        <button md-mini-fab color="primary" title="Add a task" (click)="addTask()">
-            <i class="fa fa-plus spin-hover"></i>
-        </button>
+        <bl-action-btn color="primary" type="round" icon="fa fa-plus spin-hover" title="Add a task" (action)="addTask()">
+        </bl-action-btn>
     </div>
     <div bl-list-content>
         <bl-focus-section>
diff --git a/app/core/record/arm-record.ts b/app/core/record/arm-record.ts
new file mode 100644
index 0000000000..7a54a32bb3
--- /dev/null
+++ b/app/core/record/arm-record.ts
@@ -0,0 +1,19 @@
+import { Model, Prop } from "./decorators";
+import { Record } from "./record";
+
+export interface ArmRecordAttributes {
+    id: string;
+    type: string;
+}
+
+/**
+ * ArmRecord is a subclass of record that unify the id for ARM record which have problems with the case.
+ */
+@Model()
+export class ArmRecord<T extends ArmRecordAttributes> extends Record<T> {
+    @Prop() public type: string;
+
+    constructor(data: T) {
+        super(Object.assign({}, data, { id: data.id && data.id.toLowerCase() }));
+    }
+}
diff --git a/app/core/record/decorators.ts b/app/core/record/decorators.ts
index 4ac221bf5e..92583255da 100644
--- a/app/core/record/decorators.ts
+++ b/app/core/record/decorators.ts
@@ -22,7 +22,7 @@ export function Prop<T>(...args) {
         const type = Reflect.getMetadata("design:type", target, attr);
         if (!type) {
             throw new Error(`Cannot retrieve the type for RecordAttribute ${target.constructor.name}#${attr}`
-            + "Check your nested type is defined in another file or above this DtoAttr");
+                + ". Check your nested type is defined in another file or above this DtoAttr");
         }
 
         updateTypeMetadata(ctr, attr, { type, list: false });
diff --git a/app/core/record/helpers.ts b/app/core/record/helpers.ts
index 80c9ee4614..7a885dae99 100644
--- a/app/core/record/helpers.ts
+++ b/app/core/record/helpers.ts
@@ -1,5 +1,6 @@
 import { Type } from "@angular/core";
 
+import { exists } from "app/utils";
 import { RecordSetAttributeError } from "./errors";
 import { Record } from "./record";
 
@@ -7,7 +8,18 @@ const attrMetadataKey = "record:attrs";
 export const primitives = new Set(["Array", "Number", "String", "Object", "Boolean"]);
 
 export function metadataForRecord(record: Record<any>) {
-    return Reflect.getMetadata(attrMetadataKey, record.constructor) || {};
+    return metadataForCtr(record.constructor);
+}
+
+function metadataForCtr(ctr: any) {
+    const data = Reflect.getMetadata(attrMetadataKey, ctr) || {};
+    const parent = Object.getPrototypeOf(ctr.prototype);
+    const parentCtr = parent.constructor;
+    if (parentCtr.name !== "Record") {
+        const parentData = metadataForCtr(parentCtr);
+        return { ...parentData, ...data };
+    }
+    return data;
 }
 
 interface TypeMetadata {
@@ -25,7 +37,8 @@ export function updateTypeMetadata(ctr: Type<any>, attr: string, type: TypeMetad
 export function setProp(ctr: Type<any>, attr: string) {
     Object.defineProperty(ctr.prototype, attr, {
         get: function (this: Record<any>) {
-            return (this as any)._map.get(attr) || (this as any)._defaultValues[attr];
+            const value = (this as any)._map.get(attr);
+            return exists(value) ? value : (this as any)._defaultValues[attr];
         },
         set: function <T>(this: Record<any>, value: T) {
             if ((this as any)._initialized) {
diff --git a/app/core/record/index.ts b/app/core/record/index.ts
index 44c0753f12..5b0904bad3 100644
--- a/app/core/record/index.ts
+++ b/app/core/record/index.ts
@@ -1,3 +1,4 @@
+export * from "./arm-record";
 export * from "./record";
 export * from "./decorators";
 export * from "./errors";
diff --git a/app/core/record/record.ts b/app/core/record/record.ts
index 5a331ee82c..970de05245 100644
--- a/app/core/record/record.ts
+++ b/app/core/record/record.ts
@@ -1,6 +1,6 @@
 import { List, Map } from "immutable";
 
-import { nil } from "app/utils";
+import { exists, nil } from "app/utils";
 import { metadataForRecord, primitives } from "./helpers";
 
 /**
@@ -29,6 +29,11 @@ export class Record<TInput> {
         return Object.assign({}, this._defaultValues, this._toJS());
     }
 
+    public merge(other: Partial<TInput>): this {
+        const ctr: any = this.constructor;
+        return new ctr({ ...this.toJS(), ...other as any });
+    }
+
     /**
      * DO NOT USE. For interal use only
      */
@@ -39,6 +44,7 @@ export class Record<TInput> {
     private _toJS() {
         let output: any = {};
         const attrs = metadataForRecord(this);
+
         for (let key of Object.keys(attrs)) {
             if (!(key in this)) {
                 continue;
@@ -52,8 +58,10 @@ export class Record<TInput> {
                 output[key] = value;
             }
         }
+
         return output;
     }
+
     /**
      * This method will be called by the decorator.
      */
@@ -62,14 +70,16 @@ export class Record<TInput> {
         const obj = {};
         const keys = Object.keys(attrs);
         this._keys = new Set(keys);
+
         for (let key of keys) {
             this._defaultValues[key] = null;
             const typeMetadata = attrs[key];
             if (!(key in data)) {
                 continue;
             }
+
             const value = (data as any)[key];
-            if (value && typeMetadata && !primitives.has(typeMetadata.type.name)) {
+            if (exists(value) && typeMetadata && !primitives.has(typeMetadata.type.name)) {
                 if (typeMetadata.list) {
                     obj[key] = List(value && value.map(x => new typeMetadata.type(x)));
                 } else {
@@ -79,7 +89,7 @@ export class Record<TInput> {
                 obj[key] = value;
             }
         }
+
         this._map = Map(obj);
     }
-
 }
diff --git a/app/models/account.ts b/app/models/account.ts
index 64de000746..aae1fb432c 100644
--- a/app/models/account.ts
+++ b/app/models/account.ts
@@ -1,50 +1,71 @@
-import { Record } from "immutable";
-
+import { ArmRecord, Model, Prop, Record } from "app/core";
 import { Subscription } from "./subscription";
 
-const AccountRecord = Record({
-    id: null,
-    name: null,
-    location: null,
-    type: null,
-    properties: {
-        accountEndpoint: null,
-        activeJobAndJobScheduleQuota: null,
-        coreQuota: null,
-        poolQuota: null,
-        provisioningState: null,
-        autoStorage: {
-            storageAccountId: null,
-            lastKeySync: null,
-        },
-    },
-    subscription: null,
-});
+export type PoolAllocationMode = "UserSubscription";
+export const PoolAllocationMode = {
+    BatchService: "batchservice" as PoolAllocationMode,
+    UserSubscription: "usersubscription" as PoolAllocationMode,
+};
 
 export type AccountProvisingState = "Succeeded";
 export const AccountProvisingState = {
     Succeeded: "Succeeded" as AccountProvisingState,
 };
 
-export interface AutoStorageAccount {
+export interface AutoStorageAccountAttributes {
     storageAccountId: string;
     lastKeySync: Date;
 }
 
-export interface AccountResourceProperties {
+@Model()
+export class AutoStorageAccount extends Record<AutoStorageAccountAttributes> {
+    @Prop() public storageAccountId: string;
+    @Prop() public lastKeySync: Date;
+}
+
+export interface BatchAccountPropertiesAttributes {
     accountEndpoint: string;
     provisioningState: AccountProvisingState;
-    coreQuota: number;
+    dedicatedCoreQuota: number;
+    lowPriorityCoreQuota: number;
     poolQuota: number;
     activeJobAndJobScheduleQuota: number;
-    autoStorage: AutoStorageAccount;
+    autoStorage: AutoStorageAccountAttributes;
+    poolAllocationMode: PoolAllocationMode;
+}
+
+@Model()
+export class BatchAccountProperties extends Record<BatchAccountPropertiesAttributes> {
+    @Prop() public accountEndpoint: string;
+    @Prop() public provisioningState: AccountProvisingState;
+    @Prop() public dedicatedCoreQuota: number = 20;
+    @Prop() public lowPriorityCoreQuota: number = 100;
+    @Prop() public poolQuota: number = 20;
+    @Prop() public activeJobAndJobScheduleQuota: number = 20;
+    @Prop() public autoStorage: AutoStorageAccount;
+    @Prop() public poolAllocationMode: PoolAllocationMode;
+}
+
+export interface BatchAccountAttributes {
+    id: string;
+    name: string;
+    location: string;
+    type: string;
+    properties: BatchAccountPropertiesAttributes;
+    subscription: Subscription;
 }
 
-export class AccountResource extends AccountRecord {
-    public id: string;
-    public name: string;
-    public location: string;
-    public type: string;
-    public properties: AccountResourceProperties;
-    public subscription: Subscription;
+@Model()
+export class AccountResource extends ArmRecord<BatchAccountAttributes> {
+    public type: "Microsoft.Batch/batchAccounts";
+
+    @Prop() public id: string;
+    @Prop() public name: string;
+    @Prop() public location: string;
+    @Prop() public properties: BatchAccountProperties;
+    @Prop() public subscription: Subscription;
+
+    public get isBatchManaged() {
+        return this.properties && this.properties.poolAllocationMode === PoolAllocationMode.BatchService;
+    }
 }
diff --git a/app/models/application-package-reference.ts b/app/models/application-package-reference.ts
index 3e54112f4a..a09988b447 100644
--- a/app/models/application-package-reference.ts
+++ b/app/models/application-package-reference.ts
@@ -1,7 +1,15 @@
+import { Model, Prop, Record } from "app/core";
+
+export interface ApplicationPackageReferenceAttributes {
+    applicationId: string;
+    version: string;
+}
+
 /**
  * A reference to an application package to be deployed to a compute nodes
  */
-export class ApplicationPackageReference {
-    public applicationId: string;
-    public version: string;
+@Model()
+export class ApplicationPackageReference extends Record<ApplicationPackageReferenceAttributes> {
+    @Prop() public applicationId: string;
+    @Prop() public version: string;
 }
diff --git a/app/models/certificate-reference.ts b/app/models/certificate-reference.ts
new file mode 100644
index 0000000000..51ccb4b135
--- /dev/null
+++ b/app/models/certificate-reference.ts
@@ -0,0 +1,23 @@
+import { List } from "immutable";
+
+import { ListProp, Model, Prop, Record } from "app/core";
+
+export interface CertificateReferenceAttributes {
+    thumbprint: string;
+    thumbprintAlgorithm: string;
+    storeLocation: string;
+    storeName: string;
+    visibility: string[];
+}
+
+/**
+ * A reference to an application package to be deployed to a compute nodes
+ */
+@Model()
+export class CertificateReference extends Record<CertificateReferenceAttributes> {
+    @Prop() public thumbprint: string;
+    @Prop() public thumbprintAlgorithm: string;
+    @Prop() public storeLocation: string;
+    @Prop() public storeName: string;
+    @ListProp(String) public visibility: List<string> = List([]);
+}
diff --git a/app/models/compute-node-information.ts b/app/models/compute-node-information.ts
index 2700f213c2..c50b72aebd 100644
--- a/app/models/compute-node-information.ts
+++ b/app/models/compute-node-information.ts
@@ -1,11 +1,23 @@
 /**
  * Information about the compute node on which a task ran.
  */
-export class ComputeNodeInformation {
-    public affinityId: string;
-    public nodeUrl: string;
-    public poolId: string;
-    public nodeId: string;
-    public taskRootDirectory: string;
-    public taskRootDirectoryUrl: string;
+import { Model, Prop, Record } from "app/core";
+
+export interface ComputeNodeInformationAttributes {
+    affinityId: string;
+    nodeUrl: string;
+    poolId: string;
+    nodeId: string;
+    taskRootDirectory: string;
+    taskRootDirectoryUrl: string;
+}
+
+@Model()
+export class ComputeNodeInformation extends Record<ComputeNodeInformationAttributes> {
+    @Prop() public affinityId: string;
+    @Prop() public nodeUrl: string;
+    @Prop() public poolId: string;
+    @Prop() public nodeId: string;
+    @Prop() public taskRootDirectory: string;
+    @Prop() public taskRootDirectoryUrl: string;
 }
diff --git a/app/models/constraints.ts b/app/models/constraints.ts
index e6cafa5777..f348942361 100644
--- a/app/models/constraints.ts
+++ b/app/models/constraints.ts
@@ -1,9 +1,16 @@
+import { Model, Prop, Record } from "app/core";
 import { Duration } from "moment";
 
+export interface ConstraintsAttributes {
+    maxTaskRetryCount: Duration;
+    maxWallClockTime: number;
+}
+
 /**
  * Specifies the execution constraints for tasks or jobs.
  */
-export abstract class Constraints {
-    public maxWallClockTime: Duration;
-    public maxTaskRetryCount: number;
+@Model()
+export class Constraints extends Record<ConstraintsAttributes> {
+    @Prop() public maxWallClockTime: any;
+    @Prop() public maxTaskRetryCount: number;
 }
diff --git a/app/models/decorators/cloud-service-configuration-decorator.ts b/app/models/decorators/cloud-service-configuration-decorator.ts
index 8bf435b1be..208ff18b3f 100644
--- a/app/models/decorators/cloud-service-configuration-decorator.ts
+++ b/app/models/decorators/cloud-service-configuration-decorator.ts
@@ -6,11 +6,15 @@ export class CloudServiceConfigurationDecorator extends DecoratorBase<CloudServi
     public targetOSVersion: string;
     public currentOSVersion: string;
 
-    constructor(cloudServiceConfiguration: CloudServiceConfiguration) {
+    constructor(cloudServiceConfiguration: CloudServiceConfiguration, osName: string) {
         super(cloudServiceConfiguration);
 
-        this.osFamily = this.stringField(cloudServiceConfiguration.osFamily);
+        this.osFamily = this._translateOSFamily(osName, cloudServiceConfiguration.osFamily);
         this.targetOSVersion = this.stringField(cloudServiceConfiguration.targetOSVersion);
         this.currentOSVersion = this.stringField(cloudServiceConfiguration.currentOSVersion);
     }
+
+    private _translateOSFamily(osName: string, osFamilyId: number): string {
+        return `${osName}, (ID: ${osFamilyId})`;
+    }
 }
diff --git a/app/models/decorators/scheduling-error-decorator.ts b/app/models/decorators/failure-info-decorator.ts
similarity index 62%
rename from app/models/decorators/scheduling-error-decorator.ts
rename to app/models/decorators/failure-info-decorator.ts
index b6ff6d73aa..d433cb2042 100644
--- a/app/models/decorators/scheduling-error-decorator.ts
+++ b/app/models/decorators/failure-info-decorator.ts
@@ -1,7 +1,9 @@
-import { SchedulingError } from "app/models";
+import { List } from "immutable";
+
+import { FailureInfo, NameValuePair } from "app/models";
 import { DecoratorBase } from "app/utils/decorators";
 
-export class SchedulingErrorDecorator extends DecoratorBase<SchedulingError> {
+export class FailureInfoDecorator extends DecoratorBase<FailureInfo> {
     public category: string;
     public code: string;
     public message: string;
@@ -17,7 +19,7 @@ export class SchedulingErrorDecorator extends DecoratorBase<SchedulingError> {
      */
     public exists: boolean;
 
-    constructor(error: SchedulingError) {
+    constructor(error: FailureInfo) {
         super(error);
 
         this.exists = Boolean(error && error.category);
@@ -26,16 +28,13 @@ export class SchedulingErrorDecorator extends DecoratorBase<SchedulingError> {
         this.message = this.stringField(error.message);
         this.details = this._getDetails(error.details);
         this.summary = this.exists
-            ? String.prototype.format("category: {0}, code: {1}, message: {2}",
-                error.category,
-                error.code,
-                error.message)
+            ? `category: ${error.category}, code: ${error.code}, message: ${error.message}`
             : "";
     }
 
-    private _getDetails(details: any): string {
-        if (Boolean(details) && details.length > 0) {
-            const detailMessage = details.filter((x) => x.name === "Message")[0];
+    private _getDetails(details: List<NameValuePair>): string {
+        if (details && details.size > 0) {
+            const detailMessage = details.filter(x => x.name === "Message").first();
 
             if (detailMessage) {
                 return detailMessage.value;
diff --git a/app/models/decorators/index.ts b/app/models/decorators/index.ts
index 51cd0bbaba..b316fc17c2 100644
--- a/app/models/decorators/index.ts
+++ b/app/models/decorators/index.ts
@@ -1,6 +1,7 @@
 export * from "./application-decorator";
 export * from "./cloud-service-configuration-decorator";
 export * from "./compute-node-info-decorator";
+export * from "./failure-info-decorator";
 export * from "./image-reference-decorator";
 export * from "./job-constraints-decorator";
 export * from "./job-decorator";
@@ -9,8 +10,8 @@ export * from "./job-manager-task-decorator";
 export * from "./job-preparation-task-decorator";
 export * from "./job-release-task-decorator";
 export * from "./pool-decorator";
-export * from "./scheduling-error-decorator";
 export * from "./start-task.decorator";
+export * from "./start-task-info-decorator";
 export * from "./sub-task-decorator";
 export * from "./node-decorator";
 export * from "./task-constraints-decorator";
diff --git a/app/models/decorators/job-execution-info-decorator.ts b/app/models/decorators/job-execution-info-decorator.ts
index abd67d04ad..13dd49af84 100644
--- a/app/models/decorators/job-execution-info-decorator.ts
+++ b/app/models/decorators/job-execution-info-decorator.ts
@@ -1,13 +1,15 @@
 import { JobExecutionInformation } from "app/models";
+import { DateUtils } from "app/utils";
 import { DecoratorBase } from "app/utils/decorators";
-import { SchedulingErrorDecorator } from "./scheduling-error-decorator";
+import { FailureInfoDecorator } from "./failure-info-decorator";
 
 export class JobExecutionInfoDecorator extends DecoratorBase<JobExecutionInformation> {
     public startTime: string;
     public endTime: string;
     public poolId: string;
-    public schedulingError: SchedulingErrorDecorator;
+    public failureInfo: FailureInfoDecorator;
     public terminateReason: string;
+    public runtime: string;
 
     constructor(executionInfo: JobExecutionInformation) {
         super(executionInfo);
@@ -15,7 +17,8 @@ export class JobExecutionInfoDecorator extends DecoratorBase<JobExecutionInforma
         this.startTime = this.dateField(executionInfo.startTime);
         this.endTime = this.dateField(executionInfo.endTime);
         this.poolId = this.stringField(executionInfo.poolId);
-        this.schedulingError = new SchedulingErrorDecorator(executionInfo.schedulingError || {} as any);
+        this.failureInfo = new FailureInfoDecorator(executionInfo.failureInfo || {} as any);
         this.terminateReason = this.stringField(executionInfo.terminateReason);
+        this.runtime = DateUtils.computeRuntime(executionInfo.startTime, executionInfo.endTime);
     }
 }
diff --git a/app/models/decorators/node-decorator.ts b/app/models/decorators/node-decorator.ts
index 24a8222175..74b5d316ca 100644
--- a/app/models/decorators/node-decorator.ts
+++ b/app/models/decorators/node-decorator.ts
@@ -1,17 +1,21 @@
 import { Node } from "app/models";
+import { StartTaskInfoDecorator } from "app/models/decorators/start-task-info-decorator";
 import { DecoratorBase } from "app/utils/decorators";
 
 export class NodeDecorator extends DecoratorBase<Node> {
     public url: string;
     public state: string;
     public stateTransitionTime: string;
+    public schedulingState: string;
     public lastBootTime: string;
     public allocationTime: string;
     public ipAddress: string;
     public affinityId: string;
     public vmSize: string;
+    public runningTasksCount: string;
     public totalTasksRun: string;
-    // public startTaskInfo: StartTaskInfoDecorator;
+    public totalTasksSucceeded: string;
+    public startTaskInfo: StartTaskInfoDecorator;
 
     constructor(node: Node) {
         super(node);
@@ -19,13 +23,15 @@ export class NodeDecorator extends DecoratorBase<Node> {
         this.url = this.stringField(node.url);
         this.state = this.stateField(node.state);
         this.stateTransitionTime = this.dateField(node.stateTransitionTime);
+        this.schedulingState = this.stateField(node.schedulingState);
         this.lastBootTime = this.dateField(node.lastBootTime);
         this.allocationTime = this.dateField(node.allocationTime);
         this.ipAddress = this.stringField(node.ipAddress);
         this.affinityId = this.stringField(node.affinityId);
         this.vmSize = this.stringField(node.vmSize);
+        this.runningTasksCount = this.stringField(node.runningTasksCount);
         this.totalTasksRun = this.stringField(node.totalTasksRun);
-
-        // this.startTaskInfo = new StartTaskInfoDecorator(node.startTaskInfo);
+        this.totalTasksSucceeded = this.stringField(node.totalTasksSucceeded);
+        this.startTaskInfo = new StartTaskInfoDecorator(node.startTaskInfo || {} as any);
     }
 }
diff --git a/app/models/decorators/pool-decorator.ts b/app/models/decorators/pool-decorator.ts
index f08620ef8e..3705452598 100644
--- a/app/models/decorators/pool-decorator.ts
+++ b/app/models/decorators/pool-decorator.ts
@@ -1,6 +1,10 @@
-import { Pool, UserAccount, UserAccountElevationLevel } from "app/models";
-import { DecoratorBase } from "app/utils/decorators";
+import { List } from "immutable";
 import * as moment from "moment";
+
+import {
+    ApplicationPackageReference, CertificateReference, Pool, UserAccount, UserAccountElevationLevel,
+} from "app/models";
+import { DecoratorBase } from "app/utils/decorators";
 import { CloudServiceConfigurationDecorator } from "./cloud-service-configuration-decorator";
 import { TaskSchedulingPolicyDecorator } from "./task-scheduling-policy-decorator";
 import { VirtualMachineConfigurationDecorator } from "./virtual-machine-configuration-decorator";
@@ -8,11 +12,12 @@ import { VirtualMachineConfigurationDecorator } from "./virtual-machine-configur
 export class PoolDecorator extends DecoratorBase<Pool> {
     public allocationState: string;
     public allocationStateTransitionTime: string;
-    public applicationPackageReferences: any[];
-    public certificateReferences: any[];
+    public applicationPackageReferences: List<ApplicationPackageReference>;
+    public certificateReferences: List<CertificateReference>;
     public cloudServiceConfiguration: CloudServiceConfigurationDecorator;
     public creationTime: string;
-    public currentDedicated: string;
+    public currentDedicatedNodes: string;
+    public currentLowPriorityNodes: string;
     public displayName: string;
     public enableAutoScale: string;
     public enableInterNodeCommunication: string;
@@ -23,7 +28,8 @@ export class PoolDecorator extends DecoratorBase<Pool> {
     public resizeTimeout: string;
     public state: string;
     public stateTransitionTime: string;
-    public targetDedicated: string;
+    public targetDedicatedNodes: string;
+    public targetLowPriorityNodes: string;
     public autoScaleFormula: string;
     public autoScaleEvaluationInterval: string;
     public taskSchedulingPolicy: TaskSchedulingPolicyDecorator;
@@ -35,40 +41,53 @@ export class PoolDecorator extends DecoratorBase<Pool> {
     public lastResized: string;
     public userAccounts: string;
 
+    public dedicatedNodes: string;
+    public lowPriorityNodes: string;
+    public networkSubnetId: string;
+
     constructor(private pool?: Pool) {
         super(pool);
+        this.id = this.stringField(pool.id);
+        this.displayName = this.stringField(pool.displayName);
         this.allocationState = this.stateField(pool.allocationState);
         this.allocationStateTransitionTime = this.dateField(pool.allocationStateTransitionTime);
-        this.cloudServiceConfiguration =
-            new CloudServiceConfigurationDecorator(pool.cloudServiceConfiguration || {} as any);
         this.creationTime = this.dateField(pool.creationTime);
-        this.currentDedicated = this.stringField(pool.currentDedicated);
-        this.displayName = this.stringField(pool.displayName);
+        this.currentDedicatedNodes = this.stringField(pool.currentDedicatedNodes);
+        this.currentLowPriorityNodes = this.stringField(pool.currentLowPriorityNodes);
         this.enableAutoScale = this.booleanField(pool.enableAutoScale);
         this.enableInterNodeCommunication = this.booleanField(pool.enableInterNodeCommunication);
-        this.id = this.stringField(pool.id);
         this.lastModified = this.dateField(pool.lastModified);
         this.maxTasksPerNode = this.stringField(pool.maxTasksPerNode);
         // this.resizeError = <any>;
         this.resizeTimeout = this.timespanField(pool.resizeTimeout);
         this.state = this.stateField(pool.state);
         this.stateTransitionTime = this.dateField(pool.stateTransitionTime);
-        this.targetDedicated = this.stringField(pool.targetDedicated);
+        this.targetDedicatedNodes = this.stringField(pool.targetDedicatedNodes);
+        this.targetLowPriorityNodes = this.stringField(pool.targetLowPriorityNodes);
         this.autoScaleFormula = this.stringField(pool.autoScaleFormula);
         this.autoScaleEvaluationInterval = this.timespanField(pool.autoScaleEvaluationInterval);
-        this.taskSchedulingPolicy =
-            new TaskSchedulingPolicyDecorator(pool.taskSchedulingPolicy);
         this.url = this.stringField(pool.url);
-        this.virtualMachineConfiguration =
-            new VirtualMachineConfigurationDecorator(pool.virtualMachineConfiguration || {} as any);
         this.vmSize = this.stringField(pool.vmSize);
+        this.lastResized = moment(this.pool.allocationStateTransitionTime).fromNow();
+        this.userAccounts = pool.userAccounts.map(x => this._decorateUserAccount(x)).join(", ");
+        this.dedicatedNodes = this._prettyNodes(pool.currentDedicatedNodes, pool.targetDedicatedNodes);
+        this.lowPriorityNodes = this._prettyNodes(pool.currentLowPriorityNodes, pool.targetLowPriorityNodes);
 
         this.poolOs = this._computePoolOs();
         this.poolOsIcon = this._computePoolOsIcon(this.poolOs);
 
-        this.lastResized = moment(this.pool.allocationStateTransitionTime).fromNow();
+        this.cloudServiceConfiguration =
+            new CloudServiceConfigurationDecorator(pool.cloudServiceConfiguration || {} as any, this.poolOs);
 
-        this.userAccounts = pool.userAccounts.map(x => this._decorateUserAccount(x)).join(", ");
+        this.virtualMachineConfiguration =
+            new VirtualMachineConfigurationDecorator(pool.virtualMachineConfiguration || {} as any, this.poolOs);
+
+        this.taskSchedulingPolicy =
+            new TaskSchedulingPolicyDecorator(pool.taskSchedulingPolicy);
+
+        this.applicationPackageReferences = List(pool.applicationPackageReferences);
+        this.certificateReferences = List(pool.certificateReferences);
+        this.networkSubnetId = pool.networkConfiguration && pool.networkConfiguration.subnetId;
     }
 
     private _computePoolOs(): string {
@@ -79,6 +98,14 @@ export class PoolDecorator extends DecoratorBase<Pool> {
         return this.pool.osIconName();
     }
 
+    private _prettyNodes(current: number, target: number) {
+        if (current === target) {
+            return target.toString();
+        } else {
+            return `${current} → ${target}`;
+        }
+    }
+
     private _decorateUserAccount(user: UserAccount) {
         if (user.elevationLevel === UserAccountElevationLevel.admin) {
             return `${user.name} (admin)`;
diff --git a/app/models/decorators/start-task-info-decorator.ts b/app/models/decorators/start-task-info-decorator.ts
new file mode 100644
index 0000000000..07f8e029b0
--- /dev/null
+++ b/app/models/decorators/start-task-info-decorator.ts
@@ -0,0 +1,26 @@
+import { StartTaskInfo } from "app/models";
+import { DateUtils } from "app/utils";
+import { DecoratorBase } from "app/utils/decorators";
+import { FailureInfoDecorator } from "./failure-info-decorator";
+
+export class StartTaskInfoDecorator extends DecoratorBase<StartTaskInfo> {
+    public state: string;
+    public startTime: string;
+    public endTime: string;
+    public exitCode: string;
+    public runtime: string;
+    public failureInfo: FailureInfoDecorator;
+    public retryCount: string;
+
+    constructor(startTaskInfo: StartTaskInfo) {
+        super(startTaskInfo);
+
+        this.state = this.stateField(startTaskInfo.state);
+        this.startTime = this.dateField(startTaskInfo.startTime);
+        this.endTime = this.dateField(startTaskInfo.endTime);
+        this.exitCode = this.numberField(startTaskInfo.exitCode);
+        this.retryCount = this.numberField(startTaskInfo.retryCount);
+        this.runtime = DateUtils.computeRuntime(startTaskInfo.startTime, startTaskInfo.endTime);
+        this.failureInfo = new FailureInfoDecorator(startTaskInfo.failureInfo || {} as any);
+    }
+}
diff --git a/app/models/decorators/sub-task-decorator.ts b/app/models/decorators/sub-task-decorator.ts
index 44885bfcdf..6ee3266abd 100644
--- a/app/models/decorators/sub-task-decorator.ts
+++ b/app/models/decorators/sub-task-decorator.ts
@@ -1,7 +1,7 @@
 import { SubtaskInformation, TaskState } from "app/models";
 import { DecoratorBase } from "app/utils/decorators";
 import { ComputeNodeInfoDecorator } from "./compute-node-info-decorator";
-import { SchedulingErrorDecorator } from "./scheduling-error-decorator";
+import { FailureInfoDecorator } from "./failure-info-decorator";
 
 export class SubTaskDecorator extends DecoratorBase<SubtaskInformation> {
     public startTime: string;
@@ -14,7 +14,7 @@ export class SubTaskDecorator extends DecoratorBase<SubtaskInformation> {
     public previousStateTransitionTime: string;
 
     public nodeInfo: {};
-    public schedulingError: {};
+    public failureInfo: {};
 
     constructor(task?: SubtaskInformation) {
         super(task);
@@ -29,7 +29,7 @@ export class SubTaskDecorator extends DecoratorBase<SubtaskInformation> {
         this.previousStateTransitionTime = this.dateField(task.previousStateTransitionTime);
 
         this.nodeInfo = new ComputeNodeInfoDecorator(task.nodeInfo || {} as any);
-        this.schedulingError = new SchedulingErrorDecorator(task.schedulingError || {} as any);
+        this.failureInfo = new FailureInfoDecorator(task.failureInfo || {} as any);
     }
 
     // todo: base class ...
diff --git a/app/models/decorators/task-execution-info-decorator.ts b/app/models/decorators/task-execution-info-decorator.ts
index 63c6bed148..51cb781b9d 100644
--- a/app/models/decorators/task-execution-info-decorator.ts
+++ b/app/models/decorators/task-execution-info-decorator.ts
@@ -1,16 +1,18 @@
 import { TaskExecutionInformation } from "app/models";
+import { DateUtils } from "app/utils";
 import { DecoratorBase } from "app/utils/decorators";
-import { SchedulingErrorDecorator } from "./scheduling-error-decorator";
+import { FailureInfoDecorator } from "./failure-info-decorator";
 
 export class TaskExecutionInfoDecorator extends DecoratorBase<TaskExecutionInformation> {
     public startTime: string;
     public endTime: string;
     public exitCode: string;
-    public schedulingError: SchedulingErrorDecorator;
+    public failureInfo: FailureInfoDecorator;
     public retryCount: string;
     public lastRetryTime: string;
     public requeueCount: string;
     public lastRequeueTime: string;
+    public runtime: string;
 
     constructor(executionInfo: TaskExecutionInformation) {
         super(executionInfo);
@@ -18,10 +20,11 @@ export class TaskExecutionInfoDecorator extends DecoratorBase<TaskExecutionInfor
         this.startTime = this.dateField(executionInfo.startTime);
         this.endTime = this.dateField(executionInfo.endTime);
         this.exitCode = this.stringField(executionInfo.exitCode);
-        this.schedulingError = new SchedulingErrorDecorator(executionInfo.schedulingError || {} as any);
+        this.failureInfo = new FailureInfoDecorator(executionInfo.failureInfo || {} as any);
         this.retryCount = this.stringField(executionInfo.retryCount);
         this.lastRetryTime = this.dateField(executionInfo.lastRetryTime);
         this.requeueCount = this.stringField(executionInfo.requeueCount);
         this.lastRequeueTime = this.dateField(executionInfo.lastRequeueTime);
+        this.runtime = DateUtils.computeRuntime(executionInfo.startTime, executionInfo.endTime);
     }
 }
diff --git a/app/models/decorators/virtual-machine-configuration-decorator.ts b/app/models/decorators/virtual-machine-configuration-decorator.ts
index b02f5a0b35..af70e19b0f 100644
--- a/app/models/decorators/virtual-machine-configuration-decorator.ts
+++ b/app/models/decorators/virtual-machine-configuration-decorator.ts
@@ -8,7 +8,7 @@ export class VirtualMachineConfigurationDecorator extends DecoratorBase<VirtualM
     public nodeAgentSKUId: string;
     public windowsConfiguration: WindowsConfigurationDecorator;
 
-    constructor(virtualMachieConfiguration: VirtualMachineConfiguration) {
+    constructor(virtualMachieConfiguration: VirtualMachineConfiguration, osName: string) {
         super(virtualMachieConfiguration);
 
         this.imageReference = new ImageReferenceDecorator(
diff --git a/app/models/dtos/account-patch.dto.ts b/app/models/dtos/account-patch.dto.ts
new file mode 100644
index 0000000000..50f046ac2f
--- /dev/null
+++ b/app/models/dtos/account-patch.dto.ts
@@ -0,0 +1,11 @@
+import { Dto, DtoAttr } from "app/core";
+
+export class AutoStoragePatchDto extends Dto<AutoStoragePatchDto> {
+    @DtoAttr()
+    public storageAccountId: string;
+}
+
+export class AccountPatchDto extends Dto<AccountPatchDto> {
+    @DtoAttr()
+    public autoStorage: AutoStoragePatchDto;
+}
diff --git a/app/models/dtos/index.ts b/app/models/dtos/index.ts
index 510cfdec93..70b1beb773 100644
--- a/app/models/dtos/index.ts
+++ b/app/models/dtos/index.ts
@@ -2,6 +2,7 @@
  * Dto(Data transfer object)
  * This folder is used for interfaces used for creating/updating entities
  */
+export * from "./account-patch.dto";
 export * from "./pool-create.dto";
 export * from "./pool-enable-autoscale.dto";
 export * from "./job-create.dto";
@@ -9,3 +10,4 @@ export * from "./task-create.dto";
 export * from "./metadata.dto";
 export * from "./user-account.dto";
 export * from "./user-identity.dto";
+export * from "./pool-resize.dto";
diff --git a/app/models/dtos/pool-create.dto.ts b/app/models/dtos/pool-create.dto.ts
index 9929ae9955..887b10ab5e 100644
--- a/app/models/dtos/pool-create.dto.ts
+++ b/app/models/dtos/pool-create.dto.ts
@@ -32,7 +32,10 @@ export class PoolCreateDto extends Dto<PoolCreateDto> {
     public resizeTimeout?: moment.Duration;
 
     @DtoAttr()
-    public targetDedicated?: number;
+    public targetDedicatedNodes?: number;
+
+    @DtoAttr()
+    public targetLowPriorityNodes?: number;
 
     @DtoAttr()
     public maxTasksPerNode?: number;
diff --git a/app/models/dtos/pool-resize.dto.ts b/app/models/dtos/pool-resize.dto.ts
new file mode 100644
index 0000000000..692116cbd9
--- /dev/null
+++ b/app/models/dtos/pool-resize.dto.ts
@@ -0,0 +1,9 @@
+import { Dto, DtoAttr } from "app/core";
+
+export class PoolResizeDto extends Dto<PoolResizeDto> {
+    @DtoAttr()
+    public targetDedicatedNodes: number;
+
+    @DtoAttr()
+    public targetLowPriorityNodes: number;
+}
diff --git a/app/models/failure-info.ts b/app/models/failure-info.ts
new file mode 100644
index 0000000000..ed4703b608
--- /dev/null
+++ b/app/models/failure-info.ts
@@ -0,0 +1,23 @@
+import { List } from "immutable";
+
+import { ListProp, Model, Prop, Record } from "app/core";
+import { NameValuePair, NameValuePairAttributes } from "./name-value-pair";
+
+export interface FailureInfoAttributes {
+    code: string;
+    category?: string;
+    message?: string;
+    details?: NameValuePairAttributes[];
+}
+
+/**
+ * Job or task scheduling error.
+ * Possible values are https://msdn.microsoft.com/en-us/library/azure/dn878162.aspx#BKMK_JobTaskError
+ */
+@Model()
+export class FailureInfo extends Record<FailureInfoAttributes> {
+    @Prop() public code: string;
+    @Prop() public category: string;
+    @Prop() public message: string;
+    @ListProp(NameValuePair) public details: List<NameValuePair> = List([]);
+}
diff --git a/app/models/file-properties.ts b/app/models/file-properties.ts
index bee0b9c0f3..f30103da1f 100644
--- a/app/models/file-properties.ts
+++ b/app/models/file-properties.ts
@@ -1,6 +1,4 @@
-import { Record } from "immutable";
-
-import { Partial } from "app/utils";
+import { Model, Prop, Record } from "app/core";
 
 export interface FilePropertiesAttributes {
     contentLength: number;
@@ -9,24 +7,13 @@ export interface FilePropertiesAttributes {
     lastModified: Date;
 }
 
-// tslint:disable:variable-name object-literal-sort-keys
-const FilePropertiesRecord = Record({
-    contentLength: null,
-    contentType: null,
-    creationTime: null,
-    lastModified: null,
-});
-
 /**
  * Class for displaying Batch File information.
  */
-export class FileProperties extends FilePropertiesRecord implements FilePropertiesAttributes {
-    public contentLength: number;
-    public contentType: string;
-    public creationTime: Date;
-    public lastModified: Date;
-
-    constructor(data: Partial<FilePropertiesAttributes> = {}) {
-        super(data);
-    }
+@Model()
+export class FileProperties extends Record<FilePropertiesAttributes> {
+    @Prop() public contentLength: number;
+    @Prop() public contentType: string;
+    @Prop() public creationTime: Date;
+    @Prop() public lastModified: Date;
 }
diff --git a/app/models/file.ts b/app/models/file.ts
index 1cf27f309c..ed4ecf75cf 100644
--- a/app/models/file.ts
+++ b/app/models/file.ts
@@ -1,5 +1,4 @@
-import { Record } from "immutable";
-
+import { Model, Prop, Record } from "app/core";
 import { Partial } from "app/utils";
 import { FileProperties, FilePropertiesAttributes } from "./file-properties";
 
@@ -10,26 +9,13 @@ export interface FileAttributes {
     properties: Partial<FilePropertiesAttributes>;
 }
 
-// tslint:disable:variable-name object-literal-sort-keys
-const FileRecord = Record({
-    name: null,
-    url: null,
-    isDirectory: false,
-    properties: null,
-});
-
 /**
  * Class for displaying Batch File information.
  */
-export class File extends FileRecord implements FileAttributes {
-    public name: string;
-    public url: string;
-    public isDirectory: boolean;
-    public properties: FileProperties;
-
-    constructor(data: Partial<FileAttributes> = {}) {
-        super(Object.assign({}, data, {
-            properties: data.properties && new FileProperties(data.properties),
-        }));
-    }
+@Model()
+export class File extends Record<FileAttributes> {
+    @Prop() public name: string;
+    @Prop() public url: string;
+    @Prop() public isDirectory: boolean = false;
+    @Prop() public properties: FileProperties;
 }
diff --git a/app/models/forms/create-pool-model.ts b/app/models/forms/create-pool-model.ts
index 4cb0e15502..579251fda0 100644
--- a/app/models/forms/create-pool-model.ts
+++ b/app/models/forms/create-pool-model.ts
@@ -27,7 +27,8 @@ export interface PoolScaleModel {
     enableAutoScale: boolean;
     autoScaleFormula: string;
     autoScaleEvaluationInterval: number;
-    targetDedicated: number;
+    targetDedicatedNodes: number;
+    targetLowPriorityNodes: number;
 }
 
 export interface CreatePoolModel {
@@ -63,7 +64,8 @@ export function createPoolToData(output: CreatePoolModel): PoolCreateDto {
         data.autoScaleFormula = outputScale.autoScaleFormula;
         data.autoScaleEvaluationInterval = moment.duration({ minutes: outputScale.autoScaleEvaluationInterval });
     } else {
-        data.targetDedicated = outputScale.targetDedicated;
+        data.targetDedicatedNodes = outputScale.targetDedicatedNodes;
+        data.targetLowPriorityNodes = outputScale.targetLowPriorityNodes;
     }
 
     if (output.os.source === PoolOsSources.PaaS) {
@@ -89,7 +91,8 @@ export function poolToFormModel(pool: PoolCreateDto): CreatePoolModel {
         displayName: pool.displayName,
         vmSize: pool.vmSize,
         scale: {
-            targetDedicated: pool.targetDedicated,
+            targetDedicatedNodes: pool.targetDedicatedNodes,
+            targetLowPriorityNodes: pool.targetLowPriorityNodes,
             enableAutoScale: pool.enableAutoScale,
             autoScaleFormula: pool.autoScaleFormula,
             autoScaleEvaluationInterval: autoScaleInterval && autoScaleInterval.asMinutes(),
diff --git a/app/models/index.ts b/app/models/index.ts
index 1225afc3be..ea119709cb 100644
--- a/app/models/index.ts
+++ b/app/models/index.ts
@@ -8,10 +8,12 @@ export * from "./application-package-reference";
 export * from "./auto-user";
 export * from "./autoscale-formula";
 export * from "./batch-error";
+export * from "./certificate-reference";
 export * from "./cloud-service-configuration";
 export * from "./compute-node-information";
 export * from "./constraints";
 export * from "./image-reference";
+export * from "./failure-info";
 export * from "./file";
 export * from "./file-type";
 export * from "./file-properties";
@@ -19,6 +21,8 @@ export * from "./job";
 export * from "./job-action";
 export * from "./job-constraints";
 export * from "./job-execution-information";
+export * from "./job-hook-task-execution-info";
+export * from "./job-hook-task";
 export * from "./job-manager-task";
 export * from "./job-preparation-task";
 export * from "./job-release-task";
@@ -28,6 +32,7 @@ export * from "./list-result";
 export * from "./metadata";
 export * from "./multi-instance-settings";
 export * from "./name-value-pair";
+export * from "./network-configuration";
 export * from "./node";
 export * from "./node-connection-settings";
 export * from "./node-user";
@@ -38,12 +43,13 @@ export * from "./pool";
 export * from "./resize-error";
 export * from "./resource-descriptor";
 export * from "./resource-file";
-export * from "./scheduling-error";
 export * from "./settings";
 export * from "./spec-cost";
 export * from "./ssh-public-key";
 export * from "./server-error";
+export * from "./start-task-info";
 export * from "./start-task";
+export * from "./storage-account";
 export * from "./storage-error";
 export * from "./storage-keys";
 export * from "./subscription";
diff --git a/app/models/job-constraints.ts b/app/models/job-constraints.ts
index 9d1f06dbc2..e38844dfe3 100644
--- a/app/models/job-constraints.ts
+++ b/app/models/job-constraints.ts
@@ -1,7 +1,12 @@
+import { Model } from "app/core";
 import { Constraints } from "./constraints";
 
 /**
  * Specifies the execution constraints for jobs created on a schedule.
  */
+@Model()
 export class JobConstraints extends Constraints {
+    constructor(data: any) {
+        super(data);
+    }
 }
diff --git a/app/models/job-execution-information.ts b/app/models/job-execution-information.ts
index d6d8c474b3..44e7752ea0 100644
--- a/app/models/job-execution-information.ts
+++ b/app/models/job-execution-information.ts
@@ -1,14 +1,5 @@
-import { Record } from "immutable";
-
-import { SchedulingError } from "./scheduling-error";
-
-const JobExecutionInformationRecord = Record({
-    startTime: null,
-    endTime: null,
-    poolId: null,
-    schedulingError: null,
-    terminateReason: null,
-});
+import { Model, Prop, Record } from "app/core";
+import { FailureInfo, FailureInfoAttributes } from "./failure-info";
 
 /**
  * Job terminate reason.
@@ -29,19 +20,22 @@ export const JobTerminateReason = {
     UserTerminate: "UserTerminate" as JobTerminateReason,
 };
 
+export interface JobExecutionInformationAttributes {
+    startTime: Date;
+    endTime: Date;
+    poolId: string;
+    failureInfo: FailureInfoAttributes;
+    terminateReason: JobTerminateReason;
+}
+
 /**
  * Contains information about the execution of a job in the Azure
  */
-export class JobExecutionInformation extends JobExecutionInformationRecord {
-    public startTime: Date;
-    public endTime: Date;
-    public poolId: string;
-    public schedulingError: SchedulingError;
-    public terminateReason: JobTerminateReason;
-
-    constructor(data: any) {
-        super(Object.assign({}, data, {
-            schedulingError: data.schedulingError && new SchedulingError(data.schedulingError),
-        }));
-    }
+@Model()
+export class JobExecutionInformation extends Record<JobExecutionInformationAttributes> {
+    @Prop() public startTime: Date;
+    @Prop() public endTime: Date;
+    @Prop() public poolId: string;
+    @Prop() public failureInfo: FailureInfo;
+    @Prop() public terminateReason: JobTerminateReason;
 }
diff --git a/app/models/job-hook-task-execution-info.ts b/app/models/job-hook-task-execution-info.ts
new file mode 100644
index 0000000000..4900fa16e6
--- /dev/null
+++ b/app/models/job-hook-task-execution-info.ts
@@ -0,0 +1,41 @@
+import { Model, Prop, Record } from "app/core";
+import { FailureInfoAttributes } from "./failure-info";
+
+export type JobHookTaskState = "running" | "completed";
+export const JobHookTaskState = {
+    running: "running" as JobHookTaskState,
+    completed: "completed" as JobHookTaskState,
+};
+
+export type JobHookTaskResult = "success" | "failure";
+export const JobHookTaskResult = {
+    success: "Success" as JobHookTaskResult,
+    failure: "Failure" as JobHookTaskResult,
+};
+
+export interface JobHookTaskExecutionInfoAttributes {
+    state: JobHookTaskState;
+    startTime: Date;
+    endTime: Date;
+    taskRootDirectory: string;
+    taskRootDirectoryUrl: string;
+    exitCode: number;
+    failureInfo: FailureInfoAttributes;
+    retryCount: number;
+    lastRetryTime: Date;
+    result: JobHookTaskResult;
+}
+
+@Model()
+export class JobHookTaskExecutionInfo extends Record<JobHookTaskExecutionInfoAttributes> {
+    @Prop() public state: JobHookTaskState;
+    @Prop() public startTime: Date;
+    @Prop() public endTime: Date;
+    @Prop() public taskRootDirectory: string;
+    @Prop() public taskRootDirectoryUrl: string;
+    @Prop() public exitCode: number;
+    @Prop() public failureInfo: FailureInfoAttributes;
+    @Prop() public retryCount: number;
+    @Prop() public lastRetryTime: Date;
+    @Prop() public result: JobHookTaskResult;
+}
diff --git a/app/models/job-hook-task.ts b/app/models/job-hook-task.ts
new file mode 100644
index 0000000000..ec8e433112
--- /dev/null
+++ b/app/models/job-hook-task.ts
@@ -0,0 +1,32 @@
+import { Model, Prop, Record } from "app/core";
+import { JobHookTaskExecutionInfo } from "./job-hook-task-execution-info";
+
+export interface JobHookTaskAttributes {
+    poolId: string;
+    nodeId: string;
+    nodeUrl: string;
+    jobPreparationTaskExecutionInfo: JobHookTaskExecutionInfo;
+    jobReleaseTaskExecutionInfo: JobHookTaskExecutionInfo;
+}
+
+@Model()
+export class JobHookTask extends Record<JobHookTaskAttributes> {
+    @Prop() public poolId: string;
+    @Prop() public nodeId: string;
+    @Prop() public nodeUrl: string;
+    @Prop() public preparationTask: JobHookTaskExecutionInfo;
+    @Prop() public releaseTask: JobHookTaskExecutionInfo;
+
+    /**
+     * Id is a computed attribute using the pool and the node id. It is not returned by the server
+     */
+    @Prop() public id: string;
+    constructor(data: JobHookTaskAttributes) {
+        super({
+            ...data,
+            id: `${data.poolId}/${data.nodeId}`,
+            preparationTask: data.jobPreparationTaskExecutionInfo,
+            releaseTask: data.jobReleaseTaskExecutionInfo,
+        });
+    }
+}
diff --git a/app/models/job.ts b/app/models/job.ts
index e4980c40c2..490e7a09b7 100644
--- a/app/models/job.ts
+++ b/app/models/job.ts
@@ -1,86 +1,88 @@
-import { List, Record } from "immutable";
+import { List } from "immutable";
 
+import { ListProp, Model, Prop, Record } from "app/core";
 import { ModelUtils } from "app/utils";
 import { AllTasksCompleteAction, TaskFailureAction } from "./job-action";
 import { JobConstraints } from "./job-constraints";
-import { JobExecutionInformation } from "./job-execution-information";
+import { JobExecutionInformation, JobExecutionInformationAttributes } from "./job-execution-information";
 import { JobManagerTask } from "./job-manager-task";
 import { JobPreparationTask } from "./job-preparation-task";
 import { JobReleaseTask } from "./job-release-task";
 import { JobStats } from "./job-stats";
-import { Metadata } from "./metadata";
-import { NameValuePair } from "./name-value-pair";
+import { Metadata, MetadataAttributes } from "./metadata";
+import { NameValuePair, NameValuePairAttributes } from "./name-value-pair";
 
-const JobRecord = Record({
-    id: null,
-    displayName: null,
-    usesTaskDependencies: false,
-    url: null,
-    eTag: null,
-    lastModified: null,
-    creationTime: null,
-    state: null,
-    stateTransitionTime: null,
-    previousState: null,
-    previousStateTransitionTime: null,
-    priority: null,
-    onAllTasksComplete: AllTasksCompleteAction.noaction,
-    onTaskFailure: TaskFailureAction.noaction,
-    constraints: null,
-    jobManagerTask: null,
-    jobPreparationTask: null,
-    jobReleaseTask: null,
-    commonEnvironmentSettings: null,
-    poolInfo: null,
-    metadata: List([]),
-    executionInfo: null,
-    stats: null,
-    schedulingError: null,
-});
+export interface JobAttributes {
+    id: string;
+    displayName: string;
+    usesTaskDependencies: boolean;
+    url: string;
+    eTag: string;
+    lastModified: Date;
+    creationTime: Date;
+    state: JobState;
+    stateTransitionTime: Date;
+    previousState: JobState;
+    previousStateTransitionTime: Date;
+    priority: number;
+    onAllTasksComplete: AllTasksCompleteAction;
+    onTaskFailure: TaskFailureAction;
 
+    constraints: Partial<JobConstraints>;
+    jobManagerTask: Partial<JobManagerTask>;
+    jobPreparationTask: Partial<JobPreparationTask>;
+    jobReleaseTask: Partial<JobReleaseTask>;
+    commonEnvironmentSettings: NameValuePairAttributes[];
+    poolInfo: any;
+    metadata: MetadataAttributes[];
+    executionInfo: Partial<JobExecutionInformationAttributes>;
+    stats: JobStats;
+}
 /**
  * Class for displaying Batch job information.
  */
-export class Job extends JobRecord {
-    public id: string;
-    public displayName: string;
-    public usesTaskDependencies: boolean;
-    public url: string;
-    public eTag: string;
-    public lastModified: Date;
-    public creationTime: Date;
-    public state: JobState;
-    public stateTransitionTime: Date;
-    public previousState: JobState;
-    public previousStateTransitionTime: Date;
-    public priority: number;
-    public onAllTasksComplete: AllTasksCompleteAction;
-    public onTaskFailure: TaskFailureAction;
+@Model()
+export class Job extends Record<JobAttributes> {
+    @Prop() public id: string;
+    @Prop() public displayName: string;
+    @Prop() public usesTaskDependencies: boolean;
+    @Prop() public url: string;
+    @Prop() public eTag: string;
+    @Prop() public lastModified: Date;
+    @Prop() public creationTime: Date;
+    @Prop() public state: JobState;
+    @Prop() public stateTransitionTime: Date;
+    @Prop() public previousState: JobState;
+    @Prop() public previousStateTransitionTime: Date;
+    @Prop() public priority: number;
+    @Prop() public onAllTasksComplete: AllTasksCompleteAction = AllTasksCompleteAction.noaction;
+    @Prop() public onTaskFailure: TaskFailureAction = TaskFailureAction.noaction;
 
-    public constraints: JobConstraints;
-    public jobManagerTask: JobManagerTask;
-    public jobPreparationTask: JobPreparationTask;
-    public jobReleaseTask: JobReleaseTask;
-    public commonEnvironmentSettings: NameValuePair[];
-    public poolInfo: any;
-    public metadata: List<Metadata>;
-    public executionInfo: JobExecutionInformation;
-    public stats: JobStats;
+    @Prop() public constraints: JobConstraints;
+    @Prop() public jobManagerTask: JobManagerTask;
+    @Prop() public jobPreparationTask: JobPreparationTask;
+    @Prop() public jobReleaseTask: JobReleaseTask;
+    @ListProp(NameValuePair) public commonEnvironmentSettings: List<NameValuePair> = List([]);
+    @Prop() public poolInfo: any;
+    @ListProp(Metadata) public metadata: List<Metadata> = List([]);
+    @Prop() public executionInfo: JobExecutionInformation;
+    @Prop() public stats: JobStats;
 
     /**
      * Tags are computed from the metadata using an internal key
      */
-    public tags: List<string> = List([]);
+    public readonly tags: List<string> = List([]);
+
+    /**
+     * If the job properties can be edited on the server.
+     * i.e. A competed job cannot be edited anymore.
+     */
+    public readonly editable: boolean;
 
-    constructor(data: any = {}) {
-        super(Object.assign({}, data, {
-            jobPreparationTask: data.jobPreparationTask && new JobPreparationTask(data.jobPreparationTask),
-            jobReleaseTask: data.jobReleaseTask && new JobReleaseTask(data.jobReleaseTask),
-            jobManagerTask: data.jobManagerTask && new JobManagerTask(data.jobManagerTask),
-            executionInfo: data.executionInfo && new JobExecutionInformation(data.executionInfo),
-            metadata: List(data.metadata && data.metadata.map(x => new Metadata(x))),
-        }));
+    constructor(data: Partial<JobAttributes> = {}) {
+        super(data);
         this.tags = ModelUtils.tagsFromMetadata(this.metadata);
+        this.editable = this.state !== JobState.completed;
     }
 
     /**
diff --git a/app/models/name-value-pair.ts b/app/models/name-value-pair.ts
index bc3bfbc3ac..fb4dcb4cd2 100644
--- a/app/models/name-value-pair.ts
+++ b/app/models/name-value-pair.ts
@@ -1,7 +1,15 @@
+import { Model, Prop, Record } from "app/core";
+
+export interface NameValuePairAttributes {
+    name: string;
+    value?: string;
+}
+
 /**
  * Common name value pair object
  */
-export class NameValuePair {
-    public name: string;
-    public value: string;
+@Model()
+export class NameValuePair extends Record<NameValuePairAttributes> {
+    @Prop() public name: string;
+    @Prop() public value: string;
 }
diff --git a/app/models/network-configuration.ts b/app/models/network-configuration.ts
new file mode 100644
index 0000000000..3ecd943b4b
--- /dev/null
+++ b/app/models/network-configuration.ts
@@ -0,0 +1,13 @@
+import { Model, Prop, Record } from "app/core";
+
+export interface NetworkConfigurationAttributes {
+    subnetId: string;
+}
+
+/**
+ * Class for displaying The network configuration for the pool.
+ */
+@Model()
+export class NetworkConfiguration extends Record<NetworkConfigurationAttributes> {
+    @Prop() public subnetId: string;
+}
diff --git a/app/models/node.ts b/app/models/node.ts
index 215b0b477d..f511010395 100644
--- a/app/models/node.ts
+++ b/app/models/node.ts
@@ -1,68 +1,58 @@
-import { Iterable, List, Record } from "immutable";
+import { List } from "immutable";
 
+import { ListProp, Model, Prop, Record } from "app/core";
+import { CertificateReference } from "app/models/certificate-reference";
 import { NodeRecentTask } from "app/models/node-recent-task";
-import { TaskState } from "app/models/task";
-
-const NodeRecord = Record({
-    id: null,
-    state: null,
-    totalTasksRun: 0,
-    schedulingState: null,
-    vmSize: null,
-    url: null,
-    stateTransitionTime: null,
-    lastBootTime: null,
-    allocationTime: null,
-    ipAddress: null,
-    affinityId: null,
-    recentTasks: null,
-});
+import { StartTaskInfo } from "app/models/start-task-info";
 
 export interface NodeAttributes {
     id: string;
+    url: string;
     state: NodeState;
-    totalTasksRun: number;
     schedulingState: string;
-    vmSize: string;
-    url: string;
     stateTransitionTime: Date;
     lastBootTime: Date;
     allocationTime: Date;
     ipAddress: string;
     affinityId: string;
+    vmSize: string;
+    totalTasksRun: number;
+    totalTasksSucceeded: number;
+    runningTasksCount: number;
+    isDedicated: boolean;
     recentTasks: Array<Partial<NodeRecentTask>>;
+    certificateReferences: Array<Partial<CertificateReference>>;
+    startTaskInfo: Partial<StartTaskInfo>;
 }
 
 /**
  * Class for displaying Batch node information.
  */
-export class Node extends NodeRecord {
-    public id: string;
-    public state: NodeState;
-    public totalTasksRun: number;
-    public schedulingState: string;
-    public vmSize: string;
-    public url: string;
-    public stateTransitionTime: Date;
-    public lastBootTime: Date;
-    public allocationTime: Date;
-    public ipAddress: string;
-    public affinityId: string;
-    public recentTasks: List<NodeRecentTask>;
-
-    constructor(data: Partial<NodeAttributes>) {
-        super(Object.assign({}, data, {
-            recentTasks: List(data.recentTasks && data.recentTasks.map(x => new NodeRecentTask(x))),
-        }));
-    }
+@Model()
+export class Node extends Record<NodeAttributes> {
+    @Prop() public id: string;
+    @Prop() public url: string;
+    @Prop() public state: NodeState;
+    @Prop() public schedulingState: string;
+    @Prop() public stateTransitionTime: Date;
+    @Prop() public lastBootTime: Date;
+    @Prop() public allocationTime: Date;
+    @Prop() public ipAddress: string;
+    @Prop() public affinityId: string;
+    @Prop() public vmSize: string;
+    @Prop() public totalTasksRun: number = 0;
+    @Prop() public totalTasksSucceeded: number = 0;
+    @Prop() public runningTasksCount: number = 0;
+    @Prop() public isDedicated: boolean;
+    @Prop() public startTaskInfo: StartTaskInfo;
 
-    public get runningTasks(): Iterable<number, NodeRecentTask> {
-        return this.recentTasks.filter(x => x.taskState === TaskState.running);
-    }
+    @ListProp(NodeRecentTask) public recentTasks: List<NodeRecentTask> = List([]);
+    @ListProp(CertificateReference) public certificateReferences: List<CertificateReference> = List([]);
 }
 
 export type NodeState = "creating" | "starting" | "waitingforstarttask" | "starttaskfailed" |
-    "idle" | "offline" | "leavingpool" | "rebooting" | "reimaging" | "running" | "unknown" | "unusable";
+    "idle" | "offline" | "leavingpool" | "rebooting" | "reimaging" | "running" | "unknown" | "unusable" |
+    "preempted";
 
 export const NodeState = {
     creating: "creating" as NodeState,
@@ -77,4 +67,5 @@ export const NodeState = {
     running: "running" as NodeState,
     unknown: "unknown" as NodeState,
     unusable: "unusable" as NodeState,
+    preempted: "preempted" as NodeState,
 };
diff --git a/app/models/pool-os-disk.ts b/app/models/pool-os-disk.ts
new file mode 100644
index 0000000000..5c23495df7
--- /dev/null
+++ b/app/models/pool-os-disk.ts
@@ -0,0 +1,14 @@
+import { List } from "immutable";
+
+import { ListProp, Model, Prop, Record } from "app/core";
+
+export interface PoolOSDiskAttributes {
+    caching: string;
+    imageUris?: string[];
+}
+
+@Model()
+export class PoolOSDisk extends Record<PoolOSDiskAttributes> {
+    @Prop() public caching: string;
+    @ListProp(String) public imageUris: List<string> = List([]);
+}
diff --git a/app/models/pool.ts b/app/models/pool.ts
index a04eeab429..77e04e21b4 100644
--- a/app/models/pool.ts
+++ b/app/models/pool.ts
@@ -5,6 +5,7 @@ import { ListProp, Model, Prop, Record } from "app/core";
 import { ModelUtils, PoolUtils } from "app/utils";
 import { CloudServiceConfiguration } from "./cloud-service-configuration";
 import { Metadata, MetadataAttributes } from "./metadata";
+import { NetworkConfiguration } from "./network-configuration";
 import { ResizeError } from "./resize-error";
 import { StartTask, StartTaskAttributes } from "./start-task";
 import { TaskSchedulingPolicy } from "./task-scheduling-policy";
@@ -18,18 +19,20 @@ export interface PoolAttributes {
     certificateReferences: any[];
     cloudServiceConfiguration: Partial<CloudServiceConfiguration>;
     creationTime: Date;
-    currentDedicated: number;
+    currentDedicatedNodes: number;
+    currentLowPriorityNodes: number;
     displayName: string;
     enableAutoscale: boolean;
     enableInterNodeCommunication: boolean;
     id: string;
     lastModified: Date;
     maxTasksPerNode: number;
-    resizeError: Partial<ResizeError>;
+    resizeErrors: Array<Partial<ResizeError>>;
     resizeTimeout: Duration;
     state: string;
     stateTransitionTime: Date;
-    targetDedicated: number;
+    targetDedicatedNodes: number;
+    targetLowPriorityNodes: number;
     taskSchedulingPolicy: TaskSchedulingPolicy;
     url: string;
     virtualMachineConfiguration: Partial<VirtualMachineConfigurationAttributes>;
@@ -44,65 +47,81 @@ export interface PoolAttributes {
  */
 @Model()
 export class Pool extends Record<PoolAttributes> {
-    @Prop()
-    public allocationState: string;
-    @Prop()
-    public allocationStateTransitionTime: Date;
-    @ListProp(Object)
-    public applicationPackageReferences: List<any>;
-    @ListProp(Object)
-    public certificateReferences: List<any>;
-    @Prop()
-    public cloudServiceConfiguration: CloudServiceConfiguration;
-    @Prop()
-    public creationTime: Date;
-    @Prop()
-    public currentDedicated: number;
-    @Prop()
-    public displayName: string;
-    @Prop()
-    public enableAutoScale: boolean;
-    @Prop()
-    public enableInterNodeCommunication: boolean;
-    @Prop()
-    public id: string;
-    @Prop()
-    public lastModified: Date;
-    @Prop()
-    public maxTasksPerNode: number = 1;
-    @Prop()
-    public resizeError: ResizeError;
-    @Prop()
-    public resizeTimeout: Duration;
-    @Prop()
-    public state: string;
-    @Prop()
-    public stateTransitionTime: Date;
-    @Prop()
-    public targetDedicated: number = 0;
-    @Prop()
-    public autoScaleFormula: string;
-    @Prop()
-    public autoScaleEvaluationInterval: Duration;
-    @Prop()
-    public taskSchedulingPolicy: any;
-    @Prop()
-    public url: string;
-    @Prop()
-    public virtualMachineConfiguration: VirtualMachineConfiguration;
-    @Prop()
-    public vmSize: string;
-    @Prop()
-    public startTask: StartTask;
-    @ListProp(Metadata)
-    public metadata: List<Metadata> = List([]);
-    @ListProp(UserAccount)
-    public userAccounts: List<UserAccount> = List([]);
+
+    @Prop() public allocationState: string;
+
+    @Prop() public allocationStateTransitionTime: Date;
+
+    @ListProp(Object) public applicationPackageReferences: List<any>;
+
+    @ListProp(Object) public certificateReferences: List<any>;
+
+    @Prop() public cloudServiceConfiguration: CloudServiceConfiguration;
+
+    @Prop() public creationTime: Date;
+
+    @Prop() public currentDedicatedNodes: number = 0;
+
+    @Prop() public currentLowPriorityNodes: number = 0;
+
+    @Prop() public displayName: string;
+
+    @Prop() public enableAutoScale: boolean;
+
+    @Prop() public enableInterNodeCommunication: boolean;
+
+    @Prop() public id: string;
+
+    @Prop() public lastModified: Date;
+
+    @Prop() public maxTasksPerNode: number = 1;
+
+    @ListProp(ResizeError) public resizeErrors: List<ResizeError> = List([]);
+
+    @Prop() public resizeTimeout: Duration;
+
+    @Prop() public state: string;
+
+    @Prop() public stateTransitionTime: Date;
+
+    @Prop() public targetDedicatedNodes: number = 0;
+
+    @Prop() public targetLowPriorityNodes: number = 0;
+
+    @Prop() public autoScaleFormula: string;
+
+    @Prop() public autoScaleEvaluationInterval: Duration;
+
+    @Prop() public taskSchedulingPolicy: any;
+
+    @Prop() public url: string;
+
+    @Prop() public virtualMachineConfiguration: VirtualMachineConfiguration;
+
+    @Prop() public vmSize: string;
+
+    @Prop() public startTask: StartTask;
+
+    @Prop() public networkConfiguration: NetworkConfiguration;
+
+    @ListProp(Metadata) public metadata: List<Metadata> = List([]);
+
+    @ListProp(UserAccount) public userAccounts: List<UserAccount> = List([]);
 
     /**
      * Tags are computed from the metadata using an internal key
      */
-    public tags: List<string> = List([]);
+    @Prop() public tags: List<string> = List([]);
+
+    /**
+     * Computed field sum of dedicated and low pri nodes
+     */
+    public targetNodes: number;
+
+    /**
+     * Computed field sum of dedicated and low pri nodes
+     */
+    public currentNodes: number;
 
     private _osName: string;
     private _osIcon: string;
@@ -112,6 +131,8 @@ export class Pool extends Record<PoolAttributes> {
         this.tags = ModelUtils.tagsFromMetadata(this.metadata);
         this._osName = PoolUtils.getOsName(this);
         this._osIcon = PoolUtils.getComputePoolOsIcon(this._osName);
+        this.targetNodes = this.targetDedicatedNodes + this.targetLowPriorityNodes;
+        this.currentNodes = this.currentDedicatedNodes + this.currentLowPriorityNodes;
     }
 
     public osIconName(): string {
diff --git a/app/models/resize-error.ts b/app/models/resize-error.ts
index 9e570874eb..02f9bff359 100644
--- a/app/models/resize-error.ts
+++ b/app/models/resize-error.ts
@@ -1,28 +1,26 @@
-import { List, Record } from "immutable";
+import { List } from "immutable";
 
-//  tslint:disable:variable-name
-const ResizeErrorRecord = Record({
-    code: null,
-    message: null,
-    vals: [],
-});
+import { ListProp, Model, Prop, Record } from "app/core";
+import { NameValuePair, NameValuePairAttributes } from "./name-value-pair";
 
-export class ResizeError extends ResizeErrorRecord {
-    public code: ResizeErrorCode;
-    public message: string;
-
-    // equivalent to the values in the API as values is already used in immutable
-    public vals: List<any>;
+export interface ResizeErrorAttributes {
+    code: ResizeErrorCode;
+    message: string;
+    values: NameValuePairAttributes[];
+}
 
-    constructor(data: any = {}) {
-        super(Object.assign({}, data, {
-            vals: List(data.values),
-        }));
-    }
+@Model()
+export class ResizeError extends Record<ResizeErrorAttributes> {
+    @Prop() public code: ResizeErrorCode;
+    @Prop() public message: string;
+    @ListProp(Object) public values: List<NameValuePair> = List([]);
 }
 
-export type ResizeErrorCode = "AccountCoreQuotaReached" | "ResizeStopped";
+export type ResizeErrorCode = "AccountCoreQuotaReached" | "ResizeStopped"
+    | "AllocationFailed" | "AccountLowPriorityCoreQuotaReached";
 export const ResizeErrorCode = {
     accountCoreQuotaReached: "AccountCoreQuotaReached" as ResizeErrorCode,
+    accountLowPriorityCoreQuotaReached: "AccountLowPriorityCoreQuotaReached" as ResizeErrorCode,
     resizeStopped: "ResizeStopped" as ResizeErrorCode,
+    allocationFailed: "AllocationFailed" as ResizeErrorCode,
 };
diff --git a/app/models/scheduling-error.ts b/app/models/scheduling-error.ts
deleted file mode 100644
index d712a70d46..0000000000
--- a/app/models/scheduling-error.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { List, Record } from "immutable";
-
-const SchedulingErrorRecord = Record({
-    code: null,
-    category: null,
-    message: null,
-    details: List([]),
-});
-
-/**
- * Job or task scheduling error.
- * Possible values are https://msdn.microsoft.com/en-us/library/azure/dn878162.aspx#BKMK_JobTaskError
- */
-export class SchedulingError extends SchedulingErrorRecord {
-    public code: string;
-    public category: string;
-    public message: string;
-    public details: List<any>;
-}
diff --git a/app/models/start-task-info.ts b/app/models/start-task-info.ts
new file mode 100644
index 0000000000..75a7fe8268
--- /dev/null
+++ b/app/models/start-task-info.ts
@@ -0,0 +1,25 @@
+import { Model, Prop, Record } from "app/core";
+import { FailureInfo, FailureInfoAttributes } from "./failure-info";
+import { TaskState } from "./task";
+
+export interface StartTaskInfoAttributes {
+    state: TaskState;
+    startTime?: Date;
+    endTime?: Date;
+    exitCode: number;
+    failureInfo?: FailureInfoAttributes;
+    retryCount: number;
+}
+
+/**
+ * Class for displaying Start Task execution info from a node.
+ */
+@Model()
+export class StartTaskInfo extends Record<StartTaskInfoAttributes> {
+    @Prop() public state: TaskState;
+    @Prop() public startTime: Date;
+    @Prop() public endTime: Date;
+    @Prop() public exitCode: number;
+    @Prop() public failureInfo: FailureInfo;
+    @Prop() public retryCount: number;
+}
diff --git a/app/models/start-task.ts b/app/models/start-task.ts
index 02e588e224..46425049bc 100644
--- a/app/models/start-task.ts
+++ b/app/models/start-task.ts
@@ -10,6 +10,7 @@ export interface StartTaskAttributes {
     maxTaskRetryCount: number;
     resourceFiles: any[];
     environmentSettings: any[];
+    waitForSuccess: boolean;
 }
 
 /**
diff --git a/app/models/storage-account.ts b/app/models/storage-account.ts
new file mode 100644
index 0000000000..4594430286
--- /dev/null
+++ b/app/models/storage-account.ts
@@ -0,0 +1,59 @@
+import { ArmRecord, ArmRecordAttributes, Model, Prop, Record } from "app/core";
+
+interface StorageAccountPropertiesAttributes {
+    creationTime: Date;
+    primaryLocation: string;
+    provisioningState: string;
+    secondaryLocation: string;
+    statusOfPrimary: string;
+    statusOfSecondary: string;
+    supportsHttpsTrafficOnly: boolean;
+}
+
+@Model()
+class StorageAccountProperties extends Record<StorageAccountPropertiesAttributes> {
+    @Prop() public creationTime: Date;
+
+    @Prop() public primaryLocation: string;
+
+    @Prop() public provisioningState: string;
+
+    @Prop() public secondaryLocation: string;
+
+    @Prop() public statusOfPrimary: string;
+
+    @Prop() public statusOfSecondary: string;
+
+    @Prop() public supportsHttpsTrafficOnly: boolean;
+}
+
+export interface StorageAccountAttributes extends ArmRecordAttributes {
+    location: string;
+    name: string;
+    kind: string;
+    properties: Partial<StorageAccountPropertiesAttributes>;
+    type: StorageAccountType;
+}
+
+export type StorageAccountType = "Microsoft.Storage/storageAccounts" | "Microsoft.ClassicStorage/storageAccounts";
+
+@Model()
+export class StorageAccount extends ArmRecord<StorageAccountAttributes> {
+    @Prop() public id: string;
+
+    @Prop() public location: string;
+
+    @Prop() public name: string;
+
+    @Prop() public kind: string;
+
+    @Prop() public properties: StorageAccountProperties;
+
+    public type: StorageAccountType;
+    public isClassic: boolean;
+
+    constructor(data: StorageAccountAttributes) {
+        super(data);
+        this.isClassic = this.type === "Microsoft.ClassicStorage/storageAccounts";
+    }
+}
diff --git a/app/models/storage-keys.ts b/app/models/storage-keys.ts
index 4a0ae7fd30..4c2bcb5524 100644
--- a/app/models/storage-keys.ts
+++ b/app/models/storage-keys.ts
@@ -8,7 +8,6 @@ const StorageKeysRecord = Record({
 });
 
 export interface StorageKeysAttributes {
-
     primaryKey: string;
     secondaryKey: string;
 }
diff --git a/app/models/subtask-information.ts b/app/models/subtask-information.ts
index 8b7247f28a..93fec09be2 100644
--- a/app/models/subtask-information.ts
+++ b/app/models/subtask-information.ts
@@ -1,36 +1,37 @@
-import { Record } from "immutable";
+import { Model, Prop, Record } from "app/core";
 
 import { ComputeNodeInformation } from "./compute-node-information";
-import { SchedulingError } from "./scheduling-error";
+import { FailureInfo } from "./failure-info";
 import { TaskState } from "./task";
 
-// tslint:disable:variable-name
-const SubtaskRecord = Record({
-    id: null,
-    startTime: null,
-    endTime: null,
-    exitCode: null,
-    state: null,
-    stateTransitionTime: null,
-    previousState: null,
-    previousStateTransitionTime: null,
-    nodeInfo: null,
-    schedulingError: null,
-});
+export interface SubtaskInformationAttributes {
+    id?: number;
+    nodeInfo?: ComputeNodeInformation;
+    startTime?: Date;
+    endTime?: Date;
+    exitCode?: number;
+    failureInfo?: FailureInfo;
+    state?: string;
+    stateTransitionTime?: Date;
+    previousState?: string;
+    previousStateTransitionTime?: Date;
+    result?: string;
+}
 
 /**
  * Class for displaying MPI sub task information.
  */
-export class SubtaskInformation extends SubtaskRecord {
-    public id: string;
-    public startTime: Date;
-    public endTime: Date;
-    public exitCode: number;
-    public state: TaskState;
-    public stateTransitionTime: Date;
-    public previousState: TaskState;
-    public previousStateTransitionTime: Date;
+@Model()
+export class SubtaskInformation extends Record<SubtaskInformationAttributes> {
+    @Prop() public id: string;
+    @Prop() public startTime: Date;
+    @Prop() public endTime: Date;
+    @Prop() public exitCode: number;
+    @Prop() public state: TaskState;
+    @Prop() public stateTransitionTime: Date;
+    @Prop() public previousState: TaskState;
+    @Prop() public previousStateTransitionTime: Date;
 
-    public nodeInfo: ComputeNodeInformation;
-    public schedulingError: SchedulingError;
+    @Prop() public nodeInfo: ComputeNodeInformation;
+    @Prop() public failureInfo: FailureInfo;
 }
diff --git a/app/models/task-execution-information.ts b/app/models/task-execution-information.ts
index a544eb5178..c0d9eecfa8 100644
--- a/app/models/task-execution-information.ts
+++ b/app/models/task-execution-information.ts
@@ -1,15 +1,30 @@
-import { SchedulingError } from "./scheduling-error";
+import { Model, Prop, Record } from "app/core";
+import { FailureInfo, FailureInfoAttributes } from "./failure-info";
+
+export interface TaskExecutionInformationAttributes {
+    startTime: Date;
+    endTime?: Date;
+    state: string;
+    taskRootDirectory?: string;
+    taskRootDirectoryUrl?: string;
+    exitCode?: number;
+    failureInfo?: FailureInfoAttributes;
+    retryCount: number;
+    lastRetryTime?: Date;
+    result?: string;
+}
 
 /**
  * Contains information about the execution of a task in the Azure
  */
-export class TaskExecutionInformation {
-    public startTime: Date;
-    public endTime: Date;
-    public exitCode: number;
-    public schedulingError: SchedulingError;
-    public retryCount: number;
-    public lastRetryTime: Date;
-    public requeueCount: number;
-    public lastRequeueTime: Date;
+@Model()
+export class TaskExecutionInformation extends Record<TaskExecutionInformationAttributes> {
+    @Prop() public startTime: Date;
+    @Prop() public endTime: Date;
+    @Prop() public exitCode: number;
+    @Prop() public failureInfo: FailureInfo;
+    @Prop() public retryCount: number;
+    @Prop() public lastRetryTime: Date;
+    @Prop() public requeueCount: number;
+    @Prop() public lastRequeueTime: Date;
 }
diff --git a/app/models/task-exit-conditions.ts b/app/models/task-exit-conditions.ts
index ceb0e719fa..c7390b5751 100644
--- a/app/models/task-exit-conditions.ts
+++ b/app/models/task-exit-conditions.ts
@@ -7,21 +7,21 @@ import { JobAction } from "./job-action";
 const TaskExitConditionsRecord = Record({
     exitCodes: [],
     exitCodeRanges: [],
-    schedulingError: null,
+    failureInfo: null,
     default: null,
 });
 
 export class TaskExitConditions extends TaskExitConditionsRecord {
     public exitCodes: List<ExitCodeMapping>;
     public exitCodeRanges: List<ExitCodeRangeMapping>;
-    public schedulingError: ExitOptions;
+    public failureInfo: ExitOptions;
     public default: ExitOptions;
 
     constructor(data: any = {}) {
         super(Object.assign({}, data, ObjectUtils.compact({
             exitCodes: data.exitCodes && List(data.exitCodes.map(x => new ExitCodeMapping(x))),
             exitCodeRanges: data.exitCodeRanges && List(data.exitCodeRanges.map(x => new ExitCodeRangeMapping(x))),
-            schedulingError: new ExitOptions(data.schedulingError),
+            failureInfo: new ExitOptions(data.failureInfo),
             default: new ExitOptions(data.default),
         })));
     }
diff --git a/app/models/task.ts b/app/models/task.ts
index 38ad82d251..5fe8bdc62b 100644
--- a/app/models/task.ts
+++ b/app/models/task.ts
@@ -1,6 +1,7 @@
-import { Record } from "immutable";
+import { List } from "immutable";
 import * as moment from "moment";
 
+import { ListProp, Model, Prop, Record } from "app/core";
 import { AffinityInformation } from "./affinity-information";
 import { ApplicationPackageReference } from "./application-package-reference";
 import { ComputeNodeInformation } from "./compute-node-information";
@@ -12,68 +13,59 @@ import { TaskDependencies } from "./task-dependencies";
 import { TaskExecutionInformation } from "./task-execution-information";
 import { TaskExitConditions } from "./task-exit-conditions";
 
-// tslint:disable:variable-name
-const TaskRecord = Record({
-    id: null,
-    displayName: null,
-    url: null,
-    eTag: null,
-    lastModified: null,
-    creationTime: null,
-    state: null,
-    stateTransitionTime: null,
-    previousState: null,
-    previousStateTransitionTime: null,
-    commandLine: null,
-    runElevated: null,
-    exitConditions: new TaskExitConditions(),
-    resourceFiles: [],
-    environmentSettings: null,
-    affinityInfo: null,
-    constraints: null,
-    executionInfo: null,
-    nodeInfo: null,
-    multiInstanceSettings: null,
-    stats: null,
-    dependsOn: null,
-    applicationPackageReferences: null,
-});
-
+export interface TaskAttributes {
+    id: string;
+    displayName: string;
+    url: string;
+    eTag: string;
+    lastModified: Date;
+    creationTime: Date;
+    state: TaskState;
+    stateTransitionTime: Date;
+    previousState: TaskState;
+    previousStateTransitionTime: Date;
+    commandLine: string;
+    runElevated: boolean;
+    exitConditions: TaskExitConditions;
+    resourceFiles: ResourceFile[];
+    environmentSettings: NameValuePair[];
+    affinityInfo: AffinityInformation;
+    constraints: TaskConstraints;
+    executionInfo: TaskExecutionInformation;
+    nodeInfo: ComputeNodeInformation;
+    multiInstanceSettings: MultiInstanceSettings;
+    stats: any; // TaskStatistics
+    dependsOn: TaskDependencies;
+    applicationPackageReferences: ApplicationPackageReference[];
+}
 /**
  * Class for displaying Batch task information.
  */
-export class Task extends TaskRecord {
-    public id: string;
-    public displayName: string;
-    public url: string;
-    public eTag: string;
-    public lastModified: Date;
-    public creationTime: Date;
-    public state: TaskState;
-    public stateTransitionTime: Date;
-    public previousState: TaskState;
-    public previousStateTransitionTime: Date;
-    public commandLine: string;
-    public runElevated: boolean;
-
-    public exitConditions: TaskExitConditions;
-    public resourceFiles: ResourceFile[];
-    public environmentSettings: NameValuePair[];
-    public affinityInfo: AffinityInformation;
-    public constraints: TaskConstraints;
-    public executionInfo: TaskExecutionInformation;
-    public nodeInfo: ComputeNodeInformation;
-    public multiInstanceSettings: MultiInstanceSettings;
-    public stats: any; // TaskStatistics
-    public dependsOn: TaskDependencies;
-    public applicationPackageReferences: ApplicationPackageReference[];
-
-    constructor(data: any = {}) {
-        super(Object.assign({}, data, {
-            exitConditions: new TaskExitConditions(data.exitConditions),
-            dependsOn: data.dependsOn && new TaskDependencies(data.dependsOn),
-        }));
-    }
+@Model()
+export class Task extends Record<TaskAttributes> {
+    @Prop() public id: string;
+    @Prop() public displayName: string;
+    @Prop() public url: string;
+    @Prop() public eTag: string;
+    @Prop() public lastModified: Date;
+    @Prop() public creationTime: Date;
+    @Prop() public state: TaskState;
+    @Prop() public stateTransitionTime: Date;
+    @Prop() public previousState: TaskState;
+    @Prop() public previousStateTransitionTime: Date;
+    @Prop() public commandLine: string;
+    @Prop() public runElevated: boolean;
+    @Prop() public exitConditions: TaskExitConditions = new TaskExitConditions();
+    @ListProp(ResourceFile) public resourceFiles: List<ResourceFile> = List([]);
+    @ListProp(NameValuePair) public environmentSettings: List<NameValuePair> = List([]);
+    @Prop() public affinityInfo: AffinityInformation;
+    @Prop() public constraints: TaskConstraints;
+    @Prop() public executionInfo: TaskExecutionInformation;
+    @Prop() public nodeInfo: ComputeNodeInformation;
+    @Prop() public multiInstanceSettings: MultiInstanceSettings;
+    @Prop() public stats: any; // TaskStatistics
+    @Prop() public dependsOn: TaskDependencies;
+    @Prop() public applicationPackageReferences: ApplicationPackageReference[];
 
     /**
      * @returns true if the task timeout.
@@ -82,7 +74,7 @@ export class Task extends TaskRecord {
     public get didTimeout() {
         const info = this.executionInfo;
         const constraints = this.constraints;
-        if (!(info && info.exitCode && constraints && constraints.maxWallClockTime)) {
+        if (!(info && info.failureInfo && info.exitCode && constraints && constraints.maxWallClockTime)) {
             return false;
         }
         if (info.exitCode === 0) {
diff --git a/app/models/virtual-machine-configuration.ts b/app/models/virtual-machine-configuration.ts
index 982baedd74..105902140b 100644
--- a/app/models/virtual-machine-configuration.ts
+++ b/app/models/virtual-machine-configuration.ts
@@ -1,30 +1,22 @@
-import { Record } from "immutable";
-
+import { Model, Prop, Record } from "app/core";
 import { ImageReference, ImageReferenceAttributes } from "./image-reference";
+import { PoolOSDisk, PoolOSDiskAttributes } from "./pool-os-disk";
 import { WindowsConfiguration } from "./windows-configuration";
 
-// tslint:disable:variable-name object-literal-sort-keys
-const VirtualMachineConfigurationRecord = Record({
-    imageReference: null,
-    nodeAgentSKUId: null,
-    windowsConfiguration: null,
-});
-
 export interface VirtualMachineConfigurationAttributes {
     imageReference: ImageReferenceAttributes;
     nodeAgentSKUId: string;
     windowsConfiguration: WindowsConfiguration;
+    osDisk?: PoolOSDiskAttributes;
 }
 
 /**
  * Class for displaying Batch VirtualMachineConfiguration information.
  */
-export class VirtualMachineConfiguration extends VirtualMachineConfigurationRecord {
-    public imageReference: ImageReference;
-    public nodeAgentSKUId: string;
-    public windowsConfiguration: WindowsConfiguration;
-
-    constructor(data: VirtualMachineConfigurationAttributes) {
-        super(data);
-    }
+@Model()
+export class VirtualMachineConfiguration extends Record<VirtualMachineConfigurationAttributes> {
+    @Prop() public imageReference: ImageReference;
+    @Prop() public nodeAgentSKUId: string;
+    @Prop() public windowsConfiguration: WindowsConfiguration;
+    @Prop() public osDisk: PoolOSDisk;
 }
diff --git a/app/models/vm-size.ts b/app/models/vm-size.ts
index 5c4e0acc37..5ff13dadfb 100644
--- a/app/models/vm-size.ts
+++ b/app/models/vm-size.ts
@@ -1,13 +1,4 @@
-import { Record } from "immutable";
-
-const VmSizeRecord = Record({
-    name: null,
-    numberOfCores: null,
-    osDiskSizeInMB: null,
-    resourceDiskSizeInMB: null,
-    memoryInMB: null,
-    maxDataDiskCount: null,
-});
+import { Model, Prop, Record } from "app/core";
 
 export interface VmSizeAttributes {
     name: string;
@@ -18,34 +9,44 @@ export interface VmSizeAttributes {
     maxDataDiskCount: number;
 }
 
-export class VmSize extends VmSizeRecord implements VmSizeAttributes {
+@Model()
+export class VmSize extends Record<VmSizeAttributes> {
+    /**
+     * Id for the vmSize(This is computed form the name attribute)
+     */
+    @Prop() public id: string;
+
     /**
      * Specifies the name of the virtual machine size
      */
-    public name: string;
+    @Prop() public name: string;
 
     /**
      * Specifies the number of available CPU cores.
      */
-    public numberOfCores: number;
+    @Prop() public numberOfCores: number;
 
     /**
      * Specifies the size in MB of the operating system disk.
      */
-    public osDiskSizeInMB: number;
+    @Prop() public osDiskSizeInMB: number;
 
     /**
      * Specifies the size in MB of the temporary or resource disk.
      */
-    public resourceDiskSizeInMB: number;
+    @Prop() public resourceDiskSizeInMB: number;
 
     /**
      * Specifies the available RAM in MB.
      */
-    public memoryInMB: number;
+    @Prop() public memoryInMB: number;
 
     /**
      * Specifies the maximum number of data disks that can be attached to the VM size.
      */
-    public maxDataDiskCount: number;
+    @Prop() public maxDataDiskCount: number;
+
+    constructor(data: VmSizeAttributes) {
+        super({ ...data, id: data.name && data.name.toLowerCase() });
+    }
 }
diff --git a/app/services/account.service.ts b/app/services/account.service.ts
index 1f7f0a12f1..c95e18bb2e 100644
--- a/app/services/account.service.ts
+++ b/app/services/account.service.ts
@@ -5,10 +5,11 @@ import { List } from "immutable";
 import { AsyncSubject, BehaviorSubject, Observable } from "rxjs";
 
 import { AccountKeys, AccountResource, Subscription } from "app/models";
-import { Constants, log } from "app/utils";
+import { AccountPatchDto } from "app/models/dtos";
+import { ArmResourceUtils, Constants, log } from "app/utils";
 import { AzureHttpService } from "./azure-http.service";
 import {
-    DataCache, DataCacheTracker,
+    DataCache, DataCacheTracker, RxBasicEntityProxy, RxEntityProxy, getOnceProxy,
 } from "./core";
 import { SubscriptionService } from "./subscription.service";
 
@@ -31,17 +32,6 @@ export interface SelectedAccount {
     keys: AccountKeys;
 }
 
-function getSubscriptionIdFromAccountId(accountId: string) {
-    const regex = /subscriptions\/(.*)\/resourceGroups/;
-    const out = regex.exec(accountId);
-
-    if (!out || out.length < 2) {
-        return null;
-    } else {
-        return out[1];
-    }
-}
-
 @Injectable()
 export class AccountService {
     public accountLoaded: Observable<boolean>;
@@ -70,6 +60,7 @@ export class AccountService {
     private _currentAccountId = new BehaviorSubject<string>(null);
     private _accounts = new BehaviorSubject<List<AccountResource>>(List([]));
     private _accountsLoaded = new BehaviorSubject<boolean>(false);
+    private _cache = new DataCache<AccountResource>();
 
     constructor(
         private azure: AzureHttpService,
@@ -123,7 +114,7 @@ export class AccountService {
         const accountId = this._currentAccountId.value;
         this._currentAccountValid.next(AccountStatus.Loading);
 
-        const accountObs = this.getAccount(accountId);
+        const accountObs = this.getOnce(accountId);
         const keyObs = this.getAccountKeys(accountId);
         DataCacheTracker.clearAllCaches(this._accountCache);
 
@@ -186,16 +177,18 @@ export class AccountService {
             .share();
     }
 
-    public getAccount(accountId: string): Observable<AccountResource> {
-        return this.subscriptionService.get(getSubscriptionIdFromAccountId(accountId))
-            .flatMap((subscription) => {
-                return this.azure.get(subscription, accountId)
-                    .map(response => {
-                        const data = response.json();
-                        return this._createAccount(subscription, data);
-                    });
-            })
-            .share();
+    public get(accountId: string): RxEntityProxy<AccountParams, AccountResource> {
+        return new RxBasicEntityProxy<AccountParams, AccountResource>(AccountResource, {
+            cache: () => this._cache,
+            initialParams: {
+                id: accountId,
+            },
+            supplyData: ({ id }) => this._getAccount(id),
+        });
+    }
+
+    public getOnce(accountId: string): Observable<AccountResource> {
+        return getOnceProxy(this.get(accountId));
     }
 
     public getNameFromAccountId(accountId: string): string {
@@ -210,7 +203,7 @@ export class AccountService {
     }
 
     public getAccountKeys(accountId: string): Observable<AccountKeys> {
-        const subId = getSubscriptionIdFromAccountId(accountId);
+        const subId = ArmResourceUtils.getSubscriptionIdFromResourceId(accountId);
         return this.subscriptionService.get(subId)
             .flatMap((sub) => this.azure.post(sub, `${accountId}/listKeys`))
             .map(response => new AccountKeys(response.json()))
@@ -223,7 +216,7 @@ export class AccountService {
         }
 
         const subject = new AsyncSubject();
-        this.getAccount(accountId).subscribe({
+        this.getOnce(accountId).subscribe({
             next: (account) => {
                 this._accountFavorites.next(this._accountFavorites.getValue().push(account));
                 this._saveAccountFavorites();
@@ -250,7 +243,7 @@ export class AccountService {
     public isAccountFavorite(accountId: string): boolean {
         accountId = accountId.toLowerCase();
         const favorites = this._accountFavorites.getValue();
-        const account = favorites.filter(x => x.id.toLowerCase() === accountId).first();
+        const account = favorites.filter(x => x.id === accountId).first();
 
         return Boolean(account);
     }
@@ -271,6 +264,13 @@ export class AccountService {
         });
     }
 
+    public patch(accountId: string, properties: AccountPatchDto): Observable<any> {
+        return this.subscriptionService.get(ArmResourceUtils.getSubscriptionIdFromResourceId(accountId))
+            .flatMap((subscription) => {
+                return this.azure.patch(subscription, accountId, { properties: properties.toJS() });
+            });
+    }
+
     private _loadFavoriteAccounts(): Observable<List<AccountResource>> {
         let sub = new AsyncSubject();
         storage.get(this._accountJsonFileName, (error, data) => {
@@ -280,7 +280,7 @@ export class AccountService {
             }
 
             if (Array.isArray(data)) {
-                sub.next(List(data));
+                sub.next(List(data.map(x => new AccountResource(x))));
             } else {
                 sub.next(List([]));
             }
@@ -308,6 +308,18 @@ export class AccountService {
         return sub;
     }
 
+    private _getAccount(accountId: string): Observable<AccountResource> {
+        return this.subscriptionService.get(ArmResourceUtils.getSubscriptionIdFromResourceId(accountId))
+            .flatMap((subscription) => {
+                return this.azure.get(subscription, accountId)
+                    .map(response => {
+                        const data = response.json();
+                        return this._createAccount(subscription, data);
+                    });
+            })
+            .share();
+    }
+
     private _createAccount(subscription: Subscription, data: any): AccountResource {
         return new AccountResource(Object.assign({}, data, { subscription }));
     }
diff --git a/app/services/azure-http.service.ts b/app/services/azure-http.service.ts
index cb70be7ae2..42242a7095 100644
--- a/app/services/azure-http.service.ts
+++ b/app/services/azure-http.service.ts
@@ -24,10 +24,10 @@ function mergeOptions(original: RequestOptionsArgs, method: RequestMethod, body?
 }
 
 const providersApiVersion = {
-    "Microsoft.Batch": Constants.ApiVersion.armBatch,
-    "Microsoft.ClassicStorage": Constants.ApiVersion.armClassicStorage,
-    "Microsoft.Storage": Constants.ApiVersion.armStorage,
-    "Microsoft.Compute": Constants.ApiVersion.compute,
+    "microsoft.batch": Constants.ApiVersion.armBatch,
+    "microsoft.classicstorage": Constants.ApiVersion.armClassicStorage,
+    "microsoft.storage": Constants.ApiVersion.armStorage,
+    "microsoft.compute": Constants.ApiVersion.compute,
 };
 
 type SubscriptionOrTenant = Subscription | string;
@@ -81,7 +81,7 @@ export class AzureHttpService {
         const providerSpecific = /.*\/providers\/([a-zA-Z.]*)\/.+/i;
         const match = providerSpecific.exec(uri);
         if (match && match.length > 1) {
-            const provider = match[1];
+            const provider = match[1].toLowerCase();
             if (provider in providersApiVersion) {
                 return providersApiVersion[provider];
             } else {
diff --git a/app/services/compute.service.ts b/app/services/compute.service.ts
new file mode 100644
index 0000000000..59dc3eb114
--- /dev/null
+++ b/app/services/compute.service.ts
@@ -0,0 +1,49 @@
+import { Injectable } from "@angular/core";
+import { Observable } from "rxjs";
+
+import { AccountService } from "./account.service";
+import { ArmHttpService } from "./arm-http.service";
+
+export function computeUrl(subscriptionId: string) {
+    return `subscriptions/${subscriptionId}/providers/Microsoft.Compute`;
+}
+
+export interface ComputeUsage {
+    currentValue: number;
+    limit: number;
+    name: {
+        localizedValue: string;
+        value: string;
+    };
+    unit: string;
+}
+
+@Injectable()
+export class ComputeService {
+    constructor(private arm: ArmHttpService, private accountService: AccountService) {
+    }
+
+    public getQuotas(): Observable<ComputeUsage[]> {
+        return this.accountService.currentAccount.flatMap((account) => {
+            const { subscription, location } = account;
+
+            const url = `${computeUrl(subscription.subscriptionId)}/locations/${location}/usages`;
+            return this.arm.get(url).map((response) => response.json().value);
+        }).share();
+    }
+
+    public getCoreQuota(): Observable<number> {
+        return this.getQuotas().map(x => this._getTotalRegionalQuotas(x)).share();
+    }
+
+    private _getTotalRegionalQuotas(data: ComputeUsage[]): number {
+        for (let obj of data) {
+            if (obj.name && obj.name.localizedValue && obj.name.value) {
+                if (obj.limit && obj.name.value.toLowerCase() === "cores") {
+                    return obj.limit;
+                }
+            }
+        }
+        return 100;
+    }
+}
diff --git a/app/services/core/data-cache.ts b/app/services/core/data-cache.ts
index 759cb01fc8..62e9b8bcba 100644
--- a/app/services/core/data-cache.ts
+++ b/app/services/core/data-cache.ts
@@ -151,7 +151,7 @@ export class DataCache<T> {
         if (!select) { return item; }
         const oldItem = this._items.getValue().get(key);
         if (!oldItem) { return item; }
-        let attributes = ObjectUtils.slice((item as any).toObject(), this._getAttributesList(select));
+        let attributes = ObjectUtils.slice((item as any).toJS(), this._getAttributesList(select));
         return (oldItem as any).merge(attributes);
     }
 }
diff --git a/app/services/core/index.ts b/app/services/core/index.ts
index e802859509..34472b4448 100644
--- a/app/services/core/index.ts
+++ b/app/services/core/index.ts
@@ -7,6 +7,7 @@ export * from "./rx-entity-proxy";
 export * from "./rx-list-proxy";
 export * from "./rx-storage-entity-proxy";
 export * from "./rx-storage-list-proxy";
+export * from "./rx-basic-entity-proxy";
 export * from "./targeted-data-cache";
 export * from "./long-running-action";
 export * from "./query-cache";
diff --git a/app/services/core/poll-service.ts b/app/services/core/poll-service.ts
index cb502eb1e2..88fb7c632b 100644
--- a/app/services/core/poll-service.ts
+++ b/app/services/core/poll-service.ts
@@ -1,10 +1,14 @@
+import { Injectable } from "@angular/core";
+import { Observable, Subscription } from "rxjs";
+
 import { ObjectUtils, SecureUtils } from "app/utils";
 
+@Injectable()
 export class PollService {
     private _pollTrackers: StringMap<StringMap<PollTracker>> = {};
     private _activePoolTrackers: StringMap<PollTracker> = {};
 
-    public startPoll(key: string, interval: number, callback: () => void): PollObservable {
+    public startPoll(key: string, interval: number, callback: () => Observable<any> | void): PollObservable {
         const tracker = new PollTracker(interval, callback);
         this._addTracker(key, tracker);
         return new PollObservable(this, key, tracker.id);
@@ -81,28 +85,48 @@ export class PollService {
 
 class PollTracker {
     public id: string;
-    private _currentInterval: any;
+    private _currentTimeout: any;
+    private _running: boolean = false;
+    private _obsSubscription: Subscription;
 
-    constructor(public interval: number, public callback: () => void) {
+    constructor(public interval: number, public callback: () => Observable<any> | void) {
         this.id = SecureUtils.uuid();
     }
 
     public get running(): boolean {
-        return Boolean(this._currentInterval);
+        return this._running;
     }
 
     public start() {
         this.stop();
-        this._currentInterval = setInterval(() => {
-            this.callback();
-        }, this.interval);
+        this._running = true;
+        this._waitForNextPoll();
     }
 
     public stop() {
-        if (this._currentInterval) {
-            clearInterval(this._currentInterval);
+        this._running = false;
+        if (this._currentTimeout) {
+            clearTimeout(this._currentTimeout);
+        }
+
+        if (this._obsSubscription) {
+            this._obsSubscription.unsubscribe();
         }
     }
+
+    private _waitForNextPoll() {
+        this._currentTimeout = setTimeout(() => {
+            this._currentTimeout = null;
+            const output = this.callback();
+            if (output && output instanceof Observable) {
+                this._obsSubscription = output.subscribe(() => {
+                    this._waitForNextPoll();
+                });
+            } else {
+                this._waitForNextPoll();
+            }
+        }, this.interval);
+    }
 }
 
 export class PollObservable {
diff --git a/app/services/core/rx-basic-entity-proxy.ts b/app/services/core/rx-basic-entity-proxy.ts
new file mode 100644
index 0000000000..d2269086ab
--- /dev/null
+++ b/app/services/core/rx-basic-entity-proxy.ts
@@ -0,0 +1,27 @@
+import { Type } from "@angular/core";
+import { Observable } from "rxjs";
+
+import { RxEntityProxy, RxEntityProxyConfig } from "./rx-entity-proxy";
+
+export interface RxBasicEntityProxyConfig<TParams, TEntity> extends RxEntityProxyConfig<TParams, TEntity> {
+    /**
+     * Get function(usually call the client proxy)
+     */
+    supplyData: (params: TParams) => any;
+}
+
+export class RxBasicEntityProxy<TParams, TEntity> extends RxEntityProxy<TParams, TEntity> {
+    private _supplyData: (params: TParams) => any;
+
+    constructor(
+        type: Type<TEntity>,
+        config: RxBasicEntityProxyConfig<TParams, TEntity>) {
+
+        super(type, config);
+        this._supplyData = config.supplyData;
+    }
+
+    protected getData(): Observable<any> {
+        return this._supplyData(this.params);
+    }
+}
diff --git a/app/services/core/rx-batch-list-proxy.ts b/app/services/core/rx-batch-list-proxy.ts
index 74a2009487..c626ad28a1 100644
--- a/app/services/core/rx-batch-list-proxy.ts
+++ b/app/services/core/rx-batch-list-proxy.ts
@@ -63,6 +63,7 @@ export class RxBatchListProxy<TParams, TEntity> extends RxListProxy<TParams, TEn
     private _computeOptions(options: ListOptions) {
         const newOptions = options.mergeDefault(defaultOptions);
         const attributes = newOptions.attributes;
+
         if (newOptions.maxResults) {
             attributes.maxResults = newOptions.maxResults;
         }
diff --git a/app/services/core/rx-entity-proxy.ts b/app/services/core/rx-entity-proxy.ts
index 942af0407c..8be281c831 100644
--- a/app/services/core/rx-entity-proxy.ts
+++ b/app/services/core/rx-entity-proxy.ts
@@ -3,10 +3,16 @@ import { AsyncSubject, BehaviorSubject, Observable } from "rxjs";
 
 import { LoadingStatus } from "app/components/base/loading";
 import { ServerError } from "app/models";
+import { PollObservable } from "app/services/core";
 import { HttpCode } from "app/utils/constants";
 import { RxProxyBase, RxProxyBaseConfig } from "./rx-proxy-base";
 
 export interface RxEntityProxyConfig<TParams, TEntity> extends RxProxyBaseConfig<TParams, TEntity> {
+    /**
+     * If you want to have the entity proxy poll automatically for you every given milliseconds.
+     * @default Disabled
+     */
+    poll?: number;
 }
 
 export abstract class RxEntityProxy<TParams, TEntity> extends RxProxyBase<TParams, any, TEntity> {
@@ -17,6 +23,7 @@ export abstract class RxEntityProxy<TParams, TEntity> extends RxProxyBase<TParam
     public item: Observable<TEntity>;
 
     private _itemKey = new BehaviorSubject<string>(null);
+    private _pollTracker: PollObservable;
 
     /**
      * @param _type Class for TEntity used to instantiate
@@ -27,11 +34,15 @@ export abstract class RxEntityProxy<TParams, TEntity> extends RxProxyBase<TParam
     constructor(type: Type<TEntity>, config: RxEntityProxyConfig<TParams, TEntity>) {
         super(type, config);
         this.params = config.initialParams || {} as TParams;
-        this.item = this._itemKey.map((key) => {
+        this.item = this._itemKey.distinctUntilChanged().map((key) => {
             return this.cache.items.map((items) => {
                 return items.get(key);
             });
-        }).switch();
+        }).switch().distinctUntilChanged().takeUntil(this.isDisposed);
+
+        if (config.poll) {
+            this._pollTracker = this.startPoll(5000);
+        }
     }
 
     /**
@@ -59,10 +70,31 @@ export abstract class RxEntityProxy<TParams, TEntity> extends RxProxyBase<TParam
         });
     }
 
+    /**
+     * @see RxProxyBase#dispose()
+     */
+    public dispose() {
+        super.dispose();
+        this._itemKey.complete();
+        this.stopPoll();
+    }
+
     public refresh(): Observable<any> {
         return this.fetch();
     }
 
+    /**
+     * Stop the automatically started poll if applicable
+     */
+    public stopPoll() {
+        if (this._pollTracker) {
+            this._pollTracker.destroy();
+        }
+    }
+
+    /**
+     * Abstract method implementation of what to do when the polling calls.
+     */
     protected pollRefresh() {
         return this.refresh();
     }
@@ -83,27 +115,21 @@ export abstract class RxEntityProxy<TParams, TEntity> extends RxProxyBase<TParam
 
 export function getOnceProxy<TEntity>(getProxy: RxEntityProxy<any, TEntity>): Observable<TEntity> {
     const obs = new AsyncSubject<TEntity>();
+    getProxy.stopPoll();
 
-    const errorCallback = (e) => {
-        sub.unsubscribe();
-        obs.error(e);
-        obs.complete();
-    };
-
-    const sub = getProxy.item.subscribe({
-        next: (item: TEntity) => {
-            if (item) {
-                sub.unsubscribe();
+    getProxy.fetch().subscribe({
+        next: () => {
+            getProxy.item.subscribe((item: TEntity) => {
                 obs.next(item);
                 obs.complete();
                 getProxy.dispose();
-            }
+            });
+        },
+        error: (e) => {
+            obs.error(e);
+            obs.complete();
+            getProxy.dispose();
         },
-        error: errorCallback,
-    });
-
-    getProxy.fetch().subscribe({
-        error: errorCallback,
     });
 
     return obs.asObservable();
diff --git a/app/services/core/rx-list-proxy.ts b/app/services/core/rx-list-proxy.ts
index 572ef16df4..9709b84cef 100644
--- a/app/services/core/rx-list-proxy.ts
+++ b/app/services/core/rx-list-proxy.ts
@@ -5,7 +5,6 @@ import { AsyncSubject, BehaviorSubject, Observable } from "rxjs";
 import { LoadingStatus } from "app/components/base/loading";
 import { log } from "app/utils";
 import { ListOptions, ListOptionsAttributes } from "./list-options";
-import { RxEntityProxy } from "./rx-entity-proxy";
 import { RxProxyBase, RxProxyBaseConfig } from "./rx-proxy-base";
 
 export interface RxListProxyConfig<TParams, TEntity> extends RxProxyBaseConfig<TParams, TEntity> {
@@ -20,6 +19,11 @@ export abstract class RxListProxy<TParams, TEntity> extends RxProxyBase<TParams,
     private _hasMore: BehaviorSubject<boolean> = new BehaviorSubject(true);
     private _lastRequest: { params: TParams, options: any };
 
+    /**
+     * If polling this list proxy this is a flag if it should fetch all or just the first set
+     */
+    private _pollFetchAll: boolean = false;
+
     constructor(type: Type<TEntity>, config: RxListProxyConfig<TParams, TEntity>) {
         super(type, config);
         this._options = new ListOptions(config.initialOptions || {});
@@ -27,7 +31,7 @@ export abstract class RxListProxy<TParams, TEntity> extends RxProxyBase<TParams,
         this._hasMore.next(true);
         this.hasMore = this._hasMore.asObservable();
 
-        this.items = this._itemKeys.map((itemKeys) => {
+        this.items = this._itemKeys.distinctUntilChanged().map((itemKeys) => {
             return this.cache.items.map((items) => {
                 let keys: any = itemKeys;
                 if (this._options.maxItems) {
@@ -35,7 +39,7 @@ export abstract class RxListProxy<TParams, TEntity> extends RxProxyBase<TParams,
                 }
                 return List<TEntity>(keys.map((x) => items.get(x)));
             });
-        }).switch();
+        }).switch().distinctUntilChanged().takeUntil(this.isDisposed);
 
         this.deleted.subscribe((deletedKey) => {
             this._itemKeys.next(OrderedSet<string>(this._itemKeys.value.filter((key) => key !== deletedKey)));
@@ -46,6 +50,11 @@ export abstract class RxListProxy<TParams, TEntity> extends RxProxyBase<TParams,
         });
     }
 
+    public startPoll(interval: number, fetchAll: boolean = false) {
+        this._pollFetchAll = fetchAll;
+        return super.startPoll(interval);
+    }
+
     public updateParams(params: TParams) {
         this.params = params;
         this.handleChanges(this._params, this._options);
@@ -74,49 +83,35 @@ export abstract class RxListProxy<TParams, TEntity> extends RxProxyBase<TParams,
         if (!this._hasMore.value) {
             return Observable.of({ data: [] });
         }
+        const subject = new AsyncSubject();
 
         this._tryLoadFromQueryCache(forceNew);
-
-        return this.fetchData({
-            getData: () => {
-                return this.fetchNextItems();
-            },
-            next: (response: any) => {
-                const keys = OrderedSet(this.newItems(this.processResponse(response)));
-                this._hasMore.next(this.hasMoreItems());
+        this._fetchNextKeys().subscribe({
+            next: (keys: OrderedSet<string>) => {
                 const currentKeys = this._itemKeys.value;
                 if (currentKeys.size === 0) {
                     this.cache.queryCache.cacheQuery(this._options.filter, keys, null);
                 }
-
-                const last = this._lastRequest;
-                if (last && (last.params !== this._params || last.options !== this._options)) {
-                    this._itemKeys.next(keys);
-                } else {
-                    this._itemKeys.next(OrderedSet<string>(currentKeys.concat(keys)));
-                }
-
-                this._lastRequest = { params: this._params, options: this._options };
+                subject.next(true);
+                subject.complete();
+                this._updateNewKeys(keys);
             },
             error: (error) => {
                 this._hasMore.next(false);
+                subject.error(error);
             },
         });
+
+        return subject.asObservable();
     }
 
     public fetchAll(): Observable<any> {
-        if (!this.hasMoreItems()) {
-            return Observable.of(true);
-        }
-
         const subject = new AsyncSubject();
         subject.next(true);
-        this.fetchNext().subscribe({
-            complete: () => {
-                this.fetchAll().subscribe({
-                    complete: () => subject.complete(),
-                    error: (e) => subject.error(e),
-                });
+        this._fetchRemainingKeys().subscribe({
+            next: (keys: OrderedSet<string>) => {
+                this._updateNewKeys(keys);
+                subject.complete();
             },
             error: (e) => subject.error(e),
         });
@@ -129,9 +124,8 @@ export abstract class RxListProxy<TParams, TEntity> extends RxProxyBase<TParams,
      * It should not add the new item if already present.
      * The cache system will handle updating it already.
      */
-    public loadNewItem(entityProxy: RxEntityProxy<any, TEntity>): Observable<any> {
-        const obs = entityProxy.fetch().flatMap(() => entityProxy.item.first());
-        obs.subscribe({
+    public loadNewItem(getOnceObs: Observable<TEntity>): Observable<any> {
+        getOnceObs.subscribe({
             next: (newItem) => {
                 this._addItemToList(newItem);
             }, error: (error) => {
@@ -139,8 +133,7 @@ export abstract class RxListProxy<TParams, TEntity> extends RxProxyBase<TParams,
                     { error, params: this._params, options: this._options });
             },
         });
-
-        return obs;
+        return getOnceObs;
     }
 
     /**
@@ -151,11 +144,26 @@ export abstract class RxListProxy<TParams, TEntity> extends RxProxyBase<TParams,
     public refresh(clearExistingData = true): Observable<any> {
         this.cache.queryCache.clearCache();
         this.setOptions(this._options, clearExistingData);
-        return this.fetchNext(true);
+        return this.fetchNext();
+    }
+
+    /**
+     * Refresh the list but loads all the data from the server.
+     * @param clearExistingData If set to false it will only clear the data when the new date comes in.
+     *  This means that during the loading time the items are still the old ones.
+     */
+    public refreshAll(clearExistingData = true): Observable<any> {
+        this.cache.queryCache.clearCache();
+        this.setOptions(this._options, clearExistingData);
+        return this.fetchAll();
     }
 
     protected pollRefresh() {
-        return this.refresh(false);
+        if (this._pollFetchAll) {
+            return this.refreshAll(false);
+        } else {
+            return this.refresh(false);
+        }
     }
 
     // Method to implement in the child class
@@ -165,6 +173,55 @@ export abstract class RxListProxy<TParams, TEntity> extends RxProxyBase<TParams,
     protected abstract hasMoreItems(): boolean;
     protected abstract queryCacheKey(): string;
 
+    /**
+     * Load all the remaining items from the server and return their keys
+     */
+    private _fetchRemainingKeys() {
+        if (!this.hasMoreItems()) {
+            return Observable.of(OrderedSet());
+        }
+
+        return this._fetchNextKeys().flatMap((keys: OrderedSet<string>) => {
+            return this._fetchRemainingKeys().map(remainingKeys => OrderedSet(keys.concat(remainingKeys)));
+        }).share();
+    }
+
+    /**
+     * Load the next set of items from the server and returns the keys of those items.
+     */
+    private _fetchNextKeys(): Observable<OrderedSet<string>> {
+        const subject = new AsyncSubject();
+        this.fetchData({
+            getData: () => {
+                return this.fetchNextItems();
+            },
+            next: (response: any) => {
+                const keys = OrderedSet(this.newItems(this.processResponse(response)));
+                this._hasMore.next(this.hasMoreItems()); // This NEEDS to be called after processResponse
+                subject.next(keys);
+                subject.complete();
+            },
+            error: (error) => {
+                this._hasMore.next(false);
+                subject.error(error);
+            },
+        });
+
+        return subject.asObservable();
+    }
+
+    private _updateNewKeys(newKeys: OrderedSet<string>) {
+        const currentKeys = this._itemKeys.value;
+
+        const last = this._lastRequest;
+        if (last && (last.params !== this._params || last.options !== this._options)) {
+            this._itemKeys.next(newKeys);
+        } else {
+            this._itemKeys.next(OrderedSet<string>(currentKeys.concat(newKeys)));
+        }
+
+        this._lastRequest = { params: this._params, options: this._options };
+    }
     /**
      * This will try to load keys from the query cache
      * This succeed only if there is no item currently loaded, we don't want new data and there is cached data.
@@ -204,3 +261,24 @@ export abstract class RxListProxy<TParams, TEntity> extends RxProxyBase<TParams,
         this._cache.queryCache.addKeyToQuery(null, key);
     }
 }
+
+export function getAllProxy<TEntity>(getProxy: RxListProxy<any, TEntity>): Observable<List<TEntity>> {
+    const obs = new AsyncSubject<List<TEntity>>();
+
+    getProxy.fetchAll().subscribe({
+        next: () => {
+            getProxy.items.subscribe((items: List<TEntity>) => {
+                obs.next(items);
+                obs.complete();
+                getProxy.dispose();
+            });
+        },
+        error: (e) => {
+            obs.error(e);
+            obs.complete();
+            getProxy.dispose();
+        },
+    });
+
+    return obs.asObservable();
+}
diff --git a/app/services/core/rx-proxy-base.ts b/app/services/core/rx-proxy-base.ts
index ab9fc32084..ffcaca9de5 100644
--- a/app/services/core/rx-proxy-base.ts
+++ b/app/services/core/rx-proxy-base.ts
@@ -1,5 +1,5 @@
 import { Type } from "@angular/core";
-import { BehaviorSubject, Observable, Subject, Subscription } from "rxjs";
+import { AsyncSubject, BehaviorSubject, Observable, Subject, Subscription } from "rxjs";
 
 import { LoadingStatus } from "app/components/base/loading";
 import { ServerError } from "app/models";
@@ -62,6 +62,11 @@ export abstract class RxProxyBase<TParams, TOptions extends ProxyOptions, TEntit
      */
     public newDataStatus: Observable<LoadingStatus>;
 
+    /**
+     * Sets to   after calling dispose()
+     */
+    public isDisposed: AsyncSubject<boolean>;
+
     protected _status = new BehaviorSubject<LoadingStatus>(LoadingStatus.Loading);
     protected _newDataStatus = new BehaviorSubject<LoadingStatus>(LoadingStatus.Loading);
     protected _error = new BehaviorSubject<ServerError>(null);
@@ -86,6 +91,7 @@ export abstract class RxProxyBase<TParams, TOptions extends ProxyOptions, TEntit
         this.status = this._status.asObservable();
         this.newDataStatus = this._newDataStatus.asObservable();
         this.error = this._error.asObservable();
+        this.isDisposed = new AsyncSubject();
 
         this.status.subscribe((status) => {
             if (status === LoadingStatus.Loading) {
@@ -163,7 +169,12 @@ export abstract class RxProxyBase<TParams, TOptions extends ProxyOptions, TEntit
      * otherwise internal subscribe will never get cleared and the list porxy will not get GC
      */
     public dispose() {
+        this.isDisposed.next(true);
+        this.isDisposed.complete();
         this._clearDeleteSub();
+        this._deleted.complete();
+        this._status.complete();
+        this._error.complete();
     }
 
     protected set cache(cache: DataCache<TEntity>) {
@@ -202,13 +213,14 @@ export abstract class RxProxyBase<TParams, TOptions extends ProxyOptions, TEntit
             return this._currentObservable;
         }
         this._status.next(LoadingStatus.Loading);
-
         const obs = this._currentObservable = options.getData();
         this._currentQuerySub = obs.subscribe((response) => {
-            options.next(response);
-            this._status.next(LoadingStatus.Ready);
             this.abortFetch();
+            this._status.next(LoadingStatus.Ready);
+            options.next(response);
         }, (error: ServerError) => {
+            this.abortFetch();
+
             // We need to clone the error otherwise it only logs the stacktrace
             // and not the actual error returned by the server which is not helpful
             if (error && error.status && !this._logIgnoreError.includes(error.status)) {
@@ -217,18 +229,15 @@ export abstract class RxProxyBase<TParams, TOptions extends ProxyOptions, TEntit
 
             // if we dont have a callback, or the rethrow response is true, then handle error os normal
             if (!this.config.onError || this.config.onError(error)) {
+                this._status.next(LoadingStatus.Error);
+                this._error.next(error);
                 if (options.error) {
                     options.error(error);
                 }
-
-                this._status.next(LoadingStatus.Error);
-                this._error.next(error);
             } else {
                 // error callback returned false so act like the error never happened
                 this._status.next(LoadingStatus.Ready);
             }
-
-            this.abortFetch();
         });
 
         return obs;
@@ -265,7 +274,7 @@ export abstract class RxProxyBase<TParams, TOptions extends ProxyOptions, TEntit
 
     private _key() {
         const paramsKey = ObjectUtils.serialize(this._params);
-        const optionsKey = ObjectUtils.serialize(this._options.original);
+        const optionsKey = this._options && ObjectUtils.serialize(this._options.original);
         return `${paramsKey}|${optionsKey}`;
     }
 }
diff --git a/app/services/electron/remote.service.ts b/app/services/electron/remote.service.ts
index 5cb399b873..8c9fdd1686 100644
--- a/app/services/electron/remote.service.ts
+++ b/app/services/electron/remote.service.ts
@@ -11,6 +11,11 @@ import { remote } from "electron";
  */
 @Injectable()
 export class ElectronRemote {
+
+    public get dialog(): Electron.Dialog {
+        return remote.dialog;
+    }
+
     /**
      * @returns The BrowserWindow object which this web page belongs to.
      */
diff --git a/app/services/file-service.ts b/app/services/file-service.ts
index 333b8db1cb..be3d5e9dc6 100644
--- a/app/services/file-service.ts
+++ b/app/services/file-service.ts
@@ -1,10 +1,14 @@
 import { Injectable } from "@angular/core";
-import { Observable } from "rxjs";
+import * as path from "path";
 
 import { File, ServerError } from "app/models";
-import { Constants } from "app/utils";
+import { Constants, exists } from "app/utils";
 import { BatchClientService } from "./batch-client.service";
-import { DataCache, RxBatchEntityProxy, RxBatchListProxy, RxEntityProxy, RxListProxy, TargetedDataCache } from "./core";
+import {
+    DataCache, RxBatchEntityProxy, RxBatchListProxy, RxEntityProxy, RxListProxy, TargetedDataCache, getOnceProxy,
+} from "./core";
+import { FileLoader, FileSource } from "./file";
+import { FileSystemService } from "./fs.service";
 import { ServiceBase } from "./service-base";
 
 export interface NodeFileListParams {
@@ -46,7 +50,7 @@ export class FileService extends ServiceBase {
         key: ({ jobId, taskId }) => jobId + "/" + taskId,
     }, "url");
 
-    constructor(batchService: BatchClientService) {
+    constructor(batchService: BatchClientService, private fs: FileSystemService) {
         super(batchService);
     }
 
@@ -80,13 +84,25 @@ export class FileService extends ServiceBase {
         });
     }
 
-    public getFileContentFromComputeNode(
-        poolId: string,
-        nodeId: string,
-        filename: string,
-        options: any = {}): Observable<FileContentResult> {
-
-        return this.callBatchClient((client) => client.file.getComputeNodeFile(poolId, nodeId, filename, options));
+    public fileFromNode(poolId: string, nodeId: string, filename: string): FileLoader {
+        return new FileLoader({
+            filename: filename,
+            source: FileSource.node,
+            fs: this.fs,
+            properties: () => {
+                return getOnceProxy(this.getFilePropertiesFromComputeNode(poolId, nodeId, filename));
+            },
+            content: (options) => {
+                let ocpRange = "";
+                if (exists(options.rangeStart) && exists(options.rangeEnd)) {
+                    ocpRange = `bytes=${options.rangeStart}-${options.rangeEnd}`;
+                }
+                const batchOptions = { fileGetFromTaskOptions: { ocpRange } };
+                return this.callBatchClient((client) => {
+                    return client.file.getComputeNodeFile(poolId, nodeId, filename, batchOptions);
+                });
+            },
+        });
     }
 
     public getFilePropertiesFromComputeNode(
@@ -122,13 +138,26 @@ export class FileService extends ServiceBase {
         });
     }
 
-    public getFileContentFromTask(
-        jobId: string,
-        taskId: string,
-        filename: string,
-        options: any = {}): Observable<FileContentResult> {
-
-        return this.callBatchClient((client) => client.file.getTaskFile(jobId, taskId, filename, options));
+    public fileFromTask(jobId: string, taskId: string, filename: string): FileLoader {
+        return new FileLoader({
+            filename: filename,
+            source: FileSource.task,
+            groupId: path.join(jobId, taskId),
+            fs: this.fs,
+            properties: () => {
+                return getOnceProxy(this.getFilePropertiesFromTask(jobId, taskId, filename));
+            },
+            content: (options) => {
+                let ocpRange = "";
+                if (exists(options.rangeStart) && exists(options.rangeEnd)) {
+                    ocpRange = `bytes=${options.rangeStart}-${options.rangeEnd}`;
+                }
+                const batchOptions = { fileGetFromComputeNodeOptions: { ocpRange } };
+                return this.callBatchClient((client) => {
+                    return client.file.getTaskFile(jobId, taskId, filename, batchOptions);
+                });
+            },
+        });
     }
 
     public getFilePropertiesFromTask(
diff --git a/app/services/file/file-loader.ts b/app/services/file/file-loader.ts
new file mode 100644
index 0000000000..ed4914c11b
--- /dev/null
+++ b/app/services/file/file-loader.ts
@@ -0,0 +1,87 @@
+import * as path from "path";
+import { Observable } from "rxjs";
+
+import { File } from "app/models";
+import { FileSystemService } from "../fs.service";
+
+export type PropertiesFunc = () => Observable<File>;
+export type ContentFunc = (options: FileLoadOptions) => Observable<FileLoadResult>;
+
+export interface FileLoaderConfig {
+    filename: string;
+    source: FileSource;
+    groupId?: string;
+    fs: FileSystemService;
+    properties: PropertiesFunc;
+    content: ContentFunc;
+}
+
+export interface FileLoadOptions {
+    rangeStart?: number;
+    rangeEnd?: number;
+}
+
+export interface FileLoadResult {
+    content: string;
+}
+
+export type FileSource = "task" | "node" | "blob";
+export const FileSource = {
+    task: "task" as FileSource,
+    node: "node" as FileSource,
+    blob: "blob" as FileSource,
+};
+
+export class FileLoader {
+    public readonly filename: string;
+    public readonly source: FileSource;
+
+    /**
+     * Optional name of subfolder to prevent collision with caches
+     */
+    public readonly groupId: string;
+
+    private _fs: FileSystemService;
+    private _properties: PropertiesFunc;
+    private _content: ContentFunc;
+
+    constructor(config: FileLoaderConfig) {
+        this.filename = config.filename;
+        this._properties = config.properties;
+        this._content = config.content;
+        this.groupId = config.groupId || "";
+        this.source = config.source;
+        this._fs = config.fs;
+    }
+
+    public properties(): Observable<File> {
+        return this._properties();
+    }
+
+    public content(options: FileLoadOptions = {}): Observable<FileLoadResult> {
+        return this._content(options);
+    }
+
+    public download(dest: string): Observable<string> {
+        const obs = this.content().concatMap((result) => {
+            return this._fs.saveFile(dest, result.content);
+        }).share();
+        obs.subscribe();
+        return obs;
+    }
+
+    /**
+     * This will download the file at a prefix location in the temp folder
+     * @returns observable that resolve the path of the cached file when done caching
+     */
+    public cache(): Observable<string> {
+        const destination = path.join(this._fs.commonFolders.temp, this.source, this.groupId, this.filename);
+        return Observable.fromPromise(this._fs.exists(destination)).flatMap((exists) => {
+            if (exists) {
+                return Observable.of(destination);
+            } else {
+                return this.download(destination);
+            }
+        }).share();
+    }
+}
diff --git a/app/services/file/index.ts b/app/services/file/index.ts
new file mode 100644
index 0000000000..21789dda4c
--- /dev/null
+++ b/app/services/file/index.ts
@@ -0,0 +1 @@
+export * from "./file-loader";
diff --git a/app/services/fs.service.ts b/app/services/fs.service.ts
index d67dc4b582..751d046988 100644
--- a/app/services/fs.service.ts
+++ b/app/services/fs.service.ts
@@ -4,7 +4,7 @@ import * as fs from "fs";
 import * as mkdirp from "mkdirp";
 import * as path from "path";
 
-const {app} = remote;
+const { app } = remote;
 import { log } from "app/utils";
 
 export interface CommonFolders {
@@ -26,6 +26,18 @@ export class FileSystemService {
         };
     }
 
+    /**
+     * Check if a file exists async
+     * @param path Full path to the file
+     */
+    public exists(path: string): Promise<boolean> {
+        return new Promise<boolean>((resolve, reject) => {
+            fs.exists(path, (exists) => {
+                resolve(exists);
+            });
+        });
+    }
+
     /**
      * This make sure the given dir exists. Will recusrivelly create any missing directory.
      * @param directory: Path that we expect to exists
@@ -42,13 +54,12 @@ export class FileSystemService {
     /**
      * Save the given content to the given location.
      *
-     * @param filename: Name of the file(without directory)
+     * @param filename: Full path to the file
      * @param content: Content of the file
-     * @param directory: Where should the file be saved
      */
-    public saveFile(filename: string, content: string, directory: string): Promise<string> {
-        return this.ensureDir(directory).then(() => {
-            return this._writeFile(path.join(directory, filename), content);
+    public saveFile(dest: string, content: string): Promise<string> {
+        return this.ensureDir(path.dirname(dest)).then(() => {
+            return this._writeFile(dest, content);
         });
     }
 
diff --git a/app/services/index.ts b/app/services/index.ts
index ec56b80f5a..e4232bd063 100644
--- a/app/services/index.ts
+++ b/app/services/index.ts
@@ -3,12 +3,14 @@ export * from "./application-service";
 export * from "./autoscale-formula.service";
 export * from "./azure-http.service";
 export * from "./arm-http.service";
+export * from "./compute.service";
 export * from "./electron";
 export * from "./file-service";
 export * from "./fs.service";
 export * from "./github-data.service";
 export * from "./http-upload-service";
 export * from "./job-service";
+export * from "./job-hook-task.service";
 export * from "./local-file-storage.service";
 export * from "./pool-service";
 export * from "./node-service";
@@ -21,7 +23,9 @@ export * from "./subscription.service";
 export * from "./task-service";
 export * from "./vm-size.service";
 export * from "./adal";
+export * from "./python-rpc";
 export * from "./batch-client.service";
+export * from "./storage-account.service";
 export * from "./storage-client.service";
 export * from "./predefined-formula.service";
 
diff --git a/app/services/job-hook-task.service.ts b/app/services/job-hook-task.service.ts
new file mode 100644
index 0000000000..87bc063aca
--- /dev/null
+++ b/app/services/job-hook-task.service.ts
@@ -0,0 +1,30 @@
+import { Injectable } from "@angular/core";
+
+import {  JobHookTask } from "app/models";
+import { BatchClientService } from "./batch-client.service";
+import { RxBatchListProxy, RxListProxy, TargetedDataCache } from "./core";
+import { ServiceBase } from "./service-base";
+
+export interface JobHookTaskListParams {
+    jobId?: string;
+}
+
+@Injectable()
+export class JobHookTaskService extends ServiceBase {
+    private _cache = new TargetedDataCache<JobHookTaskListParams, JobHookTask>({
+        key: ({ jobId }) => jobId,
+    }, "nodeUrl");
+
+    constructor(batchService: BatchClientService) {
+        super(batchService);
+    }
+
+    public list(initialOptions: any = {}): RxListProxy<JobHookTaskListParams, JobHookTask> {
+        return new RxBatchListProxy<JobHookTaskListParams, JobHookTask>(JobHookTask, this.batchService, {
+            cache: ({ jobId }) => this._cache.getCache({ jobId }),
+            proxyConstructor: (client, params, options) => client.job.listHookTasks(params.jobId, options),
+            initialOptions,
+            initialParams: {jobId: null},
+        });
+    }
+}
diff --git a/app/services/job-service.ts b/app/services/job-service.ts
index 68ee0d614d..4835f9a1de 100644
--- a/app/services/job-service.ts
+++ b/app/services/job-service.ts
@@ -3,7 +3,7 @@ import { Observable, Subject } from "rxjs";
 
 import { Job } from "app/models";
 import { JobCreateDto } from "app/models/dtos";
-import { ModelUtils, log } from "app/utils";
+import { Constants, ModelUtils, log } from "app/utils";
 import { List } from "immutable";
 import { BatchClientService } from "./batch-client.service";
 import { DataCache, RxBatchEntityProxy, RxBatchListProxy, RxEntityProxy, RxListProxy, getOnceProxy } from "./core";
@@ -20,9 +20,9 @@ export class JobService extends ServiceBase {
      * Used to notify the list of a new item
      */
     public onJobAdded = new Subject<string>();
+    public cache = new DataCache<Job>();
 
     private _basicProperties: string = "id,displayName,state,creationTime,poolInfo";
-    private _cache = new DataCache<Job>();
 
     constructor(batchService: BatchClientService) {
         super(batchService);
@@ -34,7 +34,7 @@ export class JobService extends ServiceBase {
 
     public list(initialOptions: any = {}): RxListProxy<{}, Job> {
         return new RxBatchListProxy<{}, Job>(Job, this.batchService, {
-            cache: () => this._cache,
+            cache: () => this.cache,
             proxyConstructor: (client, params, options) => client.job.list(options),
             initialOptions,
         });
@@ -42,11 +42,12 @@ export class JobService extends ServiceBase {
 
     public get(jobId: string, options: any = {}): RxEntityProxy<JobParams, Job> {
         return new RxBatchEntityProxy(Job, this.batchService, {
-            cache: () => this._cache,
+            cache: () => this.cache,
             getFn: (client, params: JobParams) => {
                 return client.job.get(params.id, options);
             },
             initialParams: { id: jobId },
+            poll: Constants.PollRate.entity,
         });
     }
 
diff --git a/app/services/node-service.ts b/app/services/node-service.ts
index ec5c9cf657..0e22ee147d 100644
--- a/app/services/node-service.ts
+++ b/app/services/node-service.ts
@@ -5,9 +5,9 @@ import { AsyncSubject, Observable } from "rxjs";
 import { BackgroundTaskService } from "app/components/base/background-task";
 import { Node, NodeAgentSku, NodeConnectionSettings, NodeState } from "app/models";
 import { ArrayUtils, ObservableUtils, log } from "app/utils";
+import { Constants } from "app/utils";
 import { FilterBuilder } from "app/utils/filter-builder";
 import { BatchClientService } from "./batch-client.service";
-
 import {
     DataCache, ListOptionsAttributes, RxBatchEntityProxy, RxBatchListProxy, RxEntityProxy, RxListProxy,
     TargetedDataCache, getOnceProxy,
@@ -79,6 +79,7 @@ export class NodeService extends ServiceBase {
                 return client.node.get(params.poolId, params.id, options);
             },
             initialParams: { poolId: initialPoolId, id: initialNodeId },
+            poll: Constants.PollRate.entity,
         });
     }
 
diff --git a/app/services/pool-service.ts b/app/services/pool-service.ts
index 2a326a4702..715c8ed68e 100644
--- a/app/services/pool-service.ts
+++ b/app/services/pool-service.ts
@@ -2,8 +2,8 @@ import { Injectable } from "@angular/core";
 import { Observable, Subject } from "rxjs";
 
 import { Pool } from "app/models";
-import { PoolCreateDto, PoolEnableAutoScaleDto } from "app/models/dtos";
-import { ModelUtils, log } from "app/utils";
+import { PoolCreateDto, PoolEnableAutoScaleDto, PoolResizeDto } from "app/models/dtos";
+import { Constants, ModelUtils, log } from "app/utils";
 import { List } from "immutable";
 import { BatchClientService } from "./batch-client.service";
 import { DataCache, RxBatchEntityProxy, RxBatchListProxy, RxEntityProxy, RxListProxy, getOnceProxy } from "./core";
@@ -51,6 +51,7 @@ export class PoolService extends ServiceBase {
             cache: () => this._cache,
             getFn: (client, params: PoolParams) => client.pool.get(params.id, options),
             initialParams: { id: poolId },
+            poll: Constants.PollRate.entity,
         });
     }
 
@@ -79,8 +80,8 @@ export class PoolService extends ServiceBase {
         this._cache.deleteItemByKey(poolId);
     }
 
-    public resize(poolId: string, targetDedicated: number, options: any = {}) {
-        return this.callBatchClient((client) => client.pool.resize(poolId, targetDedicated, options), (error) => {
+    public resize(poolId: string, target: PoolResizeDto, options: any = {}) {
+        return this.callBatchClient((client) => client.pool.resize(poolId, target.toJS(), options), (error) => {
             log.error("Error resizing pool: " + poolId, Object.assign({}, error));
         });
     }
diff --git a/app/services/python-rpc/index.ts b/app/services/python-rpc/index.ts
new file mode 100644
index 0000000000..9f510ad829
--- /dev/null
+++ b/app/services/python-rpc/index.ts
@@ -0,0 +1 @@
+export * from "./python-rpc.service";
diff --git a/app/services/python-rpc/python-rpc.service.ts b/app/services/python-rpc/python-rpc.service.ts
new file mode 100644
index 0000000000..8e5636c349
--- /dev/null
+++ b/app/services/python-rpc/python-rpc.service.ts
@@ -0,0 +1,175 @@
+import { Injectable } from "@angular/core";
+import { SecureUtils, log } from "app/utils";
+import { AsyncSubject, Observable } from "rxjs";
+
+export interface JsonRpcRequest {
+    jsonrpc: string;
+    id: string;
+    method: string;
+    params: any[];
+}
+
+export interface JsonRpcError {
+    code: string;
+    message: string;
+    data: string;
+}
+
+export interface JsonRpcResponse {
+    jsonrpc: string;
+    id: string;
+    result: any;
+    error: JsonRpcError;
+}
+
+interface RequestContainer {
+    request: JsonRpcRequest;
+    subject: AsyncSubject<any>;
+
+    /**
+     * setTimeout id to clear the request if it timeout
+     */
+    timeout: any;
+}
+
+const requestTimeout = 10000;
+
+@Injectable()
+export class PythonRpcService {
+    private _socket: WebSocket;
+    private _ready = new AsyncSubject();
+    private _currentRequests: StringMap<RequestContainer> = {};
+
+    /**
+     * Initialize the connection to the rpc server
+     */
+    public init() {
+        this.resetConnection();
+    }
+
+    /**
+     * Connect to the rpc server using websocket.
+     * Call this if the connection got cut to try again.
+     */
+    public resetConnection() {
+        this._ready = new AsyncSubject();
+        this._currentRequests = {};
+        const socket = this._socket = new WebSocket("ws://127.0.0.1:8765/ws");
+
+        socket.onopen = (event: Event) => {
+            this._ready.next(true);
+            this._ready.complete();
+        };
+
+        socket.onmessage = (event: MessageEvent) => {
+            const response = JSON.parse(event.data);
+            this._processResponse(response);
+        };
+    }
+
+    /**
+     * Call a procedure on the python.
+     * @param method Name of the method registered in the python
+     * @param params Params for the method
+     */
+    public call(method: string, params: any[]): Observable<any> {
+        const request = this._buildRequest(method, params);
+        const container = this._registerRequest(request);
+
+        this._ready.subscribe(() => {
+            this._socket.send(JSON.stringify(request));
+        });
+
+        return container.subject.asObservable();
+    }
+
+    /**
+     * Build the JsonRpcRequest from the procedure name and parameters.
+     * @param method Name of the procedure in the python controller
+     * @param params Params for the procedure
+     */
+    private _buildRequest(method: string, params: any[]): JsonRpcRequest {
+        return {
+            jsonrpc: "2.0",
+            id: SecureUtils.uuid(),
+            method,
+            params,
+        };
+    }
+
+    /**
+     * Register the request as a pending request.
+     * @param request Request to be sent to the rpc server
+     */
+    private _registerRequest(request: JsonRpcRequest): RequestContainer {
+        const container = this._currentRequests[request.id] = {
+            request,
+            subject: new AsyncSubject(),
+            timeout: setTimeout(() => {
+                this._timeoutRequest(request.id);
+            }, requestTimeout),
+        };
+
+        return container;
+    }
+
+    /**
+     * Process the response returned by the rpc server.
+     * It will find the corresponding request and notify the caller of the outcome.
+     * @param response Response returned by the rpc server
+     */
+    private _processResponse(response: JsonRpcResponse) {
+        const request = this._getRequestForResponse(response);
+        if (!request) {
+            return;
+        }
+        if (response.error) {
+            request.subject.error(response.error);
+        } else {
+            request.subject.next(response.result);
+            request.subject.complete();
+        }
+        delete this._currentRequests[response.id];
+    }
+
+    /**
+     * Get the request container created for the requestId. If there is any errors it will log and return null.
+     * @param response Response returned by the server
+     */
+    private _getRequestForResponse(response: JsonRpcResponse): RequestContainer {
+        const requestId = response.id;
+        if (!requestId) {
+            log.error("Invalid message sent by the rpc server", response);
+            return null;
+        }
+        const request = this._currentRequests[requestId];
+        if (!request) {
+            log.error(`Request with id ${requestId} doesn't exists. Maybe it timed out!`, response);
+            return null;
+        }
+        if (!response.result && !response.error) {
+            log.error(`Response should have either result or error but none were provided`,
+                { response, request: request.request });
+            return null;
+        }
+
+        return request;
+    }
+
+    /**
+     * Remove the request from the list of pending request and log a timeout.
+     * @param requestId Id of the request
+     */
+    private _timeoutRequest(requestId: string) {
+        const request = this._currentRequests[requestId];
+        if (!request) {
+            return;
+        }
+        delete this._currentRequests[requestId];
+
+        request.subject.error({
+            code: 408,
+            message: `Rpc request timeout after ${requestTimeout}ms`,
+        });
+    }
+}
diff --git a/app/services/storage-account.service.ts b/app/services/storage-account.service.ts
new file mode 100644
index 0000000000..6d2fac0c4e
--- /dev/null
+++ b/app/services/storage-account.service.ts
@@ -0,0 +1,55 @@
+import { Injectable } from "@angular/core";
+import { RequestOptions, URLSearchParams } from "@angular/http";
+import { List } from "immutable";
+import { Observable } from "rxjs";
+
+import { StorageAccount } from "app/models";
+import { AzureHttpService } from "./azure-http.service";
+import { SubscriptionService } from "./subscription.service";
+
+function getSubscriptionIdFromAccountId(accountId: string) {
+    const regex = /subscriptions\/(.*)\/resourceGroups/;
+    const out = regex.exec(accountId);
+
+    if (!out || out.length < 2) {
+        return null;
+    } else {
+        return out[1];
+    }
+}
+
+@Injectable()
+export class StorageAccountService {
+    constructor(private azure: AzureHttpService, private subscriptionService: SubscriptionService) { }
+
+    public get(accountId: string): Observable<StorageAccount> {
+        return this.subscriptionService.get(getSubscriptionIdFromAccountId(accountId))
+            .flatMap((subscription) => {
+                return this.azure.get(subscription, accountId)
+                    .map(response => {
+                        const data = response.json();
+                        return new StorageAccount(data);
+                    });
+            })
+            .share();
+    }
+
+    public list(subscriptionId: string): Observable<List<StorageAccount>> {
+        const search = new URLSearchParams();
+        search.set("$filter",
+            "resourceType eq 'Microsoft.Storage/storageAccounts'" +
+            "or resourceType eq 'Microsoft.ClassicStorage/storageAccounts'");
+        const options = new RequestOptions({ search });
+
+        return this.subscriptionService.get(subscriptionId)
+            .flatMap((subscription) => {
+                return this.azure.get(subscription, `/subscriptions/${subscriptionId}/resources`, options)
+                    .map(response => {
+                        return List(response.json().value.map((data) => {
+                            return new StorageAccount(data);
+                        }));
+                    });
+            })
+            .share();
+    }
+}
diff --git a/app/services/storage-client.service.ts b/app/services/storage-client.service.ts
index 902afde4b8..225031a8a4 100644
--- a/app/services/storage-client.service.ts
+++ b/app/services/storage-client.service.ts
@@ -2,7 +2,7 @@ import { Injectable } from "@angular/core";
 import { StorageAccountSharedKeyOptions, StorageClientProxyFactory } from "client/api";
 import { Observable } from "rxjs";
 
-import { AutoStorageAccount, StorageKeys } from "app/models";
+import { AutoStorageAccount, StorageKeys, StorageKeysAttributes } from "app/models";
 import { ArmResourceUtils } from "app/utils";
 import { AccountService } from "./account.service";
 import { ArmHttpService } from "./arm-http.service";
@@ -66,8 +66,13 @@ export class StorageClientService {
             } else {
                 const url = `${settings.storageAccountId}/listkeys`;
                 return this.arm.post(url, JSON.stringify({}))
-                    .map(response => new StorageKeys(response.json()))
-                    .cascade((keys) => {
+                    .map(response => this._parseKeysReponse(response.json()))
+                    .cascade((keys: StorageKeys) => {
+                        // bail out if we didn't get any keys
+                        if (!keys.primaryKey && !keys.secondaryKey) {
+                            throw new Error(`Failed to return access keys for: ${settings.storageAccountId}`);
+                        }
+
                         cachedItem.keys = keys;
                         return Observable.of(this.getForSharedKey({
                             account: cachedItem.storageAccountName,
@@ -89,6 +94,26 @@ export class StorageClientService {
         }
     }
 
+    /**
+     * Classic and Standard storage API's return different payloads for the /listkeys operation
+     * @param responseJson - response JSON from the /listkeys operation
+     */
+    private _parseKeysReponse(responseJson) {
+        if (responseJson.primaryKey) {
+            // classic storage
+            return new StorageKeys(responseJson);
+        } else {
+            // Probably new storage account type, StorageKeys is immutable so construct correct JSON format.
+            const keyJson: StorageKeysAttributes = {} as any;
+            if (Array.isArray(responseJson.keys)) {
+                keyJson.primaryKey = responseJson.keys[0] ? responseJson.keys[0].value : null;
+                keyJson.secondaryKey = responseJson.keys[1] ? responseJson.keys[1].value : null;
+            }
+
+            return new StorageKeys(keyJson);
+        }
+    }
+
     /**
      * Get the name of the storage account from the account id
      * @param [storageAccountId] the full resource id for the storage account.
diff --git a/app/services/storage.service.ts b/app/services/storage.service.ts
index 4653faec3e..471d474715 100644
--- a/app/services/storage.service.ts
+++ b/app/services/storage.service.ts
@@ -1,7 +1,9 @@
 import { Injectable } from "@angular/core";
+import * as path from "path";
 import { Observable } from "rxjs";
 
 import { File, ServerError } from "app/models";
+import { FileSystemService } from "app/services";
 import { Constants, StorageUtils } from "app/utils";
 import {
     DataCache,
@@ -10,7 +12,9 @@ import {
     RxStorageEntityProxy,
     RxStorageListProxy,
     TargetedDataCache,
+    getOnceProxy,
 } from "./core";
+import { FileLoadOptions, FileLoader, FileSource } from "./file";
 import { StorageClientService } from "./storage-client.service";
 
 export interface BlobListParams {
@@ -39,7 +43,7 @@ export class StorageService {
         key: ({ jobId, taskId, outputKind }) => jobId + "/" + taskId + "/" + outputKind,
     }, "url");
 
-    constructor(private storageClient: StorageClientService) {
+    constructor(private storageClient: StorageClientService, private fs: FileSystemService) {
     }
 
     public getBlobFileCache(params: BlobListParams): DataCache<File> {
@@ -61,7 +65,7 @@ export class StorageService {
 
         const initialOptions: any = {};
         return new RxStorageListProxy<BlobListParams, File>(File, this.storageClient, {
-            cache: (params) =>  this.getBlobFileCache(params),
+            cache: (params) => this.getBlobFileCache(params),
             getData: (client, params, options) => {
                 // the prefix of the blob, eg: 10011/$TaskOutput/
                 const prefix = `${params.taskId}/${params.outputKind}/`;
@@ -72,7 +76,7 @@ export class StorageService {
                     return client.listBlobsWithPrefix(safeContainerName, prefix, filter, null, initialOptions);
                 });
             },
-            initialParams: { jobId: jobIdParam, taskId: taskIdParam, outputKind: outputKindParam},
+            initialParams: { jobId: jobIdParam, taskId: taskIdParam, outputKind: outputKindParam },
             initialOptions,
             logIgnoreError: storageIgnoredErrors,
             onError: onError,
@@ -118,11 +122,23 @@ export class StorageService {
      * @param blobName - Fully prefixed blob path: "1001/$TaskOutput/myblob.txt"
      * @param options - Optional parameters, rangeStart & rangeEnd for partial contents
      */
-    public getBlobContent(jobId: string, blobName: string, options: any = {}): Observable<BlobContentResult> {
-        return this._callStorageClient((client) => {
-            return StorageUtils.getSafeContainerName(jobId).then((safeContainerName) => {
-                return client.getBlobContent(safeContainerName, blobName, options);
-            });
+    public blobContent(jobId: string, taskId: string, outputKind: string, filename: string): FileLoader {
+        return new FileLoader({
+            filename: filename,
+            source: FileSource.blob,
+            groupId: path.join(jobId, taskId, outputKind),
+            fs: this.fs,
+            properties: () => {
+                return getOnceProxy(this.getBlobProperties(jobId, taskId, outputKind, filename));
+            },
+            content: (options: FileLoadOptions) => {
+                return this._callStorageClient((client) => {
+                    return StorageUtils.getSafeContainerName(jobId).then((safeContainerName) => {
+                        const blobName = `${taskId}/${outputKind}/${filename}`;
+                        return client.getBlobContent(safeContainerName, blobName, options);
+                    });
+                });
+            },
         });
     }
 
diff --git a/app/services/task-service.ts b/app/services/task-service.ts
index 6ed723e84e..4e2aa8589d 100644
--- a/app/services/task-service.ts
+++ b/app/services/task-service.ts
@@ -2,9 +2,9 @@ import { Injectable } from "@angular/core";
 import { List } from "immutable";
 import { Observable, Subject } from "rxjs";
 
-import { SubtaskInformation, Task } from "app/models";
+import { SubtaskInformation, Task, TaskState } from "app/models";
 import { TaskCreateDto } from "app/models/dtos";
-import { log } from "app/utils";
+import { Constants, log } from "app/utils";
 import { FilterBuilder } from "app/utils/filter-builder";
 import { BatchClientService } from "./batch-client.service";
 import {
@@ -15,6 +15,7 @@ import {
     RxEntityProxy,
     RxListProxy,
     TargetedDataCache,
+    getAllProxy,
     getOnceProxy,
 } from "./core";
 import { ServiceBase } from "./service-base";
@@ -74,6 +75,15 @@ export class TaskService extends ServiceBase {
         });
     }
 
+    public listAll(jobId: string, options: TaskListOptions): Observable<List<Task>> {
+        return getAllProxy(this.list(jobId, options));
+    }
+
+    public countTasks(jobId: string, state: TaskState): Observable<number> {
+        const filter = FilterBuilder.prop("state").eq(state).toOData();
+        return this.listAll(jobId, { filter, select: "id,state" }).map(tasks => tasks.size).share();
+    }
+
     public listSubTasks(
         initialJobId: string,
         initialTaskId: string,
@@ -96,6 +106,7 @@ export class TaskService extends ServiceBase {
                 return client.task.get(params.jobId, params.id, options);
             },
             initialParams: { id: taskId, jobId: initialJobId },
+            poll: Constants.PollRate.entity,
         });
     }
 
diff --git a/app/services/vm-size.service.ts b/app/services/vm-size.service.ts
index b47750b0b0..b546cfcaaa 100644
--- a/app/services/vm-size.service.ts
+++ b/app/services/vm-size.service.ts
@@ -7,12 +7,9 @@ import { AccountResource, VmSize } from "app/models";
 import { StringUtils, log } from "app/utils";
 import { AccountService } from "./account.service";
 import { ArmHttpService } from "./arm-http.service";
+import { computeUrl } from "./compute.service";
 import { GithubDataService } from "./github-data.service";
 
-export function computeUrl(subscriptionId: string) {
-    return `subscriptions/${subscriptionId}/providers/Microsoft.Compute`;
-}
-
 const excludedVmsSizesPath = "data/vm-sizes.json";
 
 interface VmSizeData {
diff --git a/app/styles/account/browse.scss b/app/styles/account/browse.scss
index 474fc72b5a..e701d477ed 100644
--- a/app/styles/account/browse.scss
+++ b/app/styles/account/browse.scss
@@ -10,55 +10,16 @@ bl-account-home {
 }
 
 bl-account-list {
-    .subscription {
-        > .subscription-details {
-            display: flex;
-            align-items: center;
-            cursor: pointer;
-
-            &:hover {
-                background-color: $altoGray;
-            }
-
-            .icon {
-                color: map-get($md-prussian-blue, 300);
-                margin: 0 10px;
-                font-size: 2em;
-                width: 26px;
-            }
-        }
-
-        > .accounts {
-            position: relative;
-            background: #f1f1f1;
-            min-height: 40px;
-
-            .no-item-message {
-                height: 40px;
-                padding: 5px 0;
-                font-size: 14px;
-            }
-
-            .quick-list-item {
-                padding-left: 20px;
-            }
-            border-top: 1px solid #e5e5e5;
-            border-bottom: 1px solid #e5e5e5;
-        }
-    }
-}
-
-bl-account-list, bl-account-fav-list {
     .fa-star {
         font-size: 2em;
         color: #d5d5d5;
 
         &:hover {
-            color: map-get($md-prussian-blue, 100);
+            color: map-get($primary, 100);
         }
 
         &.favorite {
-            color: map-get($md-prussian-blue, 400);
+            color: map-get($primary, 400);
         }
     }
 }
diff --git a/app/styles/base/advanced-filter.scss b/app/styles/base/advanced-filter.scss
index 7fb99fdeea..c69bf9e1f7 100644
--- a/app/styles/base/advanced-filter.scss
+++ b/app/styles/base/advanced-filter.scss
@@ -8,7 +8,7 @@
         .label {
             padding: 2px 5px;
             background: $alto;
-            color: map-get($md-prussian-blue, 400);
+            color: map-get($primary, 400);
         }
 
         .value {
diff --git a/app/styles/base/breadcrumbs.scss b/app/styles/base/breadcrumbs.scss
index 02349d0120..a7a4892ae1 100644
--- a/app/styles/base/breadcrumbs.scss
+++ b/app/styles/base/breadcrumbs.scss
@@ -3,8 +3,8 @@ bl-breadcrumb-group {
     $separation: 3px;
     $height: 28px;
     $half-height: $height / 2;
-    $color: lighten($blue-lighter, 5%);
-    $hover-color: $blue-light;
+    $color: map-get($primary, 500);
+    $hover-color: map-get($primary, 600);
     display: block;
     height: $height;
 
diff --git a/app/styles/base/buttons.scss b/app/styles/base/buttons.scss
index df194d8998..3bc51aae9e 100644
--- a/app/styles/base/buttons.scss
+++ b/app/styles/base/buttons.scss
@@ -6,7 +6,7 @@ bl-submit-btn {
         }
 
         .fa-check {
-            color: $green-dark;
+            color: map-get($success, 800);
             overflow: hidden;
         }
 
@@ -37,6 +37,10 @@ bl-loading-button {
     }
 }
 
+.mat-mini-fab[disabled] {
+    background-color: rgba(225, 225, 225, 1) !important;
+}
+
 @keyframes spin-left-then-right {
     0% {
         transform: rotate(0);
diff --git a/app/styles/base/forms.scss b/app/styles/base/forms.scss
index 88eb8a9c96..414c4aa322 100644
--- a/app/styles/base/forms.scss
+++ b/app/styles/base/forms.scss
@@ -86,7 +86,7 @@ fieldset {
         background-color: $silver-grey;
 
         i {
-            color: map-get($md-prussian-blue, 400);
+            color: map-get($primary, 400);
         }
     }
 
@@ -244,7 +244,7 @@ bl-complex-form {
     > .form-footer {
         height: $footer-height;
 
-        // background: map-get($md-prussian-blue, 500);
+        // background: map-get($primary, 500);
         padding: 5px;
         display: flex;
         align-items: center;
diff --git a/app/styles/base/graphs/gauge.scss b/app/styles/base/graphs/gauge.scss
index 45a1ba01f1..50b76eeb51 100644
--- a/app/styles/base/graphs/gauge.scss
+++ b/app/styles/base/graphs/gauge.scss
@@ -2,7 +2,7 @@ bl-gauge {
     display: block;
 
     .chart-filled {
-        fill: map-get($md-prussian-blue, 400);
+        fill: map-get($primary, 400);
     }
 
     .chart-empty {
diff --git a/app/styles/base/layout.scss b/app/styles/base/layout.scss
index de6acf1da2..a9739aa6f0 100644
--- a/app/styles/base/layout.scss
+++ b/app/styles/base/layout.scss
@@ -210,7 +210,7 @@ footer {
         position: absolute;
         left: 0;
         top: 0;
-        background-color: $fuzzyWuzzyBrown;
+        background-color: map-get($danger, 500);
         border-radius: 10px;
         width: 18px;
         height: 18px;
@@ -219,10 +219,13 @@ footer {
 
 .context-button-bar {
     position: relative !important;
-    margin-top: -34px !important;
-    margin-right: 10px !important;
+    margin: -35px 10px 0 !important;
     float: right;
 
+    bl-action-btn {
+        line-height: 31px;
+    }
+
     button {
         margin-left: 5px;
     }
@@ -249,7 +252,6 @@ footer {
 }
 
 .noselect {
-    -webkit-user-select: none;
     user-select: none;
 }
 
@@ -258,7 +260,7 @@ footer {
 }
 
 .warn-text {
-    color: $yellow-dark;
+    color: map-get($warn, 800);
 }
 
 .route-home {
@@ -314,7 +316,7 @@ ul.list-point {
         flex-direction: column;
         align-items: center;
         justify-content: center;
-        color: map-get($md-prussian-blue, 400);
+        color: map-get($primary, 400);
         cursor: pointer;
 
         &:hover {
@@ -342,7 +344,7 @@ ul.list-point {
 
         &:hover {
             background: $header-hover;
-            color: map-get($md-prussian-blue, 300);
+            color: map-get($primary, 300);
         }
 
         > .fa {
diff --git a/app/styles/base/list.scss b/app/styles/base/list.scss
index 2851805ac1..0896ae6296 100644
--- a/app/styles/base/list.scss
+++ b/app/styles/base/list.scss
@@ -46,7 +46,7 @@ bl-quick-list {
         white-space: nowrap;
 
         &.selected {
-            background-color: map-get($md-prussian-blue, 100);
+            background-color: map-get($primary, 100);
 
             p {
                 color: $mineShaftGray;
@@ -54,7 +54,7 @@ bl-quick-list {
         }
 
         &.focused {
-            background-color: map-get($md-prussian-blue, 200);
+            background-color: map-get($primary, 200);
         }
 
         &:hover:not(.selected) {
@@ -87,13 +87,13 @@ bl-quick-list {
             }
 
             .fa-hourglass-half {
-                color: map-get($md-prussian-blue, 400);
+                color: map-get($primary, 400);
             }
         }
 
         bl-quick-list-item-status {
             position: relative;
-            color: $blue-light;
+            color: map-get($primary, 500);
             flex: 0 0 8px;
             display: flex;
             align-items: stretch;
@@ -101,16 +101,16 @@ bl-quick-list {
                 width: 100%;
 
                 &.warning {
-                    background-color: $red;
+                    background-color: map-get($danger, 500);
                 }
 
                 &.lightaccent {
-                    background: map-get($md-prussian-blue, 100);
+                    background: map-get($primary, 100);
 
                 }
 
                 &.accent {
-                    background: map-get($md-prussian-blue, 300);
+                    background: map-get($primary, 300);
                 }
 
                 &.important {
@@ -120,7 +120,7 @@ bl-quick-list {
                         transparent 5px,
                         $concreteGray 5px,
                         $concreteGray 10px
-                    ), map-get($md-prussian-blue, 500);
+                    ), map-get($primary, 500);
                 }
             }
         }
diff --git a/app/styles/base/loading.scss b/app/styles/base/loading.scss
index 943446b19f..e3aabb6151 100644
--- a/app/styles/base/loading.scss
+++ b/app/styles/base/loading.scss
@@ -1,4 +1,4 @@
-$spinner-color: $blue-medium;
+$spinner-color: map-get($primary, 600);
 
 bl-loading {
     display: block;
diff --git a/app/styles/base/notifications.scss b/app/styles/base/notifications.scss
index be0370faae..b950db0200 100644
--- a/app/styles/base/notifications.scss
+++ b/app/styles/base/notifications.scss
@@ -84,28 +84,28 @@ bl-notification {
     }
 
     &.success {
-        background-color: $green;
+        background-color: map-get($success, 500);
         a {
-            color: $green-dark;
+            color: map-get($success, 800);
         }
     }
 
     &.error {
-        background-color: $red-light;
+        background-color: map-get($danger, 300);
         a {
-            color: $red;
+            color: map-get($danger, 500);
         }
     }
 
     &.info {
-        color: $orient;
+        color: map-get($primary, 400);
         background-color: white;
     }
 
     &.warn {
-        background-color: $yellow-light;
+        background-color: map-get($warn, 400);
         a {
-            color: $yellow-dark;
+            color: map-get($warn, 800);
         }
     }
 
@@ -168,7 +168,7 @@ bl-persistent-notifications-dropdown {
         position: absolute;
         left: 0;
         top: 0;
-        background-color: $fuzzyWuzzyBrown;
+        background-color: map-get($danger, 500);
         border-radius: 10px;
         width: 18px;
         height: 18px;
@@ -188,7 +188,7 @@ bl-persistent-notifications-dropdown {
             margin-right: 10px;
 
             .fa-exclamation-triangle {
-                color: $yellow;
+                color: map-get($warn, 500);
             }
         }
 
@@ -218,11 +218,11 @@ bl-persistent-notifications-dropdown {
 
             &:hover {
                 color: white;
-                background-color: $crail;
+                background-color: map-get($danger, 400);
             }
 
             &:active {
-                background-color: $buttonBrown;
+                background-color: map-get($danger, 600);
             }
         }
 
diff --git a/app/styles/base/scaffolding.scss b/app/styles/base/scaffolding.scss
index 9c5df69168..5bec61a2b1 100644
--- a/app/styles/base/scaffolding.scss
+++ b/app/styles/base/scaffolding.scss
@@ -3,11 +3,6 @@ html, body, button {
     padding: 0;
     border: 0;
     height: 100%;
-    font-family: "Roboto", Helvetica, Arial, sans-serif;
-}
-
-.center_this {
-    @include center();
 }
 
 .text-left           { text-align: left; }
@@ -28,68 +23,8 @@ ol ul {
     margin-bottom: 0;
 }
 
-// Horizontal rules
-hr {
-    margin: $baseLineHeight 0;
-    border: 0;
-    border-top: 1px solid $athensGrey;
-    border-bottom: 1px solid $white;
-}
-
-// Blockquotes
-blockquote {
-    padding: 0 0 0 15px;
-    margin: 0 0 $baseLineHeight;
-    border-left: 5px solid $athensGrey;
-
-    p {
-        margin-bottom: 0;
-        font-size: $baseFontSize * 1.25;
-        font-weight: 300;
-        line-height: 1.25;
-    }
-
-    small {
-        display: block;
-        line-height: $baseLineHeight;
-        color: $silver-grey;
-
-        &:before {
-            content: "\2014 \00A0";
-        }
-    }
-
-    // Float right with text-align: right
-    &.pull-right {
-        float: right;
-        padding-right: 15px;
-        padding-left: 0;
-        border-right: 5px solid $athensGrey;
-        border-left: 0;
-
-        p, small {
-            text-align: right;
-        }
-
-        small {
-            &:before {
-                content: "";
-            }
-
-            &:after {
-                content: "\00A0 \2014";
-            }
-        }
-    }
-}
-
-// Quotes
-blockquote:before, blockquote:after {
-    content: "";
-}
-
 .danger {
-    color: $red;
+    color: map-get($danger, 500);
 }
 
 .unaccent {
diff --git a/app/styles/base/server-error.scss b/app/styles/base/server-error.scss
index 64f50aa655..80af0b4362 100644
--- a/app/styles/base/server-error.scss
+++ b/app/styles/base/server-error.scss
@@ -7,7 +7,7 @@ bl-server-error {
 }
 
 .error-banner {
-    background: $red;
+    background: map-get($danger, 500);
     color: $whiteSmoke;
     > .content {
         padding: 10px;
@@ -39,18 +39,18 @@ bl-server-error {
         z-index: 10;
 
         i {
-            border: 1px solid $red-dark;
+            border: 1px solid map-get($danger, 800);
             border-radius: 3px;
             padding: 3px;
             &:hover {
-                background-color: $red-dark;
+                background-color: map-get($danger, 800);
             }
         }
     }
 
     .troubleshoot-info {
         padding: 10px;
-        border-top: 1px solid $red-dark;
+        border-top: 1px solid map-get($danger, 800);
 
         table {
             font-size: 1em;
diff --git a/app/styles/common/type.scss b/app/styles/common/type.scss
index 856f1b9200..6466b29715 100644
--- a/app/styles/common/type.scss
+++ b/app/styles/common/type.scss
@@ -6,7 +6,7 @@
  */
 
 body {
-    font-family: $baseFontFamily;
+    font-family: "Roboto", Helvetica, Arial, sans-serif;
     font-size: $baseFontSize;
     line-height: $baseLineHeight;
     color: $textColor;
@@ -59,3 +59,10 @@ h6 {
     font-size: $h6FontSize;
     line-height: 19px;
 }
+
+hr {
+    margin: $baseLineHeight 0;
+    border: 0;
+    border-top: 1px solid $border-color;
+    border-bottom: 1px solid $white;
+}
diff --git a/app/styles/job/base.scss b/app/styles/job/base.scss
index 42123cd173..7a0f5e6f34 100644
--- a/app/styles/job/base.scss
+++ b/app/styles/job/base.scss
@@ -1,13 +1,13 @@
 bl-job-stats-preview {
     .task-success {
         display: inline-block;
-        color: $green-dark;
+        color: map-get($success, 800);
         margin-right: 5px;
     }
 
     .task-failed {
         display: inline-block;
-        color: $red;
+        color: map-get($danger, 500);
     }
 }
 
@@ -17,10 +17,10 @@ bl-application-preview, bl-task-preview {
     }
 
     .success {
-        color: $green;
+        color: map-get($success, 500);
     }
 
     .failure {
-        color: $red;
+        color: map-get($danger, 500);
     }
 }
diff --git a/app/styles/job/details.scss b/app/styles/job/details.scss
index 3ebd6cc37e..65bca060ef 100644
--- a/app/styles/job/details.scss
+++ b/app/styles/job/details.scss
@@ -1,12 +1,19 @@
-bl-job-details {
-    .overview > .main-content {
-        display: flex;
+md-card.overview {
+    padding: 0 !important;
+    display: flex;
 
-        > .info {
-            flex: 1;
-        }
+    > .actions {
+        width: $action-btn-size + 1;
     }
 
+    > .content {
+        padding: 18px;
+        flex: 1;
+    }
+
+    > .tile {
+        border-left: 1px solid #d5d5d5;
+    }
 }
 
 bl-job-progress-status {
@@ -49,7 +56,7 @@ bl-job-progress-status {
             cursor: pointer;
 
             &.active {
-                color: map-get($md-prussian-blue, 600);
+                color: map-get($primary, 600);
                 font-weight: bold;
             }
         }
diff --git a/app/styles/job/form.scss b/app/styles/job/form.scss
index f10f7abfb4..71119a6671 100644
--- a/app/styles/job/form.scss
+++ b/app/styles/job/form.scss
@@ -25,7 +25,7 @@ bl-pool-picker {
         margin: 5px;
         vertical-align: top;
 
-        border: 1px solid #d5d5d5;
+        border: 1px solid $border-color;
         border-radius: 3px;
         background: $white;
         outline: none;
@@ -38,21 +38,21 @@ bl-pool-picker {
 
         &.active {
             color: $whitesmoke;
-            border-color: map-get($md-prussian-blue, 300);
-            background:  map-get($md-prussian-blue, 300);
+            border-color: map-get($primary, 300);
+            background:  map-get($primary, 300);
 
             > .pool-wrapper {
                 > .icon {
-                    color: map-get($md-prussian-blue, 50);
+                    color: map-get($primary, 50);
                 }
                 > .info > .details {
-                    color: map-get($md-prussian-blue, 50);
+                    color: map-get($primary, 50);
                 }
             }
 
             > .pool-tags .tag {
-                color: map-get($md-prussian-blue, 700);
-                background-color: map-get($md-prussian-blue, 50);
+                color: map-get($primary, 700);
+                background-color: map-get($primary, 50);
             }
         }
 
@@ -62,7 +62,7 @@ bl-pool-picker {
             width: $tile-width;
 
             > .icon {
-                color: map-get($md-prussian-blue, 300);
+                color: map-get($primary, 300);
                 font-size: 30px;
                 height: 30px;
                 margin: 5px;
diff --git a/app/styles/main.scss b/app/styles/main.scss
index d4a1d6c314..f85ba7a2f1 100644
--- a/app/styles/main.scss
+++ b/app/styles/main.scss
@@ -22,7 +22,6 @@
 @import "./base/server-error";
 
 // Account styles
-@import "./account/details";
 @import "./account/browse";
 
 // Pool styles
@@ -36,9 +35,6 @@
 @import "./job/details";
 @import "./job/form";
 
-// Node styles
-@import "./node/connect";
-
 //Task styles
 @import "./task/base";
 @import "./task/output";
@@ -46,7 +42,6 @@
 
 // File styles
 @import "./file/browse";
-@import "./file/log";
 
 // Partial styles
 @import "./partials/grid";
diff --git a/app/styles/partials/header.scss b/app/styles/partials/header.scss
index a4a5e5cb09..a116f826f7 100644
--- a/app/styles/partials/header.scss
+++ b/app/styles/partials/header.scss
@@ -34,7 +34,7 @@
         border-right: 1px solid $navigation-background;
 
         &.invalid {
-            color: $fuzzyWuzzyBrown;
+            color: map-get($danger, 500);
         }
 
         i {
@@ -116,11 +116,11 @@
 
             &:hover {
                 color: white;
-                background-color: $crail;
+                background-color: map-get($danger, 400);
             }
 
             &:active {
-                background-color: $buttonBrown;
+                background-color: map-get($danger, 600);
             }
         }
     }
diff --git a/app/styles/partials/icons.scss b/app/styles/partials/icons.scss
index 43c7059f52..2813f11b2d 100644
--- a/app/styles/partials/icons.scss
+++ b/app/styles/partials/icons.scss
@@ -1,21 +1,21 @@
 .fa-refresh {
-    color: map-get($md-prussian-blue, 300);
+    color: map-get($primary, 300);
 }
 
 .fa-cog, .fa-gear {
-    color: map-get($md-prussian-blue, 300);
+    color: map-get($primary, 300);
 }
 
 .fa-ban, .fa-times, .fa-warning, .fa-times-circle {
-    color: $red;
+    color: map-get($danger, 500);
 }
 
 .fa-check, .fa-check-circle-o, .fa-check-circle {
-    color: $green-dark;
+    color: map-get($success, 800);
 }
 
 .fa-question-circle-o {
-    color: $green-dark;
+    color: map-get($success, 800);
 }
 
 button {
diff --git a/app/styles/partials/navigation.scss b/app/styles/partials/navigation.scss
index 15cc5197cc..e28c17968f 100644
--- a/app/styles/partials/navigation.scss
+++ b/app/styles/partials/navigation.scss
@@ -1,36 +1,32 @@
-nav {
-    ul {
-        margin: 0;
- 
-        li {
-            padding: 0;
+bl-app-nav > ul {
+    margin: 0;
+    user-select: none;
 
-            i.fa {
-                display: block;
-                margin: 0 auto;
-            }
-            
-            a {
-                display: block;
-                padding: 18px 0;
-            }
+    > li > a {
+        height: $navigationbar-width;
+        display: block;
+        padding: 13px 0;
+        outline: none;
+        color: $navigation-text;
+        -webkit-user-drag: none;
 
-            a.active {
-                background-color: lighten($navigation-hover, 4%);
-                color: $white;
-            }
+        i.fa {
+            display: block;
+            margin: 0 auto;
         }
 
-        li:hover {
-            background-color: $navigation-hover;
+        .label {
+            margin-top: 5px;
         }
-    }
 
-    a {
-        color: $navigation-text;
-    }
+        &:hover, &:focus {
+            background-color: $navigation-hover;
+            color: $white;
+        }
 
-    a:hover {
-        color: $white;
+        &.active {
+            background-color: map-get($primary, 500);
+            color: $white;
+        }
     }
 }
diff --git a/app/styles/partials/refresh-btn.scss b/app/styles/partials/refresh-btn.scss
index 2b6b3070a7..aae1633d11 100644
--- a/app/styles/partials/refresh-btn.scss
+++ b/app/styles/partials/refresh-btn.scss
@@ -1,15 +1,15 @@
 bl-refresh-btn {
     .fa-refresh {
-        color: map-get($md-prussian-blue, 300);
+        color: map-get($primary, 300);
     }
 
     .fa-check {
-        color: $green-dark;
+        color: map-get($success, 800);
         // overflow: hidden;
     }
 
     .fa-warning {
-        color: $red;
+        color: map-get($danger, 500);
     }
 
     .success-container {
diff --git a/app/styles/pool/create.scss b/app/styles/pool/create.scss
index 5225dd4742..55ad7d7c1a 100644
--- a/app/styles/pool/create.scss
+++ b/app/styles/pool/create.scss
@@ -11,7 +11,7 @@ bl-pool-os-picker {
         padding: 0;
         display: inline-block;
         width: 120px;
-        border: 1px solid #d5d5d5;
+        border: 1px solid $border-color;
         border-radius: 3px;
         background: $white;
         outline: none;
@@ -26,16 +26,16 @@ bl-pool-os-picker {
         }
 
         &.active {
-            border-color: map-get($md-prussian-blue, 300);
+            border-color: map-get($primary, 300);
 
             > .main > .icon {
-                background: map-get($md-prussian-blue, 300);
-                border-color: map-get($md-prussian-blue, 300);
-                color: map-get($md-prussian-blue, 50);
+                background: map-get($primary, 300);
+                border-color: map-get($primary, 300);
+                color: map-get($primary, 50);
             }
 
             .select-version {
-                color: map-get($md-prussian-blue, 500);
+                color: map-get($primary, 500);
                 font-weight: bold;
             }
 
@@ -50,7 +50,7 @@ bl-pool-os-picker {
                 padding: 10px 0;
                 height: 120px;
                 font-size: 60px;
-                color: map-get($md-prussian-blue, 300);
+                color: map-get($primary, 300);
                 display: flex;
                 align-items: center;
                 justify-content: center;
@@ -104,7 +104,7 @@ bl-vm-size-picker {
             padding: 0;
             display: inline-block;
             width: 120px;
-            border: 1px solid #d5d5d5;
+            border: 1px solid $border-color;
             border-radius: 3px;
             background: $white;
             outline: none;
@@ -117,16 +117,16 @@ bl-vm-size-picker {
             }
 
             &.active {
-                border-color: map-get($md-prussian-blue, 300);
+                border-color: map-get($primary, 300);
 
                 > .title {
-                    background: map-get($md-prussian-blue, 300);
-                    border-color: map-get($md-prussian-blue, 300);
+                    background: map-get($primary, 300);
+                    border-color: map-get($primary, 300);
                     color: $whitesmoke;
                 }
 
                 > .pricing {
-                    border-color: map-get($md-prussian-blue, 300);
+                    border-color: map-get($primary, 300);
                 }
             }
 
@@ -158,36 +158,6 @@ bl-vm-size-picker {
     }
 }
 
-bl-autoscale-formula-picker {
-    display: flex;
-    .CodeMirror {
-        font-size: 12px;
-    }
-
-    .CodeMirror pre.CodeMirror-placeholder {
-        font-family: Roboto, "Helvetica Neue", sans-serif;
-        line-height: normal;
-        text-align: left;
-        color: rgba(0, 0, 0, 0.38);
-    }
-
-    .cm-variables {
-        color: $green-dark;
-    }
-
-    .cm-functions {
-        color: $red-dark;
-    }
-
-    .cm-math {
-        color: $prussian-blue;
-    }
-
-    .cm-builtin {
-        color: $midnight;
-    }
-}
-
 bl-pool-scale-picker {
     md-input-container {
         margin-top: 8px;
diff --git a/app/styles/pool/graphs.scss b/app/styles/pool/graphs.scss
index 4a5269aa1c..3d56717747 100644
--- a/app/styles/pool/graphs.scss
+++ b/app/styles/pool/graphs.scss
@@ -18,7 +18,7 @@ bl-pool-graphs {
 
             &.focused {
                 .label {
-                    color: map-get($md-prussian-blue, 600);
+                    color: map-get($primary, 600);
                     text-decoration: underline;
                 }
             }
diff --git a/app/styles/pool/heatmap.scss b/app/styles/pool/heatmap.scss
index f6c193097d..dc8c653335 100644
--- a/app/styles/pool/heatmap.scss
+++ b/app/styles/pool/heatmap.scss
@@ -20,7 +20,7 @@ $color-width: 14px;
     g.node-group {
         cursor: pointer;
         rect {
-            stroke: map-get($md-prussian-blue, 500);
+            stroke: map-get($primary, 500);
         }
 
         text {
@@ -33,7 +33,7 @@ $color-width: 14px;
     &.interactive {
         g.node-group:hover {
             rect {
-                stroke: map-get($md-prussian-blue, 500);
+                stroke: map-get($primary, 500);
                 fill-opacity: 0.7;
             }
         }
@@ -66,7 +66,7 @@ $color-width: 14px;
 
             &.highlighted {
                 color: $concreteGray;
-                background: map-get($md-prussian-blue, 400);
+                background: map-get($primary, 400);
             }
         }
 
diff --git a/app/styles/task/output.scss b/app/styles/task/output.scss
index 98c7811e09..4f037e8ec6 100644
--- a/app/styles/task/output.scss
+++ b/app/styles/task/output.scss
@@ -24,10 +24,21 @@ bl-task-log, bl-task-outputs {
             &:hover {
                 background: $dove-grey;
             }
+
+            .mat-input-wrapper {
+                margin: 0;
+
+                .mat-input-underline {
+                    .mat-input-ripple {
+                        height: 0;
+                    }
+                }
+            }
         }
 
         > .file-tab-more {
-            font-size: 20px;
+            font-size: 16px;
+            padding-top: 6px;
         }
     }
 }
diff --git a/app/styles/task/timeline.scss b/app/styles/task/timeline.scss
index 4c2ea4ad62..c053378dbf 100644
--- a/app/styles/task/timeline.scss
+++ b/app/styles/task/timeline.scss
@@ -2,7 +2,7 @@ bl-task-timeline {
     $tile-size: 30px;
     $separator-width: 60px;
     $separator-height: 2px;
-    $state-reached-color: map-get($md-prussian-blue, 300);
+    $state-reached-color: map-get($primary, 300);
 
     .timeline {
         display: flex;
@@ -44,12 +44,12 @@ bl-task-timeline {
                     color: $dusty-grey;
 
                     .warn {
-                        color: $yellow;
+                        color: map-get($warn, 500);
                     }
 
                     .error {
                         font-weight: bold;
-                        color: $red;
+                        color: map-get($danger, 500);
                     }
                 }
             }
@@ -68,11 +68,11 @@ bl-task-timeline {
             }
 
             &.warn > .tile {
-                background: $yellow;
+                background: map-get($warn, 500);
             }
 
             &.error > .tile {
-                background: $red;
+                background: map-get($danger, 500);
             }
         }
 
diff --git a/app/styles/themes/classic.scss b/app/styles/themes/classic.scss
new file mode 100644
index 0000000000..75a0e88963
--- /dev/null
+++ b/app/styles/themes/classic.scss
@@ -0,0 +1,99 @@
+$black-87-opacity: rgba(black, 0.87);
+$white-87-opacity: rgba(white, 0.87);
+
+$contrast-theme-classic: (
+    50: $black-87-opacity,
+    100: $black-87-opacity,
+    200: $black-87-opacity,
+    300: $black-87-opacity,
+    400: $black-87-opacity,
+    500: white,
+    600: white,
+    700: white,
+    800: $white-87-opacity,
+    900: $white-87-opacity,
+    A100: $black-87-opacity,
+    A200: white,
+    A400: white,
+    A700: white,
+);
+
+$primary-theme-classic: (
+    50: #cde0ed,
+    100: #94bdd9,
+    200: #6ba3cb,
+    300: #3e81b0,
+    400: #36719a,
+    500: #2e6083,
+    600: #264f6c,
+    700: #1e3f56,
+    800: #162e3f,
+    900: #0e1e28,
+    A100: #cde0ed,
+    A200: #94bdd9,
+    A400: #36719a,
+    A700: #1e3f56,
+    contrast: $contrast-theme-classic,
+);
+
+$danger-theme-classic: (
+    50: #f5e7e7,
+    100: #e6c4c4,
+    200: #d59c9c,
+    300: #c47474,
+    400: #b75757,
+    500: #aa3939,
+    600: #a33333,
+    700: #992c2c,
+    800: #902424,
+    900: #7f1717,
+    A100: #ffb7b7,
+    A200: #ff8484,
+    A400: #ff5151,
+    A700: #ff3737,
+    contrast: $contrast-theme-classic,
+);
+
+$warn-theme-classic: (
+    50: #fef5e8,
+    100: #fce6c6,
+    200: #fad6a1,
+    300: #f7c67b,
+    400: #f6b95e,
+    500: #f4ad42,
+    600: #f3a63c,
+    700: #f19c33,
+    800: #ef932b,
+    900: #ec831d,
+    A100: #ffffff,
+    A200: #fff6ee,
+    A400: #ffdabb,
+    A700: #ffcda1,
+    contrast: $contrast-theme-classic,
+);
+
+$success-theme-classic: (
+    50: #eaf5ea,
+    100: #c9e7cb,
+    200: #a6d7a8,
+    300: #82c785,
+    400: #67bb6a,
+    500: #4caf50,
+    600: #45a849,
+    700: #3c9f40,
+    800: #339637,
+    900: #248627,
+    A100: #c5ffc7,
+    A200: #92ff95,
+    A400: #5fff64,
+    A700: #46ff4b,
+    contrast: $contrast-theme-classic,
+);
+
+body {
+    // Primary color
+    @include css-var-theme(--primary, $primary-theme-classic);
+    @include css-var-theme(--danger, $danger-theme-classic);
+    @include css-var-theme(--warn, $warn-theme-classic);
+    @include css-var-theme(--success, $success-theme-classic);
+}
diff --git a/app/styles/themes/core.scss b/app/styles/themes/core.scss
new file mode 100644
index 0000000000..ff2609d0fb
--- /dev/null
+++ b/app/styles/themes/core.scss
@@ -0,0 +1,89 @@
+@mixin prop($name, $var, $index) {
+    #{$name}-#{$index}: map-get($var, $index);
+}
+
+@mixin css-var-theme($name, $var) {
+    @include prop($name, $var, 50);
+    @include prop($name, $var, 100);
+    @include prop($name, $var, 200);
+    @include prop($name, $var, 300);
+    @include prop($name, $var, 400);
+    @include prop($name, $var, 500);
+    @include prop($name, $var, 600);
+    @include prop($name, $var, 700);
+    @include prop($name, $var, 800);
+    @include prop($name, $var, 900);
+    @include prop($name, $var, A100);
+    @include prop($name, $var, A200);
+    @include prop($name, $var, A400);
+    @include prop($name, $var, A700);
+};
+
+$primary: (
+    50: var(--primary-50),
+    100: var(--primary-100),
+    200: var(--primary-200),
+    300: var(--primary-300),
+    400: var(--primary-400),
+    500: var(--primary-500),
+    600: var(--primary-600),
+    700: var(--primary-700),
+    800: var(--primary-800),
+    900: var(--primary-900),
+    A100: var(--primary-A100),
+    A200: var(--primary-A200),
+    A400: var(--primary-A400),
+    A700: var(--primary-A700),
+);
+$primary: $primary;
+
+$danger: (
+    50: var(--danger-50),
+    100: var(--danger-100),
+    200: var(--danger-200),
+    300: var(--danger-300),
+    400: var(--danger-400),
+    500: var(--danger-500),
+    600: var(--danger-600),
+    700: var(--danger-700),
+    800: var(--danger-800),
+    900: var(--danger-900),
+    A100: var(--danger-A100),
+    A200: var(--danger-A200),
+    A400: var(--danger-A400),
+    A700: var(--danger-A700),
+);
+
+$warn: (
+    50: var(--warn-50),
+    100: var(--warn-100),
+    200: var(--warn-200),
+    300: var(--warn-300),
+    400: var(--warn-400),
+    500: var(--warn-500),
+    600: var(--warn-600),
+    700: var(--warn-700),
+    800: var(--warn-800),
+    900: var(--warn-900),
+    A100: var(--warn-A100),
+    A200: var(--warn-A200),
+    A400: var(--warn-A400),
+    A700: var(--warn-A700),
+);
+
+$success: (
+    50: var(--success-50),
+    100: var(--success-100),
+    200: var(--success-200),
+    300: var(--success-300),
+    400: var(--success-400),
+    500: var(--success-500),
+    600: var(--success-600),
+    700: var(--success-700),
+    800: var(--success-800),
+    900: var(--success-900),
+    A100: var(--success-A100),
+    A200: var(--success-A200),
+    A400: var(--success-A400),
+    A700: var(--success-A700),
+);
diff --git a/app/styles/variables.scss b/app/styles/variables.scss
index cf391857e8..c8de4a9d2d 100644
--- a/app/styles/variables.scss
+++ b/app/styles/variables.scss
@@ -1,42 +1,13 @@
+@import "./themes/core";
+@import "./themes/classic";
 @import "./vars/material-colors";
 @import "./vars/zindex";
 
-$orient: #00528c;
-$regal-blue: #00416f;
-$prussian-blue: #003153;
-$midnight: #001e33;
-$charcoal-blue: #000306;
 
-$blue-lighter: $orient;
-$blue-light: $regal-blue;
-$blue-medium: $prussian-blue;
-$blue-dark: $midnight;
-$blue-darker: $charcoal-blue;
-
-// Red
-$red-light: #d46a6a;
-$red: #aa3939;
-$red-dark: #801515;
-
-$grenadier          :  #dd2c00;
-$fuzzyWuzzyBrown    :  #c74f54;
-$buttonBrown        :  #c45151;
-$crail              :  #c14848;
-$vanillaIce         :  #efd0d0;
-
-$yellow-light: #ffc267;
-$yellow: #f4ad42;
-$yellow-dark: #e39014;
-
-//Green
-$green-light: #77cc7d;
-$green: #4caf50;
-$green-dark: #388e3c;
-
-$header-background: $blue-light;
-$header-hover: $blue-medium;
-$navigation-background: $blue-medium;
-$navigation-hover: $blue-light;
+$header-background      : map-get($primary, 700);
+$header-hover           : map-get($primary, 800);
+$navigation-background  : map-get($primary, 600);
+$navigation-hover       : map-get($primary, 700);
 
 // Black & white
 //---------------------------------------------
@@ -68,34 +39,22 @@ $mineShaftGray      :  $mineshaft-grey;
 
 // Status Colours
 //---------------------------------------------
-$warningText        :  #c09853;
-$errorText          :  #b94a48;
-$infoText           :  #3a87ad;
-$successText        :  #468847;
-
+$warningText        :  map-get($warn, 500);
+$errorText          :  map-get($danger, 500);
+$infoText           :  map-get($primary, 500);
+$successText        :  map-get($success, 500);
 
 // Text
 //---------------------------------------------
-$headings-color      : $prussian-blue;
-$link-color          : map-get($md-prussian-blue, 700);
-$link-color-hover    : map-get($md-prussian-blue, 800);
-$validation-error-color   : $red;
-$label-text          : $dusty-grey;
-
-// Typography
-//---------------------------------------------
-$segoeUiFontFamily         : wf_segoe-ui_normal, "Segoe UI", "Segoe WP", Tahoma, Arial, sans-serif;
-$segoiUiFontFamilySemibold : wf_segoe-ui_semibold, "Segoe UI Semibold", "Segoe WP Semibold", "Segoe UI", "Segoe WP", Tahoma, Arial, sans-serif;
-$segoiUiFontFamilySemilight: wf_segoe-ui_semilight, "Segoe UI Semilight", "Segoe WP Semilight","Segoe UI", "Segoe WP", Tahoma, Arial, sans-serif;
-$segoiUiFontFamilyBold     : wf_segoe-ui_bold, "Segoe UI Bold", "Segoe WP Bold","Segoe UI", "Segoe WP", Tahoma, Arial, sans-serif;
+$headings-color             : map-get($primary, 700);
+$link-color                 : map-get($primary, 700);
+$link-color-hover           : map-get($primary, 800);
+$validation-error-color     : map-get($danger, 500);
+$label-text                 : $dusty-grey;
 
-$baseFontSize       : 10pt;
-$baseFontFamily     : $segoeUiFontFamily;
+$baseFontSize       : 13px;
 $baseLineHeight     : 1.4em;
-$lineHeightComputed : floor($baseFontSize * $baseLineHeight);
-$altFontFamily      : $segoeUiFontFamily;
 
-$headingsFontFamily : $segoeUiFontFamily;
 $headingsFontWeight : semilight;
 $headingWeightBold  : semibold;
 $headingsLineHeight : $baseLineHeight;
@@ -122,14 +81,19 @@ $content-background :  $whiteSmoke-darker;
 $listview-background :  white;
 $footer-background: white;
 $navigation-text: $whiteSmoke;
+$border-color: $alto;
 
 // Layout sizing
 //---------------------------------------------
 $header-height                       : 30px;
-$navigationbar-width                 : 70px;
+$navigationbar-width                 : 60px;
 $listview-width                      : 350px;
 $listview-filtering-width            : 55vw;
 $listview-header-height              : 90px;
 $footer-height                       : 0;
 $content-top-position                : $header-height;
 $contentview-height                  : calc(100vh - #{$header-height});
+
+
+// Base component dimensions
+$action-btn-size: 32px;
diff --git a/app/styles/vars/material-colors.scss b/app/styles/vars/material-colors.scss
index 80505f0333..e69de29bb2 100644
--- a/app/styles/vars/material-colors.scss
+++ b/app/styles/vars/material-colors.scss
@@ -1,35 +0,0 @@
-$black-87-opacity: rgba(black, 0.87);
-$white-87-opacity: rgba(white, 0.87);
-
-$md-prussian-blue: (
-    50: #cde0ed,
-    100: #94bdd9,
-    200: #6ba3cb,
-    300: #3e81b0,
-    400: #36719a,
-    500: #2e6083,
-    600: #264f6c,
-    700: #1e3f56,
-    800: #162e3f,
-    900: #0e1e28,
-    A100: #cde0ed,
-    A200: #94bdd9,
-    A400: #36719a,
-    A700: #1e3f56,
-    contrast: (
-        50: $black-87-opacity,
-        100: $black-87-opacity,
-        200: $black-87-opacity,
-        300: $black-87-opacity,
-        400: $black-87-opacity,
-        500: white,
-        600: white,
-        700: white,
-        800: $white-87-opacity,
-        900: $white-87-opacity,
-        A100: $black-87-opacity,
-        A200: white,
-        A400: white,
-        A700: white,
-    )
-);
diff --git a/app/styles/vendor/material-theme.scss b/app/styles/vendor/material-theme.scss
index 5d92612c93..a16d619f02 100644
--- a/app/styles/vendor/material-theme.scss
+++ b/app/styles/vendor/material-theme.scss
@@ -8,19 +8,19 @@
 // Define the palettes for your theme using the Material Design palettes available in palette.scss
 // (imported above). For each palette, you can optionally specify a default, lighter, and darker
 // hue.
-$primary: mat-palette($md-prussian-blue);
-$accent:  mat-palette($mat-grey, A200, A100, A400);
+$md-primary: mat-palette($primary-theme-classic);
+$md-accent:  mat-palette($mat-grey, A200, A100, A400);
 
 // The warn palette is optional (defaults to red).
-$warn:    mat-palette($mat-red);
+$md-warn:    mat-palette($mat-red);
 
 // Create the theme object (a Sass map containing all of the palettes).
-$theme: mat-light-theme($primary, $accent, $warn);
+$md-theme: mat-light-theme($md-primary, $md-accent, $md-warn);
 
 // Include theme styles for core and each component used in your app.
 // Alternatively, you can import and @include the theme mixins for each component
 // that you are using.
-@include angular-material-theme($theme);
+@include angular-material-theme($md-theme);
 
 // TODO: can we pull in the material scss classes into the project?
 // really want to be able to override the styles more easily.
@@ -42,7 +42,7 @@ md-tab-group:not(.form-tabs) {
         border-right: 1px solid #ddd;
 
         &.mat-tab-label-active {
-            background-color: map-get($md-prussian-blue, 100);
+            background-color: map-get($primary, 100);
         }
 
         &.mat-tab-disabled {
@@ -99,21 +99,6 @@ md-card {
         }
     }
 
-    &.overview {
-        padding: 18px !important;
-
-        md-card-actions {
-            margin-left: -10px !important;
-            margin-right: -10px !important;
-            padding-top: 4px !important;
-        }
-
-        md-card-actions:last-child {
-            margin-bottom: -10px !important;
-            padding-bottom: 0 !important;
-        }
-    }
-
     &.details {
         margin-top:8px !important;
         padding:0 !important;
@@ -130,17 +115,17 @@ md-radio-button {
 
     &.mat-radio-checked {
         .mat-radio-outer-circle {
-            border-color: map-get($md-prussian-blue, 400);
+            border-color: map-get($primary, 400);
         }
 
         .mat-radio-inner-circle {
-            background: map-get($md-prussian-blue, 400);
+            background: map-get($primary, 400);
         }
     }
 }
 
 [md-raised-button].mat-primary.mat-button-focus {
-    background: map-get($md-prussian-blue, 700);
+    background: map-get($primary, 700);
 }
 
 button[md-raised-button].small {
@@ -187,3 +172,6 @@ md-input-container.bl-textarea {
     margin-top: 6px;
 }
 
+.mat-autocomplete-panel {
+    width : 30vw;
+}
diff --git a/app/utils/arm-resource-utils.ts b/app/utils/arm-resource-utils.ts
index 412fdaa172..7ca3cdca45 100644
--- a/app/utils/arm-resource-utils.ts
+++ b/app/utils/arm-resource-utils.ts
@@ -7,6 +7,18 @@ import { log } from "app/utils";
  * From: MsPortalFx.ViewModels.Services.ResourceTypes.ts
  */
 export class ArmResourceUtils {
+
+    public static getSubscriptionIdFromResourceId(id: string) {
+        const regex = /subscriptions\/(.*)\/resourcegroups/;
+        const out = regex.exec(id.toLowerCase());
+
+        if (!out || out.length < 2) {
+            return null;
+        } else {
+            return out[1];
+        }
+    }
+
     /*
      * Returns the account name from a resource id
      */
diff --git a/app/utils/autoscale.ts b/app/utils/autoscale.ts
index ead585ae1c..df9b34e5ab 100644
--- a/app/utils/autoscale.ts
+++ b/app/utils/autoscale.ts
@@ -5,7 +5,8 @@ const variables = [
     "$DiskReadBytes", "$DiskReadOps", "$DiskWriteBytes", "$DiskWriteOps",
     "$FailedTasks", "$MemoryBytes", "$NetworkInBytes", "$NetworkOutBytes",
     "$PendingTasks", "$RunningTasks", "$SampleNodeCount", "$SucceededTasks",
-    "$TargetDedicated", "$WallClockSeconds", "$NodeDeallocationOption",
+    "$TargetDedicatedNodes", "$TargetLowPriorityNodes", "$WallClockSeconds",
+    "$NodeDeallocationOption",
 ];
 
 const mathFunc = [
diff --git a/app/utils/constants.ts b/app/utils/constants.ts
index c37bb667dc..2b70d2318e 100644
--- a/app/utils/constants.ts
+++ b/app/utils/constants.ts
@@ -108,7 +108,7 @@ export const ApiVersion = {
     arm: "2016-09-01",
     armClassicStorage: "2016-11-01",
     armStorage: "2016-12-01",
-    armBatch: "2015-12-01",
+    armBatch: "2017-05-01",
     compute: "2017-03-30",
 };
 
@@ -143,3 +143,12 @@ export const APIErrorCodes = {
 export const MetadataInternalKey = {
     tags: "_bl_tags",
 };
+
+export const PollRate = {
+    entity: 10000,
+};
+
+/**
+ * Maximum number of tasks the recent tasks attribute can have.
+ */
+export const nodeRecentTaskLimit = 10;
diff --git a/app/utils/date-utils.ts b/app/utils/date-utils.ts
index 630cbac41a..7f0d1c9115 100644
--- a/app/utils/date-utils.ts
+++ b/app/utils/date-utils.ts
@@ -57,4 +57,21 @@ export class DateUtils {
             ? moment(date).format("MMM Do, YYYY, HH:mm:ss.SSS Z")
             : "";
     }
+
+    /**
+     * Using the supplied start and end times, compute the duration.
+     * @example 9m 2s, or null if no start time supplied.
+     *
+     * @param startTime - optional start time
+     * @param endTime - optional end time
+     */
+    public static computeRuntime(startTime?: Date, endTime?: Date): string {
+        if (!startTime) {
+            return null;
+        }
+
+        const currentEndTime = endTime === null ? moment.utc() : moment.utc(endTime);
+        const runtime = moment.duration(currentEndTime.diff(moment(startTime)));
+        return DateUtils.prettyDuration(runtime);
+    }
 }
diff --git a/app/utils/pool-utils.ts b/app/utils/pool-utils.ts
index b7ff8c7057..126235cc1c 100644
--- a/app/utils/pool-utils.ts
+++ b/app/utils/pool-utils.ts
@@ -58,8 +58,8 @@ export class PoolUtils {
         return !this.isOfferWindows(offer);
     }
 
-    public static isOfferWindows(offer: string) {
-        return /^.*Windows.*$/.test(offer);
+    public static isOfferWindows(offer: string): boolean {
+        return /windows/i.test(offer);
     }
 
     public static iconForOffer(offerName: string) {
@@ -96,8 +96,14 @@ export class PoolUtils {
         }
 
         if (pool.virtualMachineConfiguration) {
-            if (pool.virtualMachineConfiguration.imageReference.publisher ===
-                "MicrosoftWindowsServer") {
+            const config = pool.virtualMachineConfiguration;
+            if (config.osDisk) {
+                return "Custom Image";
+            }
+            if (!config.imageReference) {
+                return "Unkown";
+            }
+            if (config.imageReference.publisher === "MicrosoftWindowsServer") {
                 return `Windows Server ${pool.virtualMachineConfiguration.imageReference.sku}`;
             }
 
@@ -110,7 +116,9 @@ export class PoolUtils {
     }
 
     public static getComputePoolOsIcon(osName): string {
-        if (osName.includes("Windows")) {
+        if (osName === "Custom Image") {
+            return "cloud";
+        } else if (/windows/i.test(osName)) {
             return "windows";
         }
 
diff --git a/config/build-python.ts b/config/build-python.ts
new file mode 100644
index 0000000000..4e2ae5464c
--- /dev/null
+++ b/config/build-python.ts
@@ -0,0 +1,19 @@
+// tslint:disable:no-console
+/**
+ * This script will run the command "python setup.py build" to build the python
+ * but ensure it is using a valid version of python to do so.
+ */
+import * as path from "path";
+
+import { Constants } from "../src/client/client-constants";
+import { execCommand } from "../src/client/core";
+import { getPythonPath } from "../src/client/python-process";
+
+const setupPath = path.join(Constants.root, "python/setup.py");
+getPythonPath().then((pythonPath) => {
+    // Run "python setup.py build"
+    execCommand(`${pythonPath} ${setupPath} build`);
+}).catch((errors) => {
+    console.error(errors);
+    process.exit(1);
+});
diff --git a/config/webpack.config.base.js b/config/webpack.config.base.js
index 5e606b333e..bfc7e01893 100644
--- a/config/webpack.config.base.js
+++ b/config/webpack.config.base.js
@@ -19,7 +19,7 @@ const baseConfig = {
 
     resolve: {
         extensions: [".ts", ".js", ".json", ".scss", ".css", ".html"],
-        modules: [helpers.root(), helpers.root("node_modules")],
+        modules: [helpers.root(), helpers.root("src"), helpers.root("node_modules")],
     },
 
     module: {
diff --git a/docs/call-python.md b/docs/call-python.md
new file mode 100644
index 0000000000..c3488d7498
--- /dev/null
+++ b/docs/call-python.md
@@ -0,0 +1,43 @@
+# Calling python from the javascript
+
+There is a rpc server that starts automaticaly when you start the app that allows you to run python code from the browser.
+
+## Step 0: Setup python
+Install python > 3.6 **Important: Batch labs will look for python and check the version is more than 3.6 before starting the server**
+It will scan for executable in the path called `python3` or `python`. If your python is not in your path you can set the environment variable `BL_PYTHON_PATH` with the path to python 3.6.
+
+## Step 1: Write the python controller
+In `python/controllers` open/create a controller file(It will be loaded automatically).
+
+```python
+from server.app import app
+# Give the name of the procedure in `app.procedure` decorator.
+@app.procedure("foo")
+def foo(params):
+    print("got data", params)
+    # Return a dict that can be converted to JSON(The conversion is done automatically)
+    return {"what": "it works!"}
+
+```
+
+## Step 2: Call the python procedure from the javascript.
+
+```ts
+import {PythonRpcService} from "app/services";
+
+// Inject service in constructor
+constructor(pythonRpcService: PythonRpcService) {
+
+}
+
+// Call the python methods
+pythonRpcService.call("foo", ["abc", "def"]).subscribe({
+    next: (data) => console.log("Got foo", data),
+    error: (err) => console.log("Error foo", err),
+});
+pythonRpcService.call("other", ["abc", "def"]).subscribe({
+    next: (data) => console.log("Got other", data),
+    // Here it will return an
+    error: (err) => console.log("Error other", err),
+});
+```
diff --git a/package.json b/package.json
index 7f50b8559d..ac3bb52689 100644
--- a/package.json
+++ b/package.json
@@ -8,11 +8,12 @@
   "author": {
     "name": "Microsoft Corporation"
   },
-  "version": "0.4.0",
+  "version": "0.5.0",
   "main": "build/client/main.prod.js",
   "scripts": {
+    "ts": "ts-node --project tsconfig.node.json",
     "start": "npm run electron:prod",
-    "clean": "rimraf build/* dll/*",
+    "clean": "rimraf build/* dll/* python/build/*",
     "test": "npm run test-client && npm run test-app",
     "test-app": "karma start",
     "test-app:mem": "cross-env DEBUG_MEM=1 npm run test-app",
@@ -22,9 +23,10 @@
     "test-browser-watch": "npm run test-app-watch",
     "test-client": "cross-env NODE_ENV=test node test/client/run-jasmine.js",
     "test-client-watch": "npm run test-client -- --watch",
-    "build-node-ts": "tsc -p tsconfig.node.json",
+    "build-client": "tsc -p tsconfig.node.json",
     "build-app": "webpack --progress --profile --colors --display-error-details --display-cached",
-    "build": "npm run clean && npm run build-node-ts && npm run build-app",
+    "build-python": "npm run ts config/build-python.ts",
+    "build": "npm run clean && npm run build-client && npm run build-app",
     "build:prod": "cross-env NODE_ENV=production npm run build",
     "watch": "webpack --watch --progress --profile --colors --display-error-details --display-cached",
     "electron": "electron build/client/main.js",
@@ -32,11 +34,11 @@
     "dev": "concurrently --kill-others \"npm run dev-server\" \"npm run dev-electron\"",
     "dev-electron": "cross-env HOT=1 electron build/client/main.js",
     "dev-server": "webpack-dev-server --hot --inline --colors --content-base app/",
-    "tslint": "tslint -c tslint.json \"app/**/*.ts\" \"client/**/*.ts\" \"test/**/*.ts\" \"./*.js\" \"config/**/*.js\"",
+    "tslint": "tslint -c tslint.json \"app/**/*.ts\" \"src/**/*.ts\" \"test/**/*.ts\" \"./*.js\" \"config/**/*.js\"",
     "stylelint": "stylelint --syntax scss \"app/**/*.scss\"",
     "lint": "npm run tslint && npm run stylelint",
     "package": "build --dir",
-    "build-and-pack": "npm run build:prod && npm run package"
+    "build-and-pack": "npm run build:prod && npm run build-python && npm run package"
   },
   "license": "MIT",
   "engines": {
@@ -50,6 +52,15 @@
       "node_modules/",
       "package.json"
     ],
+    "extraResources": [
+      {
+        "from": "python/build/",
+        "to": "python-rpc",
+        "filter": [
+          "**/*"
+        ]
+      }
+    ],
     "dmg": {
       "contents": [
         {
@@ -134,7 +145,6 @@
     "tslint": "~5.2.0",
     "typescript": "~2.3.2",
     "url-loader": "^0.5.7",
-    "vrsource-tslint-rules": "^4.0.1",
     "webpack": "~2.5.1",
     "webpack-dev-server": "^2.2.0",
     "webpack-dll-bundles-plugin": "^1.0.0-beta.5",
@@ -148,12 +158,13 @@
     "@angular/core": "4.1.2",
     "@angular/forms": "4.1.2",
     "@angular/http": "4.1.2",
-    "@angular/material": "2.0.0-beta.3",
+    "@angular/material": "~2.0.0-beta.7",
     "@angular/platform-browser": "4.1.2",
     "@angular/platform-browser-dynamic": "4.1.2",
     "@angular/router": "4.1.2",
     "@angular/tsc-wrapped": "4.1.2",
-    "azure-batch": "1.0.0-preview",
+    "@types/codemirror": "~0.0.40",
+    "azure-batch": "~2.0.0-preview",
     "azure-storage": "^2.1.0",
     "brace": "^0.10.0",
     "bunyan": "^1.8.4",
diff --git a/pylintrc b/pylintrc
new file mode 100644
index 0000000000..33609c7506
--- /dev/null
+++ b/pylintrc
@@ -0,0 +1,406 @@
+[MASTER]
+
+# Specify a configuration file.
+#rcfile=
+
+# Python code to execute, usually for sys.path manipulation such as
+# pygtk.require().
+#init-hook=
+
+# Add files or directories to the blacklist. They should be base names, not
+# paths.
+ignore=CVS
+
+# Add files or directories matching the regex patterns to the blacklist. The
+# regex matches against base names, not paths.
+ignore-patterns=
+
+# Pickle collected data for later comparisons.
+persistent=yes
+
+# List of plugins (as comma separated values of python modules names) to load,
+# usually to register additional checkers.
+load-plugins=
+
+# Use multiple processes to speed up Pylint.
+jobs=1
+
+# Allow loading of arbitrary C extensions. Extensions are imported into the
+# active Python interpreter and may run arbitrary code.
+unsafe-load-any-extension=no
+
+# A comma-separated list of package or module names from where C extensions may
+# be loaded. Extensions are loading into the active Python interpreter and may
+# run arbitrary code
+extension-pkg-whitelist=
+
+# Allow optimization of some AST trees. This will activate a peephole AST
+# optimizer, which will apply various small optimizations. For instance, it can
+# be used to obtain the result of joining multiple strings with the addition
+# operator. Joining a lot of strings can lead to a maximum recursion error in
+# Pylint and this flag can prevent that. It has one side effect, the resulting
+# AST will be different than the one from reality. This option is deprecated
+# and it will be removed in Pylint 2.0.
+optimize-ast=no
+
+
+[MESSAGES CONTROL]
+
+# Only show warnings with the listed confidence levels. Leave empty to show
+# all. Valid levels: HIGH, INFERENCE, INFERENCE_FAILURE, UNDEFINED
+confidence=
+
+# Enable the message, report, category or checker with the given id(s). You can
+# either give multiple identifier separated by comma (,) or put this option
+# multiple time (only on the command line, not in the configuration file where
+# it should appear only once). See also the "--disable" option for examples.
+#enable=
+
+# Disable the message, report, category or checker with the given id(s). You
+# can either give multiple identifiers separated by comma (,) or put this
+# option multiple times (only on the command line, not in the configuration
+# file where it should appear only once).You can also use "--disable=all" to
+# disable everything first and then reenable specific checks. For example, if
+# you want to run only the similarities checker, you can use "--disable=all
+# --enable=similarities". If you want to run only the classes checker, but have
+# no Warning level messages displayed, use"--disable=all --enable=classes
+# --disable=W"
+# disable=print-statement,parameter-unpacking,unpacking-in-except,old-raise-syntax,backtick,import-star-module-level,apply-builtin,basestring-builtin,buffer-builtin,cmp-builtin,coerce-builtin,execfile-builtin,file-builtin,long-builtin,raw_input-builtin,reduce-builtin,standarderror-builtin,unicode-builtin,xrange-builtin,coerce-method,delslice-method,getslice-method,setslice-method,no-absolute-import,old-division,dict-iter-method,dict-view-method,next-method-called,metaclass-assignment,indexing-exception,raising-string,reload-builtin,oct-method,hex-method,nonzero-method,cmp-method,input-builtin,round-builtin,intern-builtin,unichr-builtin,map-builtin-not-iterating,zip-builtin-not-iterating,range-builtin-not-iterating,filter-builtin-not-iterating,using-cmp-argument,long-suffix,old-ne-operator,old-octal-literal,suppressed-message,useless-suppression
+disable = C0111,W0401,I0011,C0103
+
+[REPORTS]
+
+# Set the output format. Available formats are text, parseable, colorized, msvs
+# (visual studio) and html. You can also give a reporter class, eg
+# mypackage.mymodule.MyReporterClass.
+output-format=text
+
+# Put messages in a separate file for each module / package specified on the
+# command line instead of printing them on stdout. Reports (if any) will be
+# written in a file name "pylint_global.[txt|html]". This option is deprecated
+# and it will be removed in Pylint 2.0.
+files-output=no
+
+# Tells whether to display a full report or only the messages
+reports=yes
+
+# Python expression which should return a note less than 10 (10 is the highest
+# note). You have access to the variables errors warning, statement which
+# respectively contain the number of errors / warnings messages and the total
+# number of statements analyzed. This is used by the global evaluation report
+# (RP0004).
+evaluation=10.0 - ((float(5 * error + warning + refactor + convention) / statement) * 10)
+
+# Template used to display messages. This is a python new-style format string
+# used to format the message information. See doc for all details
+#msg-template=
+
+
+[BASIC]
+
+# Good variable names which should always be accepted, separated by a comma
+good-names=i,j,k,ex,Run,_
+
+# Bad variable names which should always be refused, separated by a comma
+bad-names=foo,bar,baz,toto,tutu,tata
+
+# Colon-delimited sets of names that determine each other's naming style when
+# the name regexes allow several styles.
+name-group=
+
+# Include a hint for the correct naming format with invalid-name
+include-naming-hint=no
+
+# List of decorators that produce properties, such as abc.abstractproperty. Add
+# to this list to register other decorators that produce valid properties.
+property-classes=abc.abstractproperty
+
+# Regular expression matching correct module names
+module-rgx=(([a-z_][a-z0-9_]*)|([A-Z][a-zA-Z0-9]+))$
+
+# Naming hint for module names
+module-name-hint=(([a-z_][a-z0-9_]*)|([A-Z][a-zA-Z0-9]+))$
+
+# Regular expression matching correct constant names
+const-rgx=(([A-Z_][A-Z0-9_]*)|(__.*__))$
+
+# Naming hint for constant names
+const-name-hint=(([A-Z_][A-Z0-9_]*)|(__.*__))$
+
+# Regular expression matching correct class names
+class-rgx=[A-Z_][a-zA-Z0-9]+$
+
+# Naming hint for class names
+class-name-hint=[A-Z_][a-zA-Z0-9]+$
+
+# Regular expression matching correct function names
+function-rgx=[a-z_][a-z0-9_]{2,30}$
+
+# Naming hint for function names
+function-name-hint=[a-z_][a-z0-9_]{2,30}$
+
+# Regular expression matching correct method names
+method-rgx=[a-z_][a-z0-9_]{2,30}$
+
+# Naming hint for method names
+method-name-hint=[a-z_][a-z0-9_]{2,30}$
+
+# Regular expression matching correct attribute names
+attr-rgx=[a-z_][a-z0-9_]{2,30}$
+
+# Naming hint for attribute names
+attr-name-hint=[a-z_][a-z0-9_]{2,30}$
+
+# Regular expression matching correct argument names
+argument-rgx=[a-z_][a-z0-9_]{2,30}$
+
+# Naming hint for argument names
+argument-name-hint=[a-z_][a-z0-9_]{2,30}$
+
+# Regular expression matching correct variable names
+variable-rgx=[a-z_][a-z0-9_]{2,30}$
+
+# Naming hint for variable names
+variable-name-hint=[a-z_][a-z0-9_]{2,30}$
+
+# Regular expression matching correct class attribute names
+class-attribute-rgx=([A-Za-z_][A-Za-z0-9_]{2,30}|(__.*__))$
+
+# Naming hint for class attribute names
+class-attribute-name-hint=([A-Za-z_][A-Za-z0-9_]{2,30}|(__.*__))$
+
+# Regular expression matching correct inline iteration names
+inlinevar-rgx=[A-Za-z_][A-Za-z0-9_]*$
+
+# Naming hint for inline iteration names
+inlinevar-name-hint=[A-Za-z_][A-Za-z0-9_]*$
+
+# Regular expression which should only match function or class names that do
+# not require a docstring.
+no-docstring-rgx=^_
+
+# Minimum line length for functions/classes that require docstrings, shorter
+# ones are exempt.
+docstring-min-length=-1
+
+[ELIF]
+
+# Maximum number of nested blocks for function / method body
+max-nested-blocks=5
+
+
+[FORMAT]
+
+# Maximum number of characters on a single line.
+max-line-length=120
+
+# Regexp for a line that is allowed to be longer than the limit.
+ignore-long-lines=^\s*(# )?<?https?://\S+>?$
+
+# Allow the body of an if to be on the same line as the test if there is no
+# else.
+single-line-if-stmt=no
+
+# List of optional constructs for which whitespace checking is disabled. `dict-
+# separator` is used to allow tabulation in dicts, etc.: {1  : 1,\n222: 2}.
+# `trailing-comma` allows a space between comma and closing bracket: (a, ).
+# `empty-line` allows space-only lines.
+no-space-check=trailing-comma,dict-separator
+
+# Maximum number of lines in a module
+max-module-lines=1000
+
+# String used as indentation unit. This is usually "    " (4 spaces) or "\t" (1
+# tab).
+indent-string='    '
+
+# Number of spaces of indent required inside a hanging  or continued line.
+indent-after-paren=4
+
+# Expected format of line ending, e.g. empty (any line ending), LF or CRLF.
+expected-line-ending-format=
+
+
+[LOGGING]
+
+# Logging modules to check that the string format arguments are in logging
+# function parameter format
+logging-modules=logging
+
+
+[MISCELLANEOUS]
+
+# List of note tags to take in consideration, separated by a comma.
+notes=FIXME,XXX,TODO
+
+
+[SIMILARITIES]
+
+# Minimum lines number of a similarity.
+min-similarity-lines=4
+
+# Ignore comments when computing similarities.
+ignore-comments=yes
+
+# Ignore docstrings when computing similarities.
+ignore-docstrings=yes
+
+# Ignore imports when computing similarities.
+ignore-imports=no
+
+
+[SPELLING]
+
+# Spelling dictionary name. Available dictionaries: none. To make it working
+# install python-enchant package.
+spelling-dict=
+
+# List of comma separated words that should not be checked.
+spelling-ignore-words=
+
+# A path to a file that contains private dictionary; one word per line.
+spelling-private-dict-file=
+
+# Tells whether to store unknown words to indicated private dictionary in
+# --spelling-private-dict-file option instead of raising a message.
+spelling-store-unknown-words=no
+
+
+[TYPECHECK]
+
+# Tells whether missing members accessed in mixin class should be ignored. A
+# mixin class is detected if its name ends with "mixin" (case insensitive).
+ignore-mixin-members=yes
+
+# List of module names for which member attributes should not be checked
+# (useful for modules/projects where namespaces are manipulated during runtime
+# and thus existing member attributes cannot be deduced by static analysis. It
+# supports qualified module names, as well as Unix pattern matching.
+ignored-modules=
+
+# List of class names for which member attributes should not be checked (useful
+# for classes with dynamically set attributes). This supports the use of
+# qualified names.
+ignored-classes=optparse.Values,thread._local,_thread._local
+
+# List of members which are set dynamically and missed by pylint inference
+# system, and so shouldn't trigger E1101 when accessed. Python regular
+# expressions are accepted.
+generated-members=
+
+# List of decorators that produce context managers, such as
+# contextlib.contextmanager. Add to this list to register other decorators that
+# produce valid context managers.
+contextmanager-decorators=contextlib.contextmanager
+
+
+[VARIABLES]
+
+# Tells whether we should check for unused import in __init__ files.
+init-import=no
+
+# A regular expression matching the name of dummy variables (i.e. expectedly
+# not used).
+dummy-variables-rgx=(_+[a-zA-Z0-9]*?$)|dummy
+
+# List of additional names supposed to be defined in builtins. Remember that
+# you should avoid to define new builtins when possible.
+additional-builtins=
+
+# List of strings which can identify a callback function by name. A callback
+# name must start or end with one of those strings.
+callbacks=cb_,_cb
+
+# List of qualified module names which can have objects that can redefine
+# builtins.
+redefining-builtins-modules=six.moves,future.builtins
+
+
+[CLASSES]
+
+# List of method names used to declare (i.e. assign) instance attributes.
+defining-attr-methods=__init__,__new__,setUp
+
+# List of valid names for the first argument in a class method.
+valid-classmethod-first-arg=cls
+
+# List of valid names for the first argument in a metaclass class method.
+valid-metaclass-classmethod-first-arg=mcs
+
+# List of member names, which should be excluded from the protected access
+# warning.
+exclude-protected=_asdict,_fields,_replace,_source,_make
+
+
+[DESIGN]
+
+# Maximum number of arguments for function / method
+max-args=5
+
+# Argument names that match this expression will be ignored. Default to name
+# with leading underscore
+ignored-argument-names=_.*
+
+# Maximum number of locals for function / method body
+max-locals=15
+
+# Maximum number of return / yield for function / method body
+max-returns=6
+
+# Maximum number of branch for function / method body
+max-branches=12
+
+# Maximum number of statements in function / method body
+max-statements=50
+
+# Maximum number of parents for a class (see R0901).
+max-parents=7
+
+# Maximum number of attributes for a class (see R0902).
+max-attributes=7
+
+# Minimum number of public methods for a class (see R0903).
+min-public-methods=2
+
+# Maximum number of public methods for a class (see R0904).
+max-public-methods=20
+
+# Maximum number of boolean expressions in a if statement
+max-bool-expr=5
+
+
+[IMPORTS]
+
+# Deprecated modules which should not be used, separated by a comma
+deprecated-modules=optparse
+
+# Create a graph of every (i.e. internal and external) dependencies in the
+# given file (report RP0402 must not be disabled)
+import-graph=
+
+# Create a graph of external dependencies in the given file (report RP0402 must
+# not be disabled)
+ext-import-graph=
+
+# Create a graph of internal dependencies in the given file (report RP0402 must
+# not be disabled)
+int-import-graph=
+
+# Force import order to recognize a module as part of the standard
+# compatibility libraries.
+known-standard-library=
+
+# Force import order to recognize a module as part of a third party library.
+known-third-party=enchant
+
+# Analyse import fallback blocks. This can be used to support both Python 2 and
+# 3 compatible code, which means that the block might have code that exists
+# only in one or another interpreter, leading to false positives when analysed.
+analyse-fallback-blocks=no
+
+
+[EXCEPTIONS]
+
+# Exceptions that will emit a warning when being caught. Defaults to
+# "Exception"
+overgeneral-exceptions=Exception
diff --git a/python/.gitignore b/python/.gitignore
new file mode 100644
index 0000000000..fdad5c7c95
--- /dev/null
+++ b/python/.gitignore
@@ -0,0 +1,98 @@
+# Byte-compiled / optimized / DLL files
+__pycache__/
+*.py[cod]
+*$py.class
+
+# C extensions
+*.so
+
+# Distribution / packaging
+.Python
+env/
+build/
+develop-eggs/
+dist/
+downloads/
+eggs/
+.eggs/
+lib/
+lib64/
+parts/
+sdist/
+var/
+wheels/
+*.egg-info/
+.installed.cfg
+*.egg
+
+# PyInstaller
+#  Usually these files are written by a python script from a template
+#  before PyInstaller builds the exe, so as to inject date/other infos into it.
+*.manifest
+*.spec
+
+# Installer logs
+pip-log.txt
+pip-delete-this-directory.txt
+
+# Unit test / coverage reports
+htmlcov/
+.tox/
+.coverage
+.coverage.*
+.cache
+nosetests.xml
+coverage.xml
+*,cover
+.hypothesis/
+
+# Translations
+*.mo
+*.pot
+
+# Django stuff:
+*.log
+local_settings.py
+
+# Flask stuff:
+instance/
+.webassets-cache
+
+# Scrapy stuff:
+.scrapy
+
+# Sphinx documentation
+docs/_build/
+
+# PyBuilder
+target/
+
+# Jupyter Notebook
+.ipynb_checkpoints
+
+# pyenv
+.python-version
+
+# celery beat schedule file
+celerybeat-schedule
+
+# SageMath parsed files
+*.sage.py
+
+# dotenv
+.env
+
+# virtualenv
+.venv
+venv/
+ENV/
+
+# Spyder project settings
+.spyderproject
+.spyproject
+
+# Rope project settings
+.ropeproject
+
+# mkdocs documentation
+/site
diff --git a/python/controllers/__init__.py b/python/controllers/__init__.py
new file mode 100644
index 0000000000..19b0f47f8e
--- /dev/null
+++ b/python/controllers/__init__.py
@@ -0,0 +1,10 @@
+"""
+    Add all your controllers here.
+    They all will be imported automatically
+"""
+from os.path import dirname, basename, isfile
+import glob
+
+modules = glob.glob(dirname(__file__) + "/*.py")
+__all__ = [basename(f)[:-3] for f in modules if isfile(f)]
+
diff --git a/python/controllers/test_controller.py b/python/controllers/test_controller.py
new file mode 100644
index 0000000000..16cb3d35ce
--- /dev/null
+++ b/python/controllers/test_controller.py
@@ -0,0 +1,7 @@
+from server.app import app
+
+@app.procedure("foo")
+def foo(params):
+    print("got data", params)
+
+    return {"what": "it works!"}
diff --git a/python/jsonrpc/__init__.py b/python/jsonrpc/__init__.py
new file mode 100644
index 0000000000..b4393b9707
--- /dev/null
+++ b/python/jsonrpc/__init__.py
@@ -0,0 +1,7 @@
+"""
+    This module define json-rpc module
+"""
+
+from .error import *
+from .request import *
+from .response import *
diff --git a/python/jsonrpc/error.py b/python/jsonrpc/error.py
new file mode 100644
index 0000000000..1020fd276e
--- /dev/null
+++ b/python/jsonrpc/error.py
@@ -0,0 +1,66 @@
+import json
+
+
+class JsonRpcErrorCodes:
+    PARSE_ERROR = -32700
+    INVALID_REQUEST = -32600
+    METHOD_NOT_FOUND = -32601
+    INVALID_PARAMS = -32602
+    INTERNAL_ERROR = -32603
+
+
+JSONRPC_ERROR_MESSAGE = dict([
+    (JsonRpcErrorCodes.PARSE_ERROR, "Parse error"),
+    (JsonRpcErrorCodes.INVALID_REQUEST, "nvalid request"),
+    (JsonRpcErrorCodes.METHOD_NOT_FOUND, "Method not found"),
+    (JsonRpcErrorCodes.INVALID_PARAMS, "Invalid params"),
+    (JsonRpcErrorCodes.INTERNAL_ERROR, "Internal error"),
+])
+
+
+class JsonRpcError(BaseException):
+    """
+        Class representing a JSON rpc error
+    """
+
+    def __init__(self, code: str, message: str, data: object):
+        super().__init__()
+        self.code = code
+        self.message = message
+        self.data = data
+
+    def to_json(self):
+        return json.dumps({
+            'code': self.code,
+            'message': self.message,
+            'data': self.data,
+        })
+
+
+class JsonRpcParseError(JsonRpcError):
+    def __init__(self, decode_error: json.JSONDecodeError, original: object):
+        data = {
+            'error': decode_error.msg,
+            'request': original
+        }
+        super().__init__(JsonRpcErrorCodes.PARSE_ERROR,
+                         JSONRPC_ERROR_MESSAGE[JsonRpcErrorCodes.PARSE_ERROR], data)
+
+
+class JsonRpcInvalidRequestError(JsonRpcError):
+    def __init__(self, data: object):
+        code = JsonRpcErrorCodes.INVALID_REQUEST
+        super().__init__(code, JSONRPC_ERROR_MESSAGE[code], data)
+
+
+class JsonRpcInvalidParamsError(JsonRpcError):
+    def __init__(self, data: object):
+        code = JsonRpcErrorCodes.INVALID_PARAMS
+        super().__init__(code, JSONRPC_ERROR_MESSAGE[code], data)
+
+
+class JsonRpcMethodNotFoundError(JsonRpcError):
+    def __init__(self, method: str):
+        data = dict({'methodName': method})
+        code = JsonRpcErrorCodes.METHOD_NOT_FOUND
+        super().__init__(code, JSONRPC_ERROR_MESSAGE[code], data)
diff --git a/python/jsonrpc/request.py b/python/jsonrpc/request.py
new file mode 100644
index 0000000000..5bb2f6c27e
--- /dev/null
+++ b/python/jsonrpc/request.py
@@ -0,0 +1,27 @@
+import json
+from .error import JsonRpcParseError
+
+
+class JsonRpcRequest:
+    """
+        Class for a json rpc request
+    """
+
+    def __init__(self, jsonrpc: str, method: str, params: any, request_id: str):
+        self.jsonrpc = jsonrpc
+        self.method = method
+        self.params = params
+        self.request_id = request_id
+
+    @staticmethod
+    def from_json(json_str: str):
+        try:
+            data = json.loads(json_str)
+            return JsonRpcRequest(
+                jsonrpc=data['jsonrpc'],
+                method=data['method'],
+                params=data['params'],
+                request_id=data['id'],
+            )
+        except json.JSONDecodeError as error:
+            raise JsonRpcParseError(error, json_str)
diff --git a/python/jsonrpc/response.py b/python/jsonrpc/response.py
new file mode 100644
index 0000000000..d71f98229c
--- /dev/null
+++ b/python/jsonrpc/response.py
@@ -0,0 +1,36 @@
+import json
+from .error import JsonRpcError
+from .request import JsonRpcRequest
+
+
+class JsonRpcResponse:
+    """
+        Class for a json rpc response.
+    """
+
+    def __init__(self, request: JsonRpcRequest, result: any=None, error: JsonRpcError=None):
+        self.jsonrpc = "2.0"
+        self.result = result
+        self.error = error
+        self.request = request
+
+    def to_json(self) -> str:
+        """
+            Return the json object of the response matching the JSONRPC 2.0 specs
+        """
+        data = {
+            'jsonrpc': self.jsonrpc,
+        }
+
+        if self.request:
+            data['id'] = self.request.request_id
+        else:
+            data['id'] = None
+
+        if self.result:
+            data['result'] = self.result
+
+        if self.error:
+            data['error'] = self.error.__dict__
+
+        return json.dumps(data)
diff --git a/python/main.py b/python/main.py
new file mode 100644
index 0000000000..94faf51ec4
--- /dev/null
+++ b/python/main.py
@@ -0,0 +1,18 @@
+"""
+    Main module
+"""
+
+import signal
+import server.websocket_server
+
+signal.signal(signal.SIGINT, signal.SIG_DFL)
+
+def run():
+    """
+        Main function of the app that start the server
+    """
+    ws_server = server.websocket_server.WebsocketServer(8765)
+    ws_server.run_forever()
+
+if __name__ == "__main__":
+    run()
diff --git a/python/requirements.txt b/python/requirements.txt
new file mode 100644
index 0000000000..431cb27bb0
Binary files /dev/null and b/python/requirements.txt differ
diff --git a/python/server/__init__.py b/python/server/__init__.py
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/python/server/app.py b/python/server/app.py
new file mode 100644
index 0000000000..22728a775b
--- /dev/null
+++ b/python/server/app.py
@@ -0,0 +1,47 @@
+from jsonrpc.error import JsonRpcMethodNotFoundError
+
+
+class BatchLabsApp:
+    """
+        Batch labs app
+    """
+
+    def __init__(self):
+        self.procedures = dict()
+
+    def procedure(self, name: str, **options):
+        def decorator(func):
+            self.add_procedure(name, func, **options)
+            return func
+        return decorator
+
+    def add_procedure(self, name: str, callback=None):
+        """Connects a URL rule.  Works exactly like the :meth:`route`
+        decorator.
+
+        Basically this example::
+
+            @app.procedure('foo')
+            def foo():
+                pass
+
+        Is equivalent to the following::
+
+            def foo():
+                pass
+            app.add_procedure('foo', foo)
+
+        """
+        self.procedures[name] = callback
+
+    def call_procedure(self, name: str, params):
+        """
+            Call the register procedure with the given name. If none found it raise a JsonRpcMethodNotFoundError
+        """
+        if name in self.procedures:
+            return self.procedures[name](params)
+        else:
+            raise JsonRpcMethodNotFoundError(name)
+
+
+app = BatchLabsApp()
diff --git a/python/server/websocket_server.py b/python/server/websocket_server.py
new file mode 100644
index 0000000000..a9eb90c7e7
--- /dev/null
+++ b/python/server/websocket_server.py
@@ -0,0 +1,74 @@
+import asyncio
+import websockets
+from jsonrpc import JsonRpcRequest, JsonRpcResponse, error
+from .app import app
+from controllers import *
+
+class WebsocketServer:
+    """
+        Websocket server core class. It will handle receiving and sending messages
+    """
+
+    def __init__(self, port):
+        self.port = port
+        self.start_server = websockets.serve(
+            self.handler, "localhost", self.port)
+
+    def run_forever(self):
+        """
+            Start to serve the server forever.
+        """
+        print("Starting websocket server...")
+        asyncio.get_event_loop().run_until_complete(self.start_server)
+        asyncio.get_event_loop().run_forever()
+
+    async def handler(self, websocket, _):
+        """
+            Websocket handler
+        """
+        connection = WebsocketConnection(websocket)
+        await connection.listen()
+
+
+class WebsocketConnection:
+    def __init__(self, websocket):
+        self.websocket = websocket
+
+    async def listen(self):
+        while True:
+            message = await self.websocket.recv()
+            try:
+                request = self.parse_request(message)
+            except error.JsonRpcParseError as parse_error:
+                response = JsonRpcResponse(
+                    request=None,
+                    error=parse_error,
+                )
+                await self.send_response(response)
+            else:
+                await self.process_request(request)
+
+    async def process_request(self, request: JsonRpcRequest):
+        try:
+            print("< {0} {1}".format(request.request_id, request.method))
+
+            result = app.call_procedure(request.method, request.params)
+            response = JsonRpcResponse(
+                request=request,
+                result=result,
+            )
+            await self.send_response(response)
+        except error.JsonRpcError as rpc_error:
+            response = JsonRpcResponse(
+                request=request,
+                error=rpc_error,
+            )
+            await self.send_response(response)
+
+    def parse_request(self, message: str) -> JsonRpcRequest:
+        return JsonRpcRequest.from_json(message)
+
+    async def send_response(self, response: JsonRpcResponse):
+        data = response.to_json()
+        await self.websocket.send(data)
+        print("> {}".format(data))
diff --git a/python/setup.py b/python/setup.py
new file mode 100644
index 0000000000..aa6f064865
--- /dev/null
+++ b/python/setup.py
@@ -0,0 +1,20 @@
+import os
+from cx_Freeze import setup, Executable
+
+dir_path = os.path.dirname(os.path.realpath(__file__))
+
+# Dependencies are automatically detected, but it might need fine tuning.
+build_exe_options = {
+    "build_exe": os.path.join(dir_path, "build"),
+    "packages": ["os", "asyncio"],
+    "include_files": [(os.path.join(dir_path, "controllers/"), "controllers/")],
+    "excludes": ["tkinter"],
+}
+
+setup(
+    name="blpythonrpc",
+    version="0.1",
+    description="BatchLabs Python rpc server",
+    options={"build_exe": build_exe_options},
+    executables=[Executable(os.path.join(dir_path, "main.py"))]
+)
diff --git a/client/api/batch-client-proxy/accountProxy.ts b/src/client/api/batch-client-proxy/accountProxy.ts
similarity index 100%
rename from client/api/batch-client-proxy/accountProxy.ts
rename to src/client/api/batch-client-proxy/accountProxy.ts
diff --git a/client/api/batch-client-proxy/batch-client-proxy-factory.ts b/src/client/api/batch-client-proxy/batch-client-proxy-factory.ts
similarity index 100%
rename from client/api/batch-client-proxy/batch-client-proxy-factory.ts
rename to src/client/api/batch-client-proxy/batch-client-proxy-factory.ts
diff --git a/client/api/batch-client-proxy/batch-client-proxy.ts b/src/client/api/batch-client-proxy/batch-client-proxy.ts
similarity index 100%
rename from client/api/batch-client-proxy/batch-client-proxy.ts
rename to src/client/api/batch-client-proxy/batch-client-proxy.ts
diff --git a/client/api/batch-client-proxy/batch-models.ts b/src/client/api/batch-client-proxy/batch-models.ts
similarity index 100%
rename from client/api/batch-client-proxy/batch-models.ts
rename to src/client/api/batch-client-proxy/batch-models.ts
diff --git a/client/api/batch-client-proxy/fileProxy.ts b/src/client/api/batch-client-proxy/fileProxy.ts
similarity index 100%
rename from client/api/batch-client-proxy/fileProxy.ts
rename to src/client/api/batch-client-proxy/fileProxy.ts
diff --git a/client/api/batch-client-proxy/index.ts b/src/client/api/batch-client-proxy/index.ts
similarity index 100%
rename from client/api/batch-client-proxy/index.ts
rename to src/client/api/batch-client-proxy/index.ts
diff --git a/client/api/batch-client-proxy/jobProxy.ts b/src/client/api/batch-client-proxy/jobProxy.ts
similarity index 85%
rename from client/api/batch-client-proxy/jobProxy.ts
rename to src/client/api/batch-client-proxy/jobProxy.ts
index 7fbf0bc0e4..5f7f43aa3f 100644
--- a/client/api/batch-client-proxy/jobProxy.ts
+++ b/src/client/api/batch-client-proxy/jobProxy.ts
@@ -82,4 +82,17 @@ export default class JobProxy {
     public patch(jobId: string, attributes: any, options?: any): Promise<any> {
         return this.client.job.patch(jobId, attributes, wrapOptions(options));
     }
+
+    /**
+     */
+    public listHookTasks(jobId: string, options?: models.JobListPreparationAndReleaseTaskStatusNextOptions) {
+        const entity = {
+            list: this.client.job.listPreparationAndReleaseTaskStatus.bind(this.client.job),
+            listNext: this.client.job.listPreparationAndReleaseTaskStatusNext.bind(this.client.job),
+        };
+
+        // returns all of the tasklets, there is no nextLink data
+        return new ListProxy(entity, [jobId],
+            wrapOptions({ jobListPreparationAndReleaseTaskStatusOptions: options }));
+    }
 }
diff --git a/client/api/batch-client-proxy/models/batchResult.ts b/src/client/api/batch-client-proxy/models/batchResult.ts
similarity index 100%
rename from client/api/batch-client-proxy/models/batchResult.ts
rename to src/client/api/batch-client-proxy/models/batchResult.ts
diff --git a/client/api/batch-client-proxy/models/index.ts b/src/client/api/batch-client-proxy/models/index.ts
similarity index 100%
rename from client/api/batch-client-proxy/models/index.ts
rename to src/client/api/batch-client-proxy/models/index.ts
diff --git a/client/api/batch-client-proxy/nodeProxy.ts b/src/client/api/batch-client-proxy/nodeProxy.ts
similarity index 98%
rename from client/api/batch-client-proxy/nodeProxy.ts
rename to src/client/api/batch-client-proxy/nodeProxy.ts
index 2760cede90..552cb148d9 100644
--- a/client/api/batch-client-proxy/nodeProxy.ts
+++ b/src/client/api/batch-client-proxy/nodeProxy.ts
@@ -10,7 +10,8 @@ export default class NodeProxy {
     }
 
     public list(poolId: string, options?: models.ComputeNodeListOptions) {
-        return new ListProxy(this.client.computeNodeOperations, [poolId], wrapOptions(options));
+        return new ListProxy(this.client.computeNodeOperations, [poolId],
+            wrapOptions({ computeNodeListOptions: options }));
     }
 
     public get(poolId: string, nodeId: string, options?: any): Promise<BatchResult> {
diff --git a/client/api/batch-client-proxy/poolProxy.ts b/src/client/api/batch-client-proxy/poolProxy.ts
similarity index 92%
rename from client/api/batch-client-proxy/poolProxy.ts
rename to src/client/api/batch-client-proxy/poolProxy.ts
index 3fde6ba932..544c206d90 100644
--- a/client/api/batch-client-proxy/poolProxy.ts
+++ b/src/client/api/batch-client-proxy/poolProxy.ts
@@ -44,9 +44,10 @@ export default class PoolProxy {
      * @param targetDedicated: The desired number of nodes in the pool
      * @param options: Optional Parameters.
      */
-    public resize(poolId: string, targetDedicated: number, options?: any): Promise<any> {
+    public resize(poolId: string, target: any, options?: any): Promise<any> {
         let resizeBody: any = {};
-        resizeBody.targetDedicated = Number(targetDedicated);
+        resizeBody.targetDedicatedNodes = Number(target.targetDedicatedNodes);
+        resizeBody.targetLowPriorityNodes = Number(target.targetLowPriorityNodes);
 
         return this.client.pool.resize(poolId, resizeBody, wrapOptions(options));
     }
diff --git a/client/api/batch-client-proxy/shared/index.ts b/src/client/api/batch-client-proxy/shared/index.ts
similarity index 100%
rename from client/api/batch-client-proxy/shared/index.ts
rename to src/client/api/batch-client-proxy/shared/index.ts
diff --git a/client/api/batch-client-proxy/shared/list-proxy.ts b/src/client/api/batch-client-proxy/shared/list-proxy.ts
similarity index 100%
rename from client/api/batch-client-proxy/shared/list-proxy.ts
rename to src/client/api/batch-client-proxy/shared/list-proxy.ts
diff --git a/client/api/batch-client-proxy/shared/options-utils.ts b/src/client/api/batch-client-proxy/shared/options-utils.ts
similarity index 100%
rename from client/api/batch-client-proxy/shared/options-utils.ts
rename to src/client/api/batch-client-proxy/shared/options-utils.ts
diff --git a/client/api/batch-client-proxy/shared/proxy-utils.ts b/src/client/api/batch-client-proxy/shared/proxy-utils.ts
similarity index 100%
rename from client/api/batch-client-proxy/shared/proxy-utils.ts
rename to src/client/api/batch-client-proxy/shared/proxy-utils.ts
diff --git a/client/api/batch-client-proxy/taskProxy.ts b/src/client/api/batch-client-proxy/taskProxy.ts
similarity index 100%
rename from client/api/batch-client-proxy/taskProxy.ts
rename to src/client/api/batch-client-proxy/taskProxy.ts
diff --git a/client/api/index.ts b/src/client/api/index.ts
similarity index 100%
rename from client/api/index.ts
rename to src/client/api/index.ts
diff --git a/client/api/storage-client-proxy/blob-storage-client-proxy.ts b/src/client/api/storage-client-proxy/blob-storage-client-proxy.ts
similarity index 100%
rename from client/api/storage-client-proxy/blob-storage-client-proxy.ts
rename to src/client/api/storage-client-proxy/blob-storage-client-proxy.ts
diff --git a/client/api/storage-client-proxy/index.ts b/src/client/api/storage-client-proxy/index.ts
similarity index 100%
rename from client/api/storage-client-proxy/index.ts
rename to src/client/api/storage-client-proxy/index.ts
diff --git a/client/api/storage-client-proxy/models/blobStorageResult.ts b/src/client/api/storage-client-proxy/models/blobStorageResult.ts
similarity index 100%
rename from client/api/storage-client-proxy/models/blobStorageResult.ts
rename to src/client/api/storage-client-proxy/models/blobStorageResult.ts
diff --git a/client/api/storage-client-proxy/models/index.ts b/src/client/api/storage-client-proxy/models/index.ts
similarity index 100%
rename from client/api/storage-client-proxy/models/index.ts
rename to src/client/api/storage-client-proxy/models/index.ts
diff --git a/client/api/storage-client-proxy/models/storageRequestOptions.ts b/src/client/api/storage-client-proxy/models/storageRequestOptions.ts
similarity index 100%
rename from client/api/storage-client-proxy/models/storageRequestOptions.ts
rename to src/client/api/storage-client-proxy/models/storageRequestOptions.ts
diff --git a/client/api/storage-client-proxy/storage-client-proxy-factory.ts b/src/client/api/storage-client-proxy/storage-client-proxy-factory.ts
similarity index 100%
rename from client/api/storage-client-proxy/storage-client-proxy-factory.ts
rename to src/client/api/storage-client-proxy/storage-client-proxy-factory.ts
diff --git a/client/authentication/authentication-window.ts b/src/client/authentication/authentication-window.ts
similarity index 100%
rename from client/authentication/authentication-window.ts
rename to src/client/authentication/authentication-window.ts
diff --git a/client/authentication/index.ts b/src/client/authentication/index.ts
similarity index 100%
rename from client/authentication/index.ts
rename to src/client/authentication/index.ts
diff --git a/client/client-constants.ts b/src/client/client-constants.ts
similarity index 84%
rename from client/client-constants.ts
rename to src/client/client-constants.ts
index 1fb79eb368..54fc869fc6 100644
--- a/client/client-constants.ts
+++ b/src/client/client-constants.ts
@@ -14,11 +14,11 @@ const urls = {
         prod: `file://${__dirname}/../../build/index.html`,
     },
     splash: {
-        dev: `file://${root}/client/splash-screen/splash-screen.html`,
+        dev: `file://${root}/src/client/splash-screen/splash-screen.html`,
         prod: `file://${root}/build/client/splash-screen/splash-screen.html`,
     },
     recover: {
-        dev: `file://${root}/client/recover-window/recover-window.html`,
+        dev: `file://${root}/src/client/recover-window/recover-window.html`,
         prod: `file://${root}/build/client/recover-window/recover-window.html`,
     },
     icon: __dirname + "/../assets/images/icon.ico",
diff --git a/client/core/global.ts b/src/client/core/global.ts
similarity index 100%
rename from client/core/global.ts
rename to src/client/core/global.ts
diff --git a/client/core/index.ts b/src/client/core/index.ts
similarity index 66%
rename from client/core/index.ts
rename to src/client/core/index.ts
index 23dbc6bb4e..12496bc413 100644
--- a/client/core/index.ts
+++ b/src/client/core/index.ts
@@ -1,2 +1,3 @@
 export * from "./unique-window";
 export * from "./global";
+export * from "./subprocess";
diff --git a/src/client/core/subprocess.ts b/src/client/core/subprocess.ts
new file mode 100644
index 0000000000..3e6aff8c3c
--- /dev/null
+++ b/src/client/core/subprocess.ts
@@ -0,0 +1,27 @@
+import { exec } from "child_process";
+
+/**
+ * Result of running execCommand
+ */
+export interface ExecCommandResult {
+    stdout: string;
+    stderr: string;
+}
+
+/**
+ * Execute a command line and wait for the output.
+ * @param command Command line to run
+ *
+ * @returns Promise that resolove when the command line complete.
+ */
+export function execCommand(command: string): Promise<ExecCommandResult> {
+    return new Promise((resolve, reject) => {
+        exec(command, (error: string, stdout: string, stderr: string) => {
+            if (error) {
+                reject(error);
+            } else {
+                resolve({ stdout, stderr });
+            }
+        });
+    });
+}
diff --git a/client/core/unique-window.ts b/src/client/core/unique-window.ts
similarity index 100%
rename from client/core/unique-window.ts
rename to src/client/core/unique-window.ts
diff --git a/client/logger/index.ts b/src/client/logger/index.ts
similarity index 100%
rename from client/logger/index.ts
rename to src/client/logger/index.ts
diff --git a/client/logger/logger-proxy.ts b/src/client/logger/logger-proxy.ts
similarity index 100%
rename from client/logger/logger-proxy.ts
rename to src/client/logger/logger-proxy.ts
diff --git a/client/main-window/index.ts b/src/client/main-window/index.ts
similarity index 100%
rename from client/main-window/index.ts
rename to src/client/main-window/index.ts
diff --git a/client/main-window/main-window.ts b/src/client/main-window/main-window.ts
similarity index 100%
rename from client/main-window/main-window.ts
rename to src/client/main-window/main-window.ts
diff --git a/client/main.prod.ts b/src/client/main.prod.ts
similarity index 100%
rename from client/main.prod.ts
rename to src/client/main.prod.ts
diff --git a/client/main.ts b/src/client/main.ts
similarity index 93%
rename from client/main.ts
rename to src/client/main.ts
index 0e520c085f..f40427fc65 100644
--- a/client/main.ts
+++ b/src/client/main.ts
@@ -1,10 +1,13 @@
 import { app, ipcMain, protocol } from "electron";
 import * as path from "path";
-
 app.setPath("userData", path.join(app.getPath("appData"), "batch-labs"));
 
 import { windows } from "./core";
 import { logger } from "./logger";
+import { PythonRpcServerProcess } from "./python-process";
+
+const pythonServer = new PythonRpcServerProcess();
+pythonServer.start();
 
 // Create the browser window.
 function createWindow() {
diff --git a/src/client/python-process/index.ts b/src/client/python-process/index.ts
new file mode 100644
index 0000000000..dcddad6e46
--- /dev/null
+++ b/src/client/python-process/index.ts
@@ -0,0 +1,2 @@
+export * from "./python-rpc-server-process";
+export * from "./python-executable";
diff --git a/src/client/python-process/python-executable.ts b/src/client/python-process/python-executable.ts
new file mode 100644
index 0000000000..619edf6d7d
--- /dev/null
+++ b/src/client/python-process/python-executable.ts
@@ -0,0 +1,95 @@
+import { execCommand } from "../core";
+
+let computedPythonPath: string = null;
+
+export class PythonExecutableError extends Error {
+    constructor(public message) {
+        super();
+    }
+}
+
+export class PythonExecutableNotFoundError extends PythonExecutableError {
+    constructor(public executable) {
+        super(`Python exec "${executable}" is not found.`);
+    }
+}
+
+/**
+ * Try the given python path to see if it exists and is of a valid version.
+ * @param pythonPath Path to the python executable
+ * @returns Promise with the python path if it is a valid python environment or reject with the error.
+ */
+export function tryPython(pythonPath: string): Promise<string> {
+    return execCommand(`${pythonPath} --version`).then(({ stdout }) => {
+        const pythonVersion = parsePythonVersion(stdout);
+        if (!pythonVersion) {
+            throw new PythonExecutableError(`Could not parse python version from string ${stdout}`);
+        }
+        if (!isValidVersion(pythonVersion)) {
+            throw new PythonExecutableError(`Python version is not valid please install python >= 3.6`);
+        }
+        return pythonPath;
+    }).catch((error) => {
+        return Promise.reject(new PythonExecutableNotFoundError(pythonPath));
+    });
+}
+
+/**
+ * Try a list of python paths sequentially. As soon as 1 valid path is found it resolve this one.
+ * @param paths List of python executable paths.
+ * @returns Promise that resolve the first valid path. If no path are valid reject with an error.
+ */
+export function tryMultiplePythons(paths: string[]): Promise<string> {
+    let promise = Promise.reject(null);
+    const errors = {};
+
+    for (let path of paths) {
+        promise = promise.catch((error) => {
+            errors[path] = error;
+            return tryPython(path);
+        }).then(() => {
+            return path;
+        });
+    }
+    return promise;
+}
+
+/**
+ * Retrieve the python path that should be used for batch labs.
+ * It will only look for the python executable on the first run. It will then used the cached value
+ */
+export function getPythonPath(): Promise<string> {
+    if (computedPythonPath) {
+        return Promise.resolve(computedPythonPath);
+    }
+    const envPython = process.env.BL_PYTHON_PATH;
+    return tryMultiplePythons([envPython, "python3", "python"].filter(x => Boolean(x))).then((path) => {
+        computedPythonPath = path;
+        return path;
+    });
+}
+
+const pythonVersionRegex = /Python\s*([\d.]+)/;
+const pythonVersion = "3.6";
+
+/**
+ * Parse the version from the stdout
+ * @param str Stdout of running python --version
+ */
+function parsePythonVersion(str: string) {
+    const out = pythonVersionRegex.exec(str);
+
+    if (!out || out.length < 2) {
+        return null;
+    } else {
+        return out[1];
+    }
+}
+
+/**
+ * Check if the version is the right for batchlabs.
+ * @param version Python version
+ */
+function isValidVersion(version: string) {
+    return version.startsWith(pythonVersion);
+}
diff --git a/src/client/python-process/python-rpc-server-process.ts b/src/client/python-process/python-rpc-server-process.ts
new file mode 100644
index 0000000000..b768ec193a
--- /dev/null
+++ b/src/client/python-process/python-rpc-server-process.ts
@@ -0,0 +1,59 @@
+import { ChildProcess, spawn } from "child_process";
+import * as path from "path";
+
+import { Constants } from "../client-constants";
+import { logger } from "../logger";
+import { getPythonPath } from "./python-executable";
+
+const asarPath = path.join(Constants.root, "../python-rpc/main");
+const localPath = path.join(Constants.root, "python/main.py");
+
+export class PythonRpcServerProcess {
+    private _spawedProcess: ChildProcess;
+    private _askForKill: boolean;
+    /**
+     * Start the python server
+     * @returns Promise when the process has spawned
+     */
+    public start(): Promise<void> {
+        this._askForKill = false;
+        return this._getCommandLine().then((data) => {
+            logger.info("Python path is", data.cmd, { args: data.args });
+            const child = this._spawedProcess = spawn(data.cmd, [...data.args]);
+            child.on("exit", (code) => {
+                if (this._askForKill) {
+                    logger.info("Python rpc server has stopped!");
+                } else {
+                    logger.error("Python Rpc server has exited unexpectedly with code!", code);
+                }
+            });
+            logger.info("Python Rpc server started!");
+        });
+    }
+
+    public stop() {
+        if (this._spawedProcess) {
+            this._askForKill = true;
+            logger.info("Stopping python rpc server!");
+            this._spawedProcess.kill();
+        }
+    }
+
+    public restart() {
+        this.stop();
+        this.start();
+    }
+
+    private _getCommandLine(): Promise<{ cmd: string, args: string[] }> {
+        if (Constants.isAsar) {
+            return Promise.resolve({ cmd: asarPath, args: [] });
+        } else {
+            return getPythonPath().then(pythonPath => {
+                return {
+                    cmd: pythonPath,
+                    args: [localPath],
+                };
+            });
+        }
+    }
+}
diff --git a/client/recover-window/index.ts b/src/client/recover-window/index.ts
similarity index 100%
rename from client/recover-window/index.ts
rename to src/client/recover-window/index.ts
diff --git a/client/recover-window/recover-window.html b/src/client/recover-window/recover-window.html
similarity index 100%
rename from client/recover-window/recover-window.html
rename to src/client/recover-window/recover-window.html
diff --git a/client/recover-window/recover-window.ts b/src/client/recover-window/recover-window.ts
similarity index 100%
rename from client/recover-window/recover-window.ts
rename to src/client/recover-window/recover-window.ts
diff --git a/client/splash-screen/flask.svg b/src/client/splash-screen/flask.svg
similarity index 100%
rename from client/splash-screen/flask.svg
rename to src/client/splash-screen/flask.svg
diff --git a/client/splash-screen/index.ts b/src/client/splash-screen/index.ts
similarity index 100%
rename from client/splash-screen/index.ts
rename to src/client/splash-screen/index.ts
diff --git a/client/splash-screen/splash-screen.html b/src/client/splash-screen/splash-screen.html
similarity index 100%
rename from client/splash-screen/splash-screen.html
rename to src/client/splash-screen/splash-screen.html
diff --git a/client/splash-screen/splash-screen.ts b/src/client/splash-screen/splash-screen.ts
similarity index 100%
rename from client/splash-screen/splash-screen.ts
rename to src/client/splash-screen/splash-screen.ts
diff --git a/test/app/components/account/base/storage-account-picker/storage-account-picker.component.spec.ts b/test/app/components/account/base/storage-account-picker/storage-account-picker.component.spec.ts
new file mode 100644
index 0000000000..5edc54bc1f
--- /dev/null
+++ b/test/app/components/account/base/storage-account-picker/storage-account-picker.component.spec.ts
@@ -0,0 +1,108 @@
+import { Component, DebugElement, NO_ERRORS_SCHEMA } from "@angular/core";
+import { ComponentFixture, TestBed } from "@angular/core/testing";
+import { FormsModule } from "@angular/forms";
+import { By } from "@angular/platform-browser";
+import { RouterTestingModule } from "@angular/router/testing";
+import { List } from "immutable";
+import { Observable } from "rxjs";
+
+import { StorageAccountPickerComponent } from "app/components/account/base/storage-account-picker";
+import { TableCellComponent } from "app/components/base/table";
+import { AccountResource, StorageAccount } from "app/models";
+import { StorageAccountService } from "app/services";
+import { LoadingMockComponent, TableMockComponent } from "test/utils/mocks/components";
+
+const account = new AccountResource({
+    id: "acc-1", location: "westus",
+    subscription: { subscriptionId: "sub-1" },
+} as any);
+
+@Component({
+    template: `
+        <bl-storage-account-picker [account]="account" [(ngModel)]="storageAccountId"></bl-storage-account-picker>
+    `,
+})
+class TestComponent {
+    public storageAccountId: string;
+    public account = account;
+}
+
+describe("StorageAccountPickerComponent", () => {
+    let fixture: ComponentFixture<TestComponent>;
+    let testComponent: TestComponent;
+    let component: StorageAccountPickerComponent;
+    let de: DebugElement;
+    let storageServiceSpy;
+    let preferedTable: DebugElement;
+    let otherTable: DebugElement;
+
+    beforeEach(() => {
+        storageServiceSpy = {
+            list: () => Observable.of(List([
+                new StorageAccount({ id: "sub-1/storage-1", name: "storage-1", location: "westus" } as any),
+                new StorageAccount({ id: "sub-1/storage-2", name: "storage-2", location: "brazilsouth" } as any),
+                new StorageAccount({ id: "sub-1/storage-3", name: "storage-3", location: "westus" } as any),
+                new StorageAccount({ id: "sub-1/storage-4", name: "storage-4", location: "easteurope" } as any),
+                new StorageAccount({ id: "sub-1/storage-5", name: "storage-5", location: "eastus" } as any),
+            ])),
+        };
+        TestBed.configureTestingModule({
+            imports: [RouterTestingModule, FormsModule],
+            declarations: [
+                StorageAccountPickerComponent, TableMockComponent, TableCellComponent,
+                LoadingMockComponent, TestComponent,
+            ],
+            providers: [
+                { provide: StorageAccountService, useValue: storageServiceSpy },
+            ],
+            schemas: [NO_ERRORS_SCHEMA],
+        });
+        fixture = TestBed.createComponent(TestComponent);
+        testComponent = fixture.componentInstance;
+        de = fixture.debugElement.query(By.css("bl-storage-account-picker"));
+        component = de.componentInstance;
+        fixture.detectChanges();
+
+        preferedTable = de.query(By.css("bl-table.prefered"));
+        otherTable = de.query(By.css("bl-table.others"));
+    });
+
+    it("should split accounts in best region and other regions", () => {
+        const preferedRows = preferedTable.queryAll(By.css("bl-row"));
+        expect(preferedRows.length).toBe(3); // 2 plus the no account row
+        expect(preferedRows[0].nativeElement.textContent).toContain("No storage account");
+        expect(preferedRows[1].nativeElement.textContent).toContain("storage-1");
+        expect(preferedRows[1].nativeElement.textContent).toContain("westus");
+        expect(preferedRows[2].nativeElement.textContent).toContain("storage-3");
+        expect(preferedRows[2].nativeElement.textContent).toContain("westus");
+
+        const otherRows = otherTable.queryAll(By.css("bl-row"));
+        expect(otherRows.length).toBe(3);
+        expect(otherRows[0].nativeElement.textContent).toContain("storage-2");
+        expect(otherRows[1].nativeElement.textContent).toContain("storage-4");
+        expect(otherRows[2].nativeElement.textContent).toContain("storage-5");
+    });
+
+    it("should propagate changes", () => {
+        component.pickStorageAccount("sub-1/storage-3");
+        fixture.detectChanges();
+
+        expect(testComponent.storageAccountId).toBe("sub-1/storage-3", "Change should propagate");
+        expect(preferedTable.componentInstance.activeItem).toBe("sub-1/storage-3", "Prefered Table updated activeItem");
+        expect(otherTable.componentInstance.activeItem).toBe("sub-1/storage-3", "Others Table updated activeItem");
+    });
+
+    it("should unselect account when clicking on the no storage account row", () => {
+        component.pickStorageAccount("sub-1/storage-3");
+        fixture.detectChanges();
+
+        component.pickStorageAccount(component.noSelectionKey);
+        fixture.detectChanges();
+
+        expect(testComponent.storageAccountId).toBe(null, "Change should propagate");
+        expect(preferedTable.componentInstance.activeItem).toBe(component.noSelectionKey,
+            "Prefered Table updated activeItem");
+        expect(otherTable.componentInstance.activeItem).toBe(component.noSelectionKey,
+            "Others Table updated activeItem");
+    });
+});
diff --git a/test/app/components/account/details/storage-account-card/storage-account-card.component.spec.ts b/test/app/components/account/details/storage-account-card/storage-account-card.component.spec.ts
new file mode 100644
index 0000000000..889e141f28
--- /dev/null
+++ b/test/app/components/account/details/storage-account-card/storage-account-card.component.spec.ts
@@ -0,0 +1,120 @@
+import { Component, DebugElement } from "@angular/core";
+import { ComponentFixture, TestBed } from "@angular/core/testing";
+import { By } from "@angular/platform-browser";
+import { Observable } from "rxjs";
+
+import { StorageAccountCardComponent } from "app/components/account/details";
+import { SidebarManager } from "app/components/base/sidebar";
+import { AccountResource, ServerError, StorageAccount } from "app/models";
+import { StorageAccountService } from "app/services";
+
+const accountNoStorage = new AccountResource({ id: "acc-1", location: "westus", properties: {} } as any);
+const accountWithStorage = new AccountResource({
+    id: "acc-1",
+    location: "westus",
+    properties: {
+        autoStorage: { storageAccountId: "sub-1/storage-1" },
+    },
+} as any);
+const accountWithInvalidStorage = new AccountResource({
+    id: "acc-1",
+    location: "westus",
+    properties: {
+        autoStorage: { storageAccountId: "sub-1/storage-wrong" },
+    },
+} as any);
+const storage1 = new StorageAccount({ id: "sub-1/storage-1", name: "storage-1", location: "westus" } as any);
+
+@Component({
+    template: `<bl-storage-account-card [account]="account"></bl-storage-account-card>`,
+})
+class TestComponent {
+    public account = accountWithStorage;
+}
+
+describe("StorageAccountCardComponent", () => {
+    let fixture: ComponentFixture<TestComponent>;
+    let testComponent: TestComponent;
+    let component: StorageAccountCardComponent;
+    let de: DebugElement;
+    let storageAccountServiceSpy;
+
+    beforeEach(() => {
+        storageAccountServiceSpy = {
+            get: (storageAccountId: string) => {
+                if (storageAccountId === "sub-1/storage-1") {
+                    return Observable.of(storage1);
+                } else {
+                    return Observable.throw(new ServerError({
+                        status: 404, statusText: "Not found",
+                        body: { message: "Storage doesn't exists" },
+                        original: null,
+                    }));
+                }
+            },
+        };
+        TestBed.configureTestingModule({
+            imports: [],
+            declarations: [StorageAccountCardComponent, TestComponent],
+            providers: [
+                { provide: SidebarManager, useValue: null },
+                { provide: StorageAccountService, useValue: storageAccountServiceSpy },
+            ],
+        });
+        fixture = TestBed.createComponent(TestComponent);
+        testComponent = fixture.componentInstance;
+        de = fixture.debugElement.query(By.css("bl-storage-account-card"));
+        component = de.componentInstance;
+        fixture.detectChanges();
+    });
+
+    describe("when account has no storage account", () => {
+        beforeEach(() => {
+            testComponent.account = accountNoStorage;
+            fixture.detectChanges();
+        });
+
+        it("should show the button with setup text", () => {
+            const btn = de.query(By.css("button.edit"));
+            expect(btn).not.toBeFalsy();
+            expect(btn.nativeElement.textContent).toContain("Setup");
+            expect(btn.nativeElement.textContent).not.toContain("Edit");
+        });
+    });
+
+    describe("when account has A storage account", () => {
+        beforeEach(() => {
+            testComponent.account = accountWithStorage;
+            fixture.detectChanges();
+        });
+
+        it("should show the button with edit text", () => {
+            const btn = de.query(By.css("button.edit"));
+            expect(btn).not.toBeFalsy();
+            expect(btn.nativeElement.textContent).toContain("Edit");
+            expect(btn.nativeElement.textContent).not.toContain("Setup");
+        });
+
+        it("should show the account name", () => {
+            expect(de.query(By.css(".details")).nativeElement.textContent).toContain("storage-1");
+        });
+    });
+
+    describe("when account has A Invalid storage account", () => {
+        beforeEach(() => {
+            testComponent.account = accountWithInvalidStorage;
+            fixture.detectChanges();
+        });
+
+        it("should show the button with edit text", () => {
+            const btn = de.query(By.css("button.edit"));
+            expect(btn).not.toBeFalsy();
+            expect(btn.nativeElement.textContent).toContain("Edit");
+            expect(btn.nativeElement.textContent).not.toContain("Setup");
+        });
+
+        it("should show the error", () => {
+            expect(de.query(By.css(".details")).nativeElement.textContent).toContain("Not found");
+        });
+    });
+});
diff --git a/test/app/components/application/errors/application-error-display.component.spec.ts b/test/app/components/application/errors/application-error-display.component.spec.ts
index 9334519ad7..d3bb300b45 100644
--- a/test/app/components/application/errors/application-error-display.component.spec.ts
+++ b/test/app/components/application/errors/application-error-display.component.spec.ts
@@ -4,8 +4,9 @@ import { By } from "@angular/platform-browser";
 import { BehaviorSubject } from "rxjs";
 
 import { ApplicationErrorDisplayComponent } from "app/components/application/errors";
+import { SidebarManager } from "app/components/base/sidebar";
 import { AccountResource, Application } from "app/models";
-import { AccountService, ElectronShell } from "app/services";
+import { AccountService } from "app/services";
 import * as Fixtures from "test/fixture";
 import { BannerMockComponent } from "test/utils/mocks/components";
 
@@ -22,7 +23,7 @@ describe("ApplicationErrorDisplayComponent", () => {
     let component: ApplicationErrorDisplayComponent;
     let accountUnderTest: BehaviorSubject<AccountResource>;
     let accountServiceSpy: any;
-    let shellSpy;
+    let sidebarSpy;
 
     beforeEach(() => {
         accountUnderTest = new BehaviorSubject<AccountResource>(Fixtures.account.create({
@@ -38,15 +39,15 @@ describe("ApplicationErrorDisplayComponent", () => {
             currentAccount: accountUnderTest,
         };
 
-        shellSpy = {
-            openItem: jasmine.createSpy("openItem"),
+        sidebarSpy = {
+            open: jasmine.createSpy("open"),
         };
 
         TestBed.configureTestingModule({
             declarations: [ApplicationErrorDisplayComponent, BannerMockComponent, TestApplicationErrorDisplayComponent],
             providers: [
                 { provide: AccountService, useValue: accountServiceSpy },
-                { provide: ElectronShell, useValue: shellSpy },
+                { provide: SidebarManager, useValue: sidebarSpy },
             ],
             schemas: [NO_ERRORS_SCHEMA],
         });
diff --git a/test/app/components/base/background-task/background-task-tracker.spec.ts b/test/app/components/base/background-task/background-task-tracker.spec.ts
index 9af59722df..262c1832fb 100644
--- a/test/app/components/base/background-task/background-task-tracker.spec.ts
+++ b/test/app/components/base/background-task/background-task-tracker.spec.ts
@@ -13,7 +13,7 @@ describe("BackgroundTaskTrackerComponent", () => {
 
     beforeEach(() => {
         TestBed.configureTestingModule({
-            imports: [MaterialModule.forRoot(), BackgroundTaskModule],
+            imports: [MaterialModule, BackgroundTaskModule],
             declarations: [
             ],
         });
diff --git a/test/app/components/base/banner/banner.spec.ts b/test/app/components/base/banner/banner.spec.ts
index e1e40c5a52..0a78c4efa3 100644
--- a/test/app/components/base/banner/banner.spec.ts
+++ b/test/app/components/base/banner/banner.spec.ts
@@ -1,13 +1,14 @@
 import { Component, DebugElement, NO_ERRORS_SCHEMA, ViewChild } from "@angular/core";
-import { ComponentFixture, TestBed } from "@angular/core/testing";
+import { ComponentFixture, TestBed, fakeAsync } from "@angular/core/testing";
 import { By } from "@angular/platform-browser";
+import { AsyncSubject } from "rxjs";
 
 import { BannerComponent, BannerOtherFixDirective } from "app/components/base/banner";
 import { mouseenter } from "test/utils/helpers";
 
 @Component({
     template: `
-        <bl-banner #banner [fix]="fix1" fixMessage="Main fix" [type]="type">
+        <bl-banner #banner [fix]="fix1" fixMessage="Main fix" [type]="type" [id]="bannerId">
             <div code>Error 404</div>
             <div message>Page not found</div>
             <div details *ngIf="includeDetails">You got to look carefully where you go</div>
@@ -24,6 +25,8 @@ export class BannerTestComponent {
     public includeOtherFixes = false;
     public type = "error";
 
+    public bannerId = "id-1";
+
     public fix1: jasmine.Spy;
     public fix2: jasmine.Spy;
     public fix3: jasmine.Spy;
@@ -31,9 +34,9 @@ export class BannerTestComponent {
 
 describe("BannerComponent", () => {
     let fixture: ComponentFixture<BannerTestComponent>;
-    let component: BannerTestComponent;
-    let bannerElement: DebugElement;
-    let bannerComponent: BannerComponent;
+    let testComponent: BannerTestComponent;
+    let de: DebugElement;
+    let component: BannerComponent;
 
     beforeEach(() => {
         TestBed.configureTestingModule({
@@ -43,25 +46,25 @@ describe("BannerComponent", () => {
 
         TestBed.compileComponents();
         fixture = TestBed.createComponent(BannerTestComponent);
-        component = fixture.componentInstance;
-        component.fix1 = jasmine.createSpy("Fix 1");
-        component.fix2 = jasmine.createSpy("Fix 2");
-        component.fix3 = jasmine.createSpy("Fix 3");
+        testComponent = fixture.componentInstance;
+        testComponent.fix1 = jasmine.createSpy("Fix 1");
+        testComponent.fix2 = jasmine.createSpy("Fix 2");
+        testComponent.fix3 = jasmine.createSpy("Fix 3");
         fixture.detectChanges();
-        bannerElement = fixture.debugElement.query(By.css("bl-banner"));
-        bannerComponent = bannerElement.componentInstance;
+        de = fixture.debugElement.query(By.css("bl-banner"));
+        component = de.componentInstance;
     });
 
     it("should be of error type by default", () => {
-        expect(bannerComponent.type).toBe("error");
-        expect(bannerElement.query(By.css("md-card")).nativeElement.className).toContain("error");
+        expect(component.type).toBe("error");
+        expect(de.query(By.css("md-card")).nativeElement.className).toContain("error");
     });
 
     it("should be of warning type when changed", () => {
-        component.type = "warning";
+        testComponent.type = "warning";
         fixture.detectChanges();
-        expect(bannerComponent.type).toBe("warning");
-        expect(bannerElement.query(By.css("md-card")).nativeElement.className).toContain("warning");
+        expect(component.type).toBe("warning");
+        expect(de.query(By.css("md-card")).nativeElement.className).toContain("warning");
     });
 
     describe("When there is details", () => {
@@ -70,26 +73,26 @@ describe("BannerComponent", () => {
         });
 
         it("should not show the more fixes button", () => {
-            expect(bannerElement.query(By.css(".other-fixes-btn"))).toBeNull();
+            expect(de.query(By.css(".other-fixes-btn"))).toBeNull();
         });
 
         it("should not have the carret on facing left", () => {
-            const carretEl = bannerElement.query(By.css(".caret"));
+            const carretEl = de.query(By.css(".caret"));
             expect(carretEl).not.toBe(null);
             expect(carretEl.classes["fa-caret-left"]).toBe(true);
             expect(carretEl.classes["fa-caret-down"]).toBe(false);
         });
 
         it("should show details after you click", () => {
-            bannerElement.query(By.css(".summary-container")).nativeElement.click();
+            de.query(By.css(".summary-container")).nativeElement.click();
             expect(fixture.componentRef.instance.banner.showDetails).toBe(true);
         });
 
         it("carret change when you click", () => {
-            bannerElement.query(By.css(".summary-container")).nativeElement.click();
+            de.query(By.css(".summary-container")).nativeElement.click();
             fixture.detectChanges();
 
-            const carretEl = bannerElement.query(By.css(".caret"));
+            const carretEl = de.query(By.css(".caret"));
             expect(carretEl).not.toBe(null);
             expect(carretEl.classes["fa-caret-left"]).toBe(false);
             expect(carretEl.classes["fa-caret-down"]).toBe(true);
@@ -103,31 +106,31 @@ describe("BannerComponent", () => {
         });
 
         it("should not have the carret", () => {
-            const carretEl = bannerElement.query(By.css(".caret"));
+            const carretEl = de.query(By.css(".caret"));
             expect(carretEl).toBe(null);
         });
 
         it("clicking should not do anything", () => {
-            bannerElement.query(By.css(".summary-container")).nativeElement.click();
+            de.query(By.css(".summary-container")).nativeElement.click();
             expect(fixture.componentRef.instance.banner.showDetails).toBe(false);
         });
     });
 
     describe("when there is other fixes", () => {
         beforeEach(() => {
-            component.includeOtherFixes = true;
+            testComponent.includeOtherFixes = true;
             fixture.detectChanges();
         });
 
         it("should show the more fixes button", () => {
-            expect(bannerElement.query(By.css(".other-fixes-btn"))).not.toBeNull();
-            expect(bannerElement.query(By.css(".other-fixes"))).toBeNull();
+            expect(de.query(By.css(".other-fixes-btn"))).not.toBeNull();
+            expect(de.query(By.css(".other-fixes"))).toBeNull();
         });
 
         it("should list other fixes when mouse over the more fixes button", () => {
-            mouseenter(bannerElement.query(By.css(".other-fixes-btn")));
+            mouseenter(de.query(By.css(".other-fixes-btn")));
             fixture.detectChanges();
-            const otherFixesEl = bannerElement.query(By.css(".other-fixes"));
+            const otherFixesEl = de.query(By.css(".other-fixes"));
             expect(otherFixesEl).not.toBeNull();
             const els = otherFixesEl.queryAll(By.css(".other-fix"));
             expect(els.length).toBe(2);
@@ -135,4 +138,26 @@ describe("BannerComponent", () => {
             expect(els[1].nativeElement.textContent).toContain("Third fix");
         });
     });
+
+    describe("when switching id after clicking fix it", () => {
+        let subject;
+        beforeEach(() => {
+            subject = new AsyncSubject();
+            testComponent.fix1 = (() => subject) as any;
+            fixture.detectChanges();
+            component.triggerFix();
+            fixture.detectChanges();
+            expect(de.query(By.css(".quick-fix-btn-container .btn")).nativeElement.textContent).toContain("Fixing");
+        });
+
+        it("should not show the fixed message", fakeAsync(() => {
+            testComponent.bannerId = "id-2";
+            fixture.detectChanges();
+            expect(de.query(By.css(".quick-fix-btn-container .btn")).nativeElement.textContent).toContain("Main fix");
+            subject.next(true);
+            subject.complete();
+            expect(de.query(By.css(".quick-fix-btn-container .btn")).nativeElement.textContent)
+                .toContain("Main fix", "Should still be Main fix after fix observable resolve");
+        }));
+    });
 });
diff --git a/test/app/components/base/buttons/action-button.component.spec.ts b/test/app/components/base/buttons/action-button.component.spec.ts
new file mode 100644
index 0000000000..e8715fe7f8
--- /dev/null
+++ b/test/app/components/base/buttons/action-button.component.spec.ts
@@ -0,0 +1,98 @@
+import { Component, DebugElement, NO_ERRORS_SCHEMA } from "@angular/core";
+import { ComponentFixture, TestBed } from "@angular/core/testing";
+import { By } from "@angular/platform-browser";
+
+import { MaterialModule, MdTooltip } from "@angular/material";
+import { ActionButtonComponent } from "app/components/base/buttons/action-button.component";
+import { click } from "test/utils/helpers";
+
+@Component({
+    template: `
+        <bl-action-btn [disabled]="disabled" icon="fa fa-stop" (action)="onAction()" title="Stop" [color]="color">
+        </bl-action-btn>
+    `,
+})
+class TestComponent {
+    public disabled: boolean = false;
+
+    public onAction: jasmine.Spy;
+
+    public color = "primary";
+    constructor() {
+        this.onAction = jasmine.createSpy("onAction");
+    }
+}
+
+describe("ActionButton", () => {
+    let fixture: ComponentFixture<TestComponent>;
+    let testComponent: TestComponent;
+    let component: ActionButtonComponent;
+    let de: DebugElement;
+
+    beforeEach(() => {
+        TestBed.configureTestingModule({
+            imports: [MaterialModule],
+            declarations: [ActionButtonComponent, TestComponent],
+            schemas: [NO_ERRORS_SCHEMA],
+        });
+        fixture = TestBed.createComponent(TestComponent);
+        testComponent = fixture.componentInstance;
+        de = fixture.debugElement.query(By.css("bl-action-btn"));
+        component = de.componentInstance;
+        fixture.detectChanges();
+    });
+
+    it("should have the icon specified", () => {
+        const icon = de.query(By.css("i.fa.fa-stop"));
+        expect(icon).not.toBeFalsy();
+    });
+
+    it("Should have the tooltip specified with title", () => {
+        const el = de.query(By.css(".action-btn"));
+        const tooltip = el.injector.get(MdTooltip);
+        expect(tooltip.message).toBe("Stop");
+    });
+
+    it("should change color", () => {
+        expect(de.attributes["color"]).toBe("primary");
+
+        testComponent.color = "warn";
+        fixture.detectChanges();
+        expect(de.attributes["color"]).toBe("warn");
+
+    });
+
+    describe("when disabled", () => {
+        beforeEach(() => {
+            testComponent.disabled = true;
+            fixture.detectChanges();
+        });
+
+        it("should have the disabled class", () => {
+            expect(de.classes["disabled"]).toBe(true);
+        });
+
+        it("should not trigger the event on click", () => {
+            click(de);
+            fixture.detectChanges();
+            expect(testComponent.onAction).not.toHaveBeenCalled();
+        });
+    });
+
+    describe("when enabled", () => {
+        beforeEach(() => {
+            testComponent.disabled = false;
+            fixture.detectChanges();
+        });
+
+        it("should have NOT the disabled class", () => {
+            expect(de.classes["disabled"]).toBe(false);
+        });
+
+        it("should trigger the event on click", () => {
+            click(de);
+            fixture.detectChanges();
+            expect(testComponent.onAction).toHaveBeenCalledOnce();
+        });
+    });
+});
diff --git a/test/app/components/base/form/server-error/server-error.component.spec.ts b/test/app/components/base/form/server-error/server-error.component.spec.ts
index 10c0623988..139b48f22d 100644
--- a/test/app/components/base/form/server-error/server-error.component.spec.ts
+++ b/test/app/components/base/form/server-error/server-error.component.spec.ts
@@ -30,7 +30,7 @@ describe("ServerErrorComponent", () => {
 
     beforeEach(() => {
         TestBed.configureTestingModule({
-            imports: [MaterialModule.forRoot()],
+            imports: [MaterialModule],
             declarations: [
                 ServerErrorComponent,
                 ServerErrorTestComponent,
diff --git a/test/app/components/base/form/simple-form/simple-form.spec.ts b/test/app/components/base/form/simple-form/simple-form.spec.ts
index 7c8cdb71e3..099d15d1b0 100644
--- a/test/app/components/base/form/simple-form/simple-form.spec.ts
+++ b/test/app/components/base/form/simple-form/simple-form.spec.ts
@@ -50,7 +50,7 @@ describe("SimpleFormComponent", () => {
 
     beforeEach(() => {
         TestBed.configureTestingModule({
-            imports: [ReactiveFormsModule, MaterialModule.forRoot()],
+            imports: [ReactiveFormsModule, MaterialModule],
             declarations: [
                 SubmitButtonComponent,
                 FormTestComponent,
diff --git a/test/app/components/base/quick-list/quick-list.component.spec.ts b/test/app/components/base/quick-list/quick-list.component.spec.ts
index 58f3f3cb82..8012065224 100644
--- a/test/app/components/base/quick-list/quick-list.component.spec.ts
+++ b/test/app/components/base/quick-list/quick-list.component.spec.ts
@@ -1,4 +1,4 @@
-import { Component, DebugElement } from "@angular/core";
+import { Component, DebugElement, ViewChild } from "@angular/core";
 import { ComponentFixture, TestBed } from "@angular/core/testing";
 import { By } from "@angular/platform-browser";
 import { RouterTestingModule } from "@angular/router/testing";
@@ -15,7 +15,7 @@ interface TestItem {
 
 @Component({
     template: `
-        <bl-focus-section>
+        <bl-focus-section #focusSection>
             <bl-quick-list>
                 <bl-quick-list-item *ngFor="let item of items" [key]="item.id">
                     <h4 bl-quick-list-item-title>{{item.name}}</h4>
@@ -25,6 +25,9 @@ interface TestItem {
     `,
 })
 class TestComponent {
+    @ViewChild("focusSection")
+    public focusSection: FocusSectionComponent;
+
     public items: TestItem[] = [
         { id: "item-1", name: "Item 1" },
         { id: "item-2", name: "Item 2" },
@@ -83,7 +86,8 @@ describe("QuickListComponent", () => {
 
     it("click on an item should also focus it", () => {
         const item = items[1].query(By.css(".quick-list-item"));
-        fixture.debugElement.query(By.css("bl-focus-section")).nativeElement.focus();
+        testComponent.focusSection.focus();
+
         click(item.nativeElement);
         fixture.detectChanges();
         expect(quicklist.focusedItem.value).toEqual("item-2");
diff --git a/test/app/components/base/sidebar/sidebar-spec-helper.ts b/test/app/components/base/sidebar/sidebar-spec-helper.ts
index 3a747fcc5c..991dc605a7 100644
--- a/test/app/components/base/sidebar/sidebar-spec-helper.ts
+++ b/test/app/components/base/sidebar/sidebar-spec-helper.ts
@@ -47,7 +47,7 @@ export class AppTestComponent implements AfterViewInit {
 export function setupSidebarTest() {
     TestBed.configureTestingModule({
         declarations: [FakeComponent, AppTestComponent],
-        imports: [SidebarModule.forRoot(), MaterialModule.forRoot()],
+        imports: [SidebarModule.forRoot(), MaterialModule],
     });
 
     TestBed.overrideModule(BrowserDynamicTestingModule, {
diff --git a/test/app/components/base/table/table.component.spec.ts b/test/app/components/base/table/table.component.spec.ts
index c536f7e8d1..ceaded0671 100644
--- a/test/app/components/base/table/table.component.spec.ts
+++ b/test/app/components/base/table/table.component.spec.ts
@@ -11,10 +11,10 @@ import {
 import { VmSize } from "app/models";
 import { click } from "test/utils/helpers";
 
-const sizeA = new VmSize({ name: "Size A", numberOfCores: 1, resourceDiskSizeInMB: 1000 });
-const sizeB = new VmSize({ name: "Size B", numberOfCores: 8, resourceDiskSizeInMB: 2000 });
-const sizeC = new VmSize({ name: "Size C", numberOfCores: 4, resourceDiskSizeInMB: 80000 });
-const sizeD = new VmSize({ name: "Size D", numberOfCores: 2, resourceDiskSizeInMB: 4000 });
+const sizeA = new VmSize({ name: "Size A", numberOfCores: 1, resourceDiskSizeInMB: 1000 } as any);
+const sizeB = new VmSize({ name: "Size B", numberOfCores: 8, resourceDiskSizeInMB: 2000 } as any);
+const sizeC = new VmSize({ name: "Size C", numberOfCores: 4, resourceDiskSizeInMB: 80000 } as any);
+const sizeD = new VmSize({ name: "Size D", numberOfCores: 2, resourceDiskSizeInMB: 4000 } as any);
 
 @Component({
     template: `
diff --git a/test/app/components/base/tabs/tabs.spec.ts b/test/app/components/base/tabs/tabs.spec.ts
index 15aff0ad2c..2f72a32297 100644
--- a/test/app/components/base/tabs/tabs.spec.ts
+++ b/test/app/components/base/tabs/tabs.spec.ts
@@ -41,7 +41,7 @@ describe("Tabs", () => {
         };
 
         TestBed.configureTestingModule({
-            imports: [MaterialModule.forRoot(), TabsModule, NoopAnimationsModule],
+            imports: [MaterialModule, TabsModule, NoopAnimationsModule],
             declarations: [TabTestComponent],
             providers: [
                 { provide: Router, useValue: routerSpy },
diff --git a/test/app/components/file/details/file-content.component.spec.ts b/test/app/components/file/details/file-content.component.spec.ts
new file mode 100644
index 0000000000..84d845ede2
--- /dev/null
+++ b/test/app/components/file/details/file-content.component.spec.ts
@@ -0,0 +1,99 @@
+import { Component, DebugElement, NO_ERRORS_SCHEMA } from "@angular/core";
+import { ComponentFixture, TestBed } from "@angular/core/testing";
+import { By } from "@angular/platform-browser";
+import { Observable } from "rxjs";
+
+import { FileContentComponent } from "app/components/file/details";
+import { File } from "app/models";
+import { FileService, StorageService } from "app/services";
+import { click } from "test/utils/helpers";
+
+@Component({
+    template: `<bl-file-content [poolId]="poolId" [nodeId]="nodeId" [filename]="filename"></bl-file-content>`,
+})
+class TestComponent {
+    public poolId = "pool-1";
+    public nodeId = "pool-1";
+    public filename = "some.txt";
+}
+
+describe("FileContentComponent", () => {
+    let fixture: ComponentFixture<TestComponent>;
+    let testComponent: TestComponent;
+    let component: FileContentComponent;
+    let de: DebugElement;
+
+    let storageServiceSpy;
+    let fileServiceSpy;
+
+    beforeEach(() => {
+        storageServiceSpy = {};
+        fileServiceSpy = {
+            fileFromNode: (pool, node, filename) => ({
+                properties: () => Observable.of(new File()),
+                content: () => Observable.of({ content: "something" }),
+            }),
+        };
+        TestBed.configureTestingModule({
+            imports: [],
+            declarations: [FileContentComponent, TestComponent],
+            schemas: [NO_ERRORS_SCHEMA],
+            providers: [
+                { provide: StorageService, useValue: storageServiceSpy },
+                { provide: FileService, useValue: fileServiceSpy },
+            ],
+        });
+        fixture = TestBed.createComponent(TestComponent);
+        testComponent = fixture.componentInstance;
+        de = fixture.debugElement.query(By.css("bl-file-content"));
+        component = de.componentInstance;
+        fixture.detectChanges();
+    });
+
+    it("when file is of type log it should show the log file viewer", () => {
+        testComponent.filename = "some.log";
+        fixture.detectChanges();
+        expect(de.query(By.css("bl-log-file-viewer"))).not.toBeFalsy();
+        expect(de.query(By.css("bl-image-file-viewer"))).toBeFalsy();
+        expect(de.query(By.css("bl-code-file-viewer"))).toBeFalsy();
+        expect(de.query(By.css(".unknown-file-type"))).toBeFalsy();
+    });
+
+    it("when file is of type png it should show the image file viewer", () => {
+        testComponent.filename = "some.png";
+        fixture.detectChanges();
+        expect(de.query(By.css("bl-log-file-viewer"))).toBeFalsy();
+        expect(de.query(By.css("bl-image-file-viewer"))).not.toBeFalsy();
+        expect(de.query(By.css("bl-code-file-viewer"))).toBeFalsy();
+        expect(de.query(By.css(".unknown-file-type"))).toBeFalsy();
+    });
+
+    it("when file is of type py it should show the code file viewer", () => {
+        testComponent.filename = "some.py";
+        fixture.detectChanges();
+        expect(de.query(By.css("bl-log-file-viewer"))).toBeFalsy();
+        expect(de.query(By.css("bl-image-file-viewer"))).toBeFalsy();
+        expect(de.query(By.css("bl-code-file-viewer"))).not.toBeFalsy();
+        expect(de.query(By.css(".unknown-file-type"))).toBeFalsy();
+    });
+
+    it("when file is of unkown type", () => {
+        testComponent.filename = "some.custom";
+        fixture.detectChanges();
+        expect(de.query(By.css("bl-log-file-viewer"))).toBeFalsy();
+        expect(de.query(By.css("bl-image-file-viewer"))).toBeFalsy();
+        expect(de.query(By.css("bl-code-file-viewer"))).toBeFalsy();
+        expect(de.query(By.css(".unknown-file-type"))).not.toBeFalsy();
+
+        const codeBtn = de.query(By.css(".unknown-file-type .code"));
+
+        expect(codeBtn).not.toBeFalsy("Should have the open as code button");
+
+        click(codeBtn);
+        fixture.detectChanges();
+
+        expect(de.query(By.css("bl-code-file-viewer"))).not.toBeFalsy("Should now show the code viewer");
+
+        expect(de.query(By.css(".unknown-file-type"))).toBeFalsy("Should not show the unkown file type anymore");
+    });
+});
diff --git a/test/app/components/file/details/image-file-viewer/image-file-viewer.component.spec.ts b/test/app/components/file/details/image-file-viewer/image-file-viewer.component.spec.ts
new file mode 100644
index 0000000000..5344faeead
--- /dev/null
+++ b/test/app/components/file/details/image-file-viewer/image-file-viewer.component.spec.ts
@@ -0,0 +1,48 @@
+import { Component, DebugElement, NO_ERRORS_SCHEMA } from "@angular/core";
+import { ComponentFixture, TestBed } from "@angular/core/testing";
+import { By } from "@angular/platform-browser";
+import { Observable } from "rxjs";
+
+import { ImageFileViewerComponent } from "app/components/file/details/image-file-viewer";
+
+@Component({
+    template: `<bl-image-file-viewer [fileLoader]="fileLoader"></bl-image-file-viewer>`,
+})
+class TestComponent {
+    public fileLoader;
+}
+
+describe("ImageFileViewerComponent", () => {
+    let fixture: ComponentFixture<TestComponent>;
+    let testComponent: TestComponent;
+    let component: ImageFileViewerComponent;
+    let de: DebugElement;
+
+    beforeEach(() => {
+        TestBed.configureTestingModule({
+            imports: [],
+            declarations: [ImageFileViewerComponent, TestComponent],
+            schemas: [NO_ERRORS_SCHEMA],
+        });
+        fixture = TestBed.createComponent(TestComponent);
+        testComponent = fixture.componentInstance;
+        testComponent.fileLoader = {
+            cache: jasmine.createSpy("file-loader-cache").and.returnValue(Observable.of("cached/file.png")),
+        };
+        de = fixture.debugElement.query(By.css("bl-image-file-viewer"));
+        component = de.componentInstance;
+        fixture.detectChanges();
+    });
+
+    it("Should have called the cache method", () => {
+        expect(testComponent.fileLoader.cache).toHaveBeenCalledOnce();
+    });
+
+    it("Sould set the image src", () => {
+        fixture.detectChanges();
+        expect(component.src).toEqual("file://cached/file.png");
+        const img = de.query(By.css("img"));
+        expect(img).not.toBeFalsy();
+        expect(img.properties.src).toEqual("file://cached/file.png");
+    });
+});
diff --git a/test/app/components/job/action/add/pool-picker.component.spec.ts b/test/app/components/job/action/add/pool-picker.component.spec.ts
index b0fea1100a..49a618539d 100644
--- a/test/app/components/job/action/add/pool-picker.component.spec.ts
+++ b/test/app/components/job/action/add/pool-picker.component.spec.ts
@@ -22,9 +22,9 @@ const config = {
     nodeAgentId: "centos.batch",
 };
 
-const pool1 = new Pool({ id: "pool-1", targetDedicated: 3, virtualMachineConfiguration: config });
-const pool2 = new Pool({ id: "pool-2", targetDedicated: 1, virtualMachineConfiguration: config });
-const pool3 = new Pool({ id: "pool-3", targetDedicated: 19, virtualMachineConfiguration: config });
+const pool1 = new Pool({ id: "pool-1", targetDedicatedNodes: 3, virtualMachineConfiguration: config });
+const pool2 = new Pool({ id: "pool-2", targetDedicatedNodes: 1, virtualMachineConfiguration: config });
+const pool3 = new Pool({ id: "pool-3", targetDedicatedNodes: 19, virtualMachineConfiguration: config });
 
 describe("PoolPickerComponent", () => {
     let fixture: ComponentFixture<TestComponent>;
diff --git a/test/app/components/job/details/error-display/job-error-display.component.spec.ts b/test/app/components/job/details/error-display/job-error-display.component.spec.ts
index f8c923f393..ee6bd0fcae 100644
--- a/test/app/components/job/details/error-display/job-error-display.component.spec.ts
+++ b/test/app/components/job/details/error-display/job-error-display.component.spec.ts
@@ -119,12 +119,12 @@ describe("JobErrorDisplayComponent", () => {
                     maxWallClockTime: moment.duration("PT2M"),
                 },
                 executionInfo: {
-                    schedulingError: {
+                    failureInfo: {
                         code: "InvalidAutoPoolSettings",
                         category: "UserError",
                         message: "Auto pool has invalid settings",
                         details: [
-                            { key: "some", value: "More info" },
+                            { name: "some", value: "More info" },
                         ],
                     },
                 },
diff --git a/test/app/components/job/details/job-progress-status/job-progress-status.component.spec.ts b/test/app/components/job/details/job-progress-status/job-progress-status.component.spec.ts
index 763ad8116e..48b4f5a909 100644
--- a/test/app/components/job/details/job-progress-status/job-progress-status.component.spec.ts
+++ b/test/app/components/job/details/job-progress-status/job-progress-status.component.spec.ts
@@ -1,10 +1,12 @@
 import { Component, DebugElement, NO_ERRORS_SCHEMA } from "@angular/core";
 import { ComponentFixture, TestBed } from "@angular/core/testing";
 import { By } from "@angular/platform-browser";
+import { Observable } from "rxjs";
 
 import { JobProgressStatusComponent } from "app/components/job/details/job-progress-status";
-import { Job, Node, Pool, TaskState } from "app/models";
-import { NodeService, PoolService } from "app/services";
+import { Job, Node, Pool } from "app/models";
+import { NodeService, PoolService, TaskService } from "app/services";
+import { PollService } from "app/services/core";
 import { click } from "test/utils/helpers";
 import { RxMockEntityProxy, RxMockListProxy } from "test/utils/mocks";
 import { GaugeMockComponent } from "test/utils/mocks/components";
@@ -27,48 +29,42 @@ describe("JobProgressStatusComponent", () => {
     let de: DebugElement;
     let poolServiceSpy;
     let nodeServiceSpy;
+    let taskServiceSpy;
+    let pollServiceSpy;
 
     beforeEach(() => {
         poolServiceSpy = {
             get: () => new RxMockEntityProxy<any, Pool>(Pool, {
-                item: new Pool({ id: "pool-1", maxTasksPerNode: 8, targetDedicated: 3 }),
+                item: new Pool({ id: "pool-1", maxTasksPerNode: 8, targetDedicatedNodes: 3 }),
             }),
         };
 
         nodeServiceSpy = {
             list: () => new RxMockListProxy<any, Node>(Node, {
                 items: [
-                    new Node({
-                        id: "node-1",
-                        recentTasks: [
-                            { taskId: "running-1", taskState: TaskState.running, jobId: "job-1" },
-                            { taskId: "running-2", taskState: TaskState.running, jobId: "job-1" },
-                            { taskId: "completed-1", taskState: TaskState.completed, jobId: "job-1" },
-                        ],
-                    }),
-                    new Node({
-                        id: "node-2",
-                        recentTasks: [
-                            { taskId: "running-3", taskState: TaskState.running, jobId: "job-1" },
-                            { taskId: "running-wrong-job", taskState: TaskState.running, jobId: "job-2" },
-                            { taskId: "active-1", taskState: TaskState.active, jobId: "job-1" },
-                        ],
-                    }),
-                    new Node({
-                        id: "node-3", recentTasks: [
-                            { taskId: "running-4", taskState: TaskState.running, jobId: "job-1" },
-                        ],
-                    }),
+                    new Node({ id: "node-1", runningTasksCount: 2 }),
+                    new Node({ id: "node-2", runningTasksCount: 2 }),
+                    new Node({ id: "node-3", runningTasksCount: 1 }),
                 ],
             }),
         };
 
+        taskServiceSpy = {
+            countTasks: jasmine.createSpy("countTasks").and.returnValue(Observable.of(4)),
+        };
+
+        pollServiceSpy = {
+            startPoll: () => ({}),
+        };
+
         TestBed.configureTestingModule({
             declarations: [JobProgressStatusComponent, GaugeMockComponent, TestComponent],
             schemas: [NO_ERRORS_SCHEMA],
             providers: [
                 { provide: PoolService, useValue: poolServiceSpy },
                 { provide: NodeService, useValue: nodeServiceSpy },
+                { provide: TaskService, useValue: taskServiceSpy },
+                { provide: PollService, useValue: pollServiceSpy },
             ],
         });
         fixture = TestBed.createComponent(TestComponent);
@@ -103,7 +99,7 @@ describe("JobProgressStatusComponent", () => {
         const options = de.queryAll(By.css(".toggle-job-pool-tasks > .option"));
         click(options[1]);
         fixture.detectChanges();
-        expect(gaugeComponent.value).toBe(5, "Should all task on pool");
+        expect(gaugeComponent.value).toBe(5, "Should count task on pool");
 
         click(options[0]);
         fixture.detectChanges();
diff --git a/test/app/components/node/connect/download-rdp.component.spec.ts b/test/app/components/node/connect/download-rdp.component.spec.ts
index 0d66765254..76959eebd6 100644
--- a/test/app/components/node/connect/download-rdp.component.spec.ts
+++ b/test/app/components/node/connect/download-rdp.component.spec.ts
@@ -99,9 +99,9 @@ describe("DownloadRdpComponent", () => {
             btn.submit().subscribe(() => {
                 expect(fsServiceSpy.saveFile).toHaveBeenCalledOnce();
                 const expectedContent = "full address:s:0.0.0.0\nusername:s:.\\bar\nprompt for credentials:i:1";
-                expect(fsServiceSpy.saveFile).toHaveBeenCalledWith("node-1.rdp",
-                    expectedContent,
-                    path.join("temp-folder", "rdp"));
+                expect(fsServiceSpy.saveFile).toHaveBeenCalledWith(
+                    path.join("temp-folder", "rdp", "node-1.rdp"),
+                    expectedContent);
 
                 expect(shellSpy.openItem).toHaveBeenCalledOnce();
                 expect(shellSpy.showItemInFolder).not.toHaveBeenCalled();
@@ -133,9 +133,9 @@ describe("DownloadRdpComponent", () => {
             btn.submit().subscribe(() => {
                 expect(fsServiceSpy.saveFile).toHaveBeenCalledOnce();
                 const expectedContent = "full address:s:0.0.0.0\nusername:s:.\\bar\nprompt for credentials:i:1";
-                expect(fsServiceSpy.saveFile).toHaveBeenCalledWith("node-1.rdp",
-                    expectedContent,
-                    "download-folder");
+                expect(fsServiceSpy.saveFile).toHaveBeenCalledWith(
+                    path.join("download-folder", "node-1.rdp"),
+                    expectedContent);
 
                 expect(shellSpy.showItemInFolder).toHaveBeenCalledOnce();
                 expect(shellSpy.openItem).not.toHaveBeenCalled();
diff --git a/test/app/components/pool/action/add/vm-size-picker.spec.ts b/test/app/components/pool/action/add/vm-size-picker.spec.ts
index dafe17703d..e487d1e15e 100644
--- a/test/app/components/pool/action/add/vm-size-picker.spec.ts
+++ b/test/app/components/pool/action/add/vm-size-picker.spec.ts
@@ -35,24 +35,24 @@ describe("VmSizePickerComponent", () => {
                 memory: ["Standard_M*"],
             }),
             virtualMachineSizes: Observable.of(List([
-                new VmSize({ name: "Standard_A1" }),
-                new VmSize({ name: "Standard_A2" }),
-                new VmSize({ name: "Standard_A3" }),
-                new VmSize({ name: "Standard_C1" }),
-                new VmSize({ name: "Standard_C2" }),
-                new VmSize({ name: "Standard_O1" }),
+                new VmSize({ name: "Standard_A1" } as any),
+                new VmSize({ name: "Standard_A2" } as any),
+                new VmSize({ name: "Standard_A3" } as any),
+                new VmSize({ name: "Standard_C1" } as any),
+                new VmSize({ name: "Standard_C2" } as any),
+                new VmSize({ name: "Standard_O1" } as any),
             ])),
             cloudServiceSizes: Observable.of(List([
-                new VmSize({ name: "Standard_A1" }),
-                new VmSize({ name: "Standard_A2" }),
-                new VmSize({ name: "Standard_A3" }),
-                new VmSize({ name: "Standard_C1" }),
-                new VmSize({ name: "Standard_C2" }),
+                new VmSize({ name: "Standard_A1" } as any),
+                new VmSize({ name: "Standard_A2" } as any),
+                new VmSize({ name: "Standard_A3" } as any),
+                new VmSize({ name: "Standard_C1" } as any),
+                new VmSize({ name: "Standard_C2" } as any),
             ])),
         };
 
         accountServiceSpy = {
-            currentAccount: Observable.of(new AccountResource({ location: "westus" })),
+            currentAccount: Observable.of(new AccountResource({ location: "westus" } as any)),
         };
 
         pricingServiceSpy = {
diff --git a/test/app/components/pool/base/pool-nodes-preview.component.spec.ts b/test/app/components/pool/base/pool-nodes-preview.component.spec.ts
index e4650d1811..64f08649e9 100644
--- a/test/app/components/pool/base/pool-nodes-preview.component.spec.ts
+++ b/test/app/components/pool/base/pool-nodes-preview.component.spec.ts
@@ -33,14 +33,18 @@ describe("PoolNodesPreviewComponent", () => {
 
     describe("when pool is steady", () => {
         beforeEach(() => {
-            testComponent.pool = new Pool({ state: "steady", currentDedicated: 4, targetDedicated: 4 });
+            testComponent.pool = new Pool({
+                state: "steady",
+                currentDedicatedNodes: 4, targetDedicatedNodes: 4,
+                currentLowPriorityNodes: 1, targetLowPriorityNodes: 1,
+            });
             fixture.detectChanges();
         });
 
         it("should just show the current dedicated", () => {
             const text = de.nativeElement.textContent;
-            expect(text).toContain("4");
-            expect((text.match(/4/g) || []).length).toBe(1, "Should only have one 4 in the content");
+            expect(text).toContain("5");
+            expect((text.match(/5/g) || []).length).toBe(1, "Should only have one 5 in the content");
         });
 
         it("should not show the arrow", () => {
@@ -51,14 +55,18 @@ describe("PoolNodesPreviewComponent", () => {
 
     describe("when pool is resizing", () => {
         beforeEach(() => {
-            testComponent.pool = new Pool({ state: "resizing", currentDedicated: 2, targetDedicated: 8 });
+            testComponent.pool = new Pool({
+                state: "resizing",
+                currentDedicatedNodes: 2, targetDedicatedNodes: 8,
+                currentLowPriorityNodes: 1, targetLowPriorityNodes: 1,
+            });
             fixture.detectChanges();
         });
 
         it("should just show the current dedicated", () => {
             const text = de.nativeElement.textContent;
-            expect(text).toContain("2");
-            expect(text).toContain("8");
+            expect(text).toContain("3");
+            expect(text).toContain("9");
         });
 
         it("should show the arrow", () => {
@@ -70,16 +78,18 @@ describe("PoolNodesPreviewComponent", () => {
     describe("when there is a resize error", () => {
         beforeEach(() => {
             testComponent.pool = new Pool({
-                state: "steady", currentDedicated: 2, targetDedicated: 8,
-                resizeError: { code: "StoppedResize" } as any,
+                state: "steady",
+                currentDedicatedNodes: 2, targetDedicatedNodes: 8,
+                currentLowPriorityNodes: 1, targetLowPriorityNodes: 1,
+                resizeErrors: [{ code: "StoppedResize" }] as any,
             });
             fixture.detectChanges();
         });
 
         it("should just show the current dedicated", () => {
             const text = de.nativeElement.textContent;
-            expect(text).toContain("2");
-            expect(text).toContain("8");
+            expect(text).toContain("3");
+            expect(text).toContain("9");
         });
 
         it("should show the arrow", () => {
diff --git a/test/app/components/pool/details/pool-error-display.component.spec.ts b/test/app/components/pool/details/pool-error-display.component.spec.ts
index c254567068..5503029ae9 100644
--- a/test/app/components/pool/details/pool-error-display.component.spec.ts
+++ b/test/app/components/pool/details/pool-error-display.component.spec.ts
@@ -53,22 +53,14 @@ describe("PoolErrorDisplayComponent", () => {
     describe("when there is a quota error", () => {
         beforeEach(() => {
             testComponent.pool = new Pool({
-                resizeError: {
+                resizeErrors: [{
                     code: ResizeErrorCode.accountCoreQuotaReached,
                     message: "Reached account core quota",
-                },
+                }],
             });
             fixture.detectChanges();
         });
 
-        it("should have a resize error", () => {
-            expect(component.hasResizeError).toBe(true);
-        });
-
-        it("should have a quota error", () => {
-            expect(component.hasQuotaReachedError).toBe(true);
-        });
-
         it("should show 1 bl banner", () => {
             expect(fixture.debugElement.queryAll(By.css("bl-banner")).length).toBe(1);
         });
@@ -88,22 +80,14 @@ describe("PoolErrorDisplayComponent", () => {
     describe("when there is a stop resizeError", () => {
         beforeEach(() => {
             testComponent.pool = new Pool({
-                resizeError: {
+                resizeErrors: [{
                     code: ResizeErrorCode.resizeStopped,
                     message: "The resize was stopped",
-                },
+                }],
             });
             fixture.detectChanges();
         });
 
-        it("should have a resize error", () => {
-            expect(component.hasResizeError).toBe(true);
-        });
-
-        it("should NOT have a quota error", () => {
-            expect(component.hasQuotaReachedError).toBe(false);
-        });
-
         it("should show 1 bl banner", () => {
             expect(fixture.debugElement.queryAll(By.css("bl-banner")).length).toBe(1);
         });
diff --git a/test/app/components/pool/graphs/nodes-heatmap.component.spec.ts b/test/app/components/pool/graphs/nodes-heatmap.component.spec.ts
index a9aed0efde..4616ffbfc5 100644
--- a/test/app/components/pool/graphs/nodes-heatmap.component.spec.ts
+++ b/test/app/components/pool/graphs/nodes-heatmap.component.spec.ts
@@ -129,6 +129,54 @@ describe("NodesHeatmapLegendComponent", () => {
         });
     });
 
+    it("should have title with number of tasks running on node", () => {
+        testComponent.nodes = createNodes(2);
+        fixture.detectChanges();
+        const tiles = svg.selectAll("g.node-group");
+        tiles.each((d, i, groups) => {
+            const group = d3.select(groups[i]);
+            expect(group.selectAll("title").size()).toBe(1, "Should only 1 title element");
+            const title = group.select("title");
+
+            expect(title).not.toBeFalsy("Should have a rect in bg");
+            expect(title.text()).toContain("2 tasks running on this node");
+        });
+    });
+
+    describe("Lowpri stipes overlay", () => {
+        it("should use fill transpart for dedicated nodes", () => {
+            testComponent.nodes = createNodes(2);
+            fixture.detectChanges();
+            const tiles = svg.selectAll("g.node-group");
+            expect(tiles.size()).toBe(2);
+            tiles.each((d, i, groups) => {
+                const group = d3.select(groups[i]);
+                const bg = group.select("g.lowpri");
+
+                expect(bg.selectAll("rect").size()).toBe(1, "Should only have 1 rect");
+                const rect = bg.select("rect");
+                expect(rect).not.toBeFalsy("Should have a rect in lowpri group");
+                expect(rect.attr("style")).toContain("fill: transparent");
+            });
+        });
+
+        it("should use fill url(low-pri-stripes) for low pri nodes", () => {
+            testComponent.nodes = createNodes(2, false);
+            fixture.detectChanges();
+            const tiles = svg.selectAll("g.node-group");
+            expect(tiles.size()).toBe(2);
+            tiles.each((d, i, groups) => {
+                const group = d3.select(groups[i]);
+                const bg = group.select("g.lowpri");
+
+                expect(bg.selectAll("rect").size()).toBe(1, "Should only have 1 rect");
+                const rect = bg.select("rect");
+                expect(rect).not.toBeFalsy("Should have a rect in lowpri group");
+                expect(rect.attr("style")).toContain("fill: url(\"#low-pri-stripes\")");
+            });
+        });
+    });
+
     it("should not fail when the size of the svg is 0x0", () => {
         testComponent.width = "160px";
         testComponent.nodes = createNodes(4);
@@ -153,9 +201,8 @@ describe("NodesHeatmapLegendComponent", () => {
         testComponent.nodes = createNodes(4);
         fixture.detectChanges();
 
-        const group = svg.select("g.node-group:nth-child(2)");
-
-        const el: any = group.node();
+        const groups = svg.selectAll("g.node-group");
+        const el: any = groups.nodes()[1];
         click(el);
         fixture.detectChanges();
         expect(heatmap.selectedNodeId.value).toEqual("node-2");
@@ -189,10 +236,14 @@ describe("NodesHeatmapLegendComponent", () => {
     });
 });
 
-function createNodes(count: number) {
+function createNodes(count: number, dedicated = true) {
     const nodes: Node[] = [];
     for (let i = 0; i < count; i++) {
-        nodes.push(Fixture.node.create({ id: `node-${i + 1}`, state: NodeState.idle }));
+        nodes.push(Fixture.node.create({
+            id: `node-${i + 1}`, state: NodeState.idle,
+            isDedicated: dedicated,
+            runningTasksCount: 2,
+        }));
     }
     return List(nodes);
 }
diff --git a/test/app/components/task/details/output/task-log.component.spec.ts b/test/app/components/task/details/output/task-log.component.spec.ts
new file mode 100644
index 0000000000..ea8013cb1c
--- /dev/null
+++ b/test/app/components/task/details/output/task-log.component.spec.ts
@@ -0,0 +1,198 @@
+import { NO_ERRORS_SCHEMA } from "@angular/core";
+import { ComponentFixture, TestBed } from "@angular/core/testing";
+import { MdAutocomplete } from "@angular/material";
+import { By } from "@angular/platform-browser";
+import { RouterTestingModule } from "@angular/router/testing";
+
+import { TaskLogComponent } from "app/components/task/details/output";
+import { File } from "app/models";
+import { FileService } from "app/services";
+import * as Fixtures from "test/fixture";
+import { RxMockEntityProxy, RxMockListProxy } from "test/utils/mocks";
+
+const fileSizeMap: Map<string, number> = new Map()
+    .set("stdout.txt", 10)
+    .set("stderr.txt", 20)
+    .set("banana.txt", 30)
+    .set("apple.txt", 40)
+    .set("pear.txt", 50);
+
+describe("TaskDependenciesComponent", () => {
+    let fixture: ComponentFixture<TaskLogComponent>;
+    let component: TaskLogComponent;
+
+    let anyComponent: any;
+    let fileListProxy: RxMockListProxy<any, File>;
+    let fileServiceSpy: any;
+
+    beforeEach(() => {
+        fileListProxy = new RxMockListProxy(File, {
+            cacheKey: "name",
+            items: [
+                Fixtures.file.create({ name: "stdout.txt" }),
+                Fixtures.file.create({ name: "stderr.txt" }),
+                Fixtures.file.create({ name: "banana.txt" }),
+                Fixtures.file.create({ name: "apple.txt" }),
+                Fixtures.file.create({ name: "pear.txt" }),
+            ],
+        });
+
+        fileServiceSpy = {
+            listFromTask: (jobid: string, taskId: string, recursive?: boolean, options?: any) => fileListProxy,
+
+            getFilePropertiesFromTask: (jobid: string, taskId: string, filename: string) =>
+                new RxMockEntityProxy<any, File>(File, {
+                    cacheKey: "name",
+                    item: Fixtures.file.create({
+                        name: filename,
+                        properties: { contentLength: fileSizeMap.get(filename) || 100 },
+                    }),
+                }),
+        };
+
+        TestBed.configureTestingModule({
+            imports: [RouterTestingModule],
+            declarations: [
+                MdAutocomplete, TaskLogComponent,
+            ],
+            providers: [
+                { provide: FileService, useValue: fileServiceSpy },
+            ],
+            schemas: [NO_ERRORS_SCHEMA],
+        });
+
+        fixture = TestBed.createComponent(TaskLogComponent);
+        component = fixture.componentInstance;
+        component.jobId = "bobs-job-1";
+        component.task = Fixtures.task.create({ id: "bobs-task" });
+        anyComponent = component as any;
+        fixture.detectChanges();
+    });
+
+    describe("on initial default load", () => {
+        it("initial ui state is correct", () => {
+            expect(component.jobId).toBe("bobs-job-1");
+            expect(component.outputFileNames.length).toBe(2);
+            expect(component.selectedOutputFile).toBe("stdout.txt");
+            expect(Object.keys(component.fileSizes).length).toBe(0);
+            expect(component.filterControl.value).toBeNull();
+            expect(component.addingFile).toBeFalsy();
+
+            expect(anyComponent._currentTaskId).toBeNull();
+            expect(anyComponent._refreshInterval).toBe(5000);
+        });
+
+        it("shows default tabs", () => {
+            const container = fixture.debugElement.query(By.css(".file-tabs"));
+            expect(container.nativeElement.textContent).toContain("stdout.txt ( - B)");
+            expect(container.nativeElement.textContent).toContain("stderr.txt ( - B)");
+            expect(container).toBeVisible();
+        });
+
+        it("shows default add file tab", () => {
+            const container = fixture.debugElement.query(By.css(".file-tab-more"));
+            expect(container).toBeVisible();
+        });
+
+        it("reset tabs button not shown", () => {
+            const container = fixture.debugElement.query(By.css("div[title=\"Reset to default\"]"));
+            expect(container).toBeNull();
+        });
+    });
+
+    describe("loads file sizes based on current job and task", () => {
+        beforeEach(() => {
+            component.ngOnChanges({ jobId: component.jobId, task: component.task });
+            fixture.detectChanges();
+        });
+
+        it("current task id set", () => {
+            expect(anyComponent._currentTaskId).toBe("bobs-task");
+        });
+
+        it("has loaded file sizes", () => {
+            expect(Object.keys(component.fileSizes).length).toBe(2);
+            expect(component.fileSizes["stdout.txt"]).toBe("10 B");
+            expect(component.fileSizes["stderr.txt"]).toBe("20 B");
+        });
+
+        it("ui shows file sizes", () => {
+            const container = fixture.debugElement.query(By.css(".file-tabs"));
+            expect(container.nativeElement.textContent).toContain("stdout.txt (10 B)");
+            expect(container.nativeElement.textContent).toContain("stderr.txt (20 B)");
+        });
+
+        it("default file tab is stdout.txt", () => {
+            const container = fixture.debugElement.query(By.css(".file-tab.active"));
+            expect(container.nativeElement.textContent).toContain("stdout.txt (10 B)");
+        });
+    });
+
+    describe("loads additional task output files", () => {
+        beforeEach(() => {
+            component.ngOnChanges({ jobId: component.jobId, task: component.task });
+            fixture.detectChanges();
+        });
+
+        it("has 3 extra outputs for auto-complete filter", () => {
+            expect(anyComponent._options.value.length).toBe(3);
+        });
+
+        it("won't add either default file to _options list", () => {
+            let file = { name: "stdout.txt", isDirectory: false };
+            expect(anyComponent._canAddFileToMap(file)).toBe(false);
+
+            file.name = "stderr.txt";
+            expect(anyComponent._canAddFileToMap(file)).toBe(false);
+
+            file.isDirectory = true;
+            expect(anyComponent._canAddFileToMap(file)).toBe(false);
+        });
+
+        it("hasn't added new files to tab list", () => {
+            expect(component.outputFileNames.length).toBe(2);
+        });
+    });
+
+    describe("can add a new file to a tab", () => {
+        beforeEach(() => {
+            component.ngOnChanges({ jobId: component.jobId, task: component.task });
+            fixture.detectChanges();
+        });
+
+        it("click add shows filter", () => {
+            const tabElements = fixture.debugElement.queryAll(By.css(".file-tab-more"));
+            tabElements[0].nativeElement.click();
+            fixture.detectChanges();
+            expect(component.addingFile).toBe(true);
+        });
+
+        it("can filter options", (done) => {
+            component.filteredOptions.subscribe((items) => {
+                expect(items.length).toBe(1);
+                expect(items[0]).toBe("banana.txt");
+                done();
+            });
+
+            component.filterControl.setValue("banana");
+        });
+
+        it("selecting option loads file into tab list and gets file size", () => {
+            component.optionSelected({}, "banana.txt");
+            expect(component.outputFileNames.length).toBe(3);
+            expect(component.selectedOutputFile).toBe("banana.txt");
+            expect(Object.keys(component.fileSizes).length).toBe(3);
+            expect(component.fileSizes["banana.txt"]).toBe("30 B");
+        });
+
+        it("clicking reset will remove additional tabs", () => {
+            component.optionSelected({}, "apple.txt");
+            expect(component.outputFileNames.length).toBe(3);
+            expect(component.selectedOutputFile).toBe("apple.txt");
+
+            component.resetTabs();
+            expect(component.outputFileNames.length).toBe(2);
+            expect(component.selectedOutputFile).toBe("stdout.txt");
+        });
+    });
+});
diff --git a/test/app/components/task/details/task-dependencies.component.spec.ts b/test/app/components/task/details/task-dependencies.component.spec.ts
index 7257df75cf..060820c907 100644
--- a/test/app/components/task/details/task-dependencies.component.spec.ts
+++ b/test/app/components/task/details/task-dependencies.component.spec.ts
@@ -15,8 +15,8 @@ import * as Fixtures from "test/fixture";
 import { NoItemMockComponent } from "test/utils/mocks/components";
 
 const taskMap: Map<string, Task> = new Map()
-    .set("1", new Task({ id: "1", dependsOn: { taskIds: ["1", "2"]} }))
-    .set("2", new Task({ id: "2", dependsOn: { taskIds: ["3", "4", "5"]} }));
+    .set("1", new Task({ id: "1", dependsOn: { taskIds: ["1", "2"] } } as any))
+    .set("2", new Task({ id: "2", dependsOn: { taskIds: ["3", "4", "5"] } } as any));
 
 describe("TaskDependenciesComponent", () => {
     let fixture: ComponentFixture<TaskDependenciesComponent>;
@@ -29,12 +29,12 @@ describe("TaskDependenciesComponent", () => {
                 .createSpy("getMultipleTasks").and
                 .callFake((jobid: string, taskIds: string[], properties?: string) => {
 
-                const result = List<Task>(taskIds.map(id => {
-                    return taskMap.get(id) || Fixtures.task.create({ id: id });
-                }));
+                    const result = List<Task>(taskIds.map(id => {
+                        return taskMap.get(id) || Fixtures.task.create({ id: id });
+                    }));
 
-                return Observable.of(result);
-            }),
+                    return Observable.of(result);
+                }),
         };
 
         TestBed.configureTestingModule({
@@ -78,7 +78,7 @@ describe("TaskDependenciesComponent", () => {
                 dependsOn: {
                     taskIds: ["1", "2", "3"],
                 },
-            });
+            } as any);
 
             fixture.detectChanges();
         });
@@ -105,7 +105,7 @@ describe("TaskDependenciesComponent", () => {
                 dependsOn: {
                     taskIdRanges: [{ start: 1, end: 5 }, { start: 10, end: 12 }],
                 },
-            });
+            } as any);
 
             fixture.detectChanges();
         });
@@ -129,7 +129,7 @@ describe("TaskDependenciesComponent", () => {
                     taskIds: ["1"],
                     taskIdRanges: [{ start: 1, end: 5 }],
                 },
-            });
+            } as any);
 
             fixture.detectChanges();
         });
@@ -152,7 +152,7 @@ describe("TaskDependenciesComponent", () => {
                 dependsOn: {
                     taskIdRanges: [{ start: 1, end: 25 }],
                 },
-            });
+            } as any);
 
             fixture.detectChanges();
         });
@@ -170,7 +170,7 @@ describe("TaskDependenciesComponent", () => {
                 dependsOn: {
                     taskIds: ["1", "2", "3"],
                 },
-            });
+            } as any);
 
             fixture.detectChanges();
         });
diff --git a/test/app/components/task/details/task-error-display.component.spec.ts b/test/app/components/task/details/task-error-display.component.spec.ts
index 9bcde92ac2..5941970be2 100644
--- a/test/app/components/task/details/task-error-display.component.spec.ts
+++ b/test/app/components/task/details/task-error-display.component.spec.ts
@@ -54,9 +54,14 @@ describe("TaskErrorDisplayComponent", () => {
             testComponent.task = new Task({
                 state: TaskState.completed,
                 executionInfo: {
+                    failureInfo: {
+                        category: "UserError",
+                        code: "FailureExitCode",
+                        message: "Task has wrong exit code",
+                    },
                     exitCode: 1,
                 },
-            });
+            } as any);
             fixture.detectChanges();
         });
 
@@ -69,11 +74,21 @@ describe("TaskErrorDisplayComponent", () => {
             expect(fixture.debugElement.queryAll(By.css("bl-banner")).length).toBe(1);
         });
 
-        it("Should show the code and message", () => {
+        it("Should contain the error code", () => {
+            const banner = fixture.debugElement.query(By.css("bl-banner"));
+            expect(banner.nativeElement.textContent).toContain("FailureExitCode");
+        });
+
+        it("Should custom message", () => {
             const banner = fixture.debugElement.query(By.css("bl-banner"));
             expect(banner.nativeElement.textContent).toContain("Task completed with exit code '1'");
         });
 
+        it("Should not show the failure info message", () => {
+            const banner = fixture.debugElement.query(By.css("bl-banner"));
+            expect(banner.nativeElement.textContent).not.toContain("Task has wrong exit code");
+        });
+
         it("should propose increase quota as a first fix", () => {
             const banner = fixture.debugElement.query(By.css("bl-banner")).componentInstance;
             expect(banner.fixMessage).toContain("Rerun task");
diff --git a/test/app/components/task/details/task-lifetime/task-timeline.component.spec.ts b/test/app/components/task/details/task-lifetime/task-timeline.component.spec.ts
index 3e45d114e3..db31358b17 100644
--- a/test/app/components/task/details/task-lifetime/task-timeline.component.spec.ts
+++ b/test/app/components/task/details/task-lifetime/task-timeline.component.spec.ts
@@ -28,11 +28,15 @@ function createTask(state: string, timeout = "PT6M") {
             endTime: moment().subtract(20, "minutes").toDate(),
             retryCount: 3,
             exitCode: -3,
+            failureInfo: {
+                category: "UserError",
+                code: "TaskEnded",
+            },
         },
         constraints: {
             maxWallClockTime: moment.duration(timeout),
         },
-    });
+    } as any);
 }
 
 describe("TaskTimelineComponent", () => {
diff --git a/test/app/core/arm-record.spec.ts b/test/app/core/arm-record.spec.ts
new file mode 100644
index 0000000000..71f5116f6a
--- /dev/null
+++ b/test/app/core/arm-record.spec.ts
@@ -0,0 +1,17 @@
+import { ArmRecord, Model, Prop } from "app/core";
+
+@Model()
+class TestModel extends ArmRecord<any> {
+    @Prop() public id: string;
+
+    @Prop() public name: string;
+}
+
+describe("Node Model", () => {
+    it("lower case the id", () => {
+        const model1 = new TestModel({ id: "sub-1/My-Resource-GrOUP/storage-1", name: "storage-1" } as any);
+        const model2 = new TestModel({ id: "sub-1/my-resource-group/storage-1", name: "storage-1" } as any);
+        expect(model1.id).toEqual(model2.id);
+        expect(model1).toEqualImmutable(model2);
+    });
+});
diff --git a/test/app/core/record.spec.ts b/test/app/core/record.spec.ts
index 240586a350..03abe4b0e4 100644
--- a/test/app/core/record.spec.ts
+++ b/test/app/core/record.spec.ts
@@ -34,6 +34,12 @@ class SimpleTestRec extends Record<any> {
     public c: number;
 }
 
+@Model()
+class InheritedTestRec extends SimpleTestRec {
+    @Prop()
+    public d: number;
+}
+
 describe("Record", () => {
     it("should throw an exeption when record doesn't extends Record class", () => {
         try {
@@ -126,9 +132,9 @@ describe("Record", () => {
     });
 
     it("toJS() should return compelex type toJS recursively", () => {
-        let a = new TestRec({ id: "id-1", nested: { name: "name-1" }, nestedList: [{ name: "name-2" }]});
+        let a = new TestRec({ id: "id-1", nested: { name: "name-1" }, nestedList: [{ name: "name-2" }] });
 
-        expect(a.toJS()).toEqual({ id: "id-1", nested: { name: "name-1" }, nestedList: [{ name: "name-2" }]});
+        expect(a.toJS()).toEqual({ id: "id-1", nested: { name: "name-1" }, nestedList: [{ name: "name-2" }] });
     });
 
     it("should have access to values in constructor", () => {
@@ -156,4 +162,9 @@ describe("Record", () => {
         expect(rec2.computedA).toEqual("A3");
         expect(rec2.computedB).toEqual("B50");
     });
+
+    it("should work with inherited models", () => {
+        const rec = new InheritedTestRec({ a: 1, b: 2, c: 3, d: 4, invalid: 10 });
+        expect(rec.toJS()).toEqual({ id: null, a: 1, b: 2, c: 3, d: 4 });
+    });
 });
diff --git a/test/app/memory-leak/mem-leak.spec.ts b/test/app/memory-leak/mem-leak.spec.ts
index 69004ee80d..fad8c731c4 100644
--- a/test/app/memory-leak/mem-leak.spec.ts
+++ b/test/app/memory-leak/mem-leak.spec.ts
@@ -1,11 +1,11 @@
 // tslint:disable:no-unused-variable
-// tslint:disable:no-jasmine-focus
 import { Component } from "@angular/core";
 import { TestBed, async } from "@angular/core/testing";
 
 import { TaskDetailsModule } from "app/components/task/details";
 
 export function main() {
+    // tslint:disable-next-line:ban
     fdescribe("Memory leak Testing", () => {
         for (let i = 0; i < 100000; i++) {
             describe(`${i}`, () => {
diff --git a/test/app/models/node.spec.ts b/test/app/models/node.spec.ts
index 2a514e6d68..2be6987296 100644
--- a/test/app/models/node.spec.ts
+++ b/test/app/models/node.spec.ts
@@ -1,6 +1,6 @@
 import { List } from "immutable";
 
-import { Node, TaskState } from "app/models";
+import { Node } from "app/models";
 
 describe("Node Model", () => {
     describe("defaults", () => {
@@ -10,29 +10,4 @@ describe("Node Model", () => {
             expect(node.recentTasks).toEqualImmutable(List([]));
         });
     });
-
-    describe("#runningTasks", () => {
-        it("should return empty list if recentTasks is not defined", () => {
-            const node = new Node({ id: "node-1" });
-            expect(node.runningTasks.toJS()).toEqual([]);
-        });
-
-        it("should return only the running tasks", () => {
-            const node = new Node({
-                id: "node-1",
-                recentTasks: [
-                    { taskId: "task-1", taskState: TaskState.running },
-                    { taskId: "task-2", taskState: TaskState.active },
-                    { taskId: "task-3", taskState: TaskState.preparing },
-                    { taskId: "task-4", taskState: TaskState.running },
-                    { taskId: "task-5", taskState: TaskState.completed },
-                ],
-            });
-            const runningTasks = node.runningTasks;
-
-            expect(runningTasks.size).toBe(2);
-            expect(runningTasks.get(0).taskId).toEqual("task-1");
-            expect(runningTasks.get(1).taskId).toEqual("task-4");
-        });
-    });
 });
diff --git a/test/app/models/storage-account.spec.ts b/test/app/models/storage-account.spec.ts
new file mode 100644
index 0000000000..e68fef4407
--- /dev/null
+++ b/test/app/models/storage-account.spec.ts
@@ -0,0 +1,10 @@
+import { StorageAccount } from "app/models";
+
+describe("Node Model", () => {
+    it("lower case the id", () => {
+        const account1 = new StorageAccount({ id: "sub-1/My-Resource-GrOUP/storage-1", name: "storage-1" } as any);
+        const account2 = new StorageAccount({ id: "sub-1/my-resource-group/storage-1", name: "storage-1" } as any);
+        expect(account1.id).toEqual(account2.id);
+        expect(account1).toEqualImmutable(account2);
+    });
+});
diff --git a/test/app/models/task.spec.ts b/test/app/models/task.spec.ts
index 5ed31d8d60..d50871d95a 100644
--- a/test/app/models/task.spec.ts
+++ b/test/app/models/task.spec.ts
@@ -2,29 +2,38 @@ import * as moment from "moment";
 
 import { Task } from "app/models";
 
-function createTask(exitCode: number, startTime: Date, endTime: Date, maxWallClockTime = "PT4M") {
+function createTask(exitCode: number, startTime: Date, endTime: Date, hasFailureInfo = false) {
+    let failureInfo = null;
+
+    if (hasFailureInfo) {
+        failureInfo = {
+            category: "UserError",
+            code: "TaskEnded",
+        };
+    }
     return new Task({
         executionInfo: {
             startTime,
             endTime,
             exitCode,
+            failureInfo,
         },
         constraints: {
-            maxWallClockTime: moment.duration(maxWallClockTime),
+            maxWallClockTime: moment.duration("PT4M"),
         },
-    });
+    } as any);
 }
 
 describe("Task Model", () => {
     describe("#didTimeout()", () => {
         it("should return false if execution info or constraints are null", () => {
             expect(new Task().didTimeout).toBe(false);
-            expect(new Task({ executionInfo: { startTime: null } }).didTimeout).toBe(false);
-            expect(new Task({ constraints: {} }).didTimeout).toBe(false);
+            expect(new Task({ executionInfo: { startTime: null } } as any).didTimeout).toBe(false);
+            expect(new Task({ constraints: {} } as any).didTimeout).toBe(false);
         });
 
         it("Should return false if there is no maxWallClockTime", () => {
-            expect(new Task({ executionInfo: {}, constraints: {} }).didTimeout).toBe(false);
+            expect(new Task({ executionInfo: {}, constraints: {} } as any).didTimeout).toBe(false);
         });
 
         it("should return false if exit code is 0", () => {
@@ -34,13 +43,13 @@ describe("Task Model", () => {
 
         it("should return false if runnnig time is less than clock time", () => {
             const current = moment();
-            const task = createTask(0, current.clone().subtract(3, "minute").toDate(), current.toDate());
+            const task = createTask(0, current.clone().subtract(3, "minute").toDate(), current.toDate(), true);
             expect(task.didTimeout).toBe(false);
         });
 
         it("should return true if runnnig time is more than clock time", () => {
             const current = moment();
-            const task = createTask(-10, current.clone().subtract(5, "minute").toDate(), current.toDate());
+            const task = createTask(-10, current.clone().subtract(5, "minute").toDate(), current.toDate(), true);
             expect(task.didTimeout).toBe(true);
         });
     });
diff --git a/test/app/models/vm-size.spec.ts b/test/app/models/vm-size.spec.ts
new file mode 100644
index 0000000000..3cc694e32c
--- /dev/null
+++ b/test/app/models/vm-size.spec.ts
@@ -0,0 +1,10 @@
+import { VmSize } from "app/models";
+
+describe("Node Model", () => {
+    it("lower case the id", () => {
+        const size1 = new VmSize({ name: "Standard_A1"} as any);
+        const size2 = new VmSize({ name: "standard_a1" } as any);
+        expect(size1.id).toEqual(size1.id);
+        expect(size2).toEqualImmutable(size2);
+    });
+});
diff --git a/test/app/services/account.service.spec.ts b/test/app/services/account.service.spec.ts
index f5c94633dc..9d7c100e6b 100644
--- a/test/app/services/account.service.spec.ts
+++ b/test/app/services/account.service.spec.ts
@@ -9,7 +9,7 @@ describe("AccountService", () => {
     let accountService: AccountService;
     let currentAccount: AccountResource;
     let currentAccountId: string;
-    let account1 = new AccountResource({ id: "account-1" });
+    let account1 = new AccountResource({ id: "account-1" } as any);
     let subscriptionServiceSpy;
     let subs: Subscription[] = [];
 
@@ -19,7 +19,7 @@ describe("AccountService", () => {
         };
 
         accountService = new AccountService({} as any, subscriptionServiceSpy);
-        accountService.getAccount = jasmine.createSpy("getAccount").and.returnValue(Observable.of(account1));
+        accountService.getOnce = jasmine.createSpy("getOnce").and.returnValue(Observable.of(account1));
         accountService.getAccountKeys = jasmine.createSpy("getAccountKeys").and.returnValue(Observable.of({}));
         subs.push(accountService.currentAccountId.subscribe(x => currentAccountId = x));
         subs.push(accountService.currentAccount.subscribe(x => currentAccount = x));
@@ -52,7 +52,7 @@ describe("AccountService", () => {
         expect(currentAccount.id).toBe("account-1");
 
         let accountSubject = new AsyncSubject();
-        accountService.getAccount = jasmine.createSpy("getOnce").and.returnValue(accountSubject);
+        accountService.getOnce = jasmine.createSpy("getOnce").and.returnValue(accountSubject);
 
         accountService.selectAccount("account-2");
         currentAccount = undefined;
@@ -60,7 +60,7 @@ describe("AccountService", () => {
         expect(currentAccountId).toEqual("account-2", "Account id should have been updated immediately");
         expect(currentAccount).toBeUndefined();
 
-        accountSubject.next(new AccountResource({ id: "account-2" }));
+        accountSubject.next(new AccountResource({ id: "account-2" } as any));
         accountSubject.complete();
         tick();
 
diff --git a/test/app/services/core/poll-service.spec.ts b/test/app/services/core/poll-service.spec.ts
index c4328c8849..7d755c28f5 100644
--- a/test/app/services/core/poll-service.spec.ts
+++ b/test/app/services/core/poll-service.spec.ts
@@ -1,6 +1,7 @@
 import { fakeAsync, tick } from "@angular/core/testing";
 
 import { PollObservable, PollService } from "app/services/core";
+import { Observable } from "rxjs";
 
 describe("PollService", () => {
     let service: PollService;
@@ -28,6 +29,26 @@ describe("PollService", () => {
         expect(poll1Spy).toHaveBeenCalledTimes(3);
     }));
 
+    it("should wait for callback observable to complete if applicable", fakeAsync(() => {
+        poll1 = service.startPoll("key-1", 1000, () => {
+            poll1Spy();
+            return Observable.timer(1000);
+        });
+
+        expect(poll1Spy).toHaveBeenCalledTimes(0); // Not yet called
+        tick(1000);
+        expect(poll1Spy).toHaveBeenCalledTimes(1); // Called after first interval
+        tick(1500);
+        expect(poll1Spy).toHaveBeenCalledTimes(1); // Needs to wait 1000ms for observable to return so no more call
+        tick(500);
+        expect(poll1Spy).toHaveBeenCalledTimes(2);
+        tick(2000);
+        expect(poll1Spy).toHaveBeenCalledTimes(3); // After 1000ms(observable) + 1000ms(interval) triggers again
+        poll1.destroy();
+        tick(2000);
+        expect(poll1Spy).toHaveBeenCalledTimes(3);
+    }));
+
     it("starting a poll with a long timer should not active it", fakeAsync(() => {
         poll1 = service.startPoll("key-1", 1000, poll1Spy);
 
diff --git a/test/app/services/core/rx-batch-list-proxy.spec.ts b/test/app/services/core/rx-batch-list-proxy.spec.ts
index 90eae3eb01..5a8ec8b70f 100644
--- a/test/app/services/core/rx-batch-list-proxy.spec.ts
+++ b/test/app/services/core/rx-batch-list-proxy.spec.ts
@@ -6,7 +6,7 @@ import { List, OrderedSet } from "immutable";
 
 import { LoadingStatus } from "app/components/base/loading";
 import { BatchError, ServerError } from "app/models";
-import { DataCache, RxBatchEntityProxy, RxBatchListProxy } from "app/services/core";
+import { DataCache, RxBatchEntityProxy, RxBatchListProxy, getOnceProxy } from "app/services/core";
 import { BatchClientServiceMock } from "test/utils/mocks";
 import { FakeModel } from "./fake-model";
 
@@ -193,6 +193,14 @@ describe("RxBatchListProxy", () => {
         });
     });
 
+    it("#refreshAll() should get all the items", (done) => {
+        items = List([]); // Reset the items to make sure it loads all of them again
+        proxy.refreshAll().subscribe(() => {
+            expect(items).toEqualImmutable(List(data[0].concat(data[1]).map((x) => new FakeModel(x))));
+            done();
+        });
+    });
+
     describe("#loadNewItem()", () => {
         beforeEach((done) => {
             proxy.fetchNext().subscribe(() => done());
@@ -209,7 +217,7 @@ describe("RxBatchListProxy", () => {
                 { id: "3", state: "running", name: "Fake3" },
             ];
 
-            proxy.loadNewItem(entityProxy as any).subscribe(() => {
+            proxy.loadNewItem(getOnceProxy(entityProxy)).subscribe(() => {
                 expect(items).toEqualImmutable(List(expected.map((x) => new FakeModel(x))));
                 done();
             });
@@ -225,7 +233,7 @@ describe("RxBatchListProxy", () => {
                 { id: "4", state: "running", name: "Fake4" },
             ].concat(data[0]);
 
-            proxy.loadNewItem(entityProxy as any).subscribe(() => {
+            proxy.loadNewItem(getOnceProxy(entityProxy)).subscribe(() => {
                 expect(items).toEqualImmutable(List(expected.map((x) => new FakeModel(x))));
                 done();
             });
diff --git a/test/app/utils/date-utils.spec.ts b/test/app/utils/date-utils.spec.ts
index 731fb24685..b58401e175 100644
--- a/test/app/utils/date-utils.spec.ts
+++ b/test/app/utils/date-utils.spec.ts
@@ -42,7 +42,8 @@ describe("DateUtils", () => {
             // note: date month array starts at 0 for jan
             const date = new Date(2017, 11, 24, 10, 55, 2);
             expect(DateUtils.fullDateAndTime(date)).toEqual(moment(date).format("MMM Do, YYYY, HH:mm:ss.SSS Z"));
-            expect(DateUtils.fullDateAndTime(date)).toEqual("Dec 24th, 2017, 10:55:02.000 +00:00");
+             // Timezone depends who runs the test so just check for the rest
+            expect(DateUtils.fullDateAndTime(date)).toContain("Dec 24th, 2017, 10:55:02.000");
         });
     });
 });
diff --git a/test/app/utils/pool-utils.spec.ts b/test/app/utils/pool-utils.spec.ts
index 20ecd478c6..3ed06e2ee9 100644
--- a/test/app/utils/pool-utils.spec.ts
+++ b/test/app/utils/pool-utils.spec.ts
@@ -119,12 +119,38 @@ describe("PoolUtils", () => {
                 },
             });
 
+            const vm3Pool = new Pool({
+                virtualMachineConfiguration: {
+                    imageReference: {
+                        publisher: "batch",
+                        offer: "rendering-windows2016",
+                        sku: "rendering",
+                        version: "latest",
+                    },
+                    nodeAgentSKUId: "batch.node.windows amd64",
+                },
+            });
+
+            const vm4Pool = new Pool({
+                virtualMachineConfiguration: {
+                    imageReference: {
+                        publisher: "batch",
+                        offer: "autodesk-maya-arnold-centos73",
+                        sku: "maya-arnold-2017",
+                        version: "latest",
+                    },
+                    nodeAgentSKUId: "batch.node.centos 7",
+                },
+            });
+
             expect(PoolUtils.getComputePoolOsIcon(PoolUtils.getOsName(cs2Pool))).toBe("windows");
             expect(PoolUtils.getComputePoolOsIcon(PoolUtils.getOsName(cs3Pool))).toBe("windows");
             expect(PoolUtils.getComputePoolOsIcon(PoolUtils.getOsName(cs4Pool))).toBe("windows");
             expect(PoolUtils.getComputePoolOsIcon(PoolUtils.getOsName(cs5Pool))).toBe("windows");
             expect(PoolUtils.getComputePoolOsIcon(PoolUtils.getOsName(vm1Pool))).toBe("linux");
             expect(PoolUtils.getComputePoolOsIcon(PoolUtils.getOsName(vm2Pool))).toBe("windows");
+            expect(PoolUtils.getComputePoolOsIcon(PoolUtils.getOsName(vm3Pool))).toBe("windows");
+            expect(PoolUtils.getComputePoolOsIcon(PoolUtils.getOsName(vm4Pool))).toBe("linux");
         });
     });
 });
diff --git a/test/client/batch-client-proxy/list-proxy.spec.ts b/test/client/batch-client-proxy/list-proxy.spec.ts
index 34d8347e01..55cce0067b 100644
--- a/test/client/batch-client-proxy/list-proxy.spec.ts
+++ b/test/client/batch-client-proxy/list-proxy.spec.ts
@@ -1,4 +1,4 @@
-import { ListProxy } from "../../../client/api/batch-client-proxy/shared/list-proxy";
+import { ListProxy } from "../../../src/client/api/batch-client-proxy/shared/list-proxy";
 
 describe("ListProxy", () => {
     let listProxy;
diff --git a/test/fixture.ts b/test/fixture.ts
index 711e5b8d1e..0a511bb43f 100644
--- a/test/fixture.ts
+++ b/test/fixture.ts
@@ -1,7 +1,7 @@
 import { Type } from "@angular/core";
 import * as moment from "moment";
 
-import { AccountResource, Application, ApplicationPackage, Job, Node, PackageState, Pool,
+import { AccountResource, Application, ApplicationPackage, File, Job, Node, PackageState, Pool,
     Subscription, SubtaskInformation, Task,
 } from "app/models";
 
@@ -59,7 +59,7 @@ export const job = new FixtureFactory<Job>(Job, {
         endTime: new Date(2015, 5, 1, 10, 4, 31),
         poolId: "pool-1",
         terminateReason: "because i said so",
-        schedulingError: {
+        failureInfo: {
             category: "cat1",
             code: "code1",
             message: "this is a message",
@@ -98,7 +98,7 @@ export const task = new FixtureFactory<Task>(Task, {
         lastRetryTime: new Date(2015, 5, 21, 0, 0, 0),
         requeueCount: 1,
         lastRequeueTime: new Date(2015, 5, 21, 0, 0, 0),
-        schedulingError: {
+        failureInfo: {
             category: "cat1",
             code: "code1",
             message: "this is a message",
@@ -197,6 +197,7 @@ export const node = new FixtureFactory<Node>(Node, {
     id: "node-1",
     displayName: "MyImaginaryNode",
     state: "running",
+    isDedicated: true,
 });
 
 export const subscription = new FixtureFactory<Subscription>(Subscription, {
@@ -236,3 +237,15 @@ export const applicationPackage = new FixtureFactory<ApplicationPackage>(Applica
     storageUrl: "",
     storageUrlExpiry: null,
 });
+
+export const file = new FixtureFactory<File>(File, {
+    name: "file-1",
+    url: "url/to/file",
+    isDirectory: false,
+    properties: {
+        contentLength: 0,
+        contentType: "text/plain",
+        creationTime: new Date(),
+        lastModified: new Date(),
+    },
+});
diff --git a/test/utils/mocks/components/index.ts b/test/utils/mocks/components/index.ts
index e8e96c2e76..5069e9dd74 100644
--- a/test/utils/mocks/components/index.ts
+++ b/test/utils/mocks/components/index.ts
@@ -7,3 +7,4 @@ export * from "./loading.component.mock";
 export * from "./no-item.component.mock";
 export * from "./server-error.component.mock";
 export * from "./gauge.component.mock";
+export * from "./table.component.mock";
diff --git a/test/utils/mocks/components/table.component.mock.ts b/test/utils/mocks/components/table.component.mock.ts
new file mode 100644
index 0000000000..d3645a91ba
--- /dev/null
+++ b/test/utils/mocks/components/table.component.mock.ts
@@ -0,0 +1,10 @@
+import { Component, Input } from "@angular/core";
+
+@Component({
+    selector: "bl-table",
+    template: "<ng-content></ng-content>",
+})
+export class TableMockComponent {
+    @Input()
+    public activeItem: string;
+}
diff --git a/tsconfig.json b/tsconfig.json
index d437f55ebd..87d2edb6f7 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -28,6 +28,7 @@
     "paths": {
       "*": [
         "*",
+        "src/*",
         "app/scripts/*"
       ]
     },
diff --git a/tsconfig.node.json b/tsconfig.node.json
index fbd1135d63..5a3af8ccc6 100644
--- a/tsconfig.node.json
+++ b/tsconfig.node.json
@@ -36,6 +36,6 @@
   ],
   // This is not actually used for building but to let the editor know what files use this config
   "include": [
-    "./client/**/*.ts"
+    "./src/client/**/*.ts"
   ]
 }
diff --git a/tslint.json b/tslint.json
index 0defe019f0..e7993ee1fa 100644
--- a/tslint.json
+++ b/tslint.json
@@ -2,8 +2,7 @@
   "extends": "tslint:recommended",
   "defaultSeverity": "warning",
   "rulesDirectory": [
-    "node_modules/codelyzer",
-    "node_modules/vrsource-tslint-rules/rules"
+    "node_modules/codelyzer"
   ],
   "rules": {
     // TSLint override
@@ -30,7 +29,9 @@
     "arrow-return-shorthand": [true],
     "ban": [
         true,
-        ["main", "debugCrash"] // Show a warning if the main window is being shown on start for debug purposes
+        ["main", "debugCrash"], // Show a warning if the main window is being shown on start for debug purposes
+        ["fdescribe"],
+        ["fit"]
     ],
     "no-empty-interface":  false,
     "space-before-function-paren": [false],
@@ -56,9 +57,6 @@
     "import-destructuring-spacing": true,
     "invoke-injectable": true,
 
-    // vrsource-tslint-rules https://github.com/vrsource/vrsource-tslint-rules
-    "no-jasmine-focus": true,
-
     // TODO enable
     "prefer-const": false
   },
diff --git a/yarn.lock b/yarn.lock
index 0715b00681..c0f0e39ecc 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -54,9 +54,11 @@
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/@angular/http/-/http-4.1.2.tgz#fc378c3330c0410e1fb8aac2546329a6887776e4"
 
-"@angular/material@2.0.0-beta.3":
-  version "2.0.0-beta.3"
-  resolved "https://registry.yarnpkg.com/@angular/material/-/material-2.0.0-beta.3.tgz#ec31dee61d7300ece28fee476852db236ded1e13"
+"@angular/material@~2.0.0-beta.7":
+  version "2.0.0-beta.7"
+  resolved "https://registry.yarnpkg.com/@angular/material/-/material-2.0.0-beta.7.tgz#2584aaf1ffbe24779916345f1ac82921ccbc2577"
+  dependencies:
+    tslib "^1.7.1"
 
 "@angular/platform-browser-dynamic@4.1.2":
   version "4.1.2"
@@ -88,6 +90,10 @@
   dependencies:
     "@types/jquery" "*"
 
+"@types/codemirror@~0.0.40":
+  version "0.0.40"
+  resolved "https://registry.yarnpkg.com/@types/codemirror/-/codemirror-0.0.40.tgz#0868ed9ba5bf3ef8072de80e245ecf4a8f0bbdfd"
+
 "@types/core-decorators@^0.10.30":
   version "0.10.32"
   resolved "https://registry.yarnpkg.com/@types/core-decorators/-/core-decorators-0.10.32.tgz#3cb635da99980176832ec420875f7efce1822b5e"
@@ -639,9 +645,9 @@ aws4@^1.2.1:
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.6.0.tgz#83ef5ca860b2b32e4a0deedee8c771b9db57471e"
 
-azure-batch@1.0.0-preview:
-  version "1.0.0-preview"
-  resolved "https://registry.yarnpkg.com/azure-batch/-/azure-batch-1.0.0-preview.tgz#2f281f1f8b7f381afa8eee5adbe6e8b48de40f0e"
+azure-batch@~2.0.0-preview:
+  version "2.0.0-preview"
+  resolved "https://registry.yarnpkg.com/azure-batch/-/azure-batch-2.0.0-preview.tgz#8f8cc0be13dcba361d28e2eb38887ca0e5876ea5"
   dependencies:
     "@types/underscore" "^1.8.0"
     moment "^2.18.1"
@@ -665,7 +671,7 @@ azure-storage@^2.1.0:
     xml2js "0.2.7"
     xmlbuilder "0.4.3"
 
-babel-code-frame@^6.11.0, babel-code-frame@^6.20.0, babel-code-frame@^6.22.0:
+babel-code-frame@^6.11.0, babel-code-frame@^6.22.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.22.0.tgz#027620bee567a88c32561574e7fd0801d33118e4"
   dependencies:
@@ -1965,7 +1971,7 @@ di@^0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/di/-/di-0.0.1.tgz#806649326ceaa7caa3306d75d985ea2748ba913c"
 
-diff@^3.0.1, diff@^3.1.0, diff@^3.2.0:
+diff@^3.1.0, diff@^3.2.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/diff/-/diff-3.2.0.tgz#c9ce393a4b7cbd0b058a725c93df299027868ff9"
 
@@ -5370,7 +5376,7 @@ resolve-from@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-2.0.0.tgz#9480ab20e94ffa1d9e80a804c7ea147611966b57"
 
-resolve@^1.1.7, resolve@^1.3.2:
+resolve@^1.3.2:
   version "1.3.3"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.3.3.tgz#655907c3469a8680dc2de3a275a8fdd69691f0e5"
   dependencies:
@@ -6197,24 +6203,10 @@ tsickle@^0.21.0:
     source-map "^0.5.6"
     source-map-support "^0.4.2"
 
-tslib@^1.6.0:
+tslib@^1.6.0, tslib@^1.7.1:
   version "1.7.1"
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.7.1.tgz#bc8004164691923a79fe8378bbeb3da2017538ec"
 
-tslint@^4.1.1:
-  version "4.5.1"
-  resolved "https://registry.yarnpkg.com/tslint/-/tslint-4.5.1.tgz#05356871bef23a434906734006fc188336ba824b"
-  dependencies:
-    babel-code-frame "^6.20.0"
-    colors "^1.1.2"
-    diff "^3.0.1"
-    findup-sync "~0.3.0"
-    glob "^7.1.1"
-    optimist "~0.6.0"
-    resolve "^1.1.7"
-    tsutils "^1.1.0"
-    update-notifier "^2.0.0"
-
 tslint@~5.2.0:
   version "5.2.0"
   resolved "https://registry.yarnpkg.com/tslint/-/tslint-5.2.0.tgz#16a2addf20cb748385f544e9a0edab086bc34114"
@@ -6230,7 +6222,7 @@ tslint@~5.2.0:
     tslib "^1.6.0"
     tsutils "^1.8.0"
 
-tsutils@^1.1.0, tsutils@^1.8.0:
+tsutils@^1.8.0:
   version "1.9.1"
   resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-1.9.1.tgz#b9f9ab44e55af9681831d5f28d0aeeaf5c750cb0"
 
@@ -6339,7 +6331,7 @@ unzip-response@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/unzip-response/-/unzip-response-2.0.1.tgz#d2f0f737d16b0615e72a6935ed04214572d56f97"
 
-update-notifier@^2.0.0, update-notifier@^2.1.0:
+update-notifier@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/update-notifier/-/update-notifier-2.1.0.tgz#ec0c1e53536b76647a24b77cb83966d9315123d9"
   dependencies:
@@ -6486,12 +6478,6 @@ void-elements@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/void-elements/-/void-elements-2.0.1.tgz#c066afb582bb1cb4128d60ea92392e94d5e9dbec"
 
-vrsource-tslint-rules@^4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/vrsource-tslint-rules/-/vrsource-tslint-rules-4.0.1.tgz#f3cf8026e1d3a9b63d263dd591248dc96dc3ec1c"
-  dependencies:
-    tslint "^4.1.1"
-
 w3c-blob@0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/w3c-blob/-/w3c-blob-0.0.1.tgz#b0cd352a1a50f515563420ffd5861f950f1d85b8"