<div class="space-y-4 flex flex-col justify-center items-center">
  <h1 class="title text-2xl title-primary-500">
    <%= @ammo_type.name %>
  </h1>

  <%= if @ammo_type.desc do %>
    <span class="max-w-2xl w-full px-8 py-4 rounded-lg
      text-center title text-lg
      border border-primary-600">
      <%= @ammo_type.desc %>
    </span>
  <% end %>

  <div class="flex space-x-4 justify-center items-center text-primary-600">
    <%= live_patch to: Routes.ammo_type_show_path(Endpoint, :edit, @ammo_type),
               class: "text-primary-600 link",
               data: [qa: "edit"] do %>
      <i class="fa-fw fa-lg fas fa-edit"></i>
    <% end %>

    <%= link to: "#",
         class: "text-primary-600 link",
         phx_click: "delete",
         data: [
           confirm:
             dgettext("prompts", "Are you sure you want to delete %{name}? This will delete all %{name} type ammo as well!", name: @ammo_type.name),
           qa: "delete"
         ] do %>
      <i class="fa-fw fa-lg fas fa-trash"></i>
    <% end %>
  </div>

  <hr class="hr" />

  <div class="grid sm:grid-cols-2 gap-4 text-center justify-center items-center">
    <%= for {field_name, field, type} <- [
          {gettext("Bullet type"), :bullet_type, :string},
          {gettext("Bullet core"), :bullet_core, :string},
          {gettext("Cartridge"), :cartridge, :string},
          {gettext("Caliber"), :caliber, :string},
          {gettext("Case material"), :case_material, :string},
          {gettext("Jacket type"), :jacket_type, :string},
          {gettext("Muzzle velocity"), :muzzle_velocity, :string},
          {gettext("Powder type"), :powder_type, :string},
          {gettext("Powder grains per charge"), :powder_grains_per_charge, :string},
          {gettext("Grains"), :grains, :string},
          {gettext("Pressure"), :pressure, :string},
          {gettext("Primer type"), :primer_type, :string},
          {gettext("Firing type"), :firing_type, :string},
          {gettext("Tracer"), :tracer, :boolean},
          {gettext("Incendiary"), :incendiary, :boolean},
          {gettext("Blank"), :blank, :boolean},
          {gettext("Corrosive"), :corrosive, :boolean},
          {gettext("Manufacturer"), :manufacturer, :string},
          {gettext("UPC"), :upc, :string}
        ] do %>
      <%= if @ammo_type |> Map.get(field) do %>
        <h3 class="title text-lg">
          <%= field_name %>:
        </h3>

        <span class="text-primary-600">
          <%= case type do %>
            <% :boolean -> %>
              <%= @ammo_type |> Map.get(field) |> humanize() %>
            <% _ -> %>
              <%= @ammo_type |> Map.get(field) %>
          <% end %>
        </span>
      <% end %>
    <% end %>

    <h3 class="title text-lg">
      <%= gettext("Current # of rounds:") %>
    </h3>

    <span class="text-primary-600">
      <%= @ammo_type |> Ammo.get_round_count_for_ammo_type(@current_user) %>
    </span>

    <h3 class="title text-lg">
      <%= gettext("Total rounds shot:") %>
    </h3>

    <span class="text-primary-600">
      <%= @ammo_type |> Ammo.get_used_count_for_ammo_type(@current_user) %>
    </span>

    <h3 class="title text-lg">
      <%= gettext("Added on:") %>
    </h3>

    <span class="text-primary-600">
      <%= @ammo_type.inserted_at |> display_datetime() %>
    </span>

    <%= if @avg_cost_per_round do %>
      <h3 class="title text-lg">
        <%= gettext("Average Price paid") %>:
      </h3>

      <span class="text-primary-600">
        <%= gettext("$%{amount}",
          amount: @avg_cost_per_round |> :erlang.float_to_binary(decimals: 2)
        ) %>
      </span>
    <% else %>
      <h3 class="mx-8 my-4 title text-lg text-primary-600 col-span-2">
        <%= gettext("No cost information") %>
      </h3>
    <% end %>
  </div>

  <hr class="hr" />

  <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>

  <div>
    <%= if @ammo_groups |> Enum.empty?() do %>
      <h2 class="mx-8 my-4 title text-lg text-primary-600">
        <%= gettext("No ammo for this type") %>
        <%= display_emoji("😔") %>
      </h2>
    <% else %>
      <div class="flex flex-wrap justify-center items-center">
        <%= for ammo_group <- @ammo_groups do %>
          <.ammo_group_card ammo_group={ammo_group} show_container={true} />
        <% end %>
      </div>
    <% end %>
  </div>
</div>

<%= if @live_action in [:edit] do %>
  <.modal return_to={Routes.ammo_type_show_path(Endpoint, :show, @ammo_type)}>
    <.live_component
      module={CanneryWeb.AmmoTypeLive.FormComponent}
      id={@ammo_type.id}
      title={@page_title}
      action={@live_action}
      ammo_type={@ammo_type}
      return_to={Routes.ammo_type_show_path(Endpoint, :show, @ammo_type)}
      current_user={@current_user}
    />
  </.modal>
<% end %>
