Need these definitons
- https://github.com/acdlite/recompose/blob/master/types/flow-typed/recompose_v0.24.x/flow_v0.55.x-/recompose_v0.24.x.js
- https://github.com/flowtype/flow-typed/blob/master/definitions/npm/redux_v3.x.x/flow_v0.55.x-/redux_v3.x.x.js
/* @flow */ import React from 'react' import { bindActionCreators, combineReducers } from 'redux' import { compose, lifecycle, pure, type HOC } from 'recompose' import { connect } from 'react-redux' // reducer const INC = 'inc' const inc = () => ({ type: INC }) type Counter = { value: number } type Action = $Call<typeof inc> const counter = (state: Counter = { value: 0 }, action: Action): Counter => { switch (action.type) { case INC: { return { value: state.value + 1 } } default: { return state } } } const rootReducer = combineReducers({ counter }) // Get RootState from result of rootReducer type RootState = $Call<typeof rootReducer> // compose HOCs type OuterProps = { foo: string } type Props = { foo: string, bar: number, actions: { inc: Function } } const connector = connect( (state: RootState, props) => { return { foo: props.foo, bar: state.counter.value } }, dispatch => bindActionCreators({ inc }, dispatch) ) const enhancer: HOC<Props, OuterProps> = compose( connector, pure, lifecycle({ componentDidMount() { console.log('mounted') } }) ) // props is resolved by hoc const MyComponent = enhancer(props => { return ( <div> {props.foo} {props.bar} {props.actions.inc} </div> ) })
Check them on flowtype
You can check and complete codes on part of mapStateToProps and MyComponent's props.
Top comments (0)