Revert "Extract stats data grid component"

This reverts commit 432f09cf6f.

lib/music_library_web/live/stats_live/data_components.ex

@@ -42,45 +42,6 @@ defmodule MusicLibraryWeb.StatsLive.DataComponents do
     """
   end
 
-  attr :data, :list,
-    required: true,
-    doc: """
-      A list of tuples, where the first element is label and the second is the count.
-    """
-
-  attr :title, :string, required: true
-  attr :col_class, :string
-
-  def stats_grid(assigns) do
-    ~H"""
-    <div>
-      <h1 class="mt-5 text-base lg:text-2xl text-gray-900 dark:text-gray-200 font-semibold">
-        <%= @title %>
-      </h1>
-      <dl class={[
-        "grid",
-        @col_class,
-        "mt-5 divide-x divide-gray-200 dark:divide-slate-300/50 overflow-hidden rounded-md",
-        "bg-white dark:bg-zinc-700 shadow"
-      ]}>
-        <div :for={{format, count} <- @data} class="px-2 py-5 sm:px-4">
-          <dt class="text-sm font-medium text-gray-500 dark:text-gray-400 text-center max-sm:text-xs break-keep">
-            <%= format %>
-          </dt>
-          <dd class="mt-1 text-center">
-            <a
-              class="text-xl lg:text-2xl font-semibold hover:text-gray-500 dark:text-gray-300 dark:hover:text-gray-200"
-              href={~p"/records?query=format:#{format}"}
-            >
-              <%= count %>
-            </a>
-          </dd>
-        </div>
-      </dl>
-    </div>
-    """
-  end
-
   attr :title, :string, required: true
   attr :count, :integer, required: true
   attr :path, :string, required: true

lib/music_library_web/live/stats_live/index.ex

@@ -9,12 +9,10 @@ defmodule MusicLibraryWeb.StatsLive.Index do
   def mount(_params, _session, socket) do
     collection_count_by_format =
       Records.count_records_by_format()
-      |> Enum.map(fn {format, count} -> {Record.format_long_label(format), count} end)
       |> Enum.sort_by(fn {_format, count} -> count end, :desc)
 
     collection_count_by_type =
       Records.count_records_by_type()
-      |> Enum.map(fn {type, count} -> {Record.type_long_label(type), count} end)
       |> Enum.sort_by(fn {_type, count} -> count end, :desc)
 
     collection_count =

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

@@ -13,10 +13,44 @@
   </dl>
 </div>
 
-<.stats_grid
+<div>
-  data={@collection_count_by_format}
+  <h1 class="mt-5 text-base lg:text-2xl text-gray-900 dark:text-gray-200 font-semibold">
-  title={gettext("Formats")}
+    <%= gettext("Formats") %>
-  col_class="grid-cols-5"
+  </h1>
-/>
+  <dl class="mt-5 grid divide-gray-200 dark:divide-slate-300/50 overflow-hidden rounded-md bg-white dark:bg-zinc-700 shadow grid-cols-5 divide-x">
+    <div :for={{format, count} <- @collection_count_by_format} class="px-2 py-5 sm:px-4">
+      <dt class="text-sm font-medium text-gray-500 dark:text-gray-400 text-center max-sm:text-xs break-keep">
+        <%= Record.format_long_label(format) %>
+      </dt>
+      <dd class="mt-1 text-center">
+        <a
+          class="text-xl lg:text-2xl font-semibold hover:text-gray-500 dark:text-gray-300 dark:hover:text-gray-200"
+          href={~p"/records?query=format:#{format}"}
+        >
+          <%= count %>
+        </a>
+      </dd>
+    </div>
+  </dl>
+</div>
 
-<.stats_grid data={@collection_count_by_type} title={gettext("Types")} col_class="grid-cols-6" />
+<div>
+  <h1 class="mt-5 text-base lg:text-2xl text-gray-900 dark:text-gray-200 font-semibold">
+    <%= gettext("Types") %>
+  </h1>
+  <dl class="mt-5 grid divide-gray-200 dark:divide-slate-300/50 overflow-hidden rounded-md bg-white dark:bg-zinc-700 shadow grid-cols-6 divide-x">
+    <div :for={{type, count} <- @collection_count_by_type} class="px-2 py-5 sm:px-4">
+      <dt class="text-sm font-medium text-gray-500 dark:text-gray-400 text-center max-sm:text-xs break-keep">
+        <%= Record.type_long_label(type) %>
+      </dt>
+      <dd class="mt-1 text-center">
+        <a
+          class="text-xl lg:text-2xl font-semibold hover:text-gray-500 dark:text-gray-300 dark:hover:text-gray-200"
+          href={~p"/records?query=type:#{type}"}
+        >
+          <%= count %>
+        </a>
+      </dd>
+    </div>
+  </dl>
+</div>

priv/gettext/default.pot

@@ -269,7 +269,7 @@ msgid "Something went wrong!"
 msgstr ""
 
 #: lib/music_library_web/components/layouts/app.html.heex:7
-#: lib/music_library_web/live/stats_live/index.ex:30
+#: lib/music_library_web/live/stats_live/index.ex:28
 #, elixir-autogen, elixir-format
 msgid "Stats"
 msgstr ""
@@ -302,7 +302,7 @@ msgstr ""
 msgid "Type"
 msgstr ""
 
-#: lib/music_library_web/live/stats_live/index.html.heex:22
+#: lib/music_library_web/live/stats_live/index.html.heex:39
 #, elixir-autogen, elixir-format
 msgid "Types"
 msgstr ""

test/music_library_web/live/stats_index_test.exs

@@ -35,15 +35,15 @@ defmodule MusicLibraryWeb.StatsIndexTest do
       collection
       |> Enum.frequencies_by(& &1.format)
       |> Enum.each(fn {format, count} ->
-        assert html =~ "#{count}\n"
+        assert html =~ "\n#{count}\n"
-        assert html =~ "#{Record.format_long_label(format)}\n"
+        assert html =~ "\n#{Record.format_long_label(format)}\n"
       end)
 
       collection
       |> Enum.frequencies_by(& &1.type)
       |> Enum.each(fn {type, count} ->
-        assert html =~ "#{count}\n"
+        assert html =~ "\n#{count}\n"
-        assert html =~ "#{Record.type_long_label(type)}\n"
+        assert html =~ "\n#{Record.type_long_label(type)}\n"
       end)
     end