What about?
gcanti opened this issue · comments
import { connect } from 'react-redux'
type Dispatch<A> = (a: A) => void
function myconnect<S, A>(): <OP>() => <SP, DP>(
f: (state: S, ownProps: OP) => SP,
g: (dispatch: Dispatch<A>, ownProps: OP) => DP
) => (c: React.ComponentType<OP & SP & DP>) => React.ComponentClass<OP> {
return () => (f, g) => (connect as any)(f, g)
}
Setup
type State = {
count: number
}
type Action = { type: 'INCREMENT' } | { type: 'DECREMENT' }
const appConnect = myconnect<State, Action>()
Usage
import * as React from 'react'
class Foo extends React.Component<{ message: string; inc: () => void; dec: () => void; style: object }> {}
// ConnectedFoo: React.ComponentClass<{ style: object }>
const ConnectedFoo = appConnect<{ style: object }>()(
state => ({
message: `Clicks: ${state.count}`
}),
dispatch => ({
inc: () => dispatch({ type: 'INCREMENT' }),
dec: () => dispatch({ type: 'DECREMENT' })
})
)(Foo)
It looks equivalent but less verbose
are you planning to replace the typings for the definitely typed package?
and for me, i export the dispatch separately to test them (even though they are mostly logicless and should be mechanically correct by construction, just no telling with javascript)
are you planning to replace the typings for the definitely typed package?
Oh no, react-redux's APIs are a mess, I'm not going in that water. My policy with javascript libraries like that is wrapping with saner APIs (or override their typings).
lol, why didn't use flow which can actually INFER types unlike TypeScript (also have $Call
type to call functions in compile-time)