Start making it more robust

- Use structured data for search/render
- Start testing component
- Start testing domain logic

lib/music_brainz/release_search_result.ex

@@ -0,0 +1,39 @@
+defmodule MusicBrainz.ReleaseSearchResult do
+  @enforce_keys [:id, :title, :release_group, :artists, :date, :barcode, :media]
+  defstruct [:id, :title, :release_group, :artists, :date, :barcode, :media]
+
+  alias MusicBrainz.ReleaseGroup
+
+  def from_api_response(r) do
+    %__MODULE__{
+      id: r["id"],
+      title: r["title"],
+      release_group: parse_release_group(r["release-group"]),
+      artists:
+        r["artist-credit"]
+        |> Enum.map(fn ac -> ac["artist"]["name"] end)
+        |> Enum.join(", "),
+      date: r["date"],
+      barcode: r["barcode"],
+      media: parse_media(r["media"])
+    }
+  end
+
+  defp parse_release_group(rg) do
+    %{
+      id: rg["id"],
+      type: ReleaseGroup.parse_type(rg["primary-type"]),
+      title: rg["title"]
+    }
+  end
+
+  defp parse_media(media) do
+    Enum.map(media, fn m ->
+      %{
+        format: m["format"],
+        track_count: m["track-count"],
+        disc_count: m["disc-count"]
+      }
+    end)
+  end
+end

lib/music_library/records.ex

@@ -142,7 +142,8 @@ defmodule MusicLibrary.Records do
   def search_release_by_barcode(barcode) do
     case music_brainz_config().api.search_release_by_barcode(barcode, music_brainz_config()) do
       {:ok, releases} ->
-        {:ok, releases}
+        {:ok,
+         Enum.map(releases, fn r -> MusicBrainz.ReleaseSearchResult.from_api_response(r) end)}
 
       error ->
         error

lib/music_library_web/live/record_live/barcode_scanner_component.ex

@@ -17,14 +17,21 @@ defmodule MusicLibraryWeb.RecordLive.BarcodeScannerComponent do
   @impl true
   def render(assigns) do
     ~H"""
-    <div>
-      <h1>Barcode Scan</h1>
-      <video id="camera-view" phx-hook="BarcodeScanner"></video>
+    <div id="barcode-scanner" phx-hook="BarcodeScanner" phx-target={@myself}>
+      <header>
+        <h1 class="text-sm font-medium leading-6 text-zinc-700 dark:text-zinc-400">
+          {gettext("Scan one or more barcodes")}
+        </h1>
+      </header>
+      <div>
+        <p>{@camera}</p>
+        <video id="camera-preview"></video>
+      </div>
       <ul>
         <li :for={release <- assigns.releases}>
-          <span>{release["id"]}</span>
-          <span>{release["barcode"]}</span>
-          <span>{release["title"]}</span>
+          <span>{release.id}</span>
+          <span>{release.barcode}</span>
+          <span>{release.title}</span>
         </li>
       </ul>
     </div>
@@ -32,17 +39,17 @@ defmodule MusicLibraryWeb.RecordLive.BarcodeScannerComponent do
   end
 
   @impl true
-  def handle_event("camera:allowed", _params, socket) do
+  def handle_event("camera_allowed", _params, socket) do
     Logger.debug(fn -> "Camera access allowed" end)
     {:noreply, assign(socket, camera: :allowed)}
   end
 
-  def handle_event("camera:denied", _params, socket) do
+  def handle_event("camera_denied", _params, socket) do
     Logger.debug(fn -> "Camera access denied" end)
     {:noreply, assign(socket, camera: :denied)}
   end
 
-  def handle_event("barcode:scanned", %{"number" => number}, socket) do
+  def handle_event("barcode_scanned", %{"number" => number}, socket) do
     Logger.debug(fn -> "Scanned barcode #{number}" end)
 
     {:ok, releases} =