FetchWith.re

module type Res = {type t;};

module Make = (R: Res) => {
  include R;

  type state =
    | NotAsked
    | Loading
    | NetworkError
    | DecodingError
    | Data(t);

  type action =
    | Skip
    | Init
    | NetworkFail
    | DecodeingFail
    | Loaded(t);

  let component = ReasonReact.reducerComponent("FetchWith");

  let make = (~req, ~skip=false, ~render, _children) => {
    ...component,
    initialState: _state => NotAsked,
    reducer: (action, _state) =>
      switch (action) {
      | Skip => ReasonReact.Update(NotAsked)
      | Init =>
        ReasonReact.UpdateWithSideEffects(
          Loading,
          (
            self =>
              Js.Promise.(
                req()
                |> then_(response =>
                     Belt.Result.mapWithDefault(
                       response, self.send(DecodeingFail), data =>
                       self.send(Loaded(data))
                     )
                     |> resolve
                   )
                |> catch(_ => resolve(self.send(NetworkFail)))
                |> ignore
              )
          ),
        )
      | Loaded(data) => ReasonReact.Update(Data(data))
      | DecodeingFail => ReasonReact.Update(DecodingError)
      | NetworkFail => ReasonReact.Update(NetworkError)
      },
    didMount: self => skip ? self.send(Skip) : self.send(Init),
    render: ({state}) =>
      switch (state) {
      | NotAsked => ReasonReact.null
      | _ => render(state)
      },
  };
};