ing

src/app/app-reducer.module.ts

@@ -0,0 +1,61 @@
+import { NgModule } from '@angular/core';
+import { StoreModule } from '@ngrx/store';
+import { StoreDevtoolsModule } from '@ngrx/store-devtools';
+import {
+  StoreRouterConnectingModule,
+  RouterStateSerializer,
+} from '@ngrx/router-store';
+import { EffectsModule } from '@ngrx/effects';
+import { combineReducers, ActionReducer, ActionReducerMap, MetaReducer } from '@ngrx/store';
+
+import { environment } from '../environments/environment';
+import { AppState } from './app.state';
+
+import { SimpleRouterStateSerializer } from './commons/router/state/serializer/simple-router-state-serializer';
+
+export const reducers: ActionReducerMap<AppState> = {
+};
+
+@NgModule({
+  exports: [
+    StoreModule,
+  ],
+  imports: [
+    StoreModule.forRoot(reducers),
+    /**
+     * @ngrx/router-store keeps router state up-to-date in the store.
+     */
+    StoreRouterConnectingModule.forRoot({
+      /*
+        They stateKey defines the name of the state used by the router-store reducer.
+        This matches the key defined in the map of reducers
+      */
+      stateKey: 'router',
+    }),
+    /**
+     * Store devtools instrument the store retaining past versions of state
+     * and recalculating new states. This enables powerful time-travel
+     * debugging.
+     *
+     * To use the debugger, install the Redux Devtools extension for either
+     * Chrome or Firefox
+     *
+     * See: https://github.com/zalmoxisus/redux-devtools-extension
+     */
+    StoreDevtoolsModule.instrument({
+      name: 'overFlow WebApp DevTools',
+      logOnly: environment.production,
+    }),
+    EffectsModule.forRoot([]),
+  ],
+  providers: [
+    /**
+     * The `RouterStateSnapshot` provided by the `Router` is a large complex structure.
+     * A custom RouterStateSerializer is used to parse the `RouterStateSnapshot` provided
+     * by `@ngrx/router-store` to include only the desired pieces of the snapshot.
+     */
+    { provide: RouterStateSerializer, useClass: SimpleRouterStateSerializer },
+  ],
+
+})
+export class AppReducerModule { }

src/app/app-routing.module.ts

@@ -10,6 +10,6 @@ const routes: Routes = [
 
 @NgModule({
   imports: [RouterModule.forRoot(routes, {useHash: true})],
-  exports: [RouterModule]
+  exports: [RouterModule],
 })
 export class AppRoutingModule { }

src/app/app.module.ts

@@ -3,22 +3,11 @@ import { NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 
-import { StoreModule } from '@ngrx/store';
-import { StoreDevtoolsModule } from '@ngrx/store-devtools';
-import {
-  StoreRouterConnectingModule,
-  RouterStateSerializer,
-} from '@ngrx/router-store';
-import { EffectsModule } from '@ngrx/effects';
-
-import { environment } from '../environments/environment';
-
 import { AppRoutingModule } from './app-routing.module';
-import { AppComponent } from './app.component';
-
+import { AppReducerModule } from './app-reducer.module';
 import { MaterialModule } from './commons/ui/material/material.module';
-import { SimpleRouterStateSerializer } from './commons/router/state/serializer/simple-router-state-serializer';
-import { reducers } from './app.reducers';
+
+import { AppComponent } from './app.component';
 
 @NgModule({
   declarations: [
@@ -28,42 +17,9 @@ import { reducers } from './app.reducers';
     BrowserModule,
     BrowserAnimationsModule,
     AppRoutingModule,
-    StoreModule.forRoot(reducers),
-    /**
-     * @ngrx/router-store keeps router state up-to-date in the store.
-     */
-    StoreRouterConnectingModule.forRoot({
-      /*
-        They stateKey defines the name of the state used by the router-store reducer.
-        This matches the key defined in the map of reducers
-      */
-      stateKey: 'router',
-    }),
-    /**
-     * Store devtools instrument the store retaining past versions of state
-     * and recalculating new states. This enables powerful time-travel
-     * debugging.
-     *
-     * To use the debugger, install the Redux Devtools extension for either
-     * Chrome or Firefox
-     *
-     * See: https://github.com/zalmoxisus/redux-devtools-extension
-     */
-    StoreDevtoolsModule.instrument({
-      name: 'overFlow WebApp DevTools',
-      logOnly: environment.production,
-    }),
-    EffectsModule.forRoot([]),
+    AppReducerModule,
     MaterialModule,
   ],
-  providers: [
-    /**
-     * The `RouterStateSnapshot` provided by the `Router` is a large complex structure.
-     * A custom RouterStateSerializer is used to parse the `RouterStateSnapshot` provided
-     * by `@ngrx/router-store` to include only the desired pieces of the snapshot.
-     */
-    { provide: RouterStateSerializer, useClass: SimpleRouterStateSerializer },
-  ],
   bootstrap: [AppComponent]
 })
 export class AppModule { }

src/app/app.reducers.ts

@@ -1,6 +0,0 @@
-import { combineReducers, ActionReducer, ActionReducerMap, MetaReducer } from '@ngrx/store';
-
-import { AppState } from './app.state';
-
-export const reducers: ActionReducerMap<AppState> = {
-};

src/app/commons/router/guards/auth-guard.spec.ts

@@ -0,0 +1,15 @@
+import { TestBed, inject } from '@angular/core/testing';
+
+import { AuthGuard } from './auth-guard';
+
+describe('AuthGuardService', () => {
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      providers: [AuthGuard]
+    });
+  });
+
+  it('should be created', inject([AuthGuard], (service: AuthGuard) => {
+    expect(service).toBeTruthy();
+  }));
+});

src/app/commons/router/guards/auth-guard.ts

@@ -0,0 +1,9 @@
+import { Injectable } from '@angular/core';
+import { CanActivate } from '@angular/router';
+import { Store, select } from '@ngrx/store';
+import { Observable } from 'rxjs/Observable';
+import { map, take } from 'rxjs/operators';
+
+@Injectable()
+export class AuthGuard {
+}