Add 'New update available' dialog to the electron version (#299)

* build(tsconfig): Rename root tsconfig.json -> tsconfig.base.json

* feat(auto-update): Add update dialog

When new update available than new message will visible of the top of the screen with 2 buttons 'Update' and 'Close'.
- Update button: Update the application (close and restart)
- Close button: Hide the updatePanel

* fix(auto-update): Add types to the event methods

* style: Add comma after SafeStylePipe import

I forgot add the comma when I rebased the branch

* fix(auto-update): Use electron-is-dev package to detect dev build

I removed the isDev() function from the shared util library because it is electron specific code.

* ci: Change osx_image: xcode8.3

Recommended after the last travis upgrade

* feat(auto-update): Add auto update settings page and save config save on electron platform

* ci: Fix osx image

* ci: Upgrade the electron builder -> 19.6.1

The builder now use the 2 package.json structure and build only
the necessary dependencies.

shared/src/components/auto-update-settings/auto-update-settings.html

@@ -0,0 +1,36 @@
+<div class="row">
+    <div class="col-xs-12">
+        <div class="checkbox">
+            <label>
+                <input type="checkbox"
+                       [checked]="settings.checkForUpdateOnStartUp"
+                       (change)="emitCheckForUpdateOnStartUp($event.target.checked)"> Automatically check for update on
+                application start
+            </label>
+        </div>
+
+        <div class="checkbox">
+            <label>
+                <input type="checkbox"
+                       [checked]="settings.usePreReleaseUpdate"
+                       (change)="emitUsePreReleaseUpdate($event.target.checked)"> Allow alpha / pre release
+            </label>
+        </div>
+        <div class="form-group">
+            <label class="col-sm-2 control-label">Version:</label>
+            <div class="col-sm-10">
+                <p class="form-control-static">{{version}}</p>
+            </div>
+        </div>
+
+        <button class="btn btn-link" (click)="emitCheckForUpdate()">
+            Check for update
+            <span *ngIf="checkingForUpdate"
+                  class="fa fa-spinner fa-spin"></span>
+        </button>
+
+        <div>
+            {{message}}
+        </div>
+    </div>
+</div>

shared/src/components/auto-update-settings/auto-update-settings.ts

@@ -0,0 +1,35 @@
+import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
+
+import { State } from '../../store/reducers/auto-update-settings';
+
+@Component({
+    selector: 'auto-update-settings',
+    templateUrl: './auto-update-settings.html',
+    changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class AutoUpdateSettings {
+
+    @Input() version: string;
+    @Input() settings: State;
+    @Input() checkingForUpdate: boolean;
+    @Input() message: string;
+
+    @Output() toggleCheckForUpdateOnStartUp = new EventEmitter<boolean>();
+    @Output() toggleUsePreReleaseUpdate = new EventEmitter<boolean>();
+    @Output() checkForUpdate = new EventEmitter();
+
+    constructor() {
+    }
+
+    emitCheckForUpdateOnStartUp(value: boolean) {
+        this.toggleCheckForUpdateOnStartUp.emit(value);
+    }
+
+    emitUsePreReleaseUpdate(value: boolean) {
+        this.toggleUsePreReleaseUpdate.emit(value);
+    }
+
+    emitCheckForUpdate() {
+        this.checkForUpdate.emit();
+    }
+}

shared/src/components/settings/settings.component.html

@@ -4,4 +4,15 @@
         <span class="macro__name pane-title__name">Settings</span>
     </h1>
 </div>
-To be done...
+<div *ngIf="!runInElectron">
+    To be done...
+</div>
+<auto-update-settings *ngIf="runInElectron"
+                      [version]="version"
+                      [settings]="autoUpdateSettings$ | async"
+                      [checkingForUpdate]="checkingForUpdate$ | async"
+                      [message]="autoUpdateMessage$ | async"
+                      (toggleCheckForUpdateOnStartUp)="toogleCheckForUpdateOnStartUp($event)"
+                      (toggleUsePreReleaseUpdate)="toogleUsePreReleaseUpdate($event)"
+                      (checkForUpdate)="checkForUpdate()">
+</auto-update-settings>

shared/src/components/settings/settings.component.ts

@@ -1,4 +1,15 @@
 import { Component } from '@angular/core';
+import { Store } from '@ngrx/store';
+import { Observable } from 'rxjs/Observable';
+
+import { runInElectron } from '../../util/index';
+import { AppState, getAutoUpdateMessage, getAutoUpdateSettings, getCheckingForUpdate } from '../../store';
+import {
+    CheckForUpdateNowAction,
+    ToggleCheckForUpdateOnStartupAction,
+    TogglePreReleaseFlagAction
+} from '../../store/actions/auto-update-settings';
+import { AutoUpdateSettings } from '../../models/auto-update-settings';
 
 @Component({
     selector: 'settings',
@@ -9,5 +20,28 @@ import { Component } from '@angular/core';
     }
 })
 export class SettingsComponent {
-    constructor() { }
+    runInElectron = runInElectron();
+    // TODO: From where do we get the version number? The electron gives back in main process, but the web...
+    version = '1.0.0';
+    autoUpdateSettings$: Observable<AutoUpdateSettings>;
+    checkingForUpdate$: Observable<boolean>;
+    autoUpdateMessage$: Observable<string>;
+
+    constructor(private store: Store<AppState>) {
+        this.autoUpdateSettings$ = store.select(getAutoUpdateSettings);
+        this.checkingForUpdate$ = store.select(getCheckingForUpdate);
+        this.autoUpdateMessage$ = store.select(getAutoUpdateMessage);
+    }
+
+    toogleCheckForUpdateOnStartUp(value: boolean) {
+        this.store.dispatch(new ToggleCheckForUpdateOnStartupAction(value));
+    }
+
+    toogleUsePreReleaseUpdate(value: boolean) {
+        this.store.dispatch(new TogglePreReleaseFlagAction(value));
+    }
+
+    checkForUpdate() {
+        this.store.dispatch(new CheckForUpdateNowAction());
+    }
 }