ng5 migration

Migrate to angular 5.1.1
Adjusted some visuals
Fixed some errors
Formatted all sources to LF endline

src/Web/WebSPA/.angular-cli.json

@@ -1,58 +1,55 @@
 {
-  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
-  "project": {
-    "name": "WebSPA"
-  },
-  "apps": [
-    {
-      "root": "Client",
-      "outDir": "wwwroot",
-      "assets": [
-        "assets",
-        "favicon.ico"
-      ],
-      "index": "index.html",
-      "main": "main.ts",
-      "polyfills": "polyfills.ts",
-      "test": "test.ts",
-      "tsconfig": "tsconfig.app.json",
-      "testTsconfig": "tsconfig.spec.json",
-      "prefix": "app",
-      "styles": [
-        "globals.scss",
-        "../node_modules/bootstrap/scss/bootstrap.scss"
-      ],
-      "scripts": [],
-      "environmentSource": "environments/environment.ts",
-      "environments": {
-        "dev": "environments/environment.ts",
-        "prod": "environments/environment.prod.ts"
-      }
-    }
-  ],
-  "e2e": {
-    "protractor": {
-      "config": "./protractor.conf.js"
-    }
-  },
-  "lint": [
-    {
-      "project": "Client/tsconfig.app.json"
+    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+    "project": {
+        "name": "WebSPA"
     },
-    {
-      "project": "Client/tsconfig.spec.json"
+    "apps": [{
+        "root": "Client",
+        "outDir": "wwwroot",
+        "assets": [
+            "assets",
+            "favicon.ico"
+        ],
+        "index": "index.html",
+        "main": "main.ts",
+        "polyfills": "polyfills.ts",
+        "test": "test.ts",
+        "tsconfig": "tsconfig.app.json",
+        "testTsconfig": "tsconfig.spec.json",
+        "prefix": "app",
+        "styles": [
+            "globals.scss",
+            "../node_modules/bootstrap/scss/bootstrap.scss"
+        ],
+        "scripts": [],
+        "environmentSource": "environments/environment.ts",
+        "environments": {
+            "dev": "environments/environment.ts",
+            "prod": "environments/environment.prod.ts"
+        }
+    }],
+    "e2e": {
+        "protractor": {
+            "config": "./protractor.conf.js"
+        }
     },
-    {
-      "project": "e2e/tsconfig.e2e.json"
-    }
-  ],
-  "test": {
-    "karma": {
-      "config": "./karma.conf.js"
+    "lint": [{
+            "project": "Client/tsconfig.app.json"
+        },
+        {
+            "project": "Client/tsconfig.spec.json"
+        },
+        {
+            "project": "e2e/tsconfig.e2e.json"
+        }
+    ],
+    "test": {
+        "karma": {
+            "config": "./karma.conf.js"
+        }
+    },
+    "defaults": {
+        "styleExt": "scss",
+        "component": {}
     }
-  },
-  "defaults": {
-    "styleExt": "scss",
-    "component": {}
-  }
-}
+}

src/Web/WebSPA/.angulardoc.json

@@ -0,0 +1,4 @@
+{
+  "repoId": "bccb75c8-567f-4f97-923c-d56cd1208aa5",
+  "lastSync": 0
+}

src/Web/WebSPA/AppSettings.cs

@@ -1,9 +1,4 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Threading.Tasks;
-
-namespace eShopOnContainers.WebSPA
+namespace eShopOnContainers.WebSPA
 {
     public class AppSettings
     {
@@ -14,6 +9,6 @@ namespace eShopOnContainers.WebSPA
         public string BasketUrl { get; set; }
         public string MarketingUrl { get; set; }
         public string ActivateCampaignDetailFunction { get; set; }
-	public bool UseCustomizationData { get; set; }
+        public bool UseCustomizationData { get; set; }
     }
 }

src/Web/WebSPA/Client/globals.scss

@@ -1,8 +1,7 @@
 /* You can add global styles to this file, and also import other style files */
-@import './modules/variables';
 
+@import './modules/variables';
 $dist: './fonts/Montserrat-Regular';
-
 @font-face {
     font-family: Montserrat;
     font-weight: 400;
@@ -73,5 +72,4 @@ select::-ms-expand {
     border: 0;
     color: #FB0D0D;
     font-size: 12px;
-}
-
+}

src/Web/WebSPA/Client/guid.ts

@@ -1,7 +1,7 @@
 export class Guid {
     static newGuid() {
         return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
-            var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
+            let r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
             return v.toString(16);
         });
     }

src/Web/WebSPA/Client/index.html

@@ -1,18 +1,21 @@
 <!doctype html>
 <html>
+
 <head>
-  <meta charset="utf-8">
-  <title>eShopConContainers.WebSPA</title>
-  <base href="/">
+    <meta charset="utf-8">
+    <title>eShopConContainers.WebSPA</title>
+    <base href="/">
 
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="icon" type="image/x-icon" href="favicon.ico">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="icon" type="image/x-icon" href="favicon.ico">
 </head>
+
 <body>
-  <esh-app>
-    <div class="preloading">
-      <i class="fa fa-spinner fa-spin fa-5x" aria-hidden="true"></i>
-    </div>
-  </esh-app>
+    <esh-app>
+        <div class="preloading">
+            <i class="fa fa-spinner fa-spin fa-5x" aria-hidden="true"></i>
+        </div>
+    </esh-app>
 </body>
-</html>
+
+</html>

src/Web/WebSPA/Client/modules/_variables.scss

@@ -4,41 +4,34 @@ $color-brand-dark: darken($color-brand, 10%);
 $color-brand-darker: darken($color-brand, 20%);
 $color-brand-bright: lighten($color-brand, 10%);
 $color-brand-brighter: lighten($color-brand, 20%);
-
 $color-secondary: #83D01B;
 $color-secondary-dark: darken($color-secondary, 5%);
 $color-secondary-darker: darken($color-secondary, 20%);
 $color-secondary-bright: lighten($color-secondary, 10%);
 $color-secondary-brighter: lighten($color-secondary, 20%);
-
 $color-background-dark: #333333;
 $color-background-darker: #000000;
 $color-background-bright: #EEEEFF;
 $color-background-brighter: #FFFFFF;
-
 $color-foreground-dark: #333333;
 $color-foreground-darker: #000000;
 $color-foreground-bright: #EEEEEE;
 $color-foreground-brighter: #FFFFFF;
-
 // Animations
 $animation-speed-default: .35s;
 $animation-speed-slow: .5s;
 $animation-speed-fast: .15s;
-
 // Fonts
 $font-weight-light: 200;
 $font-weight-semilight: 300;
 $font-weight-normal: 400;
 $font-weight-semibold: 600;
 $font-weight-bold: 700;
-
-$font-size-xs: .65rem;    // 10.4px
-$font-size-s: .85rem;    // 13.6px
-$font-size-m: 1rem;      // 16px
-$font-size-l: 1.25rem;   // 20px
-$font-size-xl: 1.5rem;   // 24px
-
+$font-size-xs: .65rem; // 10.4px
+$font-size-s: .85rem; // 13.6px
+$font-size-m: 1rem; // 16px
+$font-size-l: 1.25rem; // 20px
+$font-size-xl: 1.5rem; // 24px
 // Medias
 $media-screen-xxs: 360px;
 $media-screen-xs: 640px;
@@ -48,10 +41,8 @@ $media-screen-l: 1280px;
 $media-screen-xl: 1440px;
 $media-screen-xxl: 1680px;
 $media-screen-xxxl: 1920px;
-
 // Borders
 $border-light: 1px;
-
 // Images
 $image_path: '/assets/images/';
 $image-main_banner: '#{$image_path}main_banner.png';

src/Web/WebSPA/Client/modules/app.component.html

@@ -1,4 +1,4 @@
-<header class="navbar navbar-light navbar-static-top">
+<header class="navbar-light navbar-static-top">
     <div class="container">
         <article class="row">
 
@@ -37,5 +37,4 @@
 
         </article>
     </div>
-</footer>
-
+</footer>

src/Web/WebSPA/Client/modules/app.component.scss

@@ -1,23 +1,18 @@
 @import './variables';
-
 .esh-app {
     &-footer {
         $margin: 2.5rem;
         $padding: 2.5rem;
-
         background-color: $color-background-darker;
         border-top: $border-light solid $color-foreground-bright;
         margin-top: $margin;
         padding-bottom: $padding;
         padding-top: $padding;
         width: 100%;
-
         $height: 50px;
-
         &-brand {
             height: $height;
             width: 230px;
         }
-
     }
-}
+}

src/Web/WebSPA/Client/modules/app.component.ts

@@ -1,7 +1,7 @@
 import { Title } from '@angular/platform-browser';
 import { Component, ViewEncapsulation, OnInit } from '@angular/core';
 import { RouterModule } from '@angular/router';
-import { Subscription }   from 'rxjs/Subscription';
+import { Subscription } from 'rxjs/Subscription';
 
 import { DataService } from './shared/services/data.service';
 import { SecurityService } from './shared/services/security.service';
