Display online stores favicon URLs via Google API

lib/music_library/online_store_templates.ex

@@ -75,4 +75,9 @@ defmodule MusicLibrary.OnlineStoreTemplates do
     |> String.replace("{title}", URI.encode_www_form(record.title))
     |> String.replace("{format}", URI.encode_www_form(format_string))
   end
+
+  def favicon_url(template) do
+    uri = URI.parse(template.url_template)
+    "https://www.google.com/s2/favicons?domain=#{uri.host}&sz=16"
+  end
 end

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

@@ -29,7 +29,12 @@
       class="flex items-center justify-between py-5"
     >
       <div class="min-w-0">
-        <div class="flex items-start gap-x-3">
+        <div class="flex items-center gap-x-2">
+          <img
+            src={MusicLibrary.OnlineStoreTemplates.favicon_url(template)}
+            alt={template.name}
+            loading="lazy"
+          />
           <p class="text-sm font-semibold text-gray-900 dark:text-white">
             {template.name}
           </p>

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

@@ -281,7 +281,13 @@
         :for={template <- @online_store_templates}
         class="flex items-center justify-between py-2 px-3 bg-gray-50 dark:bg-gray-800 rounded-lg"
       >
-        <span class="text-sm font-medium text-gray-900 dark:text-white">
+        <img
+          class="mr-2"
+          src={MusicLibrary.OnlineStoreTemplates.favicon_url(template)}
+          alt={template.name}
+          loading="lazy"
+        />
+        <span class="text-sm font-medium text-gray-900 dark:text-white grow">
           {template.name}
         </span>
         <.button