50 lines
1.3 KiB
TypeScript

import { ComponentType, PureComponent } from 'react'
import { connect, Omit, MapDispatchToPropsParam, Matching, GetProps, ResolveThunks } from 'react-redux'
import { Dispatch } from 'redux'
import { TStateSelector } from './TStateSelector'
/**
* This function can be used to pack React components into reusable modules.
*
* For example:
*
*
* function configure<State>(
* actions: Actions,
* getLocalState: (state: State) => LocalState,
* ) {
* return pack(
* getLocalState,
* function mapStateToProps(localState: LocalState) {
* return localState,
* },
* function mapDispatchToProps(dispatch: Dispatch) {
* return bindActionCreators(actions, dispatch)
* },
* Component
* )
* }
*/
export function pack<
LocalState,
State,
Props,
StateProps,
DispatchProps,
C extends React.ComponentType<
Matching<StateProps & ResolveThunks<DispatchProps>, GetProps<C>>>
>(
getLocalState: TStateSelector<State, LocalState>,
mapStateToProps: (state: LocalState) => StateProps,
mapDispatchToProps: MapDispatchToPropsParam<DispatchProps, Props>,
Component: C,
) {
return connect(
(state: State) => {
const l = getLocalState(state)
return mapStateToProps(l)
},
mapDispatchToProps,
)(Component)
}