@@ -21,7 +21,10 @@ export class AppComponent implements OnInit {
     Authenticated: boolean = false;
     subscription: Subscription;
 
-    constructor(private titleService: Title, private securityService: SecurityService, private configurationService: ConfigurationService) {
+    constructor(
+        private titleService: Title,
+        private securityService: SecurityService,
+        private configurationService: ConfigurationService) {
         this.Authenticated = this.securityService.IsAuthorized;
     }
 
@@ -29,7 +32,7 @@ export class AppComponent implements OnInit {
         console.log('app on init');
         this.subscription = this.securityService.authenticationChallenge$.subscribe(res => this.Authenticated = res);
 
-        //Get configuration from server environment variables:
+        // Get configuration from server environment variables:
         console.log('configuration');
         this.configurationService.load();
     }

src/Web/WebSPA/Client/modules/app.module.ts

@@ -1,15 +1,15 @@
-import { NgModule, NgModuleFactoryLoader }       from '@angular/core';
-import { BrowserModule  } from '@angular/platform-browser';
+import { NgModule, NgModuleFactoryLoader } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
 // import { FormsModule } from '@angular/forms';
 import { HttpModule } from '@angular/http';
 import { RouterModule } from '@angular/router';
 
-import { routing }        from './app.routes';
+import { routing } from './app.routes';
 import { AppService } from './app.service';
 import { AppComponent } from './app.component';
-import { SharedModule }  from './shared/shared.module';
-import { CatalogModule }  from './catalog/catalog.module';
-import { OrdersModule }  from './orders/orders.module';
+import { SharedModule } from './shared/shared.module';
+import { CatalogModule } from './catalog/catalog.module';
+import { OrdersModule } from './orders/orders.module';
 import { BasketModule } from './basket/basket.module';
 import { CampaignsModule } from './campaigns/campaigns.module';
 

src/Web/WebSPA/Client/modules/basket/basket-status/basket-status.component.html

@@ -1,6 +1,4 @@
-<a class="esh-basketstatus"
-   [ngClass]="{'is-disabled': badge < 1}"
-   [routerLink]="['basket']">
+<a class="esh-basketstatus" [ngClass]="{'is-disabled': badge < 1}" [routerLink]="['basket']">
 
     <div class="esh-basketstatus-image">
         <img src="assets/images/cart.png" />
@@ -8,4 +6,4 @@
     <div class="esh-basketstatus-badge">
         {{badge}}
     </div>
-</a>
+</a>

src/Web/WebSPA/Client/modules/basket/basket-status/basket-status.component.scss

@@ -1,22 +1,18 @@
 @import '../../variables';
-
 .esh-basketstatus {
     cursor: pointer;
     display: inline-block;
     float: right;
     position: relative;
     transition: all $animation-speed-default;
-
     &.is-disabled {
         opacity: .5;
         pointer-events: none;
     }
-
     &-image {
         height: 36px;
         margin-top: .5rem;
     }
-
     &-badge {
         $size: 1.5rem;
         background-color: $color-secondary;
@@ -32,10 +28,9 @@
         transition: all $animation-speed-default;
         width: $size;
     }
-
     &:hover &-badge {
         background-color: transparent;
         color: $color-secondary-dark;
         transition: all $animation-speed-default;
     }
-}
+}

src/Web/WebSPA/Client/modules/basket/basket-status/basket-status.component.ts

@@ -1,10 +1,10 @@
-import { Component, OnInit }    from '@angular/core';
-import { Subscription }         from 'rxjs/Subscription';
+import { Component, OnInit } from '@angular/core';
+import { Subscription } from 'rxjs/Subscription';
 
-import { BasketService }        from '../basket.service';
+import { BasketService } from '../basket.service';
 import { BasketWrapperService } from '../../shared/services/basket.wrapper.service';
-import { SecurityService }      from '../../shared/services/security.service';
-import { ConfigurationService }      from '../../shared/services/configuration.service';
+import { SecurityService } from '../../shared/services/security.service';
+import { ConfigurationService } from '../../shared/services/configuration.service';
 
 @Component({
     selector: 'esh-basket-status',
@@ -32,7 +32,7 @@ export class BasketStatusComponent implements OnInit {
                 });
             });
 
-        // Subscribe to Drop Basket Observable: 
+        // Subscribe to Drop Basket Observable:
         this.basketDroppedSubscription = this.service.basketDroped$.subscribe(res => {
             this.badge = 0;
         });

src/Web/WebSPA/Client/modules/basket/basket.component.html

@@ -1,13 +1,13 @@
 <div class="esh-basket">
     <esh-header url="/catalog">Back to catalog</esh-header>
-    
+
     <div class="container">
         <div *ngFor="let errorMessage of errorMessages">
             <div class="esh-basket-items-margin-left1 row">
                 <div class="alert alert-warning" role="alert">&nbsp;{{errorMessage}}</div>
             </div>
         </div>
- 
+
         <article class="esh-basket-titles row">
             <section class="esh-basket-title col-xs-3">Product</section>
             <section class="esh-basket-title col-xs-3 hidden-lg-down"></section>
@@ -20,17 +20,12 @@
             <article class="esh-basket-items row">
 
                 <section class="esh-basket-item esh-basket-item--middle col-lg-3 hidden-lg-down">
-                    <img class="esh-basket-image" src="{{item.pictureUrl}}"/>
+                    <img class="esh-basket-image" src="{{item.pictureUrl}}" />
                 </section>
                 <section class="esh-basket-item esh-basket-item--middle col-xs-3">{{item.productName}}</section>
                 <section class="esh-basket-item esh-basket-item--middle col-xs-2">$ {{item.unitPrice | number:'.2-2'}}</section>
                 <section class="esh-basket-item esh-basket-item--middle col-xs-2">
-                    <input id="quantity"
-                           class="esh-basket-input"
-                           type="number"
-                           min="1"
-                           [(ngModel)]="item.quantity"
-                           (change)="itemQuantityChanged(item)"/>
+                    <input id="quantity" class="esh-basket-input" type="number" min="1" [(ngModel)]="item.quantity" (change)="itemQuantityChanged(item)" />
                 </section>
                 <section class="esh-basket-item esh-basket-item--middle esh-basket-item--mark col-xs-2">$ {{(item.unitPrice * item.quantity) | number:'.2-2'}}</section>
             </article>
@@ -62,4 +57,4 @@
             </section>
         </article>
     </div>
-</div>
+</div>

src/Web/WebSPA/Client/modules/basket/basket.component.scss

@@ -1,69 +1,54 @@
 @import '../variables';
-
 @mixin margin-left($distance) {
     margin-left: $distance;
 }
 
 .esh-basket {
     min-height: 80vh;
-
     &-titles {
         padding-bottom: 1rem;
         padding-top: 2rem;
-
         &--clean {
             padding-bottom: 0;
             padding-top: 0;
         }
     }
-
     &-title {
         text-transform: uppercase;
     }
-
     &-items {
         &--border {
             border-bottom: $border-light solid $color-foreground-bright;
             padding: .5rem 0;
-
             &:last-of-type {
                 border-color: transparent;
             }
         }
-
         &-margin-left1 {
             @include margin-left(1px);
         }
     }
-
     $item-height: 8rem;
-
     &-item {
         font-size: $font-size-m;
         font-weight: $font-weight-semilight;
-
         &--middle {
             line-height: $item-height;
-
             @media screen and (max-width: $media-screen-m) {
                 line-height: $font-size-m;
             }
         }
-
         &--mark {
             color: $color-brand;
         }
     }
-
     &-image {
         height: $item-height;
     }
-
     &-input {
         line-height: 1rem;
         width: 100%;
     }
-
     &-checkout {
         background-color: $color-secondary;
         border: 0;
@@ -77,13 +62,9 @@
         text-align: center;
         text-transform: uppercase;
         transition: all $animation-speed-default;
-
         &:hover {
             background-color: $color-secondary-darker;
             transition: all $animation-speed-default;
         }
     }
-}
-
-
-
+}

src/Web/WebSPA/Client/modules/basket/basket.component.ts

