add and delete tags to/from containers

lib/cannery_web/live/container_live/add_tag_component.ex

@@ -0,0 +1,79 @@
+defmodule CanneryWeb.ContainerLive.AddTagComponent do
+  @moduledoc """
+  Livecomponent that can add a tag to a Container
+  """
+
+  use CanneryWeb, :live_component
+  alias Cannery.{Accounts.User, Containers, Containers.Container, Tags, Tags.Tag}
+  alias Phoenix.LiveView.Socket
+
+  @impl true
+  @spec update(
+          %{:container => Container.t(), :current_user => User.t(), optional(any) => any},
+          Socket.t()
+        ) :: {:ok, Socket.t()}
+  def update(%{container: _container, current_user: current_user} = assigns, socket) do
+    {:ok, socket |> assign(assigns) |> assign(:tags, Tags.list_tags(current_user))}
+  end
+
+  @impl true
+  def handle_event(
+        "save",
+        %{"tag" => %{"tag_id" => tag_id}},
+        %{
+          assigns: %{
+            tags: tags,
+            container: container,
+            current_user: current_user,
+            return_to: return_to
+          }
+        } = socket
+      ) do
+    socket =
+      case tags |> Enum.find(fn %{id: id} -> tag_id == id end) do
+        nil ->
+          prompt = dgettext("errors", "Tag could not be added")
+          socket |> put_flash(:error, prompt)
+
+        %{name: tag_name} = tag ->
+          _container_tag = Containers.add_tag!(container, tag, current_user)
+          prompt = dgettext("prompts", "%{name} added successfully", name: tag_name)
+          socket |> put_flash(:info, prompt) |> push_redirect(to: return_to)
+      end
+
+    {:noreply, socket}
+  end
+
+  @impl true
+  def render(assigns) do
+    ~H"""
+    <div>
+      <h2 class="mb-4 text-center title text-xl text-primary-500">
+        <%= @title %>
+      </h2>
+
+      <.form
+        let={f}
+        for={:tag}
+        id="add-tag-to-container-form"
+        class="grid grid-cols-3 justify-center items-center space-x-2"
+        phx-target={@myself}
+        phx-submit="save"
+      >
+        <%= select(f, :tag_id, tag_options(@tags), class: "text-center col-span-2 input input-primary") %>
+        <%= error_tag(f, :tag_id, "col-span-3 text-center") %>
+
+        <%= submit(dgettext("actions", "Add"),
+          class: "mx-auto btn btn-primary",
+          phx_disable_with: dgettext("prompts", "Adding...")
+        ) %>
+      </.form>
+    </div>
+    """
+  end
+
+  @spec tag_options([Tag.t()]) :: [{String.t(), Tag.id()}]
+  defp tag_options(tags) do
+    tags |> Enum.map(fn %{id: id, name: name} -> {name, id} end)
+  end
+end

lib/cannery_web/live/container_live/show.ex

