move staging to container

lib/cannery_web/live/container_live/index.ex

@@ -112,6 +112,20 @@ defmodule CanneryWeb.ContainerLive.Index do
     {:noreply, socket |> push_patch(to: ~p"/containers/search/#{search_term}")}
   end
 
+  def handle_event(
+        "toggle_staged",
+        %{"container_id" => id},
+        %{assigns: %{current_user: current_user}} = socket
+      ) do
+    container = Containers.get_container!(id, current_user)
+
+    {:ok, _container} =
+      container
+      |> Containers.update_container(current_user, %{"staged" => !container.staged})
+
+    {:noreply, socket |> display_containers()}
+  end
+
   defp display_containers(%{assigns: %{search: search, current_user: current_user}} = socket) do
     socket |> assign(:containers, Containers.list_containers(current_user, search: search))
   end

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

@@ -1,10 +1,10 @@
-<div class="flex flex-col space-y-8 justify-center items-center">
-  <h1 class="title text-2xl title-primary-500">
+<div class="flex flex-col justify-center items-center space-y-8">
+  <h1 class="text-2xl title title-primary-500">
     <%= gettext("Containers") %>
   </h1>
 
   <%= if @containers |> Enum.empty?() and @search |> is_nil() do %>
-    <h2 class="title text-xl text-primary-600">
+    <h2 class="text-xl title text-primary-600">
       <%= gettext("No containers") %>
       <%= display_emoji("😔") %>
     </h2>
@@ -17,14 +17,14 @@
       <%= dgettext("actions", "New Container") %>
     </.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">
+    <div class="flex flex-col justify-center items-center space-y-4 w-full max-w-2xl sm:flex-row sm:space-y-0 sm:space-x-4">
       <.form
         :let={f}
         for={%{}}
         as={:search}
         phx-change="search"
         phx-submit="search"
-        class="grow flex items-center"
+        class="flex items-center grow"
       >
         <%= text_input(f, :search_term,
           class: "grow input input-primary",
@@ -36,14 +36,14 @@
       </.form>
 
       <.toggle_button action="toggle_table" value={@view_table}>
-        <span class="title text-lg text-primary-600">
+        <span class="text-lg title text-primary-600">
           <%= gettext("View as table") %>
         </span>
       </.toggle_button>
     </div>
 
     <%= if @containers |> Enum.empty?() do %>
-      <h2 class="title text-xl text-primary-600">
+      <h2 class="text-xl title text-primary-600">
         <%= gettext("No containers") %>
         <%= display_emoji("😔") %>
       </h2>
@@ -56,6 +56,20 @@
           containers={@containers}
           current_user={@current_user}
         >
+          <:range :let={container}>
+            <div class="flex justify-center items-center px-4 py-2 h-full min-w-20 flex-wrap">
+              <button
+                type="button"
+                class="mx-2 my-1 text-sm btn btn-primary"
+                phx-click="toggle_staged"
+                phx-value-container_id={container.id}
+              >
+                <%= if container.staged,
+                  do: dgettext("actions", "Unstage"),
+                  else: dgettext("actions", "Stage") %>
+              </button>
+            </div>
+          </:range>
           <:tag_actions :let={container}>
             <div class="mx-4 my-2">
               <.link
@@ -109,7 +123,7 @@
           </:actions>
         </.live_component>
       <% else %>
-        <div class="w-full flex flex-row flex-wrap justify-center items-stretch">
+        <div class="flex flex-row flex-wrap justify-center items-stretch w-full">
           <.container_card
             :for={container <- @containers}
             container={container}

lib/cannery_web/live/container_live/show.ex

@@ -78,6 +78,18 @@ defmodule CanneryWeb.ContainerLive.Show do
     {:noreply, socket}
   end
 
+  def handle_event(
+        "toggle_staged",
+        _params,
+        %{assigns: %{container: container, current_user: current_user}} = socket
+      ) do
+    {:ok, _container} =
+      container
+      |> Containers.update_container(current_user, %{"staged" => !container.staged})
+
+    {:noreply, socket |> render_container()}
+  end
+
   def handle_event("toggle_table", _params, %{assigns: %{view_table: view_table}} = socket) do
     {:noreply, socket |> assign(:view_table, !view_table) |> render_container()}
   end

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

@@ -1,34 +1,34 @@
-<div class="space-y-4 flex flex-col justify-center items-center">
-  <h1 class="title text-2xl title-primary-500">
+<div class="flex flex-col justify-center items-center space-y-4">
+  <h1 class="text-2xl title title-primary-500">
     <%= @container.name %>
   </h1>
 
-  <span :if={@container.desc} class="rounded-lg title text-lg">
+  <span :if={@container.desc} class="text-lg rounded-lg title">
     <%= gettext("Description:") %>
     <%= @container.desc %>
   </span>
 
-  <span class="rounded-lg title text-lg">
+  <span class="text-lg rounded-lg title">
     <%= gettext("Type:") %>
     <%= @container.type %>
   </span>
 
-  <span :if={@container.location} class="rounded-lg title text-lg">
+  <span :if={@container.location} class="text-lg rounded-lg title">
     <%= gettext("Location:") %>
     <%= @container.location %>
   </span>
 
-  <span class="rounded-lg title text-lg">
+  <span class="text-lg rounded-lg title">
     <%= gettext("Packs:") %>
     <%= @packs_count %>
   </span>
 
-  <span class="rounded-lg title text-lg">
+  <span class="text-lg rounded-lg title">
     <%= gettext("Rounds:") %>
     <%= @round_count %>
   </span>
 
-  <div class="flex space-x-4 justify-center items-center text-primary-600">
+  <div class="flex justify-center items-center space-x-4 text-primary-600">
     <.link
       patch={~p"/container/edit/#{@container}"}
       class="text-primary-600 link"
@@ -52,11 +52,19 @@
     </.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 @container.staged,
+        do: dgettext("actions", "Unstage from range"),
+        else: dgettext("actions", "Stage for range") %>
+    </button>
+  </div>
+
   <hr class="mb-4 hr" />
 
   <%= if @container.tags |> Enum.empty?() do %>
     <div class="flex flex-row justify-center items-center space-x-4">
-      <h2 class="title text-lg text-primary-600">
+      <h2 class="text-lg title text-primary-600">
         <%= gettext("No tags for this container") %>
         <%= display_emoji("😔") %>
       </h2>
@@ -105,15 +113,15 @@
     </.form>
 
     <.toggle_button action="toggle_table" value={@view_table}>
-      <span class="title text-lg text-primary-600">
+      <span class="text-lg title text-primary-600">
         <%= gettext("View as table") %>
       </span>
     </.toggle_button>
   </div>
 
-  <div class="w-full p-4">
+  <div class="p-4 w-full">
     <%= if @packs |> Enum.empty?() do %>
-      <h2 class="mx-4 title text-lg text-primary-600 text-center">
+      <h2 class="mx-4 text-lg text-center title text-primary-600">
         <%= gettext("No ammo in this container") %>
       </h2>
     <% else %>
@@ -131,7 +139,7 @@
             </.link>
           </:type>
           <:actions :let={%{count: pack_count} = pack}>
-            <div class="py-2 px-4 h-full space-x-4 flex justify-center items-center">
+            <div class="flex justify-center items-center px-4 py-2 space-x-4 h-full">
               <.link
                 navigate={~p"/ammo/show/#{pack}"}
                 class="text-primary-600 link"