@@ -49,12 +49,11 @@ export class BasketComponent implements OnInit {
     checkOut(event: any) {
         this.update(event)
             .subscribe(
-                x => {
-                    this.errorMessages = [];
-                    this.basketwrapper.basket = this.basket;
-                    this.router.navigate(['order'],
-                errMessage => this.errorMessages = errMessage.messages);
-        });
+            x => {
+                this.errorMessages = [];
+                this.basketwrapper.basket = this.basket;
+                this.router.navigate(['order']);
+            });
     }
 
     private calculateTotalPrice() {

src/Web/WebSPA/Client/modules/basket/basket.module.ts

@@ -1,11 +1,11 @@
-import { NgModule, ModuleWithProviders }                     from '@angular/core';
-import { BrowserModule  }               from '@angular/platform-browser';
+import { NgModule, ModuleWithProviders } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
 
-import { SharedModule }                 from '../shared/shared.module';
-import { BasketComponent }              from './basket.component';
-import { BasketStatusComponent }        from './basket-status/basket-status.component';
-import { BasketService }                from './basket.service';
-import { Header }                from '../shared/components/header/header';
+import { SharedModule } from '../shared/shared.module';
+import { BasketComponent } from './basket.component';
+import { BasketStatusComponent } from './basket-status/basket-status.component';
+import { BasketService } from './basket.service';
+import { Header } from '../shared/components/header/header';
 
 @NgModule({
     imports: [SharedModule],

src/Web/WebSPA/Client/modules/basket/basket.service.ts

@@ -1,24 +1,24 @@
-import { Injectable }               from '@angular/core';
-import { Response, Headers }        from '@angular/http';
-import { Router }                   from '@angular/router';
+import { Injectable } from '@angular/core';
+import { Response, Headers } from '@angular/http';
+import { Router } from '@angular/router';
 
-import { DataService }              from '../shared/services/data.service';
-import { SecurityService }          from '../shared/services/security.service';
+import { DataService } from '../shared/services/data.service';
+import { SecurityService } from '../shared/services/security.service';
 import { IBasket } from '../shared/models/basket.model';
 import { IOrder } from '../shared/models/order.model';
 import { IBasketCheckout } from '../shared/models/basketCheckout.model';
-import { IBasketItem }              from '../shared/models/basketItem.model';
-import { BasketWrapperService }     from '../shared/services/basket.wrapper.service';
-import { ConfigurationService }     from '../shared/services/configuration.service';
-import { StorageService }           from '../shared/services/storage.service';
+import { IBasketItem } from '../shared/models/basketItem.model';
+import { BasketWrapperService } from '../shared/services/basket.wrapper.service';
+import { ConfigurationService } from '../shared/services/configuration.service';
+import { StorageService } from '../shared/services/storage.service';
 
 import 'rxjs/Rx';
-import { Observable }               from 'rxjs/Observable';
+import { Observable } from 'rxjs/Observable';
 import 'rxjs/add/observable/throw';
-import { Observer }                 from 'rxjs/Observer';
+import { Observer } from 'rxjs/Observer';
 import 'rxjs/add/operator/map';
 import 'rxjs/add/operator/catch';
-import { Subject }                  from 'rxjs/Subject';
+import { Subject } from 'rxjs/Subject';
 
 @Injectable()
 export class BasketService {
@@ -28,13 +28,13 @@ export class BasketService {
         items: []
     };
 
-    //observable that is fired when the basket is dropped
+    // observable that is fired when the basket is dropped
     private basketDropedSource = new Subject();
     basketDroped$ = this.basketDropedSource.asObservable();
-    
+
     constructor(private service: DataService, private authService: SecurityService, private basketEvents: BasketWrapperService, private router: Router, private configurationService: ConfigurationService, private storageService: StorageService) {
         this.basket.items = [];
-        
+
         // Init:
         if (this.authService.IsAuthorized) {
             if (this.authService.UserData) {
@@ -56,7 +56,7 @@ export class BasketService {
             this.dropBasket();
         });
     }
-    
+
     addItemToBasket(item): Observable<boolean> {
         this.basket.items.push(item);
         return this.setBasket(this.basket);
@@ -87,12 +87,12 @@ export class BasketService {
 
             return response.json();
         });
-    }    
+    }
 
     mapBasketInfoCheckout(order: IOrder): IBasketCheckout {
         let basketCheckout = <IBasketCheckout>{};
 
-        basketCheckout.street = order.street
+        basketCheckout.street = order.street;
         basketCheckout.city = order.city;
         basketCheckout.country = order.country;
         basketCheckout.state = order.state;
@@ -106,10 +106,10 @@ export class BasketService {
         basketCheckout.expiration = order.expiration;
 
         return basketCheckout;
-    }    
+    }
 
     dropBasket() {
-        this.basket.items = [];        
+        this.basket.items = [];
         this.basketDropedSource.next();
     }
 

src/Web/WebSPA/Client/modules/campaigns/campaigns-detail/campaigns-detail.component.html

@@ -14,4 +14,4 @@
             </div>
         </div>
     </div>
-</div>
+</div>

src/Web/WebSPA/Client/modules/campaigns/campaigns-detail/campaigns-detail.component.scss

@@ -1,57 +1,44 @@
 @import '../../variables';
-
 .esh-campaign_detail {
     min-height: 80vh;
     margin-top: 1rem;
-
     &-section {
         padding: 1rem 0;
-
         &--right {
             text-align: right;
         }
     }
-
     &-titles {
         padding-bottom: 1rem;
         padding-top: 2rem;
     }
-
     &-title {
         text-transform: uppercase;
     }
-
     &-items {
         &--border {
             border-bottom: $border-light solid $color-foreground-bright;
             padding: .5rem 0;
-
             &:last-of-type {
                 border-color: transparent;
             }
         }
     }
-
     $item-height: 8rem;
-
     &-item {
         font-size: $font-size-m;
         font-weight: $font-weight-semilight;
-
         &--middle {
             line-height: $item-height;
-
             @media screen and (max-width: $media-screen-s) {
                 line-height: $font-size-m;
             }
         }
-
         &--mark {
             color: $color-secondary;
         }
     }
-
     &-image {
         height: $item-height;
     }
-}
+}

src/Web/WebSPA/Client/modules/campaigns/campaigns.component.html

@@ -4,10 +4,9 @@
         Error requesting campaigns list, please try later on
     </div>
     <div *ngIf="campaigns?.data?.length > 0">
-        <esh-pager [model]="paginationInfo" (changed)="onPageChanged($event)"></esh-pager>        
+        <esh-pager [model]="paginationInfo" (changed)="onPageChanged($event)"></esh-pager>
         <div class="card-group esh-campaign-items row">
-            <div class="esh-campaign-item col-md-4"
-                 *ngFor="let item of campaigns.data">
+            <div class="esh-campaign-item col-md-4" *ngFor="let item of campaigns.data">
 
                 <div class="card-block">
                     <h4 class="card-title esh-campaign-name">{{item.name}}</h4>
@@ -17,7 +16,7 @@
                         <input [ngClass]="{'esh-campaign-button': true}" type="submit" value="More details" routerLink="/campaigns/{{item.id}}">
                     </ng-template>
                 </div>
-                <div class="card-footer">                    
+                <div class="card-footer">
                     <small class="text-muted">
                         From {{item.from | date }} To {{item.to | date }}
                     </small>
@@ -30,5 +29,4 @@
     <div *ngIf="campaigns?.data?.length == 0">
         <span>THERE ARE NO RESULTS THAT MATCH YOUR SEARCH</span>
     </div>
-</div>
-
+</div>

src/Web/WebSPA/Client/modules/campaigns/campaigns.component.scss

@@ -1,38 +1,30 @@
 @import '../variables';
-
 .esh-campaign {
     $banner-height: 260px;
-
     &-title {
         position: relative;
         top: $banner-height / 3.5;
     }
-
     &-items {
         margin-top: 1rem;
     }
-
     &-item {
         margin-bottom: 1.5rem;
         text-align: center;
         width: 33%;
         display: inline-block;
         float: none !important;
-
         @media screen and (max-width: $media-screen-m) {
             width: 50%;
         }
-
         @media screen and (max-width: $media-screen-s) {
             width: 100%;
         }
     }
-
     &-thumbnail {
         max-width: 370px;
         width: 100%;
     }
-
     &-button {
         background-color: $color-secondary;
         border: 0;
@@ -43,18 +35,15 @@
         margin-top: 1rem;
         transition: all $animation-speed-default;
         width: 80%;
-
         &.is-disabled {
             opacity: .5;
             pointer-events: none;
         }
-
         &:hover {
             background-color: $color-secondary-darker;
             transition: all $animation-speed-default;
         }
     }
-
     &-name {
         font-size: $font-size-m;
         font-weight: $font-weight-semilight;
@@ -62,8 +51,7 @@
         text-align: center;
         text-transform: uppercase;
     }
-
     &-alert {
         margin-top: 10px;
     }
-}
+}

src/Web/WebSPA/Client/modules/campaigns/campaigns.component.ts

@@ -1,7 +1,7 @@
-import { Component, OnInit }    from '@angular/core';
-import { CampaignsService }        from './campaigns.service';
-import { ICampaign }               from '../shared/models/campaign.model';
-import { IPager }               from '../shared/models/pager.model';
+import { Component, OnInit } from '@angular/core';
+import { CampaignsService } from './campaigns.service';
+import { ICampaign } from '../shared/models/campaign.model';
+import { IPager } from '../shared/models/pager.model';
 import { ConfigurationService } from '../shared/services/configuration.service';
 import { Observable } from 'rxjs/Observable';
 
@@ -21,7 +21,7 @@ export class CampaignsComponent implements OnInit {
 
     ngOnInit() {
         if (this.configurationService.isReady) {
-            this.getCampaigns(9, 0)
+            this.getCampaigns(9, 0);
         } else {
             this.configurationService.settingsLoaded$.subscribe(x => {
                 this.getCampaigns(9, 0);
@@ -29,14 +29,14 @@ export class CampaignsComponent implements OnInit {
         }
 
         this.isCampaignDetailFunctionEnabled = this.configurationService.serverSettings.activateCampaignDetailFunction;
-    }    
+    }
 
     onPageChanged(value: any) {
-        console.log('campaigns pager event fired' + value);
-        //event.preventDefault();
+        console.log(`campaigns pager event fired` + value);
+        // event.preventDefault();
         this.paginationInfo.actualPage = value;
         this.getCampaigns(this.paginationInfo.itemsPage, value);
-    }   
+    }
 
     getCampaigns(pageSize: number, pageIndex: number) {
         this.errorReceived = false;
@@ -45,22 +45,22 @@ export class CampaignsComponent implements OnInit {
             .subscribe(campaigns => {
                 this.campaigns = campaigns;
                 this.paginationInfo = {
-                    actualPage : campaigns.pageIndex,
-                    itemsPage : campaigns.pageSize,
-                    totalItems : campaigns.count,
+                    actualPage: campaigns.pageIndex,
+                    itemsPage: campaigns.pageSize,
+                    totalItems: campaigns.count,
                     totalPages: Math.ceil(campaigns.count / campaigns.pageSize),
                     items: campaigns.pageSize
                 };
-        });
+            });
     }
 
     onNavigateToDetails(uri: string) {
-        window.open(uri, "_blank");
+        window.open(uri, `_blank`);
     }
 
     private handleError(error: any) {
         this.errorReceived = true;
         return Observable.throw(error);
-    }  
+    }
 }
 

src/Web/WebSPA/Client/modules/campaigns/campaigns.module.ts

@@ -1,11 +1,11 @@
-import { NgModule }             from '@angular/core';
-import { BrowserModule  }       from '@angular/platform-browser';
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
 
