Pattern

    <.action phx-click="add" class="button ui-accent">Add row</.action>
<.action phx-click="reset" class="button ui-alert">Reset</.action>
<.data_list class="data-list" items={Corex.Content.new(@items)}>
  <:empty>
    <p>No items</p>
  </:empty>
</.data_list>

  

    @initial [
  %{value: "lorem", label: "Lorem ipsum dolor sit amet", content: "Consectetur adipiscing elit."},
  %{value: "duis", label: "Duis dictum gravida odio ac pharetra?", content: "Nullam eget vestibulum ligula."},
  %{value: "donec", label: "Donec condimentum ex mi", content: "Congue molestie ipsum gravida a."}
]

def mount(_params, _session, socket) do
  {:ok, socket |> assign(:items, @initial) |> assign(:next_id, 4)}
end

def handle_event("add", _params, socket) do
  id = "item-#{socket.assigns.next_id}"
  row = %{value: id, label: "Row #{socket.assigns.next_id}", content: "Added at #{DateTime.utc_now()}"}

  {:noreply,
   socket
   |> assign(:items, socket.assigns.items ++ [row])
   |> assign(:next_id, socket.assigns.next_id + 1)}
end

def handle_event("reset", _params, socket) do
  {:noreply, socket |> assign(:items, []) |> assign(:next_id, 1)}
end