Improve records#show information structure

lib/music_library_web/live/record_live/show.ex

@@ -18,4 +18,8 @@ defmodule MusicLibraryWeb.RecordLive.Show do
 
   defp page_title(:show), do: "Show Record"
   defp page_title(:edit), do: "Edit Record"
+
+  defp musicbrainz_url(record) do
+    "https://musicbrainz.org/release-group/#{record.musicbrainz_id}"
+  end
 end

lib/music_library_web/live/record_live/show.html.heex

@@ -1,6 +1,6 @@
 <.header>
-  Record <%= @record.id %>
+  <%= @record.title %>
-  <:subtitle>This is a record record from your database.</:subtitle>
+  <:subtitle><%= Enum.map(@record.artists, fn a -> a.name end) %></:subtitle>
   <:actions>
     <.link patch={~p"/records/#{@record}/show/edit"} phx-click={JS.push_focus()}>
       <.button>Edit record</.button>
@@ -10,11 +10,13 @@
 
 <.list>
   <:item title="Type"><%= @record.type %></:item>
-  <:item title="Artists"><%= Enum.map(@record.artists, fn a -> a.name end) %></:item>
+  <:item title="Musicbrainz ID">
-  <:item title="Title"><%= @record.title %></:item>
+    <a href={musicbrainz_url(@record)}>
-  <:item title="Musicbrainz"><%= @record.musicbrainz_id %></:item>
+      <%= @record.musicbrainz_id %>
+    </a>
+  </:item>
   <:item title="Year"><%= @record.year %></:item>
-  <:item title="Genres"><%= @record.genres %></:item>
+  <:item title="Genres"><%= Enum.join(@record.genres, ", ") %></:item>
   <:item title="Image">
     <img class="max-w-32" src={~p"/images/#{@record.id}"} alt={@record.title} />
   </:item>