-import { SharedModule }         from '../shared/shared.module';
-import { CampaignsComponent }      from './campaigns.component';
-import { CampaignsDetailComponent }      from './campaigns-detail/campaigns-detail.component';
+import { SharedModule } from '../shared/shared.module';
+import { CampaignsComponent } from './campaigns.component';
+import { CampaignsDetailComponent } from './campaigns-detail/campaigns-detail.component';
 import { CampaignsService } from './campaigns.service';
-import { Header }                from '../shared/components/header/header';
+import { Header } from '../shared/components/header/header';
 
 @NgModule({
     imports: [BrowserModule, SharedModule],

src/Web/WebSPA/Client/modules/campaigns/campaigns.service.ts

@@ -47,6 +47,6 @@ export class CampaignsService {
         return this.service.get(url).map((response: Response) => {
             return response.json();
         });
-    }    
+    }
 }
 

src/Web/WebSPA/Client/modules/catalog/catalog.component.html

@@ -28,8 +28,7 @@
         <esh-pager [model]="paginationInfo" (changed)="onPageChanged($event)"></esh-pager>
 
         <div class="esh-catalog-items row">
-            <div class="esh-catalog-item col-md-4"
-                 *ngFor="let item of catalog?.data">
+            <div class="esh-catalog-item col-md-4" *ngFor="let item of catalog?.data">
 
                 <img class="esh-catalog-thumbnail" src="{{item.pictureUri}}" />
                 <button [ngClass]="{'esh-catalog-button': true, 'is-disabled': !authenticated}" (click)="addToCart(item)">
@@ -50,5 +49,4 @@
     <div *ngIf="catalog?.data.length == 0">
         <span>THERE ARE NO RESULTS THAT MATCH YOUR SEARCH</span>
     </div>
-</div>
-
+</div>

src/Web/WebSPA/Client/modules/catalog/catalog.component.scss

@@ -1,29 +1,22 @@
 @import '../variables';
-
 .esh-catalog {
     $banner-height: 260px;
-
     &-hero {
         background-image: url($image-main_banner);
         background-size: cover;
         height: $banner-height;
         width: 100%;
     }
-
     &-title {
         position: relative;
         top: $banner-height / 3.5;
     }
-
     $filter-height: 65px;
-
     &-filters {
         background-color: $color-brand;
         height: $filter-height;
     }
-
     $filter-padding: .5rem;
-
     &-filter {
         -webkit-appearance: none;
         background-color: transparent;
@@ -38,17 +31,14 @@
         padding-left: $filter-padding;
         padding-right: $filter-padding;
         padding-top: $filter-padding * 3;
-
         option {
             background-color: $color-brand;
         }
     }
-
     &-label {
         display: inline-block;
         position: relative;
         z-index: 0;
-
         &::before {
             color: rgba($color-foreground-brighter, .5);
             content: attr(data-title);
@@ -59,7 +49,6 @@
             text-transform: uppercase;
             z-index: 1;
         }
-
         &::after {
             background-image: url($image-arrow_down);
             content: '';
@@ -71,7 +60,6 @@
             z-index: 1;
         }
     }
-
     &-send {
         background-color: $color-secondary;
         color: $color-foreground-brighter;
@@ -80,38 +68,31 @@
         margin-top: -$filter-padding * 3;
         padding: $filter-padding;
         transition: all $animation-speed-default;
-
         &:hover {
             background-color: $color-secondary-darker;
             transition: all $animation-speed-default;
         }
     }
-
     &-items {
         margin-top: 1rem;
     }
-
     &-item {
         margin-bottom: 1.5rem;
         text-align: center;
         width: 33%;
         display: inline-block;
         float: none !important;
-
         @media screen and (max-width: $media-screen-m) {
             width: 50%;
         }
-
         @media screen and (max-width: $media-screen-s) {
             width: 100%;
         }
     }
-
     &-thumbnail {
         max-width: 370px;
         width: 100%;
     }
-
     &-button {
         background-color: $color-secondary;
         border: 0;
@@ -122,18 +103,15 @@
         margin-top: 1rem;
         transition: all $animation-speed-default;
         width: 80%;
-
         &.is-disabled {
             opacity: .5;
             pointer-events: none;
         }
-
         &:hover {
             background-color: $color-secondary-darker;
             transition: all $animation-speed-default;
         }
     }
-
     &-name {
         font-size: $font-size-m;
         font-weight: $font-weight-semilight;
@@ -141,18 +119,15 @@
         text-align: center;
         text-transform: uppercase;
     }
-
     &-price {
         font-size: 28px;
         font-weight: 900;
         text-align: center;
-
         &::before {
             content: '$';
         }
     }
-
     &-alert {
         margin-top: 10px;
     }
-}
+}

src/Web/WebSPA/Client/modules/catalog/catalog.component.ts

@@ -1,15 +1,15 @@
-import { Component, OnInit }    from '@angular/core';
-import { Subscription }         from 'rxjs/Subscription';
+import { Component, OnInit } from '@angular/core';
+import { Subscription } from 'rxjs/Subscription';
 
-import { CatalogService }       from './catalog.service';
+import { CatalogService } from './catalog.service';
 import { ConfigurationService } from '../shared/services/configuration.service';
