Merge branch 'master' into master

dist/index.d.ts

@@ -1,29 +1,27 @@
-declare module 'react-waterfall' {
+import { ComponentType } from 'react';
 
-  import React from 'react'
+export type Action<T> = (...args: any[]) => void
+export type Actions<T> = {
+  [K: string]: Action<T>
+}
+export type Store<T, A> = {
+  initialState: T
+  actions: {
+    [K in keyof A]: (state: T, ...args: any[]) => T | Promise<T>
+  }
+}
 
-  declare type State = any
-  declare type Self = any
-  declare type Action = (state: State) => any
-  declare type Actions = { [key: string]: Action }
-  declare type Subscriber = (action: Action, state: State) => void
+export type Subscriber<T, A> = (action: keyof A, state: T, ...args: any[]) => void
 
-  declare type Store = {
-    initialState: State
-    actions: Actions
-  }
+export type Middleware<T, A> = (store: Store<T, A>, self: ComponentType<any>) => (action: keyof A, ...args: any[]) => void
 
-  declare type Middleware = (store: Store, self: Self) => (action: string) => void
+export type Connect<T, P = any> = (selector: (state: T) => P) => (baseComponet: ComponentType<any>) => ComponentType<any>
 
-  declare export const initStore: (
-    state: any,
-    middlewares?: Middleware[],
-  ) => {
-    Provider: React.Component<any>
-    Consumer: React.Component<any>
-    connect: (state: any) => (component: React.Component<any>) => React.Component<any>
-    actions: Actions
-    getState: () => State
-    subscribe: Subscriber
-  }
+export function initStore<T, A extends Actions<T>>(store: Store<T, A>, ...middlewares: Middleware<T, A>[]): {
+  Provider: ComponentType<any>
+  Consumer: ComponentType<any>
+  connect: Connect<T>
+  actions: A
+  getState: () => T
+  subscribe: (subscruber: Subscriber<T, A>) => void
 }

src/__tests__/index.spec.js

@@ -26,6 +26,7 @@ describe('initStore', () => {
     expect(storeContext.getState).toBeDefined()
     expect(storeContext.connect).toBeDefined()
     expect(storeContext.subscribe).toBeDefined()
+    expect(storeContext.unsubscribe).toBeDefined()
   })
 
   test('should fail an action if provider not initialized', () => {
@@ -92,6 +93,22 @@ describe('initStore', () => {
     expect(subscriber).toHaveBeenCalledTimes(1)
   })
 
+  test('should remove subscribers on unsubscribe', () => {
+    const { connect, Provider, actions, subscribe, unsubscribe } = initStore(mockStore)
+    const Count = connect(state => ({ count: state.count }))(TestCount)
+    const subscriber = jest.fn()
+    subscribe(subscriber)
+    const component = renderer.create(
+      <Provider>
+        <Count />
+      </Provider>
+    );
+    unsubscribe(subscriber)
+    actions.increment()
+    component.toJSON() // invoke render
+    expect(subscriber).toHaveBeenCalledTimes(0)
+  })
+
   test('should allow action to return a promise', () => {
     const { connect, Provider, actions, subscribe } = initStore(mockStore)
     const Count = connect(state => ({ count: state.count }))(TestCount)

src/index.js

@@ -25,6 +25,10 @@ export const initStore: Function = (store, ...middlewares) => {
     subscriptions = [...subscriptions, fn]
   }
 
+  const unsubscribe = fn => {
+    subscriptions = subscriptions.filter(subscriber => subscriber !== fn)
+  }
+
   const actions = Object.keys(store.actions).reduce(
     (r, v) => ({
       ...r,
@@ -48,9 +52,9 @@ export const initStore: Function = (store, ...middlewares) => {
     _children = () => this.props.children
 
     prevent = ({ state, actions }) => {
-      const { mapStateToProps } = this.props
+      const { mapStateToProps, children /* exclude children from rest */, ...rest } = this.props
       return (
-        <Prevent {...mapStateToProps(state)} actions={actions} _children={this._children} />
+        <Prevent {...mapStateToProps(state)} {...rest} actions={actions} _children={this._children} />
       )
     }
 
@@ -64,9 +68,9 @@ export const initStore: Function = (store, ...middlewares) => {
   }
 
   const connect = mapStateToProps => WrappedComponent => {
-    const ConnectComponent = (props) =>
-      <Consumer mapStateToProps={mapStateToProps}>
-        {injectedProps => <WrappedComponent {...props} {...injectedProps} />}
+    const ConnectComponent = props =>
+      <Consumer mapStateToProps={mapStateToProps} {...props}>
+        {injectedProps => <WrappedComponent {...injectedProps} />}
       </Consumer>
     ConnectComponent.displayName = `Connect(${WrappedComponent.displayName || WrappedComponent.name || 'Unknown'})`
     return ConnectComponent
@@ -104,5 +108,6 @@ export const initStore: Function = (store, ...middlewares) => {
     getState,
     connect,
     subscribe,
+    unsubscribe,
   }
 }