rename ammo group files to pack

lib/cannery_web/live/pack_live/form_component.ex

@@ -0,0 +1,197 @@
+defmodule CanneryWeb.PackLive.FormComponent do
+  @moduledoc """
+  Livecomponent that can update or create an Cannery.Ammo.Pack
+  """
+
+  use CanneryWeb, :live_component
+  alias Cannery.Ammo.{Pack, AmmoType}
+  alias Cannery.{Accounts.User, Ammo, Containers, Containers.Container}
+  alias Ecto.Changeset
+  alias Phoenix.LiveView.Socket
+
+  @pack_create_limit 10_000
+
+  @impl true
+  @spec update(
+          %{:pack => Pack.t(), :current_user => User.t(), optional(any) => any},
+          Socket.t()
+        ) :: {:ok, Socket.t()}
+  def update(%{pack: _pack} = assigns, socket) do
+    socket |> assign(assigns) |> update()
+  end
+
+  @spec update(Socket.t()) :: {:ok, Socket.t()}
+  def update(%{assigns: %{current_user: current_user}} = socket) do
+    %{assigns: %{ammo_types: ammo_types, containers: containers}} =
+      socket =
+      socket
+      |> assign(:pack_create_limit, @pack_create_limit)
+      |> assign(:ammo_types, Ammo.list_ammo_types(current_user, :all))
+      |> assign_new(:containers, fn -> Containers.list_containers(current_user) end)
+
+    params =
+      if ammo_types |> List.first() |> is_nil(),
+        do: %{},
+        else: %{} |> Map.put("ammo_type_id", ammo_types |> List.first() |> Map.get(:id))
+
+    params =
+      if containers |> List.first() |> is_nil(),
+        do: params,
+        else: params |> Map.put("container_id", containers |> List.first() |> Map.get(:id))
+
+    {:ok, socket |> assign_changeset(params)}
+  end
+
+  @impl true
+  def handle_event("validate", %{"pack" => pack_params}, socket) do
+    {:noreply, socket |> assign_changeset(pack_params, :validate)}
+  end
+
+  def handle_event(
+        "save",
+        %{"pack" => pack_params},
+        %{assigns: %{action: action}} = socket
+      ) do
+    save_pack(socket, action, pack_params)
+  end
+
+  # HTML Helpers
+
+  @spec container_options([Container.t()]) :: [{String.t(), Container.id()}]
+  defp container_options(containers) do
+    containers |> Enum.map(fn %{id: id, name: name} -> {name, id} end)
+  end
+
+  @spec ammo_type_options([AmmoType.t()]) :: [{String.t(), AmmoType.id()}]
+  defp ammo_type_options(ammo_types) do
+    ammo_types |> Enum.map(fn %{id: id, name: name} -> {name, id} end)
+  end
+
+  # Save Helpers
+
+  defp assign_changeset(
+         %{assigns: %{action: action, pack: pack, current_user: user}} = socket,
+         pack_params,
+         changeset_action \\ nil
+       ) do
+    default_action =
+      case action do
+        create when create in [:new, :clone] -> :insert
+        :edit -> :update
+      end
+
+    changeset =
+      case default_action do
+        :insert ->
+          ammo_type = maybe_get_ammo_type(pack_params, user)
+          container = maybe_get_container(pack_params, user)
+          pack |> Pack.create_changeset(ammo_type, container, user, pack_params)
+
+        :update ->
+          pack |> Pack.update_changeset(pack_params, user)
+      end
+
+    changeset =
+      case changeset |> Changeset.apply_action(changeset_action || default_action) do
+        {:ok, _data} -> changeset
+        {:error, changeset} -> changeset
+      end
+
+    socket |> assign(:changeset, changeset)
+  end
+
+  defp maybe_get_container(%{"container_id" => container_id}, user)
+       when is_binary(container_id) do
+    container_id |> Containers.get_container!(user)
+  end
+
+  defp maybe_get_container(_params_not_found, _user), do: nil
+
+  defp maybe_get_ammo_type(%{"ammo_type_id" => ammo_type_id}, user)
+       when is_binary(ammo_type_id) do
+    ammo_type_id |> Ammo.get_ammo_type!(user)
+  end
+
+  defp maybe_get_ammo_type(_params_not_found, _user), do: nil
+
+  defp save_pack(
+         %{assigns: %{pack: pack, current_user: current_user, return_to: return_to}} = socket,
+         :edit,
+         pack_params
+       ) do
+    socket =
+      case Ammo.update_pack(pack, pack_params, current_user) do
+        {:ok, _pack} ->
+          prompt = dgettext("prompts", "Ammo updated successfully")
+          socket |> put_flash(:info, prompt) |> push_navigate(to: return_to)
+
+        {:error, %Changeset{} = changeset} ->
+          socket |> assign(:changeset, changeset)
+      end
+
+    {:noreply, socket}
+  end
+
+  defp save_pack(
+         %{assigns: %{changeset: changeset}} = socket,
+         action,
+         %{"multiplier" => multiplier_str} = pack_params
+       )
+       when action in [:new, :clone] do
+    socket =
+      case multiplier_str |> Integer.parse() do
+        {multiplier, _remainder}
+        when multiplier >= 1 and multiplier <= @pack_create_limit ->
+          socket |> create_multiple(pack_params, multiplier)
+
+        {multiplier, _remainder} ->
+          error_msg =
+            dgettext(
+              "errors",
+              "Invalid number of copies, must be between 1 and %{max}. Was %{multiplier}",
+              max: @pack_create_limit,
+              multiplier: multiplier
+            )
+
+          save_multiplier_error(socket, changeset, error_msg)
+
+        :error ->
+          error_msg = dgettext("errors", "Could not parse number of copies")
+          save_multiplier_error(socket, changeset, error_msg)
+      end
+
+    {:noreply, socket}
+  end
+
+  @spec save_multiplier_error(Socket.t(), Changeset.t(), String.t()) :: Socket.t()
+  defp save_multiplier_error(socket, changeset, error_msg) do
+    {:error, changeset} =
+      changeset
+      |> Changeset.add_error(:multiplier, error_msg)
+      |> Changeset.apply_action(:insert)
+
+    socket |> assign(:changeset, changeset)
+  end
+
+  defp create_multiple(
+         %{assigns: %{current_user: current_user, return_to: return_to}} = socket,
+         pack_params,
+         multiplier
+       ) do
+    case Ammo.create_packs(pack_params, multiplier, current_user) do
+      {:ok, {count, _packs}} ->
+        prompt =
+          dngettext(
+            "prompts",
+            "Ammo added successfully",
+            "Ammo added successfully",
+            count
+          )
+
+        socket |> put_flash(:info, prompt) |> push_navigate(to: return_to)
+
+      {:error, %Changeset{} = changeset} ->
+        socket |> assign(changeset: changeset)
+    end
+  end
+end

