make ammo type show page and container show page also display ammo groups as table

lib/cannery_web/live/ammo_group_live/index.ex

@@ -95,183 +95,11 @@ defmodule CanneryWeb.AmmoGroupLive.Index do
     ammo_types_count = Ammo.get_ammo_types_count!(current_user)
     containers_count = Containers.get_containers_count!(current_user)
 
-    columns = [
-      %{label: gettext("Ammo type"), key: :ammo_type},
-      %{label: gettext("Count"), key: :count},
-      %{label: gettext("Price paid"), key: :price_paid},
-      %{label: gettext("% left"), key: :remaining},
-      %{label: gettext("Range"), key: :range},
-      %{label: gettext("Container"), key: :container},
-      %{label: gettext("Added on"), key: :added_on}
-    ]
-
-    columns =
-      if show_used do
-        columns ++ [%{label: gettext("Used up on"), key: :used_up_on}]
-      else
-        columns
-      end
-
-    columns = columns ++ [%{label: nil, key: :actions, sortable: false}]
-
-    rows =
-      ammo_groups
-      |> Enum.map(fn ammo_group -> ammo_group |> get_row_data_for_ammo_group(columns) end)
-
     socket
     |> assign(
       ammo_groups: ammo_groups,
       ammo_types_count: ammo_types_count,
-      containers_count: containers_count,
-      columns: columns,
-      rows: rows
+      containers_count: containers_count
     )
   end
-
-  @spec get_row_data_for_ammo_group(AmmoGroup.t(), [map()]) :: [map()]
-  defp get_row_data_for_ammo_group(ammo_group, columns) do
-    ammo_group = ammo_group |> Repo.preload([:ammo_type, :container])
-
-    columns
-    |> Enum.into(%{}, fn %{key: key} -> {key, get_value_for_key(key, ammo_group)} end)
-  end
-
-  @spec get_value_for_key(atom(), AmmoGroup.t()) :: any()
-  defp get_value_for_key(:ammo_type, %{ammo_type: ammo_type}) do
-    assigns = %{ammo_type: ammo_type}
-
-    {ammo_type.name,
-     ~H"""
-     <.link navigate={Routes.ammo_type_show_path(Endpoint, :show, @ammo_type)} class="link">
-       <%= @ammo_type.name %>
-     </.link>
-     """}
-  end
-
-  defp get_value_for_key(:price_paid, %{price_paid: nil}), do: {"a", nil}
-
-  defp get_value_for_key(:price_paid, %{price_paid: price_paid}),
-    do: gettext("$%{amount}", amount: price_paid |> :erlang.float_to_binary(decimals: 2))
-
-  defp get_value_for_key(:added_on, %{inserted_at: inserted_at}) do
-    assigns = %{inserted_at: inserted_at}
-
-    {inserted_at,
-     ~H"""
-     <%= @inserted_at |> display_datetime() %>
-     """}
-  end
-
-  defp get_value_for_key(:used_up_on, ammo_group) do
-    last_shot_group_date =
-      case ammo_group |> Ammo.get_last_used_shot_group() do
-        %{date: last_shot_group_date} -> last_shot_group_date
-        _no_shot_groups -> nil
-      end
-
-    assigns = %{last_shot_group_date: last_shot_group_date}
-
-    {last_shot_group_date,
-     ~H"""
-     <%= @last_shot_group_date |> display_date() %>
-     """}
-  end
-
-  defp get_value_for_key(:range, %{staged: staged} = ammo_group) do
-    assigns = %{ammo_group: ammo_group}
-
-    {staged,
-     ~H"""
-     <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-ammo_group_id={@ammo_group.id}
-       >
-         <%= if @ammo_group.staged, do: gettext("Unstage"), else: gettext("Stage") %>
-       </button>
-
-       <.link
-         patch={Routes.ammo_group_index_path(Endpoint, :add_shot_group, @ammo_group)}
-         class="mx-2 my-1 text-sm btn btn-primary"
-       >
-         <%= dgettext("actions", "Record shots") %>
-       </.link>
-     </div>
-     """}
-  end
-
-  defp get_value_for_key(:remaining, ammo_group),
-    do: gettext("%{percentage}%", percentage: ammo_group |> Ammo.get_percentage_remaining())
-
-  defp get_value_for_key(:actions, ammo_group) do
-    assigns = %{ammo_group: ammo_group}
-
-    ~H"""
-    <div class="py-2 px-4 h-full space-x-4 flex justify-center items-center">
-      <.link
-        navigate={Routes.ammo_group_show_path(Endpoint, :show, @ammo_group)}
-        class="text-primary-600 link"
-        data-qa={"view-#{@ammo_group.id}"}
-      >
-        <i class="fa-fw fa-lg fas fa-eye"></i>
-      </.link>
-
-      <.link
-        patch={Routes.ammo_group_index_path(Endpoint, :edit, @ammo_group)}
-        class="text-primary-600 link"
-        data-qa={"edit-#{@ammo_group.id}"}
-      >
-        <i class="fa-fw fa-lg fas fa-edit"></i>
-      </.link>
-
-      <.link
-        patch={Routes.ammo_group_index_path(Endpoint, :clone, @ammo_group)}
-        class="text-primary-600 link"
-        data-qa={"clone-#{@ammo_group.id}"}
-      >
-        <i class="fa-fw fa-lg fas fa-copy"></i>
-      </.link>
-
-      <.link
-        href="#"
-        class="text-primary-600 link"
-        phx-click="delete"
-        phx-value-id={@ammo_group.id}
-        data-confirm={dgettext("prompts", "Are you sure you want to delete this ammo?")}
-        data-qa={"delete-#{@ammo_group.id}"}
-      >
-        <i class="fa-fw fa-lg fas fa-trash"></i>
-      </.link>
-    </div>
-    """
-  end
-
-  defp get_value_for_key(:container, %{container: nil}), do: {nil, nil}
-
-  defp get_value_for_key(:container, %{container: %{name: container_name}} = ammo_group) do
-    assigns = %{ammo_group: ammo_group}
-
-    {container_name,
-     ~H"""
-     <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, @ammo_group.container)}
-         class="mx-2 my-1 link"
-       >
-         <%= @ammo_group.container.name %>
-       </.link>
-
-       <.link
-         patch={Routes.ammo_group_index_path(Endpoint, :move, @ammo_group)}
-         class="mx-2 my-1 text-sm btn btn-primary"
-       >
-         <%= gettext("Move ammo") %>
-       </.link>
-     </div>
-     """}
-  end
-
-  defp get_value_for_key(key, ammo_group), do: ammo_group |> Map.get(key)
 end

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

