<.header>
  Listing Authors
  <:actions>
    <.link patch={~p"/authors/new"}>
      <.button>New Author</.button>
    </.link>
  </:actions>
</.header>

<.table id="authors" rows={@authors} row_click={&JS.navigate(~p"/authors/#{&1}")}>
  <:col :let={author} label="Name"><%= author.name %></:col>
  <:col :let={author} label="Description"><%= author.description %></:col>
  <:col :let={author} label="Homepage name"><%= author.homepage_name %></:col>
  <:col :let={author} label="Homepage url"><%= author.homepage_url %></:col>
  <:action :let={author}>
    <div class="sr-only">
      <.link navigate={~p"/authors/#{author}"}>Show</.link>
    </div>
    <.link patch={~p"/authors/#{author}/edit"}>Edit</.link>
  </:action>
  <:action :let={author}>
    <.link phx-click={JS.push("delete", value: %{id: author.id})} data-confirm="Are you sure?">
      Delete
    </.link>
  </:action>
  <:action :let={author}>
    <.link navigate={~p"/articles/new?author_id=#{author}"}>
      New article
    </.link>
  </:action>
</.table>

<.modal
  :if={@live_action in [:new, :edit]}
  id="author-modal"
  show
  on_cancel={JS.navigate(~p"/authors")}
>
  <.live_component
    module={OutlookWeb.AuthorLive.FormComponent}
    id={@author.id || :new}
    title={@page_title}
    action={@live_action}
    author={@author}
    navigate={~p"/authors"}
  />
</.modal>
