React Navigations binding

interop
#1

Hello, I try to create bindings for react-navigation. I’m after few iterations on doing bindings with partial success. I’ll shortly describe what is need to push that binding to push forward, so:

this is a basic structure of binding config:

let nav = createStackNavigator({
  Home: { screen: (navigation) => <Home navigation={navigation} /> },
  Detail: { screen: (navigation) => <Home navigation={navigation} /> },
});

The navigation argument contains navigation actions like:

  • type push = (routeName: string, params: any) => unit - where routeName is comes from the config map and argument is additional data that could be passed to the next screen.
  • type goBack = unit => unit - to navigate back
  • params - here we can find the params from push method, it could be an empty or any other data.

What is worse, Screen could be a simple function that returns React component, but it could even be a Navigator, see below:

let defailsNavigator = createStackNavigator({
  Profile: { screen: (navigation) => <Home navigation={navigation} /> },
  Info: { screen: (navigation) => <Home navigation={navigation} /> },
});

let nav = createStackNavigator({
  Home: { screen: (navigation) => <Home navigation={navigation} /> },
  Detail: { screen: defailsNavigator },
});

As you can see here we have not a screen but we have another Navigator.

In the ReasonML world, it would be perfect to have navigation like this one:

type param = { id: int, name: string };
type route = Home | Detail(param);

/* navigating :*/
navigation.push(Detail({id: 1, name: "working!"});

/* screen component */
let make = (navigation, _children) => {
...component,
render: _self => {
  ReasonReact.string(navigation.params.id)
}

It’s a short description of how it’s work but it’s extremely hard to type properly. If you want to help or have any idea how we can type it just let me know. All help will be appreciated :pray: