Split the Business Logic of Elm view Functions By Modeling the State

Flavio Corpa
InstructorFlavio Corpa

Share this video with your friends

Send Tweet

Up until this point, the 4 cards displayed in our dashboard each repeat the same information, so in this lesson, we will be splitting the state into different parts, showing an algebraic mindset and thinking how best represent the state of our app with our custom types.

We'll start by modeling the selected options in state as a List of a Menu and String. The next step is to actually update the internal state of our menus. We will update OptionPicked to receive a string and when it does receive an option, it will filter for just the selected option and append that to state. Finally we will display the options in the viewCard component that will filter for the menu that is being selected and in the case of an option selected display that option as a string.