From 3cee739fc9a0395b697844df73bb67a4f9f54334 Mon Sep 17 00:00:00 2001
From: Claudio Ortolina <cloud8421@gmail.com>
Date: Sun, 27 Apr 2025 21:39:53 +0100
Subject: [PATCH] Render artist image in artist page

---
 lib/music_library_web/live/artist_live/show.html.heex | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/lib/music_library_web/live/artist_live/show.html.heex b/lib/music_library_web/live/artist_live/show.html.heex
index f5de427d..9cf1077c 100644
--- a/lib/music_library_web/live/artist_live/show.html.heex
+++ b/lib/music_library_web/live/artist_live/show.html.heex
@@ -3,6 +3,7 @@
     <h1 class="font-semibold text-2xl leading-5 text-zinc-700 dark:text-zinc-300 text-wrap">
       {@artist.name}
     </h1>
+
     <div class="mt-4 flex items-center justify-between">
       <.async_result :let={artist_info} assign={@artist_info}>
         <:loading>
@@ -60,11 +61,17 @@
     </div>
   </header>
 
-  <div class="mt-4 grid md:grid-cols-5 md:gap-2">
+  <div class="mt-4 grid md:grid-cols-5 md:gap-4">
     <div class="col-span-5 md:col-span-1 mt-4 order-2 md:order-1">
       <h2 class="font-semibold text-base sm:text-lg leading-5 text-zinc-700 dark:text-zinc-300">
         {gettext("Meta")}
       </h2>
+      <img
+        class="w-full rounded-md shadow-sm mt-4"
+        src={~p"/artists/#{@artist.musicbrainz_id}/image"}
+        alt={@artist.name}
+        onerror={"this.src = '" <> ~p"/images/cover-not-found.png" <> "';"}
+      />
       <.async_result :let={artist_info} assign={@artist_info}>
         <:loading>
           <div class="mt-4 text-sm leading-5 text-zinc-500 dark:text-zinc-400">