lib/cannery_web/live/pack_live/form_component.html.heex

@@ -0,0 +1,90 @@
+<div>
+  <h2 class="mb-8 text-center title text-xl text-primary-600">
+    <%= @title %>
+  </h2>
+
+  <.form
+    :let={f}
+    for={@changeset}
+    id="pack-form"
+    phx-target={@myself}
+    phx-change="validate"
+    phx-submit="save"
+    class="flex flex-col space-y-4 sm:space-y-0 sm:grid sm:grid-cols-3 sm:gap-4 justify-center items-center"
+  >
+    <div
+      :if={@changeset.action && not @changeset.valid?()}
+      class="invalid-feedback col-span-3 text-center"
+    >
+      <%= changeset_errors(@changeset) %>
+    </div>
+
+    <%= label(f, :ammo_type_id, gettext("Ammo type"), class: "title text-lg text-primary-600") %>
+    <%= select(f, :ammo_type_id, ammo_type_options(@ammo_types),
+      class: "text-center col-span-2 input input-primary"
+    ) %>
+    <%= error_tag(f, :ammo_type_id, "col-span-3 text-center") %>
+
+    <%= label(f, :count, gettext("Count"), class: "title text-lg text-primary-600") %>
+    <%= number_input(f, :count,
+      class: "text-center col-span-2 input input-primary",
+      min: 0
+    ) %>
+    <%= error_tag(f, :count, "col-span-3 text-center") %>
+
+    <%= label(f, :price_paid, gettext("Price paid"), class: "title text-lg text-primary-600") %>
+    <%= number_input(f, :price_paid,
+      step: 0.01,
+      class: "text-center col-span-2 input input-primary"
+    ) %>
+    <%= error_tag(f, :price_paid, "col-span-3 text-center") %>
+
+    <%= label(f, :purchased_on, gettext("Purchased on"), class: "title text-lg text-primary-600") %>
+    <%= date_input(f, :purchased_on,
+      class: "input input-primary col-span-2",
+      phx_update: "ignore",
+      value: @changeset |> Changeset.get_field(:purchased_on) || Date.utc_today()
+    ) %>
+    <%= error_tag(f, :purchased_on, "col-span-3 text-center") %>
+
+    <%= label(f, :notes, gettext("Notes"), class: "title text-lg text-primary-600") %>
+    <%= textarea(f, :notes,
+      id: "ammo-group-form-notes",
+      class: "text-center col-span-2 input input-primary",
+      phx_hook: "MaintainAttrs",
+      phx_update: "ignore"
+    ) %>
+    <%= error_tag(f, :notes, "col-span-3 text-center") %>
+
+    <%= label(f, :container, gettext("Container"), class: "title text-lg text-primary-600") %>
+    <%= select(f, :container_id, container_options(@containers),
+      class: "text-center col-span-2 input input-primary"
+    ) %>
+    <%= error_tag(f, :container_id, "col-span-3 text-center") %>
+
+    <%= case @action do %>
+      <% action when action in [:new, :clone] -> %>
+        <hr class="hr col-span-3" />
+
+        <%= label(f, :multiplier, gettext("Copies"), class: "title text-lg text-primary-600") %>
+        <%= number_input(f, :multiplier,
+          max: @pack_create_limit,
+          class: "text-center input input-primary",
+          value: 1,
+          phx_update: "ignore"
+        ) %>
+
+        <%= submit(dgettext("actions", "Create"),
+          phx_disable_with: dgettext("prompts", "Creating..."),
+          class: "mx-auto btn btn-primary"
+        ) %>
+
+        <%= error_tag(f, :multiplier, "col-span-3 text-center") %>
+      <% :edit -> %>
+        <%= submit(dgettext("actions", "Save"),
+          phx_disable_with: dgettext("prompts", "Saving..."),
+          class: "mx-auto col-span-3 btn btn-primary"
+        ) %>
+    <% end %>
+  </.form>
+</div>

