<.header>
  Listing Translations
</.header>

<.table id="translations" rows={@translations} row_click={&JS.navigate(~p(/translations/#{(&1).id}))}>
  <:col :let={translation} label="Language"><%= translation.language %></:col>
  <:col :let={translation} label="Title"><%= translation.title %></:col>
  <:col :let={translation} label="Teaser"><%= translation.teaser |> tidy_raw %></:col>
  <%!-- <:col :let={translation} label="Content"><%= translation.content %></:col> --%>
  <:col :let={translation} label="Date"><%= translation.date %></:col>
  <:col :let={translation} label="Public"><%= translation.public %></:col>
  <:col :let={translation} label="Unauthorized"><%= translation.unauthorized %></:col>
  <:action :let={translation}>
    <div class="sr-only">
      <.link navigate={~p"/translations/#{translation.id}"}>Show</.link>
    </div>
    <.link navigate={~p"/translations/#{translation.id}/edit"}>Edit</.link>
  </:action>
  <:action :let={translation}>
    <.link phx-click={JS.push("delete", value: %{id: translation.id})} data-confirm="Are you sure?">
      Delete
    </.link>
  </:action>
</.table>
