From c0f039f2ee1b5d1151bf5ad521cbc1a7c2f93ae5 Mon Sep 17 00:00:00 2001
From: Claudio Ortolina <cloud8421@gmail.com>
Date: Fri, 1 Nov 2024 09:30:06 +0000
Subject: [PATCH] Use icon instead of custom svg in options menu

---
 .../components/core_components.ex             |  3 ++-
 .../live/record_live/import_component.ex      | 13 +++++------
 .../live/record_live/index.html.heex          | 13 +++++------
 .../live/wishlist_live/index.html.heex        | 13 +++++------
 priv/gettext/default.pot                      | 22 +++++++++----------
 5 files changed, 28 insertions(+), 36 deletions(-)

diff --git a/lib/music_library_web/components/core_components.ex b/lib/music_library_web/components/core_components.ex
index 6dc24c0d..636daf64 100644
--- a/lib/music_library_web/components/core_components.ex
+++ b/lib/music_library_web/components/core_components.ex
@@ -624,10 +624,11 @@ defmodule MusicLibraryWeb.CoreComponents do
   """
   attr :name, :string, required: true
   attr :class, :string, default: nil
+  attr :rest, :global
 
   def icon(%{name: "hero-" <> _} = assigns) do
     ~H"""
-    <span class={[@name, @class]} />
+    <span class={[@name, @class]} {@rest} />
     """
   end
 
diff --git a/lib/music_library_web/live/record_live/import_component.ex b/lib/music_library_web/live/record_live/import_component.ex
index fd975c36..a3161e80 100644
--- a/lib/music_library_web/live/record_live/import_component.ex
+++ b/lib/music_library_web/live/record_live/import_component.ex
@@ -67,22 +67,19 @@ defmodule MusicLibraryWeb.RecordLive.ImportComponent do
         <div class="relative flex-none">
           <button
             type="button"
-            class="-m-2.5 block p-2.5 text-zinc-500 hover:text-zinc-900 dark:text-zinc-400 dark:hover:text-zinc-300"
+            class="text-zinc-500 hover:text-zinc-900 dark:text-zinc-400 dark:hover:text-zinc-300"
             aria-expanded="false"
             aria-haspopup="true"
             phx-click={toggle_actions_menu(@release_group.id)}
             phx-click-away={close_actions_menu(@release_group.id)}
           >
             <span class="sr-only"><%= gettext("Open options") %></span>
-            <svg
-              class="h-5 w-5"
-              viewBox="0 0 20 20"
-              fill="currentColor"
+            <.icon
+              name="hero-ellipsis-vertical"
+              class="-mt-1 h-5 w-5"
               aria-hidden="true"
               data-slot="icon"
-            >
-              <path d="M10 3a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM10 8.5a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM11.5 15.5a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0Z" />
-            </svg>
+            />
           </button>
           <!--
           Dropdown menu, show/hide based on menu state.
diff --git a/lib/music_library_web/live/record_live/index.html.heex b/lib/music_library_web/live/record_live/index.html.heex
index 6afd7e52..08334766 100644
--- a/lib/music_library_web/live/record_live/index.html.heex
+++ b/lib/music_library_web/live/record_live/index.html.heex
@@ -90,22 +90,19 @@
       <div class="relative flex-none">
         <button
           type="button"
-          class="-m-2.5 block p-2.5 text-zinc-500 hover:text-zinc-900 dark:text-zinc-400 dark:hover:text-zinc-300"
+          class="text-zinc-500 hover:text-zinc-900 dark:text-zinc-400 dark:hover:text-zinc-300"
           aria-expanded="false"
           aria-haspopup="true"
           phx-click={toggle_actions_menu(record.id)}
           phx-click-away={close_actions_menu(record.id)}
         >
           <span class="sr-only"><%= gettext("Open options") %></span>
-          <svg
-            class="h-5 w-5"
-            viewBox="0 0 20 20"
-            fill="currentColor"
+          <.icon
+            name="hero-ellipsis-vertical"
+            class="-mt-1 h-5 w-5"
             aria-hidden="true"
             data-slot="icon"
-          >
-            <path d="M10 3a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM10 8.5a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM11.5 15.5a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0Z" />
-          </svg>
+          />
         </button>
         <!--
           Dropdown menu, show/hide based on menu state.
diff --git a/lib/music_library_web/live/wishlist_live/index.html.heex b/lib/music_library_web/live/wishlist_live/index.html.heex
index 997bb902..a1e26088 100644
--- a/lib/music_library_web/live/wishlist_live/index.html.heex
+++ b/lib/music_library_web/live/wishlist_live/index.html.heex
@@ -90,22 +90,19 @@
       <div class="relative flex-none">
         <button
           type="button"
-          class="-m-2.5 block p-2.5 text-zinc-500 hover:text-zinc-900 dark:text-zinc-400 dark:hover:text-zinc-300"
+          class="text-zinc-500 hover:text-zinc-900 dark:text-zinc-400 dark:hover:text-zinc-300"
           aria-expanded="false"
           aria-haspopup="true"
           phx-click={toggle_actions_menu(record.id)}
           phx-click-away={close_actions_menu(record.id)}
         >
           <span class="sr-only"><%= gettext("Open options") %></span>
-          <svg
-            class="h-5 w-5"
-            viewBox="0 0 20 20"
-            fill="currentColor"
+          <.icon
+            name="hero-ellipsis-vertical"
+            class="-mt-1 h-5 w-5"
             aria-hidden="true"
             data-slot="icon"
-          >
-            <path d="M10 3a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM10 8.5a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM11.5 15.5a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0Z" />
-          </svg>
+          />
         </button>
         <!--
           Dropdown menu, show/hide based on menu state.
diff --git a/priv/gettext/default.pot b/priv/gettext/default.pot
index 2fc139eb..255d1e1c 100644
--- a/priv/gettext/default.pot
+++ b/priv/gettext/default.pot
@@ -16,9 +16,9 @@ msgstr ""
 msgid "Actions"
 msgstr ""
 
-#: lib/music_library_web/live/record_live/index.html.heex:166
+#: lib/music_library_web/live/record_live/index.html.heex:163
 #: lib/music_library_web/live/record_live/show.html.heex:9
-#: lib/music_library_web/live/wishlist_live/index.html.heex:176
+#: lib/music_library_web/live/wishlist_live/index.html.heex:173
 #: lib/music_library_web/live/wishlist_live/show.html.heex:9
 #, elixir-autogen, elixir-format
 msgid "Are you sure?"
@@ -61,20 +61,20 @@ msgstr ""
 msgid "Cover art"
 msgstr ""
 
-#: lib/music_library_web/live/record_live/index.html.heex:168
+#: lib/music_library_web/live/record_live/index.html.heex:165
 #: lib/music_library_web/live/record_live/show.html.heex:12
-#: lib/music_library_web/live/wishlist_live/index.html.heex:178
+#: lib/music_library_web/live/wishlist_live/index.html.heex:175
 #: lib/music_library_web/live/wishlist_live/show.html.heex:12
 #, elixir-autogen, elixir-format
 msgid "Delete"
 msgstr ""
 
 #: lib/music_library_web/live/record_live/index.ex:54
-#: lib/music_library_web/live/record_live/index.html.heex:157
+#: lib/music_library_web/live/record_live/index.html.heex:154
 #: lib/music_library_web/live/record_live/show.ex:50
 #: lib/music_library_web/live/record_live/show.html.heex:4
 #: lib/music_library_web/live/wishlist_live/index.ex:55
-#: lib/music_library_web/live/wishlist_live/index.html.heex:157
+#: lib/music_library_web/live/wishlist_live/index.html.heex:154
 #: lib/music_library_web/live/wishlist_live/show.ex:50
 #: lib/music_library_web/live/wishlist_live/show.html.heex:4
 #, elixir-autogen, elixir-format
@@ -191,7 +191,7 @@ msgstr ""
 msgid "Previous"
 msgstr ""
 
-#: lib/music_library_web/live/wishlist_live/index.html.heex:167
+#: lib/music_library_web/live/wishlist_live/index.html.heex:164
 #, elixir-autogen, elixir-format
 msgid "Purchase"
 msgstr ""
@@ -249,9 +249,9 @@ msgstr ""
 msgid "Search for records"
 msgstr ""
 
-#: lib/music_library_web/live/record_live/index.html.heex:137
+#: lib/music_library_web/live/record_live/index.html.heex:134
 #: lib/music_library_web/live/record_live/show.ex:49
-#: lib/music_library_web/live/wishlist_live/index.html.heex:137
+#: lib/music_library_web/live/wishlist_live/index.html.heex:134
 #: lib/music_library_web/live/wishlist_live/show.ex:49
 #, elixir-autogen, elixir-format
 msgid "Show"
@@ -313,8 +313,8 @@ msgstr ""
 msgid "Updated at"
 msgstr ""
 
-#: lib/music_library_web/live/record_live/index.html.heex:147
-#: lib/music_library_web/live/wishlist_live/index.html.heex:147
+#: lib/music_library_web/live/record_live/index.html.heex:144
+#: lib/music_library_web/live/wishlist_live/index.html.heex:144
 #, elixir-autogen, elixir-format
 msgid "View on MusicBrainz"
 msgstr ""