lib/cannery_web/live/pack_live/index.ex

@@ -0,0 +1,166 @@
+defmodule CanneryWeb.PackLive.Index do
+  @moduledoc """
+  Liveview to show a Cannery.Ammo.Pack index
+  """
+
+  use CanneryWeb, :live_view
+  alias Cannery.{Ammo, Ammo.Pack, Containers}
+
+  @impl true
+  def mount(%{"search" => search}, _session, socket) do
+    socket =
+      socket
+      |> assign(class: :all, show_used: false, search: search)
+      |> display_packs()
+
+    {:ok, socket}
+  end
+
+  def mount(_params, _session, socket) do
+    {:ok, socket |> assign(class: :all, show_used: false, search: nil) |> display_packs()}
+  end
+
+  @impl true
+  def handle_params(params, _url, %{assigns: %{live_action: live_action}} = socket) do
+    {:noreply, apply_action(socket, live_action, params) |> display_packs()}
+  end
+
+  defp apply_action(
+         %{assigns: %{current_user: current_user}} = socket,
+         :add_shot_group,
+         %{"id" => id}
+       ) do
+    socket
+    |> assign(
+      page_title: gettext("Record shots"),
+      pack: Ammo.get_pack!(id, current_user)
+    )
+  end
+
+  defp apply_action(%{assigns: %{current_user: current_user}} = socket, :move, %{"id" => id}) do
+    socket
+    |> assign(
+      page_title: gettext("Move ammo"),
+      pack: Ammo.get_pack!(id, current_user)
+    )
+  end
+
+  defp apply_action(%{assigns: %{current_user: current_user}} = socket, :edit, %{"id" => id}) do
+    socket
+    |> assign(
+      page_title: gettext("Edit ammo"),
+      pack: Ammo.get_pack!(id, current_user)
+    )
+  end
+
+  defp apply_action(%{assigns: %{current_user: current_user}} = socket, :clone, %{"id" => id}) do
+    socket
+    |> assign(
+      page_title: dgettext("actions", "Add Ammo"),
+      pack: %{Ammo.get_pack!(id, current_user) | id: nil}
+    )
+  end
+
+  defp apply_action(socket, :new, _params) do
+    socket
+    |> assign(
+      page_title: dgettext("actions", "Add Ammo"),
+      pack: %Pack{}
+    )
+  end
+
+  defp apply_action(socket, :index, _params) do
+    socket
+    |> assign(
+      page_title: gettext("Ammo"),
+      search: nil,
+      pack: nil
+    )
+  end
+
+  defp apply_action(socket, :search, %{"search" => search}) do
+    socket
+    |> assign(
+      page_title: gettext("Ammo"),
+      search: search,
+      pack: nil
+    )
+  end
+
+  @impl true
+  def handle_event("delete", %{"id" => id}, %{assigns: %{current_user: current_user}} = socket) do
+    Ammo.get_pack!(id, current_user) |> Ammo.delete_pack!(current_user)
+
+    prompt = dgettext("prompts", "Ammo deleted succesfully")
+
+    {:noreply, socket |> put_flash(:info, prompt) |> display_packs()}
+  end
+
+  def handle_event(
+        "toggle_staged",
+        %{"pack_id" => id},
+        %{assigns: %{current_user: current_user}} = socket
+      ) do
+    pack = Ammo.get_pack!(id, current_user)
+
+    {:ok, _pack} = pack |> Ammo.update_pack(%{"staged" => !pack.staged}, current_user)
+
+    {:noreply, socket |> display_packs()}
+  end
+
+  def handle_event("toggle_show_used", _params, %{assigns: %{show_used: show_used}} = socket) do
+    {:noreply, socket |> assign(:show_used, !show_used) |> display_packs()}
+  end
+
+  def handle_event("search", %{"search" => %{"search_term" => ""}}, socket) do
+    {:noreply, socket |> push_patch(to: Routes.pack_index_path(Endpoint, :index))}
+  end
+
+  def handle_event("search", %{"search" => %{"search_term" => search_term}}, socket) do
+    socket = socket |> push_patch(to: Routes.pack_index_path(Endpoint, :search, search_term))
+
+    {:noreply, socket}
+  end
+
+  def handle_event("change_class", %{"ammo_type" => %{"class" => "rifle"}}, socket) do
+    {:noreply, socket |> assign(:class, :rifle) |> display_packs()}
+  end
+
+  def handle_event("change_class", %{"ammo_type" => %{"class" => "shotgun"}}, socket) do
+    {:noreply, socket |> assign(:class, :shotgun) |> display_packs()}
+  end
+
+  def handle_event("change_class", %{"ammo_type" => %{"class" => "pistol"}}, socket) do
+    {:noreply, socket |> assign(:class, :pistol) |> display_packs()}
+  end
+
+  def handle_event("change_class", %{"ammo_type" => %{"class" => _all}}, socket) do
+    {:noreply, socket |> assign(:class, :all) |> display_packs()}
+  end
+
+  defp display_packs(
+         %{
+           assigns: %{
+             class: class,
+             search: search,
+             current_user: current_user,
+             show_used: show_used
+           }
+         } = socket
+       ) do
+    # get total number of ammo groups to determine whether to display onboarding
+    # prompts
+    packs_count = Ammo.get_packs_count!(current_user, true)
+    packs = Ammo.list_packs(search, class, current_user, show_used)
+    ammo_types_count = Ammo.get_ammo_types_count!(current_user)
+    containers_count = Containers.get_containers_count!(current_user)
+
+    socket
+    |> assign(
+      packs: packs,
+      ammo_types_count: ammo_types_count,
+      containers_count: containers_count,
+      packs_count: packs_count
+    )
+  end
+end