-import { ICatalog }             from '../shared/models/catalog.model';
-import { ICatalogItem }         from '../shared/models/catalogItem.model';
-import { ICatalogType }         from '../shared/models/catalogType.model';
-import { ICatalogBrand }        from '../shared/models/catalogBrand.model';
-import { IPager }               from '../shared/models/pager.model';
-import { BasketWrapperService}  from '../shared/services/basket.wrapper.service';
-import { SecurityService }      from '../shared/services/security.service';
+import { ICatalog } from '../shared/models/catalog.model';
+import { ICatalogItem } from '../shared/models/catalogItem.model';
+import { ICatalogType } from '../shared/models/catalogType.model';
+import { ICatalogBrand } from '../shared/models/catalogBrand.model';
+import { IPager } from '../shared/models/pager.model';
+import { BasketWrapperService } from '../shared/services/basket.wrapper.service';
+import { SecurityService } from '../shared/services/security.service';
 import { Observable } from 'rxjs/Observable';
 
 @Component({
@@ -35,7 +35,7 @@ export class CatalogComponent implements OnInit {
     ngOnInit() {
 
         // Configuration Settings:
-        if (this.configurationService.isReady) 
+        if (this.configurationService.isReady)
             this.loadData();
         else
             this.configurationService.settingsLoaded$.subscribe(x => {
@@ -87,13 +87,13 @@ export class CatalogComponent implements OnInit {
             .subscribe(catalog => {
                 this.catalog = catalog;
                 this.paginationInfo = {
-                    actualPage : catalog.pageIndex,
-                    itemsPage : catalog.pageSize,
-                    totalItems : catalog.count,
+                    actualPage: catalog.pageIndex,
+                    itemsPage: catalog.pageSize,
+                    totalItems: catalog.count,
                     totalPages: Math.ceil(catalog.count / catalog.pageSize),
                     items: catalog.pageSize
                 };
-        });
+            });
     }
 
     getTypes() {

src/Web/WebSPA/Client/modules/catalog/catalog.module.ts

@@ -1,10 +1,10 @@
-import { NgModule }             from '@angular/core';
-import { BrowserModule  }       from '@angular/platform-browser';
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
 
-import { SharedModule }         from '../shared/shared.module';
-import { CatalogComponent }     from './catalog.component';
-import { CatalogService }       from './catalog.service';
-import { Pager }                from '../shared/components/pager/pager';
+import { SharedModule } from '../shared/shared.module';
+import { CatalogComponent } from './catalog.component';
+import { CatalogService } from './catalog.service';
+import { Pager } from '../shared/components/pager/pager';
 
 @NgModule({
     imports: [BrowserModule, SharedModule],

src/Web/WebSPA/Client/modules/catalog/catalog.service.ts

@@ -50,5 +50,5 @@ export class CatalogService {
         return this.service.get(this.typesUrl).map((response: Response) => {
             return response.json();
         });
-    };
+    }
 }

src/Web/WebSPA/Client/modules/orders/orders-detail/orders-detail.component.scss

@@ -1,56 +1,47 @@
 @import '../../variables';
-
 .esh-orders_detail {
     min-height: 80vh;
-
     &-section {
         padding: 1rem 0;
-
         &--right {
             text-align: right;
         }
     }
-
     &-titles {
         padding-bottom: 1rem;
         padding-top: 2rem;
+        justify-content: space-between;
+        align-items: right;
     }
-
     &-title {
         text-transform: uppercase;
     }
-
     &-items {
+        justify-content: space-between;
+        align-items: right;
         &--border {
             border-bottom: $border-light solid $color-foreground-bright;
             padding: .5rem 0;
-
             &:last-of-type {
                 border-color: transparent;
             }
         }
     }
-
     $item-height: 8rem;
-
     &-item {
         font-size: $font-size-m;
         font-weight: $font-weight-semilight;
-
         &--middle {
             line-height: $item-height;
-
             @media screen and (max-width: $media-screen-s) {
                 line-height: $font-size-m;
             }
         }
-
         &--mark {
             color: $color-secondary;
         }
     }
-
     &-image {
         height: $item-height;
     }
-}
+}

src/Web/WebSPA/Client/modules/orders/orders-new/orders-new.component.html

@@ -5,7 +5,7 @@
 </div>
 
 <div class="container">
-    <div  class="alert alert-warning esh-orders_new-alert" role="alert" [hidden]="!errorReceived">
+    <div class="alert alert-warning esh-orders_new-alert" role="alert" [hidden]="!errorReceived">
         Not possible to create a new order, please try later on
     </div>
     <form [formGroup]="newOrderForm" (ngSubmit)="submitForm(newOrderForm.value)">
@@ -80,8 +80,7 @@
                 <section class="esh-orders_new-title col-xs-12">Order details</section>
             </article>
 
-            <article class="esh-orders_new-items esh-orders_new-items--border row"
-                     *ngFor="let item of order.orderItems">
+            <article class="esh-orders_new-items esh-orders_new-items--border row" *ngFor="let item of order.orderItems">
                 <section class="esh-orders_new-item col-md-4 hidden-md-down">
                     <img class="esh-orders_new-image" src="{{item.pictureurl}}">
                 </section>

src/Web/WebSPA/Client/modules/orders/orders-new/orders-new.component.scss

@@ -1,36 +1,28 @@
 @import '../../variables';
-
 .esh-orders_new {
     min-height: 80vh;
-
     $header-height: 4rem;
-
     &-header {
         background-color: #00A69C;
         height: $header-height;
     }
-
     &-back {
         color: rgba($color-foreground-brighter, .4);
         line-height: $header-height;
         text-decoration: none;
         text-transform: uppercase;
         transition: color $animation-speed-default;
-
         &:hover {
             color: $color-foreground-brighter;
             transition: color $animation-speed-default;
         }
     }
-
     &-section {
         padding: 1rem 0;
-
         &--right {
             text-align: right;
         }
     }
-
     &-placeOrder {
         background-color: $color-secondary;
         border: 0;
@@ -44,58 +36,46 @@
         text-align: center;
         text-transform: uppercase;
         transition: all $animation-speed-default;
-
         &:hover {
             background-color: $color-secondary-darker;
             transition: all $animation-speed-default;
         }
     }
-
     &-titles {
         padding-bottom: 1rem;
         padding-top: 2rem;
     }
-
     &-title {
         font-size: $font-size-l;
         text-transform: uppercase;
     }
-
     &-items {
         &--border {
             border-bottom: $border-light solid $color-foreground-bright;
             padding: .5rem 0;
-
             &:last-of-type {
                 border-color: transparent;
             }
         }
     }
-
     $item-height: 8rem;
-
     &-item {
         font-size: $font-size-m;
         font-weight: $font-weight-semilight;
-
         &--middle {
             line-height: $item-height;
-
             @media screen and (max-width: $media-screen-s) {
                 line-height: $font-size-m;
             }
         }
-
         &--mark {
             color: $color-secondary;
         }
     }
-
     &-image {
         height: $item-height;
     }
-
     &-alert {
-       margin-top: 10px;
+        margin-top: 10px;
     }
-}
+}

src/Web/WebSPA/Client/modules/orders/orders-new/orders-new.component.ts

@@ -2,11 +2,11 @@ import { Component, OnInit } from '@angular/core';
 import { Observable } from 'rxjs/Observable';
 import { OrdersService } from '../orders.service';
 import { BasketService } from '../../basket/basket.service';
-import { IOrder }                                   from '../../shared/models/order.model';
-import { BasketWrapperService }                     from '../../shared/services/basket.wrapper.service';
+import { IOrder } from '../../shared/models/order.model';
+import { BasketWrapperService } from '../../shared/services/basket.wrapper.service';
 
-import { FormGroup, FormBuilder, Validators  }      from '@angular/forms';
-import { Router }                                   from '@angular/router';
+import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import { Router } from '@angular/router';
 
 @Component({
     selector: 'esh-orders_new',
@@ -37,7 +37,7 @@ export class OrdersNewComponent implements OnInit {
     ngOnInit() {
     }
 
-    submitForm(value: any) {        
+    submitForm(value: any) {
         this.order.street = this.newOrderForm.controls['street'].value;
         this.order.city = this.newOrderForm.controls['city'].value;
         this.order.state = this.newOrderForm.controls['state'].value;
@@ -52,7 +52,7 @@ export class OrdersNewComponent implements OnInit {
             .catch((errMessage) => {
                 this.errorReceived = true;
                 this.isOrderProcessing = false;
-                return Observable.throw(errMessage); 
+                return Observable.throw(errMessage);
             })
             .subscribe(res => {
                 this.router.navigate(['orders']);

src/Web/WebSPA/Client/modules/orders/orders.component.html

@@ -13,8 +13,7 @@
             <section class="esh-orders-title col-xs-2"></section>
         </article>
 
-        <article class="esh-orders-items row"
-                 *ngFor="let order of orders">
+        <article class="esh-orders-items row" *ngFor="let order of orders">
             <section class="esh-orders-item col-xs-2">{{order.ordernumber}}</section>
             <section class="esh-orders-item col-xs-4">{{order.date | date:'short'}}</section>
             <section class="esh-orders-item col-xs-2">$ {{order.total}}</section>
@@ -24,4 +23,4 @@
             </section>
         </article>
     </div>
-</div>
+</div>

src/Web/WebSPA/Client/modules/orders/orders.component.scss

@@ -1,44 +1,39 @@
 @import '../variables';
-
 .esh-orders {
     min-height: 80vh;
     overflow-x: hidden;
-
     $header-height: 4rem;
-
     &-header {
         background-color: #00A69C;
         height: $header-height;
     }
-
     &-back {
         color: rgba($color-foreground-brighter, .4);
         line-height: $header-height;
         text-decoration: none;
         text-transform: uppercase;
         transition: color $animation-speed-default;
-
         &:hover {
             color: $color-foreground-brighter;
             transition: color $animation-speed-default;
         }
     }
-
     &-titles {
         padding-bottom: 1rem;
         padding-top: 2rem;
+        justify-content: space-between;
+        align-items: right;
     }
-
     &-title {
         text-transform: uppercase;
     }
-
     &-items {
         $height: 2rem;
         height: $height;
         line-height: $height;
         position: relative;
-
+        justify-content: space-between;
+        align-items: right;
         &:nth-of-type(2n + 1) {
             &:before {
                 background-color: $color-background-bright;
@@ -53,33 +48,27 @@
             }
         }
     }
-
     &-item {
         font-weight: $font-weight-semilight;
-
         &--hover {
             opacity: 0;
             pointer-events: none;
         }
     }
-
     &-items:hover &-item--hover {
         opacity: 1;
         pointer-events: all;
     }
-
     &-link {
         color: $color-secondary;
         text-decoration: none;
         transition: color $animation-speed-default;
-
         &:hover {
             color: $color-secondary-dark;
             transition: color $animation-speed-default;
         }
     }
-
     &-alert {
         margin-top: 10px;
     }
-}
+}

src/Web/WebSPA/Client/modules/orders/orders.component.ts

@@ -1,6 +1,6 @@
-import { Component, OnInit }    from '@angular/core';
-import { OrdersService }        from './orders.service';
-import { IOrder }               from '../shared/models/order.model';
+import { Component, OnInit } from '@angular/core';
+import { OrdersService } from './orders.service';
+import { IOrder } from '../shared/models/order.model';
 import { ConfigurationService } from '../shared/services/configuration.service';
 import { Observable } from 'rxjs/Observable';
 
@@ -46,12 +46,12 @@ export class OrdersComponent implements OnInit {
                 this.orders = orders;
                 this.oldOrders = this.orders;
                 console.log('orders items retrieved: ' + orders.length);
-        });
+            });
     }
 
     private handleError(error: any) {
         this.errorReceived = true;
         return Observable.throw(error);
-    }  
+    }
 }
 

src/Web/WebSPA/Client/modules/orders/orders.module.ts

@@ -1,13 +1,13 @@
-import { NgModule }             from '@angular/core';
-import { BrowserModule  }       from '@angular/platform-browser';
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
 
-import { SharedModule }         from '../shared/shared.module';
-import { OrdersComponent }      from './orders.component';
-import { OrdersDetailComponent }      from './orders-detail/orders-detail.component';
-import { OrdersNewComponent }      from './orders-new/orders-new.component';
+import { SharedModule } from '../shared/shared.module';
+import { OrdersComponent } from './orders.component';
+import { OrdersDetailComponent } from './orders-detail/orders-detail.component';
+import { OrdersNewComponent } from './orders-new/orders-new.component';
 import { OrdersService } from './orders.service';
 import { BasketService } from '../basket/basket.service';
-import { Header }                from '../shared/components/header/header';
+import { Header } from '../shared/components/header/header';
 
 @NgModule({
     imports: [BrowserModule, SharedModule],

src/Web/WebSPA/Client/modules/orders/orders.service.ts

@@ -4,7 +4,7 @@ import { Response } from '@angular/http';
 import { DataService } from '../shared/services/data.service';
 import { IOrder } from '../shared/models/order.model';
 import { IOrderItem } from '../shared/models/orderItem.model';
-import { IOrderDetail } from "../shared/models/order-detail.model";
+import { IOrderDetail } from '../shared/models/order-detail.model';
 import { SecurityService } from '../shared/services/security.service';
 import { ConfigurationService } from '../shared/services/configuration.service';
 import { BasketWrapperService } from '../shared/services/basket.wrapper.service';
@@ -71,7 +71,7 @@ export class OrdersService {
         basket.items.forEach(x => {
             let item: IOrderItem = <IOrderItem>{};
             item.pictureurl = x.pictureUrl;
-            item.productId =  +x.productId;
+            item.productId = +x.productId;
             item.productname = x.productName;
             item.unitprice = x.unitPrice;
             item.units = x.quantity;

src/Web/WebSPA/Client/modules/shared/components/header/header.html

@@ -4,4 +4,4 @@
             <ng-content></ng-content>
         </a>
     </div>
-</div>
+</div>

src/Web/WebSPA/Client/modules/shared/components/header/header.scss

@@ -1,21 +1,17 @@
 @import '../../../variables';
-
 .esh-header {
     $header-height: 4rem;
-
     background-color: $color-brand;
     height: $header-height;
-
     &-back {
         color: rgba($color-foreground-brighter, .5);
         line-height: $header-height;
         text-decoration: none;
         text-transform: uppercase;
         transition: color $animation-speed-default;
-
         &:hover {
             color: $color-foreground-brighter;
             transition: color $animation-speed-default;
         }
     }
-}
+}

src/Web/WebSPA/Client/modules/shared/components/identity/identity.html

@@ -1,42 +1,35 @@
 <div class="esh-identity">
-    <section class="esh-identity-section"
-             *ngIf="!authenticated">
-        <div class="esh-identity-item"
-             (click)="login()">
+    <section class="esh-identity-section" *ngIf="!authenticated">
+        <div class="esh-identity-item" (click)="login()">
 
             <div class="esh-identity-name esh-identity-name--upper">Login</div>
         </div>
     </section>
 
-    <section class="esh-identity-section"
-         *ngIf="authenticated">
+    <section class="esh-identity-section" *ngIf="authenticated">
 
-        <div class="esh-identity-name">{{userName}}</div>
+        <div class="esh-identity-name">{{getUserName()}}</div>
         <img class="esh-identity-image" src="assets/images/arrow-down.png">
     </section>
 
-    <section class="esh-identity-drop"
-             *ngIf="authenticated">
+    <section class="esh-identity-drop" *ngIf="authenticated">
 
-        <div class="esh-identity-item"
-             [routerLink]="['orders']">
+        <div class="esh-identity-item" [routerLink]="['orders']">
 
             <div class="esh-identity-name esh-identity-name--upper">My orders</div>
             <img class="esh-identity-image" src="assets/images/my_orders.png">
         </div>
 
-        <div class="esh-identity-item"
-             [routerLink]="['campaigns']">
+        <div class="esh-identity-item" [routerLink]="['campaigns']">
 
             <div class="esh-identity-name esh-identity-name--upper">My campaigns</div>
             <img class="esh-identity-image" src="assets/images/my_orders.png">
         </div>
 
-        <div class="esh-identity-item"
-             (click)="logoutClicked($event)">
+        <div class="esh-identity-item" (click)="logoutClicked($event)">
 
             <div class="esh-identity-name esh-identity-name--upper">Log Out</div>
             <img class="esh-identity-image" src="assets/images/logout.png">
         </div>
     </section>
-</div>
+</div>

src/Web/WebSPA/Client/modules/shared/components/identity/identity.scss

@@ -1,31 +1,24 @@
 @import '../../../variables';
-
 .esh-identity {
     line-height: 2.1rem;
     position: relative;
     text-align: right;
-
     &-section {
         display: inline-block;
         width: 100%;
     }
-
     &-name {
         display: inline-block;
-
         &--upper {
             text-transform: uppercase;
         }
-
         @media screen and (max-width: $media-screen-s) {
             font-size: $font-size-s;
         }
     }
-
     &-image {
         display: inline-block;
     }
-
     &-drop {
         background: $color-background-brighter;
         height: 0;
@@ -37,20 +30,17 @@
         top: 2.5rem;
         transition: height $animation-speed-default;
     }
-
     &:hover &-drop {
         border: $border-light solid $color-foreground-bright;
         height: 7rem;
         transition: height $animation-speed-default;
     }
-
     &-item {
         cursor: pointer;
         transition: color $animation-speed-default;
-
         &:hover {
             color: $color-secondary-dark;
             transition: color $animation-speed-default;
         }
     }
-}
+}

src/Web/WebSPA/Client/modules/shared/components/identity/identity.ts

@@ -2,14 +2,14 @@ import { Component, OnInit, OnChanges, Output, Input, EventEmitter } from '@angu
 import { Subscription } from 'rxjs/Subscription';
 
 import { IIdentity } from '../../models/identity.model';
-import { SecurityService } from  '../../services/security.service';
+import { SecurityService } from '../../services/security.service';
 
 @Component({
     selector: 'esh-identity',
     templateUrl: './identity.html',
     styleUrls: ['./identity.scss']
 })
-export class Identity implements OnInit  {
+export class Identity implements OnInit {
     authenticated: boolean = false;
     private subscription: Subscription;
     private userName: string = '';
@@ -50,4 +50,8 @@ export class Identity implements OnInit  {
     logout() {
         this.service.Logoff();
     }
+
+    getUserName() {
+        return this.userName;
+    }
 }

src/Web/WebSPA/Client/modules/shared/components/pager/pager.html

@@ -2,11 +2,7 @@
     <div class="container">
         <article class="esh-pager-wrapper row">
             <nav>
-                <span class="esh-pager-item esh-pager-item--navigable"
-                      id="Previous"
-                      [ngClass]="{'is-disabled': buttonStates?.previousDisabled}"
-                      (click)="onPreviousCliked($event)"
-                      aria-label="Previous">
+                <span class="esh-pager-item esh-pager-item--navigable" id="Previous" [ngClass]="{'is-disabled': buttonStates?.previousDisabled}" (click)="onPreviousCliked($event)" aria-label="Previous">
                     Previous
                 </span>
 
@@ -14,14 +10,10 @@
                     Showing {{model?.items}} of {{model?.totalItems}} products - Page {{model?.actualPage + 1}} - {{model?.totalPages}}
                 </span>
 
-                <span class="esh-pager-item esh-pager-item--navigable"
-                      id="Next"
-                      [ngClass]="{'is-disabled': buttonStates?.nextDisabled}"
-                      (click)="onNextClicked($event)"
-                      aria-label="Next">
+                <span class="esh-pager-item esh-pager-item--navigable" id="Next" [ngClass]="{'is-disabled': buttonStates?.nextDisabled}" (click)="onNextClicked($event)" aria-label="Next">
                     Next
                 </span>
             </nav>
         </article>
     </div>
-</div>
+</div>

src/Web/WebSPA/Client/modules/shared/components/pager/pager.scss

@@ -1,36 +1,28 @@
 @import '../../../variables';
-
 .esh-pager {
-
     &-wrapper {
         padding-top: 1rem;
         text-align: center;
     }
-
     &-item {
         $margin: 5vw;
         margin: 0 $margin;
-
         &.is-disabled {
             opacity: 0;
             pointer-events: none;
         }
-
         &--navigable {
             cursor: pointer;
             display: inline-block;
-
             &:hover {
                 color: $color-secondary;
             }
         }
-
         @media screen and (max-width: $media-screen-l) {
             font-size: $font-size-s;
         }
-
         @media screen and (max-width: $media-screen-m) {
             margin: 0 $margin / 2;
         }
     }
-}
+}

src/Web/WebSPA/Client/modules/shared/components/pager/pager.ts

@@ -7,7 +7,7 @@ import { IPager } from '../../models/pager.model';
     templateUrl: './pager.html',
     styleUrls: ['./pager.scss']
 })
-export class Pager implements OnInit, OnChanges  {
+export class Pager implements OnInit, OnChanges {
 
     @Output()
     changed: EventEmitter<number> = new EventEmitter<number>();

src/Web/WebSPA/Client/modules/shared/models/campaign.model.ts

@@ -1,7 +1,7 @@
-import {ICampaignItem} from './campaignItem.model';
+import { ICampaignItem } from './campaignItem.model';
 
 export interface ICampaign {
-    data: ICampaignItem[];    
+    data: ICampaignItem[];
     pageIndex: number;
     pageSize: number;
     count: number;

src/Web/WebSPA/Client/modules/shared/models/campaignItem.model.ts

@@ -1,4 +1,4 @@
-export interface ICampaignItem {    
+export interface ICampaignItem {
     id: number;
     name: string;
     description: string;

src/Web/WebSPA/Client/modules/shared/models/catalog.model.ts

@@ -1,4 +1,4 @@
-import {ICatalogItem} from './catalogItem.model';
+import { ICatalogItem } from './catalogItem.model';
 
 export interface ICatalog {
     pageIndex: number;

src/Web/WebSPA/Client/modules/shared/models/configuration.model.ts

@@ -1,8 +1,8 @@
 export interface IConfiguration {
-    catalogUrl: string,
-    orderingUrl: string, 
-    identityUrl: string, 
-    basketUrl: string,
-    marketingUrl: string,
-    activateCampaignDetailFunction: boolean
+    catalogUrl: string;
+    orderingUrl: string;
+    identityUrl: string;
+    basketUrl: string;
+    marketingUrl: string;
+    activateCampaignDetailFunction: boolean;
 }

src/Web/WebSPA/Client/modules/shared/models/order-detail.model.ts

@@ -1,4 +1,4 @@
-import {IOrderItem} from './orderItem.model';
+import { IOrderItem } from './orderItem.model';
 
 export interface IOrderDetail {
     ordernumber: string;

src/Web/WebSPA/Client/modules/shared/models/order.model.ts

@@ -1,4 +1,4 @@
-import {IOrderItem} from './orderItem.model';
+import { IOrderItem } from './orderItem.model';
 
 export interface IOrder {
     city: number;

src/Web/WebSPA/Client/modules/shared/pipes/uppercase.pipe.ts

@@ -1,7 +1,7 @@
 import { Pipe, PipeTransform } from '@angular/core';
 
 @Pipe({
-        name: 'appfUppercase'
+    name: 'appfUppercase'
 })
 export class UppercasePipe implements PipeTransform {
     transform(value: string) {

src/Web/WebSPA/Client/modules/shared/services/basket.wrapper.service.ts

@@ -1,9 +1,9 @@
-import { Injectable }       from '@angular/core';
-import { Subject }          from 'rxjs/Subject';
+import { Injectable } from '@angular/core';
+import { Subject } from 'rxjs/Subject';
 
-import { ICatalogItem }     from '../models/catalogItem.model';
-import { IBasketItem }      from '../models/basketItem.model';
-import { IBasket }          from '../models/basket.model';
+import { ICatalogItem } from '../models/catalogItem.model';
+import { IBasketItem } from '../models/basketItem.model';
+import { IBasket } from '../models/basket.model';
 import { SecurityService } from '../services/security.service';
 import { Guid } from '../../../guid';
 

src/Web/WebSPA/Client/modules/shared/services/configuration.service.ts

@@ -1,14 +1,14 @@
-import { Injectable }       from '@angular/core';
+import { Injectable } from '@angular/core';
 import { Http, Response, RequestOptionsArgs, RequestMethod, Headers } from '@angular/http';
-import { IConfiguration }   from '../models/configuration.model';
-import { StorageService }   from './storage.service';
+import { IConfiguration } from '../models/configuration.model';
+import { StorageService } from './storage.service';
 
 import 'rxjs/Rx';
-import { Observable }       from 'rxjs/Observable';
+import { Observable } from 'rxjs/Observable';
 import 'rxjs/add/observable/throw';
-import { Observer }         from 'rxjs/Observer';
+import { Observer } from 'rxjs/Observer';
 import 'rxjs/add/operator/map';
-import { Subject }          from 'rxjs/Subject';
+import { Subject } from 'rxjs/Subject';
 
 
 @Injectable()
@@ -20,7 +20,7 @@ export class ConfigurationService {
     isReady: boolean = false;
 
     constructor(private http: Http, private storageService: StorageService) { }
-    
+
     load() {
         const baseURI = document.baseURI.endsWith('/') ? document.baseURI : `${document.baseURI}/`;
         let url = `${baseURI}Home/Configuration`;

src/Web/WebSPA/Client/modules/shared/services/data.service.ts

@@ -11,7 +11,7 @@ import 'rxjs/add/operator/catch';
 import { SecurityService } from './security.service';
 import { Guid } from '../../../guid';
 
-// Implementing a Retry-Circuit breaker policy 
+// Implementing a Retry-Circuit breaker policy
 // is pending to do for the SPA app
 @Injectable()
 export class DataService {
@@ -27,8 +27,8 @@ export class DataService {
 
         return this.http.get(url, options).map(
             (res: Response) => {
-            return res;
-        }).catch(this.handleError);
+                return res;
+            }).catch(this.handleError);
     }
 
     postWithId(url: string, data: any, params?: any): Observable<Response> {

src/Web/WebSPA/Client/modules/shared/services/security.service.ts

@@ -1,12 +1,12 @@
-import { Injectable }                   from '@angular/core';
-import { Http, Response, Headers }      from '@angular/http';
+import { Injectable } from '@angular/core';
+import { Http, Response, Headers } from '@angular/http';
 import 'rxjs/add/operator/map';
-import { Observable }                   from 'rxjs/Observable';
-import { Subject }                      from 'rxjs/Subject';
-import { Router }                       from '@angular/router';
-import { ActivatedRoute }               from '@angular/router';
-import { ConfigurationService }         from './configuration.service';
-import { StorageService }               from './storage.service';
+import { Observable } from 'rxjs/Observable';
+import { Subject } from 'rxjs/Subject';
+import { Router } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
+import { ConfigurationService } from './configuration.service';
+import { StorageService } from './storage.service';
 
 @Injectable()
 export class SecurityService {
@@ -25,7 +25,7 @@ export class SecurityService {
         this.storage = _storageService;
 
         this._configurationService.settingsLoaded$.subscribe(x => {
-            this.authorityUrl = this._configurationService.serverSettings.identityUrl
+            this.authorityUrl = this._configurationService.serverSettings.identityUrl;
             this.storage.store('IdentityUrl', this.authorityUrl);
         });
 
@@ -205,7 +205,7 @@ export class SecurityService {
         return data;
     }
 
-    //private retrieve(key: string): any {
+    // private retrieve(key: string): any {
     //    let item = this.storage.getItem(key);
 
     //    if (item && item !== 'undefined') {
@@ -213,11 +213,11 @@ export class SecurityService {
     //    }
 
     //    return;
-    //}
+    // }
 
-    //private store(key: string, value: any) {
+    // private store(key: string, value: any) {
     //    this.storage.setItem(key, JSON.stringify(value));
-    //}
+    // }
 
     private getUserData = (): Observable<string[]> => {
         this.setHeaders();

src/Web/WebSPA/Client/modules/shared/shared.module.ts

@@ -7,7 +7,7 @@ import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
 
 // Services
 import { DataService } from './services/data.service';
-import { BasketWrapperService} from './services/basket.wrapper.service';
+import { BasketWrapperService } from './services/basket.wrapper.service';
 import { SecurityService } from './services/security.service';
 import { ConfigurationService } from './services/configuration.service';
 import { StorageService } from './services/storage.service';
@@ -62,8 +62,8 @@ export class SharedModule {
                 // Providers
                 DataService,
                 BasketWrapperService,
-                SecurityService, 
-                ConfigurationService, 
+                SecurityService,
+                ConfigurationService,
                 StorageService
             ]
         };

src/Web/WebSPA/Client/test.ts

@@ -17,7 +17,7 @@ declare var __karma__: any;
 declare var require: any;
 
 // Prevent Karma from running prematurely.
-__karma__.loaded = function () {};
+__karma__.loaded = function () { };
 
 // First, initialize the Angular testing environment.
 getTestBed().initTestEnvironment(

src/Web/WebSPA/Client/tsconfig.app.json

@@ -1,13 +1,13 @@
 {
-  "extends": "../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../out-tsc/app",
-    "module": "es2015",
-    "baseUrl": "",
-    "types": []
-  },
-  "exclude": [
-    "test.ts",
-    "**/*.spec.ts"
-  ]
-}
+    "extends": "../tsconfig.json",
+    "compilerOptions": {
+        "outDir": "../out-tsc/app",
+        "module": "es2015",
+        "baseUrl": "",
+        "types": []
+    },
+    "exclude": [
+        "test.ts",
+        "**/*.spec.ts"
+    ]
+}

src/Web/WebSPA/Client/tsconfig.spec.json

@@ -1,20 +0,0 @@
-{
-  "extends": "../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../out-tsc/spec",
-    "module": "commonjs",
-    "target": "es5",
-    "baseUrl": "",
-    "types": [
-      "jasmine",
-      "node"
-    ]
-  },
-  "files": [
-    "test.ts"
-  ],
-  "include": [
-    "**/*.spec.ts",
-    "**/*.d.ts"
-  ]
-}

src/Web/WebSPA/Client/typings.d.ts

@@ -1,5 +0,0 @@
-/* SystemJS module definition */
-declare var module: NodeModule;
-interface NodeModule {
-  id: string;
-}

src/Web/WebSPA/Program.cs

@@ -28,7 +28,7 @@ namespace eShopConContainers.WebSPA
                     builder.AddConsole();
                     builder.AddDebug();
                 })
-                .UseApplicationInsights()                
-                .Build();       
+                .UseApplicationInsights()
+                .Build();
     }
 }

src/Web/WebSPA/Properties/launchSettings.json

@@ -1,18 +1,18 @@
 {
-  "iisSettings": {
-    "windowsAuthentication": false,
-    "anonymousAuthentication": true,
-    "iisExpress": {
-      "applicationUrl": "http://localhost:5104/",
-      "sslPort": 0
+    "iisSettings": {
+        "windowsAuthentication": false,
+        "anonymousAuthentication": true,
+        "iisExpress": {
+            "applicationUrl": "http://localhost:5104/",
+            "sslPort": 0
+        }
+    },
+    "profiles": {
+        "IIS Express": {
+            "commandName": "IISExpress",
+            "environmentVariables": {
+                "ASPNETCORE_ENVIRONMENT": "Production"
+            }
+        }
     }
-  },
-  "profiles": {
-    "IIS Express": {
-      "commandName": "IISExpress",
-      "environmentVariables": {
-        "ASPNETCORE_ENVIRONMENT": "Production"
-      }
-    }
-  }
 }

src/Web/WebSPA/Server/Controllers/HomeController.cs

@@ -20,6 +20,6 @@ namespace eShopConContainers.WebSPA.Server.Controllers
         public IActionResult Configuration()
         {
             return Json(_settings.Value);
-        } 
+        }
     }
 }

src/Web/WebSPA/Startup.cs

@@ -54,8 +54,8 @@ namespace eShopConContainers.WebSPA
                 checks.AddUrlCheck(Configuration["BasketUrlHC"], TimeSpan.Zero); //No cache for this HealthCheck, better just for demos 
                 checks.AddUrlCheck(Configuration["IdentityUrlHC"], TimeSpan.FromMinutes(minutes));
                 checks.AddUrlCheck(Configuration["MarketingUrlHC"], TimeSpan.FromMinutes(minutes));
-            
-        });
+
+            });
 
             services.Configure<AppSettings>(Configuration);
 
@@ -110,7 +110,7 @@ namespace eShopConContainers.WebSPA
             {
                 loggerFactory.CreateLogger("init").LogDebug($"Using PATH BASE '{pathBase}'");
                 app.UsePathBase(pathBase);
-            }            
+            }
 
             app.Use(async (context, next) =>
             {
@@ -120,12 +120,12 @@ namespace eShopConContainers.WebSPA
                 // Rewrite request to use app root
                 if (context.Response.StatusCode == 404 && !Path.HasExtension(context.Request.Path.Value) && !context.Request.Path.Value.StartsWith("/api"))
                 {
-                    context.Request.Path = "/index.html"; 
+                    context.Request.Path = "/index.html";
                     context.Response.StatusCode = 200; // Make sure we update the status code, otherwise it returns 404
                     await next();
                 }
             });
-            
+
             app.UseDefaultFiles();
             app.UseStaticFiles();
 

src/Web/WebSPA/appsettings.json

@@ -1,22 +1,22 @@
 {
-  "CatalogUrl": "http://localhost:5101",
-  "OrderingUrl": "http://localhost:5102",
-  "BasketUrl": "http://localhost:5103",
-  "IdentityUrl": "http://localhost:5105",
-  "MarketingUrl": "http://localhost:5110",
-  "CallBackUrl": "http://localhost:5104/",
-  "UseCustomizationData": true,
-  "IsClusterEnv": "False",
-  "ActivateCampaignDetailFunction": true,
-  "Logging": {
-    "IncludeScopes": false,
-    "LogLevel": {
-      "Default": "Debug",
-      "System": "Information",
-      "Microsoft": "Information"
+    "CatalogUrl": "http://localhost:5101",
+    "OrderingUrl": "http://localhost:5102",
+    "BasketUrl": "http://localhost:5103",
+    "IdentityUrl": "http://localhost:5105",
+    "MarketingUrl": "http://localhost:5110",
+    "CallBackUrl": "http://localhost:5104/",
+    "UseCustomizationData": true,
+    "IsClusterEnv": "False",
+    "ActivateCampaignDetailFunction": true,
+    "Logging": {
+        "IncludeScopes": false,
+        "LogLevel": {
+            "Default": "Debug",
+            "System": "Information",
+            "Microsoft": "Information"
+        }
+    },
+    "ApplicationInsights": {
+        "InstrumentationKey": ""
     }
-  },
-  "ApplicationInsights": {
-    "InstrumentationKey": ""
-  }
 }

src/Web/WebSPA/package.json

@@ -1,66 +1,67 @@
 {
-  "name": "eshopaspnetnetcoredockerspa",
-  "version": "0.0.0",
-  "private": true,
-  "keywords": [
-    "aspnetcore",
-    "entityframework core",
-    "angular2",
-    "webpack2",
-    "typescript2",
-    "bootstrap4",
-    "docker"
-  ],
-  "author": {
-    "name": "Microsoft",
-    "email": "cesardl@microsoft.com"
-  },
-  "scripts": {
-    "ng": "ng",
-    "rimraf": "rimraf",
-    "clean": "npm cache clean && npm run rimraf -- node_modules doc typings coverage wwwroot",
-    "start": "ng serve",
-    "build:dev": "ng build",
-    "build:prod": "ng build --prod --aot --extract-css",
-    "lint:sass": "sass-lint -c .sass-lint.yml Client/**/*.scss --verbose",
-    "lint:ts": "tslint -c tslint.json Client/**/*.ts"
-  },
-  "dependencies": {
-    "@angular/common": "^4.0.0",
-    "@angular/compiler": "^4.0.0",
-    "@angular/core": "^4.0.0",
-    "@angular/forms": "^4.0.0",
-    "@angular/http": "^4.0.0",
-    "@angular/platform-browser": "^4.0.0",
-    "@angular/platform-browser-dynamic": "^4.0.0",
-    "@angular/router": "^4.0.0",
-    "@ng-bootstrap/ng-bootstrap": "1.0.0-alpha.22",
-    "bootstrap": "4.0.0-alpha.5",
-    "core-js": "^2.4.1",
-    "file-loader": "0.9.0",
-    "font-awesome": "4.6.3",
-    "isomorphic-fetch": "2.2.1",
-    "normalize.css": "5.0.0",
-    "preboot": "4.5.2",
-    "rxjs": "^5.1.0",
-    "zone.js": "^0.8.4"
-  },
-  "devDependencies": {
-    "@angular/cli": "^1.3.0",
-    "@angular/compiler-cli": "^4.0.0",
-    "@types/core-js": "0.9.34",
-    "@types/hammerjs": "2.0.33",
-    "@types/jasmine": "2.5.38",
-    "@types/node": "~6.0.60",
-    "@types/protractor": "1.5.20",
-    "@types/selenium-webdriver": "2.44.26",
-    "codelyzer": "~2.0.0",
-    "sass-lint": "1.10.2",
-    "ts-helpers": "1.1.1",
-    "ts-node": "~2.0.0",
-    "tslint": "~4.5.0",
-    "typedoc": "0.5.0",
-    "typescript": "~2.2.0",
-    "url-loader": "0.5.7"
-  }
+    "name": "eshopaspnetnetcoredockerspa",
+    "version": "0.0.0",
+    "private": true,
+    "keywords": [
+        "aspnetcore",
+        "entityframework core",
+        "angular2",
+        "webpack2",
+        "typescript2",
+        "bootstrap4",
+        "docker"
+    ],
+    "author": {
+        "name": "Microsoft",
+        "email": "cesardl@microsoft.com"
+    },
+    "scripts": {
+        "ng": "ng",
+        "rimraf": "rimraf",
+        "clean": "npm cache clean && npm run rimraf -- node_modules doc typings coverage wwwroot",
+        "start": "ng serve",
+        "build:dev": "ng build",
+        "build:prod": "ng build --prod --aot --extract-css",
+        "lint:sass": "sass-lint -c .sass-lint.yml Client/**/*.scss --verbose",
+        "lint:ts": "tslint -c tslint.json Client/**/*.ts"
+    },
+    "dependencies": {
+        "@angular/common": "5.1.1",
+        "@angular/compiler": "5.1.1",
+        "@angular/core": "5.1.1",
+        "@angular/forms": "5.1.1",
+        "@angular/http": "5.1.1",
+        "@angular/platform-browser": "5.1.1",
+        "@angular/platform-browser-dynamic": "5.1.1",
+        "@angular/router": "5.1.1",
+        "@ng-bootstrap/ng-bootstrap": "1.0.0-beta.8",
+        "bootstrap": "4.0.0-beta.2",
+        "jquery": "3.2.1",
+        "popper.js": "1.12.9",
+        "core-js": "2.5.3",
+        "file-loader": "1.1.6",
+        "font-awesome": "4.7.0",
+        "isomorphic-fetch": "2.2.1",
+        "normalize.css": "7.0.0",
+        "preboot": "4.5.2",
+        "rxjs": "5.5.5",
+        "zone.js": "^0.8.18"
+    },
+    "devDependencies": {
+        "@angular/cli": "1.6.1",
+        "@angular/compiler-cli": "5.1.1",
+        "@types/core-js": "0.9.43",
+        "@types/hammerjs": "2.0.35",
+        "@types/jasmine": "2.8.2",
+        "@types/node": "8.5.1",
+        "@types/selenium-webdriver": "3.0.8",
+        "codelyzer": "4.0.2",
+        "sass-lint": "1.12.1",
+        "ts-helpers": "1.1.2",
+        "ts-node": "4.0.2",
+        "tslint": "5.8.0",
+        "typedoc": "0.9.0",
+        "typescript": "2.6.2",
+        "url-loader": "0.6.2"
+    }
 }

src/Web/WebSPA/tsconfig.json

@@ -17,4 +17,4 @@
       "dom"
     ]
   }
-}
+}

src/Web/WebSPA/typedoc.json

@@ -1,15 +1,15 @@
 {
-  "mode": "modules",
-  "out": "doc",
-  "theme": "default",
-  "ignoreCompilerErrors": "true",
-  "experimentalDecorators": "true",
-  "emitDecoratorMetadata": "true",
-  "target": "ES5",
-  "moduleResolution": "node",
-  "preserveConstEnums": "true",
-  "stripInternal": "true",
-  "suppressExcessPropertyErrors": "true",
-  "suppressImplicitAnyIndexErrors": "true",
-  "module": "commonjs"
-}
+    "mode": "modules",
+    "out": "doc",
+    "theme": "default",
+    "ignoreCompilerErrors": "true",
+    "experimentalDecorators": "true",
+    "emitDecoratorMetadata": "true",
+    "target": "ES5",
+    "moduleResolution": "node",
+    "preserveConstEnums": "true",
+    "stripInternal": "true",
+    "suppressExcessPropertyErrors": "true",
+    "suppressImplicitAnyIndexErrors": "true",
+    "module": "commonjs"
+}

src/Web/WebSPA/web.config

@@ -1,14 +1,10 @@
 <?xml version="1.0" encoding="utf-8"?>
 <configuration>
-
-  <!--
-    Configure your application settings in appsettings.json. Learn more at https://go.microsoft.com/fwlink/?LinkId=786380
-  -->
-
-  <system.webServer>
-    <handlers>
-      <add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModule" resourceType="Unspecified"/>
-    </handlers>
-    <aspNetCore processPath="%LAUNCHER_PATH%" arguments="%LAUNCHER_ARGS%" stdoutLogEnabled="false" stdoutLogFile=".\logs\stdout" forwardWindowsAuthToken="false"/>
-  </system.webServer>
+	<!-- Configure your application settings in appsettings.json. Learn more at https://go.microsoft.com/fwlink/?LinkId=786380 -->
+	<system.webServer>
+		<handlers>
+			<add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModule" resourceType="Unspecified" />
+		</handlers>
+		<aspNetCore processPath="%LAUNCHER_PATH%" arguments="%LAUNCHER_ARGS%" stdoutLogEnabled="false" stdoutLogFile=".\logs\stdout" forwardWindowsAuthToken="false" />
+	</system.webServer>
 </configuration>