feat(RouterStore): make the router store key selector generic

* feat(RouterStore): make the router store key selector generic
* docs: add note that router stateKey can also be a selector

Closes #1457

Author: timdeschryver

modules/router-store/src/router_store_module.ts

@@ -29,12 +29,17 @@ import {
   DefaultRouterStateSerializer,
   RouterStateSerializer,
   SerializedRouterStateSnapshot,
+  BaseRouterStoreState,
 } from './serializer';
 
-export type StateKeyOrSelector = string | Selector<any, RouterReducerState>;
+export type StateKeyOrSelector<
+  T extends BaseRouterStoreState = SerializedRouterStateSnapshot
+> = string | Selector<any, RouterReducerState<T>>;
 
-export interface StoreRouterConfig {
-  stateKey?: StateKeyOrSelector;
+export interface StoreRouterConfig<
+  T extends BaseRouterStoreState = SerializedRouterStateSnapshot
+> {
+  stateKey?: StateKeyOrSelector<T>;
   serializer?: new (...args: any[]) => RouterStateSerializer;
   /**
    * By default, ROUTER_NAVIGATION is dispatched before guards and resolvers run.
@@ -136,8 +141,10 @@ enum RouterTrigger {
   ],
 })
 export class StoreRouterConnectingModule {
-  static forRoot(
-    config: StoreRouterConfig = {}
+  static forRoot<
+    T extends BaseRouterStoreState = SerializedRouterStateSnapshot
+  >(
+    config: StoreRouterConfig<T> = {}
   ): ModuleWithProviders<StoreRouterConnectingModule> {
     return {
       ngModule: StoreRouterConnectingModule,

projects/ngrx.io/content/guide/router-store/configuration.md

@@ -2,13 +2,13 @@
 
 ```ts
 interface StoreRouterConfig {
-  stateKey?: string;
+  stateKey?: string | Selector<any, RouterReducerState<T>>;
   serializer?: new (...args: any[]) => RouterStateSerializer;
   navigationActionTiming?: NavigationActionTiming;
 }
 ```
 
-- `stateKey`: The name of reducer key, defaults to `router`
+- `stateKey`: The name of reducer key, defaults to `router`. It's also possible to provide a selector function.
 - `serializer`: How a router snapshot is serialized. Defaults to `DefaultRouterStateSerializer`. See [Custom Router State Serializer](#custom-router-state-serializer) for more information.
 - `navigationActionTiming`: When the `ROUTER_NAVIGATION` is dispatched. Defaults to `NavigationActionTiming.PreActivation`. See [Navigation Action Timing](#navigation-action-timing) for more information.
 
@@ -24,6 +24,7 @@ Your custom serializer should implement the abstract class `RouterStateSerialize
 You then provide the serializer through the config.
 
 **In a custom serializer ts file**
+
 ```ts
 import { Params, RouterStateSnapshot } from '@angular/router';
 import { RouterStateSerializer } from '@ngrx/router-store';
@@ -56,13 +57,15 @@ export class CustomSerializer implements RouterStateSerializer<RouterStateUrl> {
 ```
 
 **In your root reducer**
+
 ```ts
 export const reducers: ActionReducerMap<State> = {
   router: routerReducer
 };
 ```
 
 **In your AppModule**
+
 ```ts
 @NgModule({
   imports: [