lib/cannery_web/live/pack_live/index.html.heex

@@ -0,0 +1,245 @@
+<div class="flex flex-col space-y-8 justify-center items-center">
+  <h1 class="title text-2xl title-primary-500">
+    <%= gettext("Ammo") %>
+  </h1>
+
+  <%= 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>
+
+        <.link navigate={Routes.container_index_path(Endpoint, :new)} class="btn btn-primary">
+          <%= dgettext("actions", "add a container first") %>
+        </.link>
+      </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>
+
+        <.link navigate={Routes.ammo_type_index_path(Endpoint, :new)} class="btn btn-primary">
+          <%= dgettext("actions", "add an ammo type first") %>
+        </.link>
+      </div>
+    <% @packs_count == 0 -> %>
+      <h2 class="title text-xl text-primary-600">
+        <%= gettext("No ammo") %>
+        <%= display_emoji("😔") %>
+      </h2>
+
+      <.link patch={Routes.pack_index_path(Endpoint, :new)} class="btn btn-primary">
+        <%= dgettext("actions", "Add your first box!") %>
+      </.link>
+    <% true -> %>
+      <.link patch={Routes.pack_index_path(Endpoint, :new)} class="btn btn-primary">
+        <%= dgettext("actions", "Add Ammo") %>
+      </.link>
+
+      <div class="w-full flex flex-col sm:flex-row justify-center items-center space-y-4 sm:space-y-0 sm:space-x-4 max-w-2xl">
+        <.form
+          :let={f}
+          for={%{}}
+          as={:ammo_type}
+          phx-change="change_class"
+          phx-submit="change_class"
+          class="flex items-center"
+        >
+          <%= label(f, :class, gettext("Class"),
+            class: "title text-primary-600 text-lg text-center"
+          ) %>
+
+          <%= select(
+            f,
+            :class,
+            [
+              {gettext("All"), :all},
+              {gettext("Rifle"), :rifle},
+              {gettext("Shotgun"), :shotgun},
+              {gettext("Pistol"), :pistol}
+            ],
+            class: "mx-2 my-1 min-w-md input input-primary",
+            value: @class
+          ) %>
+        </.form>
+
+        <.form
+          :let={f}
+          for={%{}}
+          as={:search}
+          phx-change="search"
+          phx-submit="search"
+          class="grow flex items-center"
+        >
+          <%= text_input(f, :search_term,
+            class: "grow input input-primary",
+            value: @search,
+            role: "search",
+            phx_debounce: 300,
+            placeholder: gettext("Search ammo")
+          ) %>
+        </.form>
+
+        <.toggle_button action="toggle_show_used" value={@show_used}>
+          <span class="title text-lg text-primary-600">
+            <%= gettext("Show used") %>
+          </span>
+        </.toggle_button>
+      </div>
+
+      <%= if @packs |> Enum.empty?() do %>
+        <h2 class="title text-xl text-primary-600">
+          <%= gettext("No Ammo") %>
+          <%= display_emoji("😔") %>
+        </h2>
+      <% else %>
+        <.live_component
+          module={CanneryWeb.Components.PackTableComponent}
+          id="ammo-group-index-table"
+          packs={@packs}
+          current_user={@current_user}
+          show_used={@show_used}
+        >
+          <:ammo_type :let={%{name: ammo_type_name} = ammo_type}>
+            <.link navigate={Routes.ammo_type_show_path(Endpoint, :show, ammo_type)} class="link">
+              <%= ammo_type_name %>
+            </.link>
+          </:ammo_type>
+          <:range :let={pack}>
+            <div class="min-w-20 py-2 px-4 h-full flex flew-wrap justify-center items-center">
+              <button
+                type="button"
+                class="mx-2 my-1 text-sm btn btn-primary"
+                phx-click="toggle_staged"
+                phx-value-pack_id={pack.id}
+              >
+                <%= if pack.staged,
+                  do: dgettext("actions", "Unstage"),
+                  else: dgettext("actions", "Stage") %>
+              </button>
+
+              <.link
+                patch={Routes.pack_index_path(Endpoint, :add_shot_group, pack)}
+                class="mx-2 my-1 text-sm btn btn-primary"
+              >
+                <%= dgettext("actions", "Record shots") %>
+              </.link>
+            </div>
+          </:range>
+          <:container :let={{pack, %{name: container_name} = container}}>
+            <div class="min-w-20 py-2 px-4 h-full flex flew-wrap justify-center items-center">
+              <.link
+                navigate={Routes.container_show_path(Endpoint, :show, container)}
+                class="mx-2 my-1 link"
+              >
+                <%= container_name %>
+              </.link>
+
+              <.link
+                patch={Routes.pack_index_path(Endpoint, :move, pack)}
+                class="mx-2 my-1 text-sm btn btn-primary"
+              >
+                <%= dgettext("actions", "Move ammo") %>
+              </.link>
+            </div>
+          </:container>
+          <:actions :let={%{count: pack_count} = pack}>
+            <div class="py-2 px-4 h-full space-x-4 flex justify-center items-center">
+              <.link
+                navigate={Routes.pack_show_path(Endpoint, :show, pack)}
+                class="text-primary-600 link"
+                aria-label={
+                  dgettext("actions", "View ammo group of %{pack_count} bullets",
+                    pack_count: pack_count
+                  )
+                }
+              >
+                <i class="fa-fw fa-lg fas fa-eye"></i>
+              </.link>
+
+              <.link
+                patch={Routes.pack_index_path(Endpoint, :edit, pack)}
+                class="text-primary-600 link"
+                aria-label={
+                  dgettext("actions", "Edit ammo group of %{pack_count} bullets",
+                    pack_count: pack_count
+                  )
+                }
+              >
+                <i class="fa-fw fa-lg fas fa-edit"></i>
+              </.link>
+
+              <.link
+                patch={Routes.pack_index_path(Endpoint, :clone, pack)}
+                class="text-primary-600 link"
+                aria-label={
+                  dgettext("actions", "Clone ammo group of %{pack_count} bullets",
+                    pack_count: pack_count
+                  )
+                }
+              >
+                <i class="fa-fw fa-lg fas fa-copy"></i>
+              </.link>
+
+              <.link
+                href="#"
+                class="text-primary-600 link"
+                phx-click="delete"
+                phx-value-id={pack.id}
+                data-confirm={dgettext("prompts", "Are you sure you want to delete this ammo?")}
+                aria-label={
+                  dgettext("actions", "Delete ammo group of %{pack_count} bullets",
+                    pack_count: pack_count
+                  )
+                }
+              >
+                <i class="fa-fw fa-lg fas fa-trash"></i>
+              </.link>
+            </div>
+          </:actions>
+        </.live_component>
+      <% end %>
+  <% end %>
+</div>
+
+<%= case @live_action do %>
+  <% create when create in [:new, :edit, :clone] -> %>
+    <.modal return_to={Routes.pack_index_path(Endpoint, :index)}>
+      <.live_component
+        module={CanneryWeb.PackLive.FormComponent}
+        id={@pack.id || :new}
+        title={@page_title}
+        action={@live_action}
+        pack={@pack}
+        return_to={Routes.pack_index_path(Endpoint, :index)}
+        current_user={@current_user}
+      />
+    </.modal>
+  <% :add_shot_group -> %>
+    <.modal return_to={Routes.pack_index_path(Endpoint, :index)}>
+      <.live_component
+        module={CanneryWeb.Components.AddShotGroupComponent}
+        id={:new}
+        title={@page_title}
+        action={@live_action}
+        pack={@pack}
+        return_to={Routes.pack_index_path(Endpoint, :index)}
+        current_user={@current_user}
+      />
+    </.modal>
+  <% :move -> %>
+    <.modal return_to={Routes.pack_index_path(Endpoint, :index)}>
+      <.live_component
+        module={CanneryWeb.Components.MovePackComponent}
+        id={@pack.id}
+        title={@page_title}
+        action={@live_action}
+        pack={@pack}
+        return_to={Routes.pack_index_path(Endpoint, :index)}
+        current_user={@current_user}
+      />
+    </.modal>
+  <% _ -> %>
+<% end %>

