fix(core): rework local-storage initial state hydratation

- prevent loss of initial state of lazy loaded reducers
- use meta reducer to merge local-storage state on both INIT and UPDATE (reducers) events
- add debug meta reducer in DEV mode
- run tests with PROD env to prevent debug reducer logging

- standardize payloads (always use payload object with typed properties)

Fixes #3, #34

package.json

@@ -15,7 +15,7 @@
     "clean": "rm -rf ./dist/",
     "server": "cd dist && http-server",
     "prod": "npm run clean && npm run build:prod && npm run server",
-    "ci": "npm run clean && npm run prettier:ci && ng lint && ng test --browser ChromeTravisCi --single-run --reporters spec && npm run build:travisci",
+    "ci": "npm run clean && npm run prettier:ci && ng lint && ng test --browser ChromeTravisCi --single-run --reporters spec --environment prod && npm run build:travisci",
     "release": "standard-version && git push --follow-tags origin master",
     "prettier": "prettier --single-quote --parser typescript --write \"./src/**/*.ts\" && prettier --single-quote --parser scss --write \"./src/**/*.scss\"",
     "prettier:ci": "prettier --single-quote --parser typescript --list-different \"./src/**/*.ts\" && prettier --single-quote --parser scss --list-different \"./src/**/*.scss\"",

src/app/core/core.module.ts

@@ -1,15 +1,21 @@
 import { NgModule, Optional, SkipSelf } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { HttpClientModule } from '@angular/common/http';
-import { StoreModule } from '@ngrx/store';
+import { MetaReducer, StoreModule } from '@ngrx/store';
 import { EffectsModule } from '@ngrx/effects';
 
+import { environment } from '@env/environment';
+
+import { debug } from './meta-reducers/debug.reducer';
+import { initStateFromLocalStorage } from './meta-reducers/init-state-from-local-storage.reducer';
 import { LocalStorageService } from './local-storage/local-storage.service';
 import { authReducer } from './auth/auth.reducer';
 import { AuthEffects } from './auth/auth.effects';
 
-export function getInitialState() {
-  return LocalStorageService.loadInitialState();
+export const metaReducers: MetaReducer<any>[] = [initStateFromLocalStorage];
+
+if (!environment.production) {
+  metaReducers.unshift(debug);
 }
 
 @NgModule({
@@ -23,7 +29,7 @@ export function getInitialState() {
       {
         auth: authReducer
       },
-      { initialState: getInitialState }
+      { metaReducers }
     ),
     EffectsModule.forRoot([AuthEffects])
   ],

src/app/core/meta-reducers/debug.reducer.ts

@@ -0,0 +1,13 @@
+import { ActionReducer } from '@ngrx/store';
+
+export function debug(reducer: ActionReducer<any>): ActionReducer<any> {
+  return function(state, action) {
+    const newState = reducer(state, action);
+    console.log(`[DEBUG] action: ${action.type}`, {
+      payload: (<any>action).payload,
+      oldState: state,
+      newState
+    });
+    return newState;
+  };
+}

src/app/core/meta-reducers/init-state-from-local-storage.reducer.ts

@@ -0,0 +1,19 @@
+import { ActionReducer, INIT, UPDATE } from '@ngrx/store';
+
+import { LocalStorageService } from '../local-storage/local-storage.service';
+
+export function initStateFromLocalStorage(
+  reducer: ActionReducer<any>
+): ActionReducer<any> {
+  return function(state, action) {
+    const newState = reducer(state, action);
+    if ([INIT.toString(), UPDATE.toString()].includes(action.type)) {
+      return Object.assign(
+        {},
+        newState,
+        LocalStorageService.loadInitialState()
+      );
+    }
+    return newState;
+  };
+}