From a0df11d26f9cda004d9c1a37d6a5289b825cabfd Mon Sep 17 00:00:00 2001
From: Claudio Ortolina <cloud8421@gmail.com>
Date: Sun, 1 Mar 2026 20:19:46 +0000
Subject: [PATCH] Use new style for MB link and copy button in artist page

---
 .../live/artist_live/show.ex                  | 42 ++++++++++++-------
 priv/gettext/default.pot                      |  7 +---
 priv/gettext/en/LC_MESSAGES/default.po        |  7 +---
 .../live/artist_live/show_test.exs            |  2 +-
 4 files changed, 29 insertions(+), 29 deletions(-)

diff --git a/lib/music_library_web/live/artist_live/show.ex b/lib/music_library_web/live/artist_live/show.ex
index c610da83..47ea4894 100644
--- a/lib/music_library_web/live/artist_live/show.ex
+++ b/lib/music_library_web/live/artist_live/show.ex
@@ -262,22 +262,32 @@ defmodule MusicLibraryWeb.ArtistLive.Show do
                 image_hash={@artist_info.image_data_hash}
               />
             </.modal>
-            <dl>
-              <dt class="mt-4 text-sm font-medium leading-6 text-zinc-900 dark:text-zinc-400">
-                {gettext("MusicBrainz ID")}
-              </dt>
-              <dd class="mt-1 text-xs md:text-sm flex justify-between leading-6 text-zinc-700 dark:text-zinc-300">
-                <a href={MusicBrainz.Artist.url(@artist.musicbrainz_id)}>
-                  <code class="overflow-hidden text-clip" id={"mb-#{@artist.musicbrainz_id}"}>
-                    {@artist.musicbrainz_id}
-                  </code>
-                </a>
-                <.copy_to_clipboard
-                  target_id={"mb-#{@artist.musicbrainz_id}"}
-                  label={gettext("Copy MusicBrainz ID to clipboard")}
-                />
-              </dd>
-            </dl>
+            <div class="mt-2 flex items-center gap-2">
+              <code id={"mb-#{@artist.musicbrainz_id}"} class="hidden">
+                {@artist.musicbrainz_id}
+              </code>
+              <.button
+                href={MusicBrainz.Artist.url(@artist.musicbrainz_id)}
+                target="_blank"
+                rel="noopener noreferrer"
+                variant="ghost"
+                size="xs"
+              >
+                <.icon name="hero-arrow-top-right-on-square" class="h-3.5 w-3.5" aria-hidden="true" />
+                {gettext("MusicBrainz")}
+              </.button>
+              <.button
+                variant="ghost"
+                size="xs"
+                phx-click={
+                  JS.dispatch("music_library:clipcopy", to: "#mb-#{@artist.musicbrainz_id}")
+                  |> JS.transition("animate-shake")
+                }
+              >
+                <.icon name="hero-clipboard-document" class="h-3.5 w-3.5" aria-hidden="true" />
+                {gettext("Copy MB ID")}
+              </.button>
+            </div>
             <%= if @biography do %>
               <dt class="mt-4 text-sm font-medium leading-6 text-zinc-900 dark:text-zinc-400">
                 {gettext("Biography")}
diff --git a/priv/gettext/default.pot b/priv/gettext/default.pot
index 9d9239da..22741979 100644
--- a/priv/gettext/default.pot
+++ b/priv/gettext/default.pot
@@ -107,7 +107,6 @@ msgid "Logout"
 msgstr ""
 
 #: lib/music_library_web/components/record_form.ex
-#: lib/music_library_web/live/artist_live/show.ex
 #, elixir-autogen, elixir-format
 msgid "MusicBrainz ID"
 msgstr ""
@@ -227,11 +226,6 @@ msgstr ""
 msgid "You must be logged in to access this page"
 msgstr ""
 
-#: lib/music_library_web/live/artist_live/show.ex
-#, elixir-autogen, elixir-format
-msgid "Copy MusicBrainz ID to clipboard"
-msgstr ""
-
 #: lib/music_library_web/live/stats_live/index.ex
 #, elixir-autogen, elixir-format
 msgid "Scrobble activity"
@@ -1977,6 +1971,7 @@ msgid "Copy ID"
 msgstr ""
 
 #: lib/music_library_web/components/record_components.ex
+#: lib/music_library_web/live/artist_live/show.ex
 #, elixir-autogen, elixir-format
 msgid "Copy MB ID"
 msgstr ""
diff --git a/priv/gettext/en/LC_MESSAGES/default.po b/priv/gettext/en/LC_MESSAGES/default.po
index 6dcb0998..d9410928 100644
--- a/priv/gettext/en/LC_MESSAGES/default.po
+++ b/priv/gettext/en/LC_MESSAGES/default.po
@@ -107,7 +107,6 @@ msgid "Logout"
 msgstr ""
 
 #: lib/music_library_web/components/record_form.ex
-#: lib/music_library_web/live/artist_live/show.ex
 #, elixir-autogen, elixir-format
 msgid "MusicBrainz ID"
 msgstr ""
@@ -227,11 +226,6 @@ msgstr ""
 msgid "You must be logged in to access this page"
 msgstr ""
 
-#: lib/music_library_web/live/artist_live/show.ex
-#, elixir-autogen, elixir-format
-msgid "Copy MusicBrainz ID to clipboard"
-msgstr ""
-
 #: lib/music_library_web/live/stats_live/index.ex
 #, elixir-autogen, elixir-format
 msgid "Scrobble activity"
@@ -1977,6 +1971,7 @@ msgid "Copy ID"
 msgstr ""
 
 #: lib/music_library_web/components/record_components.ex
+#: lib/music_library_web/live/artist_live/show.ex
 #, elixir-autogen, elixir-format, fuzzy
 msgid "Copy MB ID"
 msgstr ""
diff --git a/test/music_library_web/live/artist_live/show_test.exs b/test/music_library_web/live/artist_live/show_test.exs
index c86a83e1..07c19603 100644
--- a/test/music_library_web/live/artist_live/show_test.exs
+++ b/test/music_library_web/live/artist_live/show_test.exs
@@ -89,7 +89,7 @@ defmodule MusicLibraryWeb.ArtistLive.ShowTest do
       |> unwrap(&render_async/1)
       |> assert_has("span", text: "United Kingdom")
       |> assert_has("span", text: "🇬🇧")
-      |> assert_has("dd", text: artist_musicbrainz_id)
+      |> assert_has("code", text: artist_musicbrainz_id)
     end
 
     test "it shows records from the collection and the wishlist", %{