Serve local cover images

lib/music_library_web/live/record_live/form_component.ex

@@ -36,7 +36,7 @@ defmodule MusicLibraryWeb.RecordLive.FormComponent do
           label="Genres"
           options={[{"Option 1", "option1"}, {"Option 2", "option2"}]}
         />
-        <.input field={@form[:image]} type="text" label="Image" />
+        <.input field={@form[:image_url]} type="text" label="Image url" />
         <:actions>
           <.button phx-disable-with="Saving...">Save Record</.button>
         </:actions>

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

@@ -13,7 +13,7 @@
   row_click={fn {_id, record} -> JS.navigate(~p"/records/#{record}") end}
 >
   <:col :let={{_id, record}} label="Image">
-    <img class="max-w-16" src={record.image} alt={record.title} />
+    <img class="max-w-16" src={~p"/images/#{record.id}"} alt={record.title} />
   </:col>
   <:col :let={{_id, record}} label="Artists">
     <%= Enum.map(record.artists, fn a -> a.name end) %>

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

@@ -15,7 +15,9 @@
   <:item title="Musicbrainz"><%= @record.musicbrainz_id %></:item>
   <:item title="Year"><%= @record.year %></:item>
   <:item title="Genres"><%= @record.genres %></:item>
-  <:item title="Image"><%= @record.image %></:item>
+  <:item title="Image">
+    <img class="max-w-32" src={~p"/images/#{@record.id}"} alt={@record.title} />
+  </:item>
 </.list>
 
 <.back navigate={~p"/records"}>Back to records</.back>