Simplifying button that when clicked changes boolean value - elm

Question

I've created a button that holds a boolean value and when you click it, it changes this value and text inside the button. The code below works but I have a feeling I'm doing an overkill. How can I write this button as simple as possible but still following the ELM architecture?
module BtnPin where
import Html exposing ( Html )
import Html.Events as E
import StartApp.Simple as StartApp
-- MAIN
main =
StartApp.start { model = emptyModel, view = view, update = update }
-- MODEL
type alias Model =
{pinned : Bool}
init : Model
init = Model False
emptyModel : Model
emptyModel =
{ pinned = False
}
pin : Model -> Model
pin model =
if model.pinned then
Model False
else
Model True
viewPin : Signal.Address Action -> Model -> Html
viewPin address model =
if model.pinned == True then
Html.button
[ E.onClick address Pin ]
[ Html.text <| "Unpin" ]
else
Html.button
[ E.onClick address Pin ]
[ Html.text <| "Pin" ]
-- UPDATE
type Action = Pin
update : Action -> Model -> Model
update action model =
pin model
-- VIEW
view : Signal.Address Action -> Model -> Html
view address model =
Html.div []
[ viewPin address model ]

Answer 1

The more explicit you are, and the closer you stay to the Elm Architecture, the easier it is to read for someone who knows the pattern. It's also easy to extend. But of course you can simplify a component that you don't expect to change.
Just remember that with the code you have in your question, the only documentation you need is the one-sentence description, because the code is Elm Architecture, everything has type annotations and is super simple. When you condense your code, you may need more documentation.
A simplified button:
module BtnPin where
import Html exposing ( Html )
import Html.Events as E
import StartApp.Simple as StartApp
main =
StartApp.start { model = False, view = view, update = always not }
-- VIEW
view : Signal.Address () -> Bool -> Html
view address model =
Html.div [] [ viewPin address model ]
viewPin : Signal.Address () -> Bool -> Html
viewPin address model =
let
text = if model then "Unpin" else "Pin"
in
Html.button
[ E.onClick address () ]
[ Html.text text ]
This may be a bit extreme, so you can compromise by defining an update function, a Model type and an Action type. But then you're pretty close to where you started...