<div class="flex flex-col space-y-8 justify-center items-center">
  <h1 class="title text-2xl title-primary-500">
    <%= gettext("Ammo") %>
  </h1>

  <%= if @ammo_groups |> Enum.empty?() do %>
    <h2 class="title text-xl text-primary-600">
      <%= gettext("No Ammo") %>
      <%= display_emoji("😔") %>
    </h2>
  <% end %>

  <%= cond do %>
    <% @containers_count == 0 -> %>
      <div class="flex justify-center items-center">
        <h2 class="m-2 title text-md text-primary-600">
          <%= dgettext("prompts", "You'll need to") %>
        </h2>

        <%= live_patch(dgettext("actions", "add a container first"),
          to: Routes.container_index_path(Endpoint, :new),
          class: "btn btn-primary"
        ) %>
      </div>
    <% @ammo_types_count == 0 -> %>
      <div class="flex justify-center items-center">
        <h2 class="m-2 title text-md text-primary-600">
          <%= dgettext("prompts", "You'll need to") %>
        </h2>

        <%= live_patch(dgettext("actions", "add an ammo type first"),
          to: Routes.ammo_type_index_path(Endpoint, :new),
          class: "btn btn-primary"
        ) %>
      </div>
    <% @ammo_groups |> Enum.empty?() -> %>
      <%= live_patch(dgettext("actions", "Add your first box!"),
        to: Routes.ammo_group_index_path(Endpoint, :new),
        class: "btn btn-primary"
      ) %>
    <% true -> %>
      <%= live_patch(dgettext("actions", "Add Ammo"),
        to: Routes.ammo_group_index_path(Endpoint, :new),
        class: "btn btn-primary"
      ) %>
  <% end %>

  <%= unless @ammo_groups |> Enum.empty?() do %>
    <div class="flex flex-col justify-center items-center">
      <.toggle_button action="toggle_show_used" value={@show_used}>
        <span class="title text-lg text-primary-600">
          <%= gettext("Show used") %>
        </span>
      </.toggle_button>
    </div>

    <.live_component
      module={CanneryWeb.Components.TableComponent}
      id="ammo_groups_index_table"
      action={@live_action}
      columns={@columns}
      rows={@rows}
    />
  <% end %>
</div>

<%= cond do %>
  <% @live_action in [:new, :edit] -> %>
    <.modal return_to={Routes.ammo_group_index_path(Endpoint, :index)}>
      <.live_component
        module={CanneryWeb.AmmoGroupLive.FormComponent}
        id={@ammo_group.id || :new}
        title={@page_title}
        action={@live_action}
        ammo_group={@ammo_group}
        return_to={Routes.ammo_group_index_path(Endpoint, :index)}
        current_user={@current_user}
      />
    </.modal>
  <% @live_action == :add_shot_group -> %>
    <.modal return_to={Routes.ammo_group_index_path(Endpoint, :index)}>
      <.live_component
        module={CanneryWeb.Components.AddShotGroupComponent}
        id={:new}
        title={@page_title}
        action={@live_action}
        ammo_group={@ammo_group}
        return_to={Routes.ammo_group_index_path(Endpoint, :index)}
        current_user={@current_user}
      />
    </.modal>
  <% @live_action == :move -> %>
    <.modal return_to={Routes.ammo_group_index_path(Endpoint, :index)}>
      <.live_component
        module={CanneryWeb.Components.MoveAmmoGroupComponent}
        id={@ammo_group.id}
        title={@page_title}
        action={@live_action}
        ammo_group={@ammo_group}
        return_to={Routes.ammo_group_index_path(Endpoint, :index)}
        current_user={@current_user}
      />
    </.modal>
  <% true -> %>
    <%= nil %>
<% end %>