lib/cannery_web/live/pack_live/show.ex

@@ -0,0 +1,177 @@
+defmodule CanneryWeb.PackLive.Show do
+  @moduledoc """
+  Liveview for showing and editing an Cannery.Ammo.Pack
+  """
+
+  use CanneryWeb, :live_view
+  alias Cannery.{ActivityLog, ActivityLog.ShotGroup}
+  alias Cannery.{Ammo, Ammo.Pack}
+  alias Cannery.{ComparableDate, Containers}
+  alias CanneryWeb.Endpoint
+  alias Phoenix.LiveView.Socket
+
+  @impl true
+  def mount(_params, _session, socket), do: {:ok, socket}
+
+  @impl true
+  def handle_params(
+        %{"id" => id, "shot_group_id" => shot_group_id},
+        _url,
+        %{assigns: %{live_action: live_action, current_user: current_user}} = socket
+      ) do
+    shot_group = ActivityLog.get_shot_group!(shot_group_id, current_user)
+
+    socket =
+      socket
+      |> assign(page_title: page_title(live_action), shot_group: shot_group)
+      |> display_pack(id)
+
+    {:noreply, socket}
+  end
+
+  def handle_params(%{"id" => id}, _url, %{assigns: %{live_action: live_action}} = socket) do
+    socket =
+      socket
+      |> assign(page_title: page_title(live_action))
+      |> display_pack(id)
+
+    {:noreply, socket}
+  end
+
+  defp page_title(:add_shot_group), do: gettext("Record Shots")
+  defp page_title(:edit_shot_group), do: gettext("Edit Shot Records")
+  defp page_title(:move), do: gettext("Move Ammo")
+  defp page_title(:show), do: gettext("Show Ammo")
+  defp page_title(:edit), do: gettext("Edit Ammo")
+
+  @impl true
+  def handle_event(
+        "delete",
+        _params,
+        %{assigns: %{pack: pack, current_user: current_user}} = socket
+      ) do
+    pack |> Ammo.delete_pack!(current_user)
+
+    prompt = dgettext("prompts", "Ammo deleted succesfully")
+    redirect_to = Routes.pack_index_path(socket, :index)
+
+    {:noreply, socket |> put_flash(:info, prompt) |> push_navigate(to: redirect_to)}
+  end
+
+  def handle_event(
+        "toggle_staged",
+        _params,
+        %{assigns: %{pack: pack, current_user: current_user}} = socket
+      ) do
+    {:ok, pack} = pack |> Ammo.update_pack(%{"staged" => !pack.staged}, current_user)
+
+    {:noreply, socket |> display_pack(pack)}
+  end
+
+  def handle_event(
+        "delete_shot_group",
+        %{"id" => id},
+        %{assigns: %{pack: %{id: pack_id}, current_user: current_user}} = socket
+      ) do
+    {:ok, _} =
+      ActivityLog.get_shot_group!(id, current_user)
+      |> ActivityLog.delete_shot_group(current_user)
+
+    prompt = dgettext("prompts", "Shot records deleted succesfully")
+    {:noreply, socket |> put_flash(:info, prompt) |> display_pack(pack_id)}
+  end
+
+  @spec display_pack(Socket.t(), Pack.t() | Pack.id()) :: Socket.t()
+  defp display_pack(
+         %{assigns: %{current_user: current_user}} = socket,
+         %Pack{container_id: container_id} = pack
+       ) do
+    columns = [
+      %{label: gettext("Rounds shot"), key: :count},
+      %{label: gettext("Notes"), key: :notes},
+      %{label: gettext("Date"), key: :date, type: ComparableDate},
+      %{label: gettext("Actions"), key: :actions, sortable: false}
+    ]
+
+    shot_groups = ActivityLog.list_shot_groups_for_pack(pack, current_user)
+
+    rows =
+      shot_groups
+      |> Enum.map(fn shot_group ->
+        pack |> get_table_row_for_shot_group(shot_group, columns)
+      end)
+
+    socket
+    |> assign(
+      pack: pack,
+      original_count: Ammo.get_original_count(pack, current_user),
+      percentage_remaining: Ammo.get_percentage_remaining(pack, current_user),
+      container: container_id && Containers.get_container!(container_id, current_user),
+      shot_groups: shot_groups,
+      columns: columns,
+      rows: rows
+    )
+  end
+
+  defp display_pack(%{assigns: %{current_user: current_user}} = socket, id),
+    do: display_pack(socket, Ammo.get_pack!(id, current_user))
+
+  @spec display_currency(float()) :: String.t()
+  defp display_currency(float), do: :erlang.float_to_binary(float, decimals: 2)
+
+  @spec get_table_row_for_shot_group(Pack.t(), ShotGroup.t(), [map()]) :: map()
+  defp get_table_row_for_shot_group(pack, %{id: id, date: date} = shot_group, columns) do
+    assigns = %{pack: pack, shot_group: shot_group}
+
+    columns
+    |> Map.new(fn %{key: key} ->
+      value =
+        case key do
+          :date ->
+            assigns = %{id: id, date: date}
+
+            {date,
+             ~H"""
+             <.date id={"#{@id}-date"} date={@date} />
+             """}
+
+          :actions ->
+            ~H"""
+            <div class="px-4 py-2 space-x-4 flex justify-center items-center">
+              <.link
+                patch={Routes.pack_show_path(Endpoint, :edit_shot_group, @pack, @shot_group)}
+                class="text-primary-600 link"
+                aria-label={
+                  dgettext("actions", "Edit shot group of %{shot_group_count} shots",
+                    shot_group_count: @shot_group.count
+                  )
+                }
+              >
+                <i class="fa-fw fa-lg fas fa-edit"></i>
+              </.link>
+
+              <.link
+                href="#"
+                class="text-primary-600 link"
+                phx-click="delete_shot_group"
+                phx-value-id={@shot_group.id}
+                data-confirm={dgettext("prompts", "Are you sure you want to delete this shot record?")}
+                aria-label={
+                  dgettext("actions", "Delete shot record of %{shot_group_count} shots",
+                    shot_group_count: @shot_group.count
+                  )
+                }
+              >
+                <i class="fa-fw fa-lg fas fa-trash"></i>
+              </.link>
+            </div>
+            """
+
+          key ->
+            shot_group |> Map.get(key)
+        end
+
+      {key, value}
+    end)
+  end
+end

