feat(stark-core): add @ngrx-store-devtools package. Integrate store d…

…ev tools in showcase and starter ISSUES CLOSED: #81, #117
NationalBankBelgium · Jul 17, 2018 · b9c9179 · b9c9179
1 parent eccceb6
commit b9c9179
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 0 deletions.
diff --git a/packages/rollup.config.common-data.js b/packages/rollup.config.common-data.js
@@ -16,6 +16,7 @@ const globals = {
 	"@nationalbankbelgium/stark-core": "stark.core",
 	"@nationalbankbelgium/stark-ui": "stark.ui",
 	"@ngrx/store": "@ngrx/store",
+	"@ngrx/store-devtools": "@ngrx/store-devtools",
 	"@ngrx/effects": "@ngrx/effects",
 	"@ng-idle/core": "@ng-idle/core",
 	"@ng-idle/keepalive": "@ng-idle/keepalive",

diff --git a/packages/stark-core/package.json b/packages/stark-core/package.json
@@ -31,6 +31,7 @@
     "@ng-idle/keepalive": "2.0.0-beta.15",
     "@ngrx/effects": "6.0.1",
     "@ngrx/store": "6.0.1",
+    "@ngrx/store-devtools": "6.0.1",
     "@ngx-translate/core": "10.0.2",
     "@types/node": "8.10.15",
     "@types/uuid": "3.4.3",

diff --git a/showcase/src/app/app.module.ts b/showcase/src/app/app.module.ts
@@ -5,6 +5,7 @@ import { UIRouterModule } from "@uirouter/angular";
 import { NgIdleModule } from "@ng-idle/core";
 import { NgIdleKeepaliveModule } from "@ng-idle/keepalive";
 import { ActionReducer, ActionReducerMap, MetaReducer, StoreModule } from "@ngrx/store";
+import { StoreDevtoolsModule } from "@ngrx/store-devtools";
 import { storeFreeze } from "ngrx-store-freeze";
 import { storeLogger } from "ngrx-store-logger";
 import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
@@ -139,6 +140,12 @@ export const metaReducers: MetaReducer<State>[] = ENV !== "production" ? [logger
 		StoreModule.forRoot(reducers, {
 			metaReducers
 		}),
+		// store dev tools instrumentation must be imported AFTER StoreModule
+		StoreDevtoolsModule.instrument({
+			maxAge: 50, // retains last 50 states
+			name: "Stark Showcase - NgRx Store DevTools", // shown in the monitor page
+			logOnly: environment.production // restrict extension to log-only mode (setting it to false enables all extension features)
+		}),
 		UIRouterModule.forRoot({
 			states: APP_STATES,
 			useHash: !Boolean(history.pushState),

diff --git a/starter/src/app/app.module.ts b/starter/src/app/app.module.ts
@@ -5,6 +5,7 @@ import { UIRouterModule } from "@uirouter/angular";
 import { NgIdleModule } from "@ng-idle/core";
 import { NgIdleKeepaliveModule } from "@ng-idle/keepalive";
 import { ActionReducer, ActionReducerMap, MetaReducer, StoreModule } from "@ngrx/store";
+import { StoreDevtoolsModule } from "@ngrx/store-devtools";
 import { storeFreeze } from "ngrx-store-freeze";
 import { storeLogger } from "ngrx-store-logger";
 import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
@@ -158,6 +159,12 @@ export const metaReducers: MetaReducer<State>[] = ENV !== "production" ? [logger
 		StoreModule.forRoot(reducers, {
 			metaReducers
 		}),
+		// store dev tools instrumentation must be imported AFTER StoreModule
+		StoreDevtoolsModule.instrument({
+			maxAge: 50, // retains last 50 states
+			name: "Stark Starter - NgRx Store DevTools", // shown in the monitor page
+			logOnly: environment.production // restrict extension to log-only mode (setting it to false enables all extension features)
+		}),
 		UIRouterModule.forRoot({
 			states: APP_STATES,
 			useHash: !Boolean(history.pushState),