[Enhancement] Improve handling of large media collections (#272)

* Added compound index for updated media item table for performance

* Improved large number display on homepage

* Improved UI around large numbers

* Centered the content of homepage data cards

* Renamed migration

lib/pinchflat_web/controllers/sources/source_html/index.html.heex

@@ -19,11 +19,12 @@
           </.subtle_link>
         </:col>
         <:col :let={source} label="Type"><%= source.collection_type %></:col>
-        <:col :let={source} label="Pending"><%= source.pending_count %></:col>
-        <:col :let={source} label="Downloaded"><%= source.downloaded_count %></:col>
+        <:col :let={source} label="Pending"><.localized_number number={source.pending_count} /></:col>
+        <:col :let={source} label="Downloaded"><.localized_number number={source.downloaded_count} /></:col>
         <:col :let={source} label="Retention">
           <%= if source.retention_period_days && source.retention_period_days > 0 do %>
-            <%= source.retention_period_days %> day(s)
+            <.localized_number number={source.retention_period_days} />
+            <.pluralize count={source.retention_period_days} word="day" />
           <% else %>
             <span class="text-lg">∞</span>
           <% end %>

lib/pinchflat_web/controllers/sources/source_html/media_item_table_live.ex

@@ -23,7 +23,9 @@ defmodule Pinchflat.Sources.MediaItemTableLive do
       <header class="flex justify-between items-center mb-4">
         <span class="flex items-center">
           <.icon_button icon_name="hero-arrow-path" class="h-10 w-10" phx-click="reload_page" tooltip="Refresh" />
-          <span class="ml-2">Showing <%= length(@records) %> of <%= @filtered_record_count %></span>
+          <span class="ml-2">
+            Showing <.localized_number number={length(@records)} /> of <.localized_number number={@filtered_record_count} />
+          </span>
         </span>
         <div class="bg-meta-4 rounded-md">
           <div class="relative">
@@ -49,12 +51,12 @@ defmodule Pinchflat.Sources.MediaItemTableLive do
             <%= StringUtils.truncate(media_item.title, 50) %>
           </.subtle_link>
         </:col>
-        <:col :let={media_item} label="Upload Date">
-          <%= DateTime.to_date(media_item.uploaded_at) %>
-        </:col>
         <:col :let={media_item} :if={@media_state == "other"} label="Manually Ignored?">
           <.icon name={if media_item.prevent_download, do: "hero-check", else: "hero-x-mark"} />
         </:col>
+        <:col :let={media_item} label="Upload Date">
+          <%= DateTime.to_date(media_item.uploaded_at) %>
+        </:col>
         <:col :let={media_item} label="" class="flex justify-end">
           <.icon_link href={~p"/sources/#{@source.id}/media/#{media_item.id}/edit"} icon="hero-pencil-square" class="mr-4" />
         </:col>
@@ -117,14 +119,40 @@ defmodule Pinchflat.Sources.MediaItemTableLive do
     {:noreply, assign(socket, new_assigns)}
   end
 
+  defp fetch_pagination_attributes(base_query, page, ""), do: fetch_pagination_attributes(base_query, page, nil)
+
+  defp fetch_pagination_attributes(base_query, page, nil) do
+    total_record_count = Repo.aggregate(base_query, :count, :id)
+    total_pages = max(ceil(total_record_count / @limit), 1)
+    page = NumberUtils.clamp(page, 1, total_pages)
+
+    records =
+      fetch_records(base_query, page)
+      |> order_by(desc: :uploaded_at)
+      |> Repo.all()
+
+    %{
+      page: page,
+      total_pages: total_pages,
+      records: records,
+      search_term: nil,
+      total_record_count: total_record_count,
+      filtered_record_count: total_record_count
+    }
+  end
+
   defp fetch_pagination_attributes(base_query, page, search_term) do
-    filtered_base_query = filter_base_query(base_query, search_term)
+    filtered_base_query = filtered_base_query(base_query, search_term)
 
     total_record_count = Repo.aggregate(base_query, :count, :id)
     filtered_record_count = Repo.aggregate(filtered_base_query, :count, :id)
     total_pages = max(ceil(filtered_record_count / @limit), 1)
     page = NumberUtils.clamp(page, 1, total_pages)
-    records = fetch_records(filtered_base_query, page)
+
+    records =
+      fetch_records(filtered_base_query, page)
+      |> order_by(desc: fragment("rank"), desc: :uploaded_at)
+      |> Repo.all()
 
     %{
       page: page,
@@ -142,39 +170,41 @@ defmodule Pinchflat.Sources.MediaItemTableLive do
     base_query
     |> limit(^@limit)
     |> offset(^offset)
-    |> Repo.all()
   end
 
   defp generate_base_query(source, "pending") do
     MediaQuery.new()
+    |> select(^select_fields())
     |> MediaQuery.require_assoc(:media_profile)
-    |> MediaQuery.require_assoc(:media_items_search_index)
     |> where(^dynamic(^MediaQuery.for_source(source) and ^MediaQuery.pending()))
-    |> order_by(desc: fragment("rank"), desc: :uploaded_at)
   end
 
   defp generate_base_query(source, "downloaded") do
     MediaQuery.new()
-    |> MediaQuery.require_assoc(:media_items_search_index)
+    |> select(^select_fields())
     |> where(^dynamic(^MediaQuery.for_source(source) and ^MediaQuery.downloaded()))
-    |> order_by(desc: fragment("rank"), desc: :uploaded_at)
   end
 
   defp generate_base_query(source, "other") do
     MediaQuery.new()
+    |> select(^select_fields())
     |> MediaQuery.require_assoc(:media_profile)
-    |> MediaQuery.require_assoc(:media_items_search_index)
     |> where(
       ^dynamic(
         ^MediaQuery.for_source(source) and
           (not (^MediaQuery.downloaded()) and not (^MediaQuery.pending()))
       )
     )
-    |> order_by(desc: fragment("rank"), desc: :uploaded_at)
   end
 
-  defp filter_base_query(base_query, search_term) do
+  defp filtered_base_query(base_query, search_term) do
     base_query
+    |> MediaQuery.require_assoc(:media_items_search_index)
     |> where(^MediaQuery.matches_search_term(search_term))
   end
+
+  # Selecting only what we need GREATLY speeds up queries on large tables
+  defp select_fields do
+    [:id, :title, :uploaded_at, :prevent_download]
+  end
 end

lib/pinchflat_web/controllers/sources/source_html/source_form.html.heex

@@ -95,7 +95,8 @@
       type="number"
       label="Retention Period (days)"
       min="0"
-      help="Days between when media is *downloaded* and when it's deleted. Leave blank to keep media indefinitely"
+      help="Days between when media is <em>downloaded</em> and when it's deleted. Leave blank to keep media indefinitely"
+      html_help={true}
     />
 
     <section x-show="advancedMode">