Add select function api (#10)

* Add select function api. * Use select in useStaat hook
ericmackrodt · Jul 2, 2019 · 50f2cae · 50f2cae
1 parent f792d06
commit 50f2cae
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 6 deletions.
diff --git a/packages/core/src/__tests__/staat.test.ts b/packages/core/src/__tests__/staat.test.ts
@@ -3,6 +3,7 @@ import { Staat, LegacyStaat } from '../types';
 
 type TestState = {
   count: number;
+  name?: string;
 };
 
 const state: TestState = {
@@ -140,5 +141,23 @@ describe('staat', () => {
       await new Promise(resolve => setTimeout(resolve, 1));
       expect(subscription).toHaveBeenCalledTimes(1);
     });
+
+    describe('select', () => {
+      it('gets the whole state if no parameter is passed', () => {
+        expect(sut.select()).toBe(state);
+      });
+
+      it('gets single value', () => {
+        sut.reduce(s => ({ ...s, count: 77 }));
+        expect(sut.select(s => s.count)).toBe(77);
+      });
+
+      it('gets different object with value', () => {
+        sut.reduce(s => ({ ...s, count: 77, name: 'test' }));
+        expect(sut.select(s => ({ result: s.name }))).toEqual({
+          result: 'test',
+        });
+      });
+    });
   });
 });
diff --git a/packages/core/src/staat.ts b/packages/core/src/staat.ts
@@ -5,6 +5,7 @@ import {
   TransformerOrObject,
   LegacyStaat,
   RequesterState,
+  Select,
 } from './types';
 import { isPromise, isTransformer } from './utils';
 
@@ -46,11 +47,12 @@ function makeReduce<TState>(container: StateContainer<TState>) {
   };
 }
 
-function makeSelect<TState>(
-  container: StateContainer<TState>,
-): <TSubset>(selector: (state: TState) => TSubset) => TSubset {
-  return selector => {
+function makeSelect<TState>(container: StateContainer<TState>): Select<TState> {
+  return <TSubset>(selector?: (state: TState) => TSubset | TState) => {
     const state = container.getState();
+    if (!selector) {
+      return state;
+    }
     return selector(state);
   };
 }
@@ -73,11 +75,17 @@ function initializeObject<TState>(
     subscribe: container.subscribe.bind(container),
     unsubscribe: container.unsubscribe.bind(container),
     reduce: makeReduce(container),
+    select: makeSelect(container),
     request: makeRequester(container),
   };
 
   Object.defineProperty(obj, 'currentState', {
-    get: () => container.getState(),
+    get: () => {
+      console.warn(
+        '[Staat - Warning] currentState will no longer be supported, use the select function instead',
+      );
+      return container.getState();
+    },
   });
   return obj as StateContainerType<TState>;
 }

diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts
@@ -30,8 +30,14 @@ export type RequesterState<TState> = {
   ): TState;
 };
 
+export interface Select<TState> {
+  (): TState;
+  <TSubset>(selector: (state: TState) => TSubset): TSubset;
+}
+
 export type StateContainerType<TState> = {
   currentState: TState;
+  select: Select<TState>;
   reduce<TArgs extends any[]>(
     reducer: (state: TState, ...args: TArgs) => TState,
     ...args: TArgs

diff --git a/packages/react/src/hooks.ts b/packages/react/src/hooks.ts
@@ -43,7 +43,7 @@ export function makeUseStaat<TState>(staat: Staat<TState>) {
             return;
           }
 
-          const newState = selector(staat.currentState);
+          const newState = staat.select(selector);
 
           setState((oldState: TSubset) => {
             if (!shallowEqual(oldState, newState)) {