@@ -42,7 +42,7 @@
   <% end %>
 
   <%= unless @ammo_groups |> Enum.empty?() do %>
-    <div class="flex flex-col justify-center items-center">
+    <div class="flex flex-col space-y-4 justify-center items-center">
       <.toggle_button action="toggle_show_used" value={@show_used}>
         <span class="title text-lg text-primary-600">
           <%= gettext("Show used") %>
@@ -51,12 +51,92 @@
     </div>
 
     <.live_component
-      module={CanneryWeb.Components.TableComponent}
-      id="ammo_groups_index_table"
-      action={@live_action}
-      columns={@columns}
-      rows={@rows}
-    />
+      module={CanneryWeb.Components.AmmoGroupTableComponent}
+      id="ammo-group-index-table"
+      ammo_groups={@ammo_groups}
+      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={ammo_group}>
+        <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-ammo_group_id={ammo_group.id}
+          >
+            <%= if ammo_group.staged, do: gettext("Unstage"), else: gettext("Stage") %>
+          </button>
+
+          <.link
+            patch={Routes.ammo_group_index_path(Endpoint, :add_shot_group, ammo_group)}
+            class="mx-2 my-1 text-sm btn btn-primary"
+          >
+            <%= dgettext("actions", "Record shots") %>
+          </.link>
+        </div>
+      </:range>
+      <:container :let={%{container: %{name: container_name} = container} = ammo_group}>
+        <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.ammo_group_index_path(Endpoint, :move, ammo_group)}
+            class="mx-2 my-1 text-sm btn btn-primary"
+          >
+            <%= gettext("Move ammo") %>
+          </.link>
+        </div>
+      </:container>
+      <:actions :let={ammo_group}>
+        <div class="py-2 px-4 h-full space-x-4 flex justify-center items-center">
+          <.link
+            navigate={Routes.ammo_group_show_path(Endpoint, :show, ammo_group)}
+            class="text-primary-600 link"
+            data-qa={"view-#{ammo_group.id}"}
+          >
+            <i class="fa-fw fa-lg fas fa-eye"></i>
+          </.link>
+
+          <.link
+            patch={Routes.ammo_group_index_path(Endpoint, :edit, ammo_group)}
+            class="text-primary-600 link"
+            data-qa={"edit-#{ammo_group.id}"}
+          >
+            <i class="fa-fw fa-lg fas fa-edit"></i>
+          </.link>
+
+          <.link
+            patch={Routes.ammo_group_index_path(Endpoint, :clone, ammo_group)}
+            class="text-primary-600 link"
+            data-qa={"clone-#{ammo_group.id}"}
+          >
+            <i class="fa-fw fa-lg fas fa-copy"></i>
+          </.link>
+
+          <.link
+            href="#"
+            class="text-primary-600 link"
+            phx-click="delete"
+            phx-value-id={ammo_group.id}
+            data-confirm={dgettext("prompts", "Are you sure you want to delete this ammo?")}
+            data-qa={"delete-#{ammo_group.id}"}
+          >
+            <i class="fa-fw fa-lg fas fa-trash"></i>
+          </.link>
+        </div>
+      </:actions>
+    </.live_component>
   <% end %>
 </div>
 

lib/cannery_web/live/ammo_group_live/show.ex

@@ -102,12 +102,12 @@ defmodule CanneryWeb.AmmoGroupLive.Show do
   defp display_ammo_group(%{assigns: %{current_user: current_user}} = socket, id),
     do: display_ammo_group(socket, Ammo.get_ammo_group!(id, current_user))
 
-  @spec get_table_row_for_shot_group(AmmoGroup.t(), ShotGroup.t(), [map()]) :: [map()]
+  @spec get_table_row_for_shot_group(AmmoGroup.t(), ShotGroup.t(), [map()]) :: map()
   defp get_table_row_for_shot_group(ammo_group, %{date: date} = shot_group, columns) do
     assigns = %{ammo_group: ammo_group, shot_group: shot_group}
 
     columns
-    |> Enum.into(%{}, fn %{key: key} ->
+    |> Map.new(fn %{key: key} ->
       value =
         case key do
           :date ->