<.header> Contacts <:actions> <.link patch={~p"/contacts/new"}> <.button>New Contact <.table id="contacts" rows={@streams.contacts} row_click={fn {_id, contact} -> JS.navigate(~p"/contacts/#{contact}") end} phx-viewport-top={@page > 1 && "prev-page"} phx-viewport-bottom={!@end_of_timeline? && "next-page"} phx-page-loading > <:col :let={{_id, contact}} label="Name"><%= contact.name %> <:col :let={{_id, contact}} label="Email"><%= contact.email %> <:col :let={{_id, contact}} label="Subscribed"><%= contact.subscribed %> <:action :let={{id, contact}}> <.link phx-click={JS.push("delete", value: %{id: contact.id}) |> hide("##{id}")} data-confirm="Are you sure?" > Delete

No more contacts!

<.modal :if={@live_action in [:new]} id="contact-modal" show on_cancel={JS.patch(~p"/contacts")}> <.live_component module={SendItWeb.ContactLive.FormComponent} id={:new} title={@page_title} action={@live_action} contact={@contact} patch={~p"/contacts"} />