hyegar

Type error and types in ReasonML

December 30, 2017

Let’s play with the type system of ReasonML and ReasonReact.

Starting with the problem

The problem I encountered is that I wanted to parametrize over my state.

a first attempt, let’s wrap in a module to keep things organized.

module Example = {
  type action =
    | Pull_data;
  type github_payload('with_rest_payload) = list(({.. "stars": int} as 'with_rest_payload));
  let s = ReasonReact.stringToElement;
  let stars_component = ReasonReact.reducerComponent("Stars");
  let style = ReactDOMRe.Style.make(~display="flex", ());
  let make = (children) => {
    ...stars_component,
    initialState: fun () => ([]: github_payload('a)),
    reducer: (action, _) =>
      switch action {
      | Pull_data => ReasonReact.Update(((s) => [{"stars": 100}]))
      },
    render: (self) => <div style onClick=(self.reduce((_) => Pull_data))> (s("Hi")) </div>
  };
};

While merlin doesn’t complain about type errors, the compiler errors out with:

The type of this module contains type variables that cannot be generalized:
 {
    type action = Pull_data;
    type github_payload('a) = list('a)
      constraint 'a = Js.t(({.. stars : int } as 'b));
    let s: (string) => ReasonReact.reactElement;
    let stars_component:
      ReasonReact.componentSpec
      (('_a) => list(Js.t({. stars : int })),  ReasonReact.stateless,
        ReasonReact.noRetainedProps,  ReasonReact.noRetainedProps,  action);
    let style: ReactDOMRe.style;
    let make:
      ('a) =>
      ReasonReact.componentSpec
      (('_b) => list(Js.t({. stars : int })),
        github_payload(Js.t({.. stars : int })),
        ReasonReact.noRetainedProps,  ReasonReact.noRetainedProps,  action);
  }

So what does this even mean? It means that we aren’t able to satisfy the signature that ReasonReact wants, that is, we have introduced a type variable the componentSpec does not account for.


Edgar Aroutiounian

My name is Edgar Aroutiounian, I'm an Armenian-American programmer in Silicon Valley. I love functional programming, OCaml old timer. Currently I work at expo.io working to make your mobile development experience with ReactNative that much better. Catch me on twitter, or on github