lib/cannery_web/live/pack_live/show.html.heex

@@ -0,0 +1,183 @@
+<div class="mx-auto space-y-4 max-w-3xl flex flex-col justify-center items-center">
+  <h1 class="title text-2xl title-primary-500">
+    <%= @pack.ammo_type.name %>
+  </h1>
+
+  <div class="space-y-2 flex flex-col justify-center items-center">
+    <span class="rounded-lg title text-lg">
+      <%= gettext("Count:") %>
+      <%= @pack.count %>
+    </span>
+
+    <span class="rounded-lg title text-lg">
+      <%= gettext("Original count:") %>
+      <%= @original_count %>
+    </span>
+
+    <span class="rounded-lg title text-lg">
+      <%= gettext("Percentage left:") %>
+      <%= gettext("%{percentage}%", percentage: @percentage_remaining) %>
+    </span>
+
+    <%= if @pack.notes do %>
+      <span class="rounded-lg title text-lg">
+        <%= gettext("Notes:") %>
+        <%= @pack.notes %>
+      </span>
+    <% end %>
+
+    <span class="rounded-lg title text-lg">
+      <%= gettext("Purchased on:") %>
+      <.date id={"#{@pack.id}-purchased-on"} date={@pack.purchased_on} />
+    </span>
+
+    <%= if @pack.price_paid do %>
+      <span class="rounded-lg title text-lg">
+        <%= gettext("Original cost:") %>
+        <%= gettext("$%{amount}", amount: display_currency(@pack.price_paid)) %>
+      </span>
+
+      <span class="rounded-lg title text-lg">
+        <%= gettext("Current value:") %>
+        <%= gettext("$%{amount}",
+          amount: display_currency(@pack.price_paid * @percentage_remaining / 100)
+        ) %>
+      </span>
+    <% end %>
+  </div>
+
+  <div class="flex flex-col justify-center items-center">
+    <div class="flex flex-wrap justify-center items-center text-primary-600">
+      <.link
+        navigate={Routes.ammo_type_show_path(Endpoint, :show, @pack.ammo_type)}
+        class="mx-4 my-2 btn btn-primary"
+      >
+        <%= dgettext("actions", "View in Catalog") %>
+      </.link>
+
+      <.link
+        patch={Routes.pack_show_path(Endpoint, :edit, @pack)}
+        class="mx-4 my-2 text-primary-600 link"
+        aria-label={
+          dgettext("actions", "Edit ammo group of %{pack_count} bullets", pack_count: @pack.count)
+        }
+      >
+        <i class="fa-fw fa-lg fas fa-edit"></i>
+      </.link>
+
+      <.link
+        href="#"
+        class="mx-4 my-2 text-primary-600 link"
+        phx-click="delete"
+        data-confirm={dgettext("prompts", "Are you sure you want to delete this ammo?")}
+        aria-label={
+          dgettext("actions", "Delete ammo group of %{pack_count} bullets",
+            pack_count: @pack.count
+          )
+        }
+      >
+        <i class="fa-fw fa-lg fas fa-trash"></i>
+      </.link>
+    </div>
+
+    <div class="flex flex-wrap justify-center items-center text-primary-600">
+      <button type="button" class="mx-4 my-2 btn btn-primary" phx-click="toggle_staged">
+        <%= if @pack.staged,
+          do: dgettext("actions", "Unstage from range"),
+          else: dgettext("actions", "Stage for range") %>
+      </button>
+
+      <.link patch={Routes.pack_show_path(Endpoint, :move, @pack)} class="btn btn-primary">
+        <%= dgettext("actions", "Move ammo") %>
+      </.link>
+
+      <.link
+        patch={Routes.pack_show_path(Endpoint, :add_shot_group, @pack)}
+        class="mx-4 my-2 btn btn-primary"
+      >
+        <%= dgettext("actions", "Record shots") %>
+      </.link>
+    </div>
+  </div>
+
+  <hr class="mb-4 w-full" />
+
+  <div>
+    <%= if @container do %>
+      <h1 class="mb-4 px-4 py-2 text-center rounded-lg title text-xl">
+        <%= gettext("Stored in") %>
+      </h1>
+
+      <.container_card container={@container} current_user={@current_user} />
+    <% else %>
+      <%= gettext("This ammo is not in a container") %>
+    <% end %>
+  </div>
+
+  <%= unless @shot_groups |> Enum.empty?() do %>
+    <hr class="mb-4 w-full" />
+
+    <h1 class="mb-4 px-4 py-2 text-center rounded-lg title text-xl">
+      <%= gettext("Rounds used") %>
+    </h1>
+
+    <.live_component
+      module={CanneryWeb.Components.TableComponent}
+      id="pack_shot_groups_table"
+      columns={@columns}
+      rows={@rows}
+    />
+  <% end %>
+</div>
+
+<%= case @live_action do %>
+  <% :edit -> %>
+    <.modal return_to={Routes.pack_show_path(Endpoint, :show, @pack)}>
+      <.live_component
+        module={CanneryWeb.PackLive.FormComponent}
+        id={@pack.id}
+        title={@page_title}
+        action={@live_action}
+        pack={@pack}
+        return_to={Routes.pack_show_path(Endpoint, :show, @pack)}
+        current_user={@current_user}
+      />
+    </.modal>
+  <% :edit_shot_group -> %>
+    <.modal return_to={Routes.pack_show_path(Endpoint, :show, @pack)}>
+      <.live_component
+        module={CanneryWeb.RangeLive.FormComponent}
+        id={@shot_group.id}
+        title={@page_title}
+        action={@live_action}
+        shot_group={@shot_group}
+        return_to={Routes.pack_show_path(Endpoint, :show, @pack)}
+        current_user={@current_user}
+      />
+    </.modal>
+  <% :add_shot_group -> %>
+    <.modal return_to={Routes.pack_show_path(Endpoint, :show, @pack)}>
+      <.live_component
+        module={CanneryWeb.Components.AddShotGroupComponent}
+        id={:new}
+        title={@page_title}
+        action={@live_action}
+        pack={@pack}
+        return_to={Routes.pack_show_path(Endpoint, :show, @pack)}
+        current_user={@current_user}
+      />
+    </.modal>
+  <% :move -> %>
+    <.modal return_to={Routes.pack_show_path(Endpoint, :show, @pack)}>
+      <.live_component
+        module={CanneryWeb.Components.MovePackComponent}
+        id={@pack.id}
+        title={@page_title}
+        action={@live_action}
+        pack={@pack}
+        return_to={Routes.pack_show_path(Endpoint, :show, @pack)}
+        current_user={@current_user}
+      />
+    </.modal>
+  <% _show -> %>
+<% end %>