Added signalr client service to SPA app

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

@@ -20,7 +20,8 @@
       "prefix": "app",
       "styles": [
         "globals.scss",
-        "../node_modules/bootstrap/scss/bootstrap.scss"
+        "../node_modules/bootstrap/scss/bootstrap.scss",
+        "../node_modules/ng2-toastr/bundles/ng2-toastr.min.css"
       ],
       "scripts": [],
       "environmentSource": "environments/environment.ts",

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

@@ -1,11 +1,13 @@
 import { Title } from '@angular/platform-browser';
-import { Component, ViewEncapsulation, OnInit } from '@angular/core';
+import { Component, ViewEncapsulation, OnInit, ViewContainerRef } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { Subscription }   from 'rxjs/Subscription';
 
 import { DataService } from './shared/services/data.service';
 import { SecurityService } from './shared/services/security.service';
 import { ConfigurationService } from './shared/services/configuration.service';
+import { SignalrService } from './shared/services/signalr.service';
+import { ToastsManager } from 'ng2-toastr';
 
 /*
  * App Component
@@ -21,7 +23,14 @@ 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,
+        private signalrService: SignalrService,
+        private toastr: ToastsManager,
+        vcr: ViewContainerRef
+    ) {
+        this.toastr.setRootViewContainerRef(vcr);
         this.Authenticated = this.securityService.IsAuthorized;
     }
 

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

@@ -1,4 +1,5 @@
-import { NgModule, NgModuleFactoryLoader }       from '@angular/core';
+import { NgModule, NgModuleFactoryLoader } from '@angular/core';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { BrowserModule  } from '@angular/platform-browser';
 // import { FormsModule } from '@angular/forms';
 import { HttpModule } from '@angular/http';
@@ -12,11 +13,15 @@ import { CatalogModule }  from './catalog/catalog.module';
 import { OrdersModule }  from './orders/orders.module';
 import { BasketModule } from './basket/basket.module';
 import { CampaignsModule } from './campaigns/campaigns.module';
+import { ToastModule } from 'ng2-toastr/ng2-toastr';
+
 
 @NgModule({
     declarations: [AppComponent],
     imports: [
+        BrowserAnimationsModule,
         BrowserModule,
+        ToastModule.forRoot(),
         routing,
         HttpModule,
         // Only module that app module loads

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

@@ -52,8 +52,7 @@ export class BasketComponent implements OnInit {
                 x => {
                     this.errorMessages = [];
                     this.basketwrapper.basket = this.basket;
-                    this.router.navigate(['order'],
+                    this.router.navigate(['order']);
-                errMessage => this.errorMessages = errMessage.messages);
         });
     }
 

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

@@ -3,6 +3,7 @@ import { OrdersService }        from './orders.service';
 import { IOrder }               from '../shared/models/order.model';
 import { ConfigurationService } from '../shared/services/configuration.service';
 import { Observable } from 'rxjs/Observable';
+import { SignalrService } from '../shared/services/signalr.service';
 
 @Component({
     selector: 'esh-orders',
@@ -16,7 +17,7 @@ export class OrdersComponent implements OnInit {
 
     orders: IOrder[];
 
-    constructor(private service: OrdersService, private configurationService: ConfigurationService) { }
+    constructor(private service: OrdersService, private configurationService: ConfigurationService, private signalrService: SignalrService) { }
 
     ngOnInit() {
         if (this.configurationService.isReady) {
@@ -27,15 +28,8 @@ export class OrdersComponent implements OnInit {
             });
         }
 
-        // call orders until new order is retrieved
+        this.signalrService.msgReceived$
-        this.interval = setTimeout(() => {
+            .subscribe(x => this.getOrders());
-            this.service.getOrders().subscribe(orders => {
-                this.orders = orders;
-                if (this.orders.length !== this.oldOrders.length) {
-                    clearInterval(this.interval);
-                }
-            });
-        }, 1000);
     }
 
     getOrders() {

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

@@ -2,7 +2,8 @@ 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';
+import { SignalrService } from '../../services/signalr.service';
 
 @Component({
     selector: 'esh-identity',
@@ -14,7 +15,7 @@ export class Identity implements OnInit  {
     private subscription: Subscription;
     private userName: string = '';
 
-    constructor(private service: SecurityService) {
+    constructor(private service: SecurityService, private signalrService: SignalrService) {
 
     }
 
@@ -48,6 +49,7 @@ export class Identity implements OnInit  {
     }
 
     logout() {
+        this.signalrService.stop();
         this.service.Logoff();
     }
 }

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

@@ -0,0 +1,70 @@
+import { Injectable } from '@angular/core';
+import { SecurityService } from './security.service';
+import { ConfigurationService } from './configuration.service';
+import { HubConnection, HttpConnection, TransportType } from '@aspnet/signalr';
+import { ToastsManager } from 'ng2-toastr/ng2-toastr';
+import { Subject } from 'rxjs';
+
+@Injectable()
+export class SignalrService {
+
+    private _hubConnection: HubConnection;
+    private _httpConnection: HttpConnection;
+    private orderApiUrl: string = '';
+    private msgSignalrSource = new Subject();
+    msgReceived$ = this.msgSignalrSource.asObservable();
+
+    constructor(
+        private securityService: SecurityService,
+        private configurationService: ConfigurationService, private toastr: ToastsManager,
+    ) {
+        if (this.configurationService.isReady) {
+            this.orderApiUrl = this.configurationService.serverSettings.purchaseUrl;
+            this.init();
+        }
+        else {
+            this.configurationService.settingsLoaded$.subscribe(x => {
+                this.orderApiUrl = this.configurationService.serverSettings.purchaseUrl;
+                this.init();
+            });
+        }            
+    }
+
+    public stop() {
+        this._hubConnection.stop();
+    }
+
+    private init() {
+        if (this.securityService.IsAuthorized == true) {
+            this.register();
+            this.stablishConnection();
+            this.registerHandlers();            
+        }        
+    }
+
+    private register() {
+        this._httpConnection = new HttpConnection(this.orderApiUrl + '/orders-api/notificationhub', {
+            transport: TransportType.LongPolling,
+            accessTokenFactory: () => this.securityService.GetToken()
+        });
+        this._hubConnection = new HubConnection(this._httpConnection);
+    }
+
+    private stablishConnection() {
+        this._hubConnection.start()
+            .then(() => {
+                console.log('Hub connection started')
+            })
+            .catch(() => {
+                console.log('Error while establishing connection')
+            });
+    }
+
+    private registerHandlers() {
+        this._hubConnection.on('UpdatedOrderState', (msg) => {
+            this.toastr.success('Updated to status: ' + msg.status, 'Order Id: ' + msg.orderId);
+            this.msgSignalrSource.next();
+        });
+    }
+
+}

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

@@ -11,6 +11,7 @@ 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';
+import { SignalrService } from './services/signalr.service';
 
 // Components:
 import { Pager } from './components/pager/pager';
@@ -18,6 +19,7 @@ import { Header } from './components/header/header';
 import { Identity } from './components/identity/identity';
 import { PageNotFoundComponent } from './components/page-not-found/page-not-found.component';
 
+
 // Pipes:
 import { UppercasePipe } from './pipes/uppercase.pipe';
 
@@ -64,7 +66,8 @@ export class SharedModule {
                 BasketWrapperService,
                 SecurityService, 
                 ConfigurationService, 
-                StorageService
+                StorageService,
+                SignalrService
             ]
         };
     }

src/Web/WebSPA/WebSPA.csproj

@@ -63,6 +63,7 @@
     <None Remove="Client\modules\shared\services\data.service.ts" />
     <None Remove="Client\modules\shared\services\notification.service.ts" />
     <None Remove="Client\modules\shared\services\security.service.ts" />
+    <None Remove="Client\modules\shared\services\signalr.service.ts" />
     <None Remove="Client\modules\shared\services\storage.service.ts" />
     <None Remove="Client\modules\shared\shared.module.ts" />
     <None Remove="Client\polyfills.ts" />
@@ -178,6 +179,7 @@
     <TypeScriptCompile Include="Client\modules\shared\services\data.service.ts" />
     <TypeScriptCompile Include="Client\modules\shared\services\notification.service.ts" />
     <TypeScriptCompile Include="Client\modules\shared\services\security.service.ts" />
+    <TypeScriptCompile Include="Client\modules\shared\services\signalr.service.ts" />
     <TypeScriptCompile Include="Client\modules\shared\services\storage.service.ts" />
     <TypeScriptCompile Include="Client\modules\shared\shared.module.ts" />
     <TypeScriptCompile Include="Client\polyfills.ts" />

src/Web/WebSPA/package-lock.json

@@ -23,6 +23,14 @@
         }
       }
     },
+    "@angular/animations": {
+      "version": "5.2.9",
+      "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-5.2.9.tgz",
+      "integrity": "sha512-H/3fMs4PhYjKoA81II6D0PHifDrqlKet2u/EXzUBq3ehXby+N/0GBzqsBYwPeU5pTye7WPFfW+5sgoJpN8Ye6Q==",
+      "requires": {
+        "tslib": "1.7.1"
+      }
+    },
     "@angular/cli": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-1.3.0.tgz",
@@ -84,7 +92,7 @@
         "stylus": "0.54.5",
         "stylus-loader": "3.0.1",
         "temp": "0.8.3",
-        "typescript": "2.2.2",
+        "typescript": "2.4.2",
         "url-loader": "0.5.7",
         "walk-sync": "0.3.2",
         "webpack": "3.4.1",
@@ -102,6 +110,12 @@
           "requires": {
             "loader-utils": "1.1.0"
           }
+        },
+        "typescript": {
+          "version": "2.4.2",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.4.2.tgz",
+          "integrity": "sha1-+DlfhdRZJ2BnyYiqQYN6j4KHCEQ=",
+          "dev": true
         }
       }
     },
@@ -247,6 +261,11 @@
         "tslib": "1.7.1"
       }
     },
+    "@aspnet/signalr": {
+      "version": "1.0.0-preview2-final",
+      "resolved": "https://registry.npmjs.org/@aspnet/signalr/-/signalr-1.0.0-preview2-final.tgz",
+      "integrity": "sha1-d2Uv0LWiLeZESl6XRVznv/vJIRY="
+    },
     "@ng-bootstrap/ng-bootstrap": {
       "version": "1.0.0-alpha.22",
       "resolved": "https://registry.npmjs.org/@ng-bootstrap/ng-bootstrap/-/ng-bootstrap-1.0.0-alpha.22.tgz",
@@ -5965,6 +5984,11 @@
       "integrity": "sha1-KzJxhOiZIQEXeyhWP7XnECrNDKk=",
       "dev": true
     },
+    "ng2-toastr": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/ng2-toastr/-/ng2-toastr-4.1.2.tgz",
+      "integrity": "sha1-G0UvBxOZYcOPhmxuJKBiR++iGxE="
+    },
     "no-case": {
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.1.tgz",
@@ -12828,9 +12852,9 @@
       }
     },
     "typescript": {
-      "version": "2.2.2",
+      "version": "2.8.1",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.2.2.tgz",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.8.1.tgz",
-      "integrity": "sha1-YGAiUIR5tV/6NotY/uljoD39eww=",
+      "integrity": "sha1-YWDk+PGV1bqB1IdvnAzB+8CCBiQ=",
       "dev": true
     },
     "uglify-js": {

src/Web/WebSPA/package.json

@@ -21,11 +21,13 @@
     "clean": "npm cache clean && npm run rimraf -- node_modules doc typings coverage wwwroot",
     "start": "ng serve",
     "build:dev": "ng build",
+    "build:dev:watch": "npm run build:dev -- -w",
     "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/animations": "^5.2.9",
     "@angular/common": "^4.0.0",
     "@angular/compiler": "^4.0.0",
     "@angular/core": "^4.0.0",
@@ -34,12 +36,14 @@
     "@angular/platform-browser": "^4.0.0",
     "@angular/platform-browser-dynamic": "^4.0.0",
     "@angular/router": "^4.0.0",
+    "@aspnet/signalr": "^1.0.0-preview2-final",
     "@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",
+    "ng2-toastr": "^4.1.2",
     "normalize.css": "5.0.0",
     "preboot": "4.5.2",
     "rxjs": "^5.1.0",
@@ -60,7 +64,7 @@
     "ts-node": "~2.0.0",
     "tslint": "~4.5.0",
     "typedoc": "0.5.0",
-    "typescript": "~2.2.0",
+    "typescript": "^2.7.1",
     "url-loader": "0.5.7"
   }
 }

test/Services/UnitTest/Ordering/Application/IdentifiedCommandHandlerTest.cs

@@ -75,6 +75,7 @@ namespace UnitTest.Ordering.Application
             return new CreateOrderCommand(
                 new List<BasketItem>(),
                 userId: args != null && args.ContainsKey("userId") ? (string)args["userId"] : null,
+                userName: args != null && args.ContainsKey("userName") ? (string)args["userName"] : null,
                 city: args != null && args.ContainsKey("city") ? (string)args["city"] : null,
                 street: args != null && args.ContainsKey("street") ? (string)args["street"] : null,
                 state: args != null && args.ContainsKey("state") ? (string)args["state"] : null,

test/Services/UnitTest/Ordering/Application/NewOrderCommandHandlerTest.cs

@@ -70,7 +70,7 @@ namespace UnitTest.Ordering.Application
 
         private Order FakeOrder()
         {
-            return new Order("1", new Address("street", "city", "state", "country", "zipcode"), 1, "12", "111", "fakeName", DateTime.Now.AddYears(1));
+            return new Order("1", "fakeName", new Address("street", "city", "state", "country", "zipcode"), 1, "12", "111", "fakeName", DateTime.Now.AddYears(1));
         }
 
         private CreateOrderCommand FakeOrderRequestWithBuyer(Dictionary<string, object> args = null)
@@ -78,6 +78,7 @@ namespace UnitTest.Ordering.Application
             return new CreateOrderCommand(
                 new List<BasketItem>(),
                 userId: args != null && args.ContainsKey("userId") ? (string)args["userId"] : null,
+                userName: args != null && args.ContainsKey("userName") ? (string)args["userName"] : null,
                 city: args != null && args.ContainsKey("city") ? (string)args["city"] : null,
                 street: args != null && args.ContainsKey("street") ? (string)args["street"] : null,
                 state: args != null && args.ContainsKey("state") ? (string)args["state"] : null,

test/Services/UnitTest/Ordering/Application/OrdersWebApiTest.cs

@@ -21,14 +21,12 @@ namespace UnitTest.Ordering.Application
         private readonly Mock<IMediator> _mediatorMock;
         private readonly Mock<IOrderQueries> _orderQueriesMock;
         private readonly Mock<IIdentityService> _identityServiceMock;
-        private readonly Mock<IHubContext<NotificationsHub>> _hubContextMock;
 
         public OrdersWebApiTest()
         {
             _mediatorMock = new Mock<IMediator>();
             _orderQueriesMock = new Mock<IOrderQueries>();
             _identityServiceMock = new Mock<IIdentityService>();
-            _hubContextMock = new Mock<IHubContext<NotificationsHub>>();
         }
 
         [Fact]
@@ -39,7 +37,7 @@ namespace UnitTest.Ordering.Application
                 .Returns(Task.FromResult(true));
 
             //Act
-            var orderController = new OrdersController(_mediatorMock.Object, _orderQueriesMock.Object, _identityServiceMock.Object, _hubContextMock.Object);
+            var orderController = new OrdersController(_mediatorMock.Object, _orderQueriesMock.Object, _identityServiceMock.Object);
             var actionResult = await orderController.CancelOrder(new CancelOrderCommand(1), Guid.NewGuid().ToString()) as OkResult;
 
             //Assert
@@ -55,7 +53,7 @@ namespace UnitTest.Ordering.Application
                 .Returns(Task.FromResult(true));
 
             //Act
-            var orderController = new OrdersController(_mediatorMock.Object, _orderQueriesMock.Object, _identityServiceMock.Object, _hubContextMock.Object);
+            var orderController = new OrdersController(_mediatorMock.Object, _orderQueriesMock.Object, _identityServiceMock.Object);
             var actionResult = await orderController.CancelOrder(new CancelOrderCommand(1), String.Empty) as BadRequestResult;
 
             //Assert
@@ -70,7 +68,7 @@ namespace UnitTest.Ordering.Application
                 .Returns(Task.FromResult(true));
 
             //Act
-            var orderController = new OrdersController(_mediatorMock.Object, _orderQueriesMock.Object, _identityServiceMock.Object, _hubContextMock.Object);
+            var orderController = new OrdersController(_mediatorMock.Object, _orderQueriesMock.Object, _identityServiceMock.Object);
             var actionResult = await orderController.ShipOrder(new ShipOrderCommand(1), Guid.NewGuid().ToString()) as OkResult;
 
             //Assert
@@ -86,7 +84,7 @@ namespace UnitTest.Ordering.Application
                 .Returns(Task.FromResult(true));
 
             //Act
-            var orderController = new OrdersController(_mediatorMock.Object, _orderQueriesMock.Object, _identityServiceMock.Object, _hubContextMock.Object);
+            var orderController = new OrdersController(_mediatorMock.Object, _orderQueriesMock.Object, _identityServiceMock.Object);
             var actionResult = await orderController.ShipOrder(new ShipOrderCommand(1), String.Empty) as BadRequestResult;
 
             //Assert
@@ -102,7 +100,7 @@ namespace UnitTest.Ordering.Application
                 .Returns(Task.FromResult(fakeDynamicResult));
 
             //Act
-            var orderController = new OrdersController(_mediatorMock.Object, _orderQueriesMock.Object, _identityServiceMock.Object, _hubContextMock.Object);
+            var orderController = new OrdersController(_mediatorMock.Object, _orderQueriesMock.Object, _identityServiceMock.Object);
             var actionResult = await orderController.GetOrders() as OkObjectResult;
 
             //Assert
@@ -119,7 +117,7 @@ namespace UnitTest.Ordering.Application
                 .Returns(Task.FromResult(fakeDynamicResult));
 
             //Act
-            var orderController = new OrdersController(_mediatorMock.Object, _orderQueriesMock.Object, _identityServiceMock.Object, _hubContextMock.Object);
+            var orderController = new OrdersController(_mediatorMock.Object, _orderQueriesMock.Object, _identityServiceMock.Object);
             var actionResult = await orderController.GetOrder(fakeOrderId) as OkObjectResult;
 
             //Assert
@@ -135,7 +133,7 @@ namespace UnitTest.Ordering.Application
                 .Returns(Task.FromResult(fakeDynamicResult));
 
             //Act
-            var orderController = new OrdersController(_mediatorMock.Object, _orderQueriesMock.Object, _identityServiceMock.Object, _hubContextMock.Object);
+            var orderController = new OrdersController(_mediatorMock.Object, _orderQueriesMock.Object, _identityServiceMock.Object);
             var actionResult = await orderController.GetCardTypes() as OkObjectResult;
 
             //Assert

test/Services/UnitTest/Ordering/Builders.cs

@@ -19,6 +19,7 @@ namespace UnitTest.Ordering
         {
             order = new Order(
                 "userId",
+                "fakeName",
                 address,
                 cardTypeId:5,
                 cardNumber:"12",

test/Services/UnitTest/Ordering/Domain/OrderAggregateTest.cs

@@ -124,7 +124,7 @@ public class OrderAggregateTest
         var expectedResult = 1;
 
         //Act 
-        var fakeOrder = new Order("1", new Address(street, city, state, country, zipcode), cardTypeId, cardNumber, cardSecurityNumber, cardHolderName, cardExpiration);
+        var fakeOrder = new Order("1", "fakeName", new Address(street, city, state, country, zipcode), cardTypeId, cardNumber, cardSecurityNumber, cardHolderName, cardExpiration);
 
         //Assert
         Assert.Equal(fakeOrder.DomainEvents.Count, expectedResult);
@@ -147,8 +147,8 @@ public class OrderAggregateTest
         var expectedResult = 2;
 
         //Act 
-        var fakeOrder = new Order("1", new Address(street, city, state, country, zipcode), cardTypeId, cardNumber, cardSecurityNumber, cardHolderName, cardExpiration);
+        var fakeOrder = new Order("1", "fakeName", new Address(street, city, state, country, zipcode), cardTypeId, cardNumber, cardSecurityNumber, cardHolderName, cardExpiration);
-        fakeOrder.AddDomainEvent(new OrderStartedDomainEvent(fakeOrder, "1", cardTypeId,cardNumber,cardSecurityNumber,cardHolderName,cardExpiration));
+        fakeOrder.AddDomainEvent(new OrderStartedDomainEvent(fakeOrder, "fakeName", "1", cardTypeId,cardNumber,cardSecurityNumber,cardHolderName,cardExpiration));
         //Assert
         Assert.Equal(fakeOrder.DomainEvents.Count, expectedResult);
     }
@@ -167,8 +167,8 @@ public class OrderAggregateTest
         var cardSecurityNumber = "123";
         var cardHolderName = "FakeName";
         var cardExpiration = DateTime.Now.AddYears(1);
-        var fakeOrder = new Order("1", new Address(street, city, state, country, zipcode), cardTypeId, cardNumber, cardSecurityNumber, cardHolderName, cardExpiration);
+        var fakeOrder = new Order("1", "fakeName", new Address(street, city, state, country, zipcode), cardTypeId, cardNumber, cardSecurityNumber, cardHolderName, cardExpiration);
-        var @fakeEvent = new OrderStartedDomainEvent(fakeOrder, "1", cardTypeId, cardNumber, cardSecurityNumber, cardHolderName, cardExpiration);
+        var @fakeEvent = new OrderStartedDomainEvent(fakeOrder, "1", "fakeName", cardTypeId, cardNumber, cardSecurityNumber, cardHolderName, cardExpiration);
         var expectedResult = 1;
 
         //Act