feat(state): add keyCompareMap option to select's keys+fn overload

matejchalk · matejchalk · commit b1b537051106 · 2022-09-10T14:28:50.000+02:00
diff --git a/libs/state/selections/spec/select.spec.ts b/libs/state/selections/spec/select.spec.ts
@@ -145,6 +145,43 @@ describe('select', () => {
     });
   });
 
+  it('should accept array of strings keyof T, map function and key compare map', () => {
+    testScheduler.run(({ cold, expectObservable }) => {
+      const state: PrimitiveState & NestedState = {
+        bol: true,
+        str: 'string',
+        num: 42,
+        obj: {
+          key1: {
+            key11: {
+              key111: 'foo',
+            },
+          },
+        },
+      };
+      const source: Observable<PrimitiveState & NestedState> = cold('abcde|', {
+        a: state,
+        b: { ...state, bol: false },
+        c: { ...state, num: 69 },
+        d: { ...state, num: 69, obj: { key1: { key11: { key111: 'foo' } } } },
+        e: { ...state, num: 69, obj: { key1: { key11: { key111: 'bar' } } } },
+      });
+      expectObservable(
+        source.pipe(
+          select(
+            ['num', 'obj'],
+            ({ num, obj }) => `${num}: ${obj.key1.key11.key111}`,
+            { obj: (a, b) => a.key1.key11.key111 === b.key1.key11.key111 }
+          )
+        )
+      ).toBe('a-c-e|', {
+        a: '42: foo',
+        c: '69: foo',
+        e: '69: bar',
+      });
+    });
+  });
+
   it('should accept one operator', () => {
     testScheduler.run(({ cold, expectObservable }) => {
       const source: Observable<PrimitiveState> = cold('a|', {
diff --git a/libs/state/selections/src/index.ts b/libs/state/selections/src/index.ts
@@ -14,8 +14,8 @@ export {
   isObjectGuard,
   isOperateFnArrayGuard,
   isStringAndFunctionTupleGuard,
+  isStringArrayFunctionAndOptionalObjectTupleGuard,
   isStringArrayGuard,
-  isStringsArrayAndFunctionTupleGuard,
 } from './lib/utils/guards';
 export { pipeFromArray } from './lib/utils/pipe-from-array';
 export { safePluck } from './lib/utils/safe-pluck';
diff --git a/libs/state/selections/src/lib/operators/select.ts b/libs/state/selections/src/lib/operators/select.ts
@@ -1,11 +1,11 @@
 import { MonoTypeOperatorFunction, Observable, OperatorFunction } from 'rxjs';
 import { map, pluck } from 'rxjs/operators';
-import { PickSlice } from '../interfaces';
+import { KeyCompareMap, PickSlice } from '../interfaces';
 import {
   isOperateFnArrayGuard,
   isStringAndFunctionTupleGuard,
+  isStringArrayFunctionAndOptionalObjectTupleGuard,
   isStringArrayGuard,
-  isStringsArrayAndFunctionTupleGuard,
 } from '../utils/guards';
 import { pipeFromArray } from '../utils/pipe-from-array';
 import { selectSlice } from './selectSlice';
@@ -99,7 +99,8 @@ export function select<T, A, B, C, D, E>(
  */
 export function select<T extends object, K extends keyof T, R>(
   keys: K[],
-  fn: (slice: PickSlice<T, K>) => R
+  fn: (slice: PickSlice<T, K>) => R,
+  keyCompareMap?: KeyCompareMap<Pick<T, K>>
 ): OperatorFunction<T, R>;
 
 /**
@@ -205,17 +206,24 @@ export function select<T extends Record<string, unknown>>(
   ...opOrMapFn:
     | OperatorFunction<T, unknown>[]
     | string[]
-    | [string, (val: unknown) => unknown]
-    | [string[], (slice: unknown) => unknown]
+    | [k: string, fn: (val: unknown) => unknown]
+    | [
+        keys: string[],
+        fn: (slice: unknown) => unknown,
+        keyCompareMap?: KeyCompareMap<T>
+      ]
 ): OperatorFunction<T, unknown> {
   return (state$: Observable<T>) => {
     if (!opOrMapFn || opOrMapFn.length === 0) {
       return state$.pipe(stateful());
     } else if (isStringAndFunctionTupleGuard(opOrMapFn)) {
       return state$.pipe(stateful(map((s) => opOrMapFn[1](s[opOrMapFn[0]]))));
-    } else if (isStringsArrayAndFunctionTupleGuard(opOrMapFn)) {
+    } else if (isStringArrayFunctionAndOptionalObjectTupleGuard(opOrMapFn)) {
       return state$.pipe(
-        selectSlice<T & object, keyof T>(opOrMapFn[0] as (keyof T)[]),
+        selectSlice<T & object, keyof T>(
+          opOrMapFn[0] as (keyof T)[],
+          opOrMapFn[2]
+        ),
         stateful(map(opOrMapFn[1]))
       );
     } else if (isStringArrayGuard(opOrMapFn)) {
diff --git a/libs/state/selections/src/lib/utils/guards.ts b/libs/state/selections/src/lib/utils/guards.ts
@@ -60,8 +60,12 @@ export function isStringAndFunctionTupleGuard<R>(
   return typeof op[0] === 'string' && typeof op[1] === 'function';
 }
 
-export function isStringsArrayAndFunctionTupleGuard<R>(
+export function isStringArrayFunctionAndOptionalObjectTupleGuard<R>(
   op: unknown[]
-): op is [string[], (val: any) => R] {
-  return isStringArrayGuard(op[0] as any) && typeof op[1] === 'function';
+): op is [strs: string[], fn: (val: any) => R, obj?: object] {
+  return (
+    isStringArrayGuard(op[0] as any) &&
+    typeof op[1] === 'function' &&
+    (op[2] === undefined || typeof op[2] === 'object')
+  );
 }
diff --git a/libs/state/spec/rx-state.service.spec.ts b/libs/state/spec/rx-state.service.spec.ts
@@ -2,6 +2,7 @@ import { fakeAsync, TestBed } from '@angular/core/testing';
 import { RxState } from '@rx-angular/state';
 import { select } from '@rx-angular/state/selections';
 import {
+  initialNestedState,
   initialPrimitiveState,
   jestMatcher,
   PrimitiveState,
@@ -251,6 +252,23 @@ describe('RxStateService', () => {
           });
         });
       });
+
+      it('should return mapped slice on select with keys, function and key compare map', () => {
+        testScheduler.run(({ expectObservable }) => {
+          const state = setupState({
+            initialState: { ...initialPrimitiveState, ...initialNestedState },
+          });
+          expectObservable(
+            state.select(
+              ['num', 'obj'],
+              ({ num, obj }) => `${num}: ${obj.key1.key11.key111}`,
+              { obj: (a, b) => a.key1.key11.key111 === b.key1.key11.key111 }
+            )
+          ).toBe('s', {
+            s: `${initialPrimitiveState.num}: ${initialNestedState.obj.key1.key11.key111}`,
+          });
+        });
+      });
     });
   });
 
diff --git a/libs/state/src/lib/rx-state.service.ts b/libs/state/src/lib/rx-state.service.ts
@@ -5,6 +5,7 @@ import {
   createAccumulationObservable,
   createSideEffectObservable,
   isKeyOf,
+  KeyCompareMap,
   PickSlice,
   safePluck,
   select,
@@ -488,7 +489,8 @@ export class RxState<T extends object> implements OnDestroy, Subscribable<T> {
    */
   select<K extends keyof T, V>(
     keys: K[],
-    fn: (slice: PickSlice<T, K>) => V
+    fn: (slice: PickSlice<T, K>) => V,
+    keyCompareMap?: KeyCompareMap<Pick<T, K>>
   ): Observable<V>;
   /**
    * @description
@@ -578,8 +580,12 @@ export class RxState<T extends object> implements OnDestroy, Subscribable<T> {
     ...args:
       | OperatorFunction<T, unknown>[]
       | string[]
-      | [string, (val: unknown) => unknown]
-      | [string[], (slice: unknown) => unknown]
+      | [k: string, fn: (val: unknown) => unknown]
+      | [
+          keys: string[],
+          fn: (slice: unknown) => unknown,
+          keyCompareMap?: KeyCompareMap<T>
+        ]
   ): Observable<T | R> {
     return this.accumulator.state$.pipe(
       select(...(args as Parameters<typeof select>))
