<.header>
  Author <%= @author.id %>
  <:subtitle>This is a author record from your database.</:subtitle>
  <:actions>
    <.link patch={~p"/authors/#{@author}/show/edit"} phx-click={JS.push_focus()}>
      <.button>Edit author</.button>
    </.link>
    <.link patch={~p"/articles/new?author_id=#{@author}"} phx-click={JS.push_focus()}>
      <.button>New article</.button>
    </.link>
  </:actions>
</.header>

<.list>
  <:item title="Name"><%= @author.name %></:item>
  <:item title="Description"><%= @author.description %></:item>
  <:item title="Homepage name"><%= @author.homepage_name %></:item>
  <:item title="Homepage url"><%= @author.homepage_url %></:item>
</.list>

<.table id="articles" rows={@author.articles} row_click={&JS.navigate(~p"/articles/#{&1}")}>
  <:col :let={article} label="Title"><%= article.title %></:col>
  <%!-- <:col :let={article} label="Content"><%= article.content %></:col> --%>
  <:col :let={article} label="Url"><%= article.url %></:col>
  <:col :let={article} label="Language"><%= article.language %></:col>
  <:col :let={article} label="Date"><%= article.date %></:col>
  <:action :let={article}>
    <div class="sr-only">
      <.link navigate={~p"/articles/#{article}"}>Show</.link>
    </div>
    <.link patch={~p"/articles/#{article}/edit"}>Edit</.link>
  </:action>
  <:action :let={article}>
    <.link phx-click={JS.push("delete", value: %{id: article.id})} data-confirm="Are you sure?">
      Delete
    </.link>
  </:action>
</.table>


<.back navigate={~p"/authors"}>Back to authors</.back>

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