Search code examples
elmelm-ui

Append elm-ui button to 2nd child of column , type error


Trying to create a simple Point of Sale in elm similar to image below.

Click a Product (Input.button, which understand is of type Element msg?) then a record of said button is created in the Order List panel. This is also an Input.button and can be removed from the Order panel by clicking.

At the moment my model looks like this:

type alias Orders =
    { order : Element Msg } -- fully aware this is uppercase 'M', not matching what the column expects

type alias Model =
    { orderlist : List Orders }

adding my model to view .. column [] [ model.orderlist ] gives the following error:

This argument is a list of type: List (List Orders)

But column needs the 2nd argument to be: List (Element msg)

what am I missing here? Any comments or ideas most welcome. Also I'm fully open to going a different direction if it might help me achieve my the goal of creating this POS. TIA :)

enter image description here


Solution

  • As the error message says, it is expected that the 2nd argument would be a List of Element msg.

    But your model.orderList gives you a List of a Record {order: Element Msg}.

    In order to solve you will need to map on the list and extract your Element Msg, something like:

    ... column [] (model.orderList |> List.map (\{order} -> order))