typed-wrap.js

// @flow

// Goal: define a top-level app state like the following. `sources`
// would be state managed by a redux reducer
type SourceState = { count: number };
type AppState = { sources: SourceState};

// Define a selector that takes a piece of the state, like sources
// (this is contrived)
function getNumSources(state: SourceState, x : number) {
  return state.count * x;
}

// Define a `wrap` function that takes a selector and returns a
// new selector with the same signature, but it takes the full
// AppState (not just a piece of it)
function wrap<S,A,R>(selector: (state: S, ...args: A[]) => R, field : $Keys<AppState>) {
  return function(state: AppState, ...args: A[]) : R {
    return selector(state[field], ...args);
  }
}

const wrapped = wrap(getNumSources, "sources");
wrapped({ sources: { count: 5 }}, 10);

In response @gcanti

@Gozala 1 nitpick and 2 possible issues.

Nitpick. This is a valid syntax for Flow

export const wrap = <outer:Object, inner, value, settings>
( selector: Selector<inner, value, settings>
, field: $Keys
): <state:outer, config:settings> (input:state, options:config) => value =>
(input, options) =>
selector(input[field], options)
but surprisingly not for babel, which throws. Easy fix: transform to function

There was a babel issue (can remember the number) that I've reported and has being solved not too long ago, so in latest versions of babel it works fine.

Issues. You are using neither SourceState nor AppState, thus you can do something like (and Flow doesn't complain):

function getNumSources(state, x) {
// return state.count * x;
return state * x; // <= error
}
and

// wrapped1({ sources: { count: 5 }}, 3);
wrapped1({ sources: {}}, 3); // <= error

Seems like another bug in flow, but can be avoid by annotating getNumSources

I'd like to propose a new implementation based on a more general (and type-checkable) slicer function instead of a field string:

Yeah I have suggested to use getter function to @jlongster as well on IRC, which avoids $Keys<object> hacks and is also more JIT friendly approach. To be honest going all the way and use something like lenses makes the most sense to me, but there were some Redux related issues preventing it, if I understood correctly.