In the last episode, we added the ability to mark Todos completed, and in the process we added identifiers. In the video, we even showed the application working to update their state. However, there was a bug!

If you add multiple Todos and mark them completed, you'll note that they act a bit unusually - specifically, after you add the third new Todo, things begin to go terribly. All of the new Todos begin to change state and take the identity of the last todo you've added.

This is not exactly an accident! Think of it as a learning opportunity, because fixing bugs is always interesting :)

If you look at the Add message, you'll find the error:

update : Msg -> Model -> Model
update msg model =
    case msg of
        Add ->
            {model
            | todos = model.todo :: model.todos
-- WOOPS!
            , todo = newTodo
            , nextIdentifier = model.nextIdentifier + 1
            }

So here's what's happening - our newTodo function returns a Todo with the identifier 0. We need to merge in the model's nextIdentifier as the identifier for that Todo.

To fix it, we can just update the function to update the identifier for the newTodo with the model's nextIdentifier:

update : Msg -> Model -> Model
update msg model =
    case msg of
        Add ->
            {model
            | todos = model.todo :: model.todos
            , todo = { newTodo | identifier = model.nextIdentifier }
            , nextIdentifier = model.nextIdentifier + 1
            }

That should fix everything up. Let me know if you found this yourself ahead of time or if this is the first time you noticed it. See you soon!

Resources