@@ -4,9 +4,11 @@ defmodule CanneryWeb.ContainerLive.Show do
   """
 
   use CanneryWeb, :live_view
-  import CanneryWeb.Components.AmmoGroupCard
-  alias Cannery.{Containers, Repo}
+  import CanneryWeb.Components.{AmmoGroupCard, TagCard}
+  alias Cannery.{Containers, Repo, Tags}
+  alias CanneryWeb.Endpoint
   alias Ecto.Changeset
+  alias Phoenix.LiveView.Socket
 
   @impl true
   def mount(_params, session, socket) do
@@ -19,19 +21,39 @@ defmodule CanneryWeb.ContainerLive.Show do
         _,
         %{assigns: %{current_user: current_user, live_action: live_action}} = socket
       ) do
+    {:noreply,
+     socket |> assign(page_title: page_title(live_action)) |> render_container(id, current_user)}
+  end
+
+  @impl true
+  def handle_event(
+        "delete_tag",
+        %{"tag-id" => tag_id},
+        %{assigns: %{container: container, current_user: current_user}} = socket
+      ) do
     socket =
-      socket
-      |> assign(
-        page_title: page_title(live_action),
-        container: Containers.get_container!(id, current_user) |> Repo.preload(:ammo_groups)
-      )
+      case Tags.get_tag(tag_id, current_user) do
+        {:ok, tag} ->
+          _count = Containers.remove_tag!(container, tag, current_user)
+
+          prompt =
+            dgettext("prompts", "%{tag_name} has been removed from %{container_name}",
+              tag_name: tag.name,
+              container_name: container.name
+            )
+
+          socket |> put_flash(:info, prompt) |> render_container(container.id, current_user)
+
+        {:error, error_string} ->
+          socket |> put_flash(:error, error_string)
+      end
 
     {:noreply, socket}
   end
 
   @impl true
   def handle_event(
-        "delete",
+        "delete_container",
         _,
         %{assigns: %{container: container, current_user: current_user}} = socket
       ) do
@@ -65,4 +87,14 @@ defmodule CanneryWeb.ContainerLive.Show do
 
   defp page_title(:show), do: gettext("Show Container")
   defp page_title(:edit), do: gettext("Edit Container")
+  defp page_title(:add_tag), do: gettext("Add Tag to Container")
+
+  @spec render_container(Socket.t(), Container.id(), User.t()) :: Socket.t()
+  defp render_container(socket, id, current_user) do
+    container =
+      Containers.get_container!(id, current_user)
+      |> Repo.preload([:ammo_groups, :tags], force: true)
+
+    socket |> assign(container: container)
+  end
 end

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

@@ -30,7 +30,7 @@
 
     <%= link to: "#",
          class: "text-primary-500 link",
-         phx_click: "delete",
+         phx_click: "delete_container",
          data: [
            confirm:
              dgettext("prompts", "Are you sure you want to delete %{name}?", name: @container.name)
@@ -39,7 +39,46 @@
     <% end %>
   </div>
 
-  <hr class="mb-4 w-full">
+  <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-500">
+        <%= gettext("No tags for this container") %> 😔
+      </h2>
+
+      <%= live_patch(dgettext("actions", "Why not add one?"),
+        to: Routes.container_show_path(Endpoint, :add_tag, @container),
+        class: "btn btn-primary"
+      ) %>
+    </div>
+  <% else %>
+    <h2 class="mb-4 title text-xl text-primary-500">
+      <%= gettext("Tags") %>
+    </h2>
+
+    <%= for tag <- @container.tags do %>
+      <.tag_card tag={tag}>
+        <%= link to: "#",
+             class: "text-primary-500 link",
+             phx_click: "delete_tag",
+             phx_value_tag_id: tag.id,
+             data: [
+               confirm:
+                 dgettext(
+                   "prompts",
+                   "Are you sure you want to remove the %{tag_name} tag from %{container_name}?",
+                   tag_name: tag.name,
+                   container_name: @container.name
+                 )
+             ] do %>
+          <i class="fa-fw fa-lg fas fa-trash"></i>
+        <% end %>
+      </.tag_card>
+    <% end %>
+  <% end %>
+
+  <hr class="mb-4 hr">
 
   <p>
     <%= if @container.ammo_groups |> Enum.empty?() do %>
@@ -50,14 +89,26 @@
       <% end %>
     <% end %>
   </p>
-
-  <%= if @live_action in [:edit] do %>
-    <%= live_modal(CanneryWeb.ContainerLive.FormComponent,
-      id: @container.id,
-      title: @page_title,
-      action: @live_action,
-      container: @container,
-      return_to: Routes.container_show_path(@socket, :show, @container)
-    ) %>
-  <% end %>
 </div>
+
+<%= if @live_action in [:edit] do %>
+  <%= live_modal(CanneryWeb.ContainerLive.FormComponent,
+    id: @container.id,
+    title: @page_title,
+    action: @live_action,
+    container: @container,
+    return_to: Routes.container_show_path(Endpoint, :show, @container),
+    current_user: @current_user
+  ) %>
+<% end %>
+
+<%= if @live_action == :add_tag do %>
+  <%= live_modal(CanneryWeb.ContainerLive.AddTagComponent,
+    id: @container.id,
+    title: @page_title,
+    action: @live_action,
+    container: @container,
+    return_to: Routes.container_show_path(Endpoint, :show, @container),
+    current_user: @current_user
+  ) %>
+<% end %>