Can search and paginate records

lib/music_library_web/live/record_live/index.ex

@@ -4,17 +4,28 @@ defmodule MusicLibraryWeb.RecordLive.Index do
 
   alias MusicLibrary.Records
 
+  @default_records_list_params %{
+    query: "",
+    page: 1,
+    page_size: 20
+  }
+
   @impl true
   def mount(params, _session, socket) do
-    total_records = Records.count_records()
+    query = params["query"] || ""
+    total_records = Records.search_records_count(query)
 
-    pagination_params = get_pagination_params(params, total_records)
-    offset = page_to_offset(pagination_params.page, pagination_params.page_size)
-    records = Records.list_records(limit: pagination_params.page_size, offset: offset)
+    record_list_params =
+      @default_records_list_params
+      |> merge_query(params["query"])
+      |> merge_pagination(params, total_records)
+
+    offset = page_to_offset(record_list_params.page, record_list_params.page_size)
+    records = Records.search_records(query, limit: record_list_params.page_size, offset: offset)
 
     {:ok,
      socket
-     |> assign(:pagination_params, pagination_params)
+     |> assign(:record_list_params, record_list_params)
      |> stream(:records, records)}
   end
 
@@ -41,19 +52,20 @@ defmodule MusicLibraryWeb.RecordLive.Index do
       |> assign(:page_title, "Listing Records")
       |> assign(:record, nil)
 
-    total_records = Records.count_records()
-    pagination_params = get_pagination_params(params, total_records)
+    query = params["query"] || socket.assigns.record_list_params.query
+    total_records = Records.search_records_count(query)
 
-    if pagination_params != socket.assigns.pagination_params do
-      offset = page_to_offset(pagination_params.page, pagination_params.page_size)
-      records = Records.list_records(limit: pagination_params.page_size, offset: offset)
+    record_list_params =
+      socket.assigns.record_list_params
+      |> merge_query(params["query"])
+      |> merge_pagination(params, total_records)
 
-      new_socket
-      |> assign(:pagination_params, pagination_params)
-      |> stream(:records, records, reset: true)
-    else
-      new_socket
-    end
+    offset = page_to_offset(record_list_params.page, record_list_params.page_size)
+    records = Records.search_records(query, limit: record_list_params.page_size, offset: offset)
+
+    new_socket
+    |> assign(:record_list_params, record_list_params)
+    |> stream(:records, records, reset: true)
   end
 
   @impl true
@@ -73,6 +85,16 @@ defmodule MusicLibraryWeb.RecordLive.Index do
     {:noreply, stream_delete(socket, :records, record)}
   end
 
+  def handle_event("search", %{"query" => query}, socket) do
+    qs =
+      @default_records_list_params
+      |> Map.put(:query, query)
+      |> Map.take([:query, :page, :page_size])
+      |> URI.encode_query()
+
+    {:noreply, push_patch(socket, to: ~s"/records?#{qs}")}
+  end
+
   def handle_event("import", %{"id" => musicbrainz_id}, socket) do
     case Records.import_from_musicbrainz(musicbrainz_id) do
       {:ok, record} ->
@@ -94,6 +116,28 @@ defmodule MusicLibraryWeb.RecordLive.Index do
     end
   end
 
+  defp merge_query(record_list_params, nil), do: record_list_params
+
+  defp merge_query(record_list_params, query) do
+    Map.put(record_list_params, :query, query)
+  end
+
+  defp merge_pagination(record_list_params, params, total_records) do
+    record_list_params
+    |> Map.put(:page, parse_int_or_default(params["page"], record_list_params.page))
+    |> Map.put(
+      :page_size,
+      parse_int_or_default(params["page_size"], record_list_params.page_size)
+    )
+    |> Map.put(:total_entries, total_records)
+  end
+
+  defp parse_int_or_default(nil, default), do: default
+
+  defp parse_int_or_default(value, _default) when is_binary(value) do
+    String.to_integer(value)
+  end
+
   defp notify_parent(msg), do: send(self(), {__MODULE__, msg})
 
   defp musicbrainz_url(record) do

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

@@ -1,11 +1,22 @@
-<.header>
-  Listing Records
-  <:actions>
+<header class="gap-6 mb-2">
+  <h1 class="text-lg font-semibold leading-8 text-zinc-800">All Records</h1>
+  <div class="flex items-center justify-between gap-6 mb-2 mt-2">
+    <form class="w-1/2" for={@record_list_params.query} phx-submit="search" phx-change="search">
+      <input
+        type="search"
+        class="w-full rounded-lg text-zinc-900 focus:ring-0 sm:text-sm sm:leading-6"
+        id="query"
+        name="query"
+        value={@record_list_params.query}
+        placeholder="Search"
+        phx-debounce="500"
+      />
+    </form>
     <.link patch={~p"/records/import"}>
       <.button>Import from MusicBrainz</.button>
     </.link>
-  </:actions>
-</.header>
+  </div>
+</header>
 
 <.table
   id="records"
@@ -62,4 +73,4 @@
   />
 </.modal>
 
-<.pagination pagination_params={@pagination_params} />
+<.pagination pagination_params={@record_list_params} />