Elm: How to transform Html FooMsg to Html Msg

Question

I'm new to Elm. I have a site with two pages: Home and Signup.

Home has it's own view and Signup has it's own view, but they both return Html Msg. I'd like to change it so that Home returns Html HomeMsg and Signup returns Html SignupMsg.

Writing these view functions is easy of course, but I think my top-level view function needs to transform the result into Html Msg.

Here is the Msg type.

type Msg 
  = Home HomeMsg
  | Signup SignupMsg
  | OnLocationChange Location

I think I need some sort of map function to do this like

view : Model -> Html Msg 
view model =
    case model.route of
        Model.HomeRoute ->
            map Home (homeView model)

        Model.SignupRoute ->
            map Signup (signupView model)

        Model.NotFoundRoute ->
            notFoundView

Answer 1

Yes, there is a map function. It belongs to Html module.

http://package.elm-lang.org/packages/elm-lang/html/2.0.0/Html#map

Your code becomes:

view : Model -> Html Msg 
view model =
    case model.route of
        Model.HomeRoute ->
            Html.map Home (homeView model)

        Model.SignupRoute ->
            Html.map Signup (signupView model)

        Model.NotFoundRoute ->
            notFoundView