cloud/music_library
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Extract stats data grid component

Browse Source
This commit is contained in:
Claudio Ortolina
2024-10-30 08:37:49 +00:00
parent f23031821c
commit 432f09cf6f
5 changed files with 259 additions and 247 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/music_library_web/live/stats_live/data_components.ex
+42
View File
@@ -0,0 +1,42 @@
defmodule MusicLibraryWeb.StatsLive.DataComponents do
use MusicLibraryWeb, :live_component
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
end
lib/music_library_web/live/stats_live/index.ex
+4
View File
@@ -1,16 +1,20 @@
defmodule MusicLibraryWeb.StatsLive.Index do
use MusicLibraryWeb, :live_view
import MusicLibraryWeb.StatsLive.DataComponents
alias MusicLibrary.{Records, Wishlist}
alias Records.Record
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
+6 -40
View File
@@ -65,44 +65,10 @@
</dl>
</div>
<div>
<h1 class="mt-5 text-base lg:text-2xl text-gray-900 dark:text-gray-200 font-semibold">
<%= gettext("Formats") %>
</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_format}
title={gettext("Formats")}
col_class="grid-cols-5"
/>
<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>
<.stats_grid data={@collection_count_by_type} title={gettext("Types")} col_class="grid-cols-6" />
priv/gettext/default.pot
+203 -203
View File
@@ -16,89 +16,32 @@ msgstr ""
msgid "Actions"
msgstr ""
#: lib/music_library_web/live/record_live/index.html.heex:166
#: lib/music_library_web/live/record_live/show.html.heex:9
#: lib/music_library_web/live/wishlist_live/index.html.heex:176
#: lib/music_library_web/live/wishlist_live/show.html.heex:9
#, elixir-autogen, elixir-format
msgid "Are you sure?"
msgstr ""
#: lib/music_library_web/components/core_components.ex:169
#, elixir-autogen, elixir-format
msgid "Attempting to reconnect"
msgstr ""
#: lib/music_library_web/components/core_components.ex:160
#: lib/music_library_web/live/record_live/show.html.heex:95
#, elixir-autogen, elixir-format
msgid "Error!"
msgid "Back to records"
msgstr ""
#: lib/music_library_web/components/core_components.ex:181
#: lib/music_library_web/live/wishlist_live/show.html.heex:87
#, elixir-autogen, elixir-format
msgid "Hang in there while we get back on track"
msgid "Back to wishlist"
msgstr ""
#: lib/music_library_web/controllers/session_html/new.html.heex:11
#: lib/music_library_web/live/stats_live/index.html.heex:3
#, elixir-autogen, elixir-format
msgid "Password"
msgstr ""
#: lib/music_library_web/components/core_components.ex:176
#, elixir-autogen, elixir-format
msgid "Something went wrong!"
msgstr ""
#: lib/music_library_web/components/core_components.ex:159
#, elixir-autogen, elixir-format
msgid "Success!"
msgstr ""
#: lib/music_library_web/components/core_components.ex:164
#, elixir-autogen, elixir-format
msgid "We can't find the internet"
msgstr ""
#: lib/music_library_web/controllers/session_html/new.html.heex:5
#, elixir-autogen, elixir-format
msgid "Welcome to your Music Library"
msgstr ""
#: lib/music_library_web/components/core_components.ex:85
#: lib/music_library_web/components/core_components.ex:139
#, elixir-autogen, elixir-format
msgid "close"
msgstr ""
#: lib/music_library_web/controllers/session_controller.ex:19
#, elixir-autogen, elixir-format
msgid "Invalid password"
msgstr ""
#: lib/music_library_web/plug/require_login.ex:17
#, elixir-autogen, elixir-format
msgid "You must be logged in to access this page"
msgstr ""
#: lib/music_library_web/components/layouts/app.html.heex:13
#: lib/music_library_web/live/record_live/index.ex:71
#, elixir-autogen, elixir-format
msgid "Collection"
msgstr ""
#: lib/music_library_web/components/layouts/app.html.heex:25
#, elixir-autogen, elixir-format
msgid "Logout"
msgstr ""
#: lib/music_library_web/components/layouts/app.html.heex:7
#: lib/music_library_web/live/stats_live/index.ex:26
#, elixir-autogen, elixir-format
msgid "Stats"
msgstr ""
#: lib/music_library_web/components/pagination.ex:48
#: lib/music_library_web/components/pagination.ex:111
#, elixir-autogen, elixir-format
msgid "Next"
msgstr ""
#: lib/music_library_web/components/pagination.ex:35
#: lib/music_library_web/components/pagination.ex:133
#, elixir-autogen, elixir-format
msgid "Previous"
msgid "Basics"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:35
@@ -107,75 +50,17 @@ msgstr ""
msgid "Choose a value"
msgstr ""
#: lib/music_library_web/components/layouts/app.html.heex:13
#: lib/music_library_web/live/record_live/index.ex:71
#, elixir-autogen, elixir-format
msgid "Collection"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:55
#, elixir-autogen, elixir-format
msgid "Cover art"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:41
#, elixir-autogen, elixir-format
msgid "Format"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:61
#, elixir-autogen, elixir-format
msgid "No cover selected"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:51
#, elixir-autogen, elixir-format
msgid "Purchased at"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:117
#: lib/music_library_web/live/wishlist_live/index.ex:129
#, elixir-autogen, elixir-format
msgid "Record updated successfully"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:46
#, elixir-autogen, elixir-format
msgid "Release"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:72
#, elixir-autogen, elixir-format
msgid "Save"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:72
#, elixir-autogen, elixir-format
msgid "Saving..."
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:34
#, elixir-autogen, elixir-format
msgid "Type"
msgstr ""
#: lib/music_library_web/live/record_live/import_component.ex:41
#, elixir-autogen, elixir-format
msgid "No results"
msgstr ""
#: lib/music_library_web/live/record_live/import_component.ex:23
#, elixir-autogen, elixir-format
msgid "Search for a record on MusicBrainz"
msgstr ""
#: lib/music_library_web/live/record_live/import_component.ex:24
#, elixir-autogen, elixir-format
msgid "Search for records"
msgstr ""
#: lib/music_library_web/live/record_live/index.html.heex:166
#: lib/music_library_web/live/record_live/show.html.heex:9
#: lib/music_library_web/live/wishlist_live/index.html.heex:176
#: lib/music_library_web/live/wishlist_live/show.html.heex:9
#, elixir-autogen, elixir-format
msgid "Are you sure?"
msgstr ""
#: lib/music_library_web/live/record_live/index.html.heex:168
#: lib/music_library_web/live/record_live/show.html.heex:12
#: lib/music_library_web/live/wishlist_live/index.html.heex:178
@@ -202,6 +87,32 @@ msgstr ""
msgid "Error importing record"
msgstr ""
#: lib/music_library_web/components/core_components.ex:160
#, elixir-autogen, elixir-format
msgid "Error!"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:41
#, elixir-autogen, elixir-format
msgid "Format"
msgstr ""
#: lib/music_library_web/live/stats_live/index.html.heex:70
#, elixir-autogen, elixir-format
msgid "Formats"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:49
#: lib/music_library_web/live/wishlist_live/show.html.heex:49
#, elixir-autogen, elixir-format
msgid "Genres"
msgstr ""
#: lib/music_library_web/components/core_components.ex:181
#, elixir-autogen, elixir-format
msgid "Hang in there while we get back on track"
msgstr ""
#: lib/music_library_web/live/record_live/index.html.heex:27
#: lib/music_library_web/live/wishlist_live/index.html.heex:27
#, elixir-autogen, elixir-format
@@ -214,6 +125,54 @@ msgstr ""
msgid "Import from MusicBrainz"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:75
#: lib/music_library_web/live/wishlist_live/show.html.heex:67
#, elixir-autogen, elixir-format
msgid "Inserted at"
msgstr ""
#: lib/music_library_web/controllers/session_controller.ex:19
#, elixir-autogen, elixir-format
msgid "Invalid password"
msgstr ""
#: lib/music_library_web/live/stats_live/index.html.heex:17
#, elixir-autogen, elixir-format
msgid "Latest purchase"
msgstr ""
#: lib/music_library_web/controllers/session_html/new.html.heex:44
#, elixir-autogen, elixir-format
msgid "Login"
msgstr ""
#: lib/music_library_web/components/layouts/app.html.heex:25
#, elixir-autogen, elixir-format
msgid "Logout"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:57
#: lib/music_library_web/live/wishlist_live/show.html.heex:57
#, elixir-autogen, elixir-format
msgid "MusicBrainz ID"
msgstr ""
#: lib/music_library_web/components/pagination.ex:48
#: lib/music_library_web/components/pagination.ex:111
#, elixir-autogen, elixir-format
msgid "Next"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:61
#, elixir-autogen, elixir-format
msgid "No cover selected"
msgstr ""
#: lib/music_library_web/live/record_live/import_component.ex:41
#, elixir-autogen, elixir-format
msgid "No results"
msgstr ""
#: lib/music_library_web/live/record_live/import_component.ex:76
#: lib/music_library_web/live/record_live/index.html.heex:99
#: lib/music_library_web/live/wishlist_live/index.html.heex:99
@@ -221,18 +180,75 @@ msgstr ""
msgid "Open options"
msgstr ""
#: lib/music_library_web/controllers/session_html/new.html.heex:11
#, elixir-autogen, elixir-format
msgid "Password"
msgstr ""
#: lib/music_library_web/components/pagination.ex:35
#: lib/music_library_web/components/pagination.ex:133
#, elixir-autogen, elixir-format
msgid "Previous"
msgstr ""
#: lib/music_library_web/live/wishlist_live/index.html.heex:167
#, elixir-autogen, elixir-format
msgid "Purchase"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:51
#, elixir-autogen, elixir-format
msgid "Purchased at"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:67
#, elixir-autogen, elixir-format
msgid "Purchased on"
msgstr ""
#: lib/music_library_web/live/record_live/index.ex:110
#: lib/music_library_web/live/wishlist_live/index.ex:107
#, elixir-autogen, elixir-format
msgid "Record imported successfully"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:117
#: lib/music_library_web/live/wishlist_live/index.ex:129
#, elixir-autogen, elixir-format
msgid "Record updated successfully"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:46
#, elixir-autogen, elixir-format
msgid "Release"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:72
#, elixir-autogen, elixir-format
msgid "Save"
msgstr ""
#: lib/music_library_web/live/record_live/form_component.ex:72
#, elixir-autogen, elixir-format
msgid "Saving..."
msgstr ""
#: lib/music_library_web/live/record_live/index.html.heex:20
#: lib/music_library_web/live/wishlist_live/index.html.heex:20
#, elixir-autogen, elixir-format
msgid "Search"
msgstr ""
#: lib/music_library_web/live/record_live/import_component.ex:23
#, elixir-autogen, elixir-format
msgid "Search for a record on MusicBrainz"
msgstr ""
#: lib/music_library_web/live/record_live/import_component.ex:24
#, elixir-autogen, elixir-format
msgid "Search for records"
msgstr ""
#: lib/music_library_web/live/record_live/index.html.heex:137
#: lib/music_library_web/live/record_live/show.ex:49
#: lib/music_library_web/live/wishlist_live/index.html.heex:137
@@ -247,6 +263,22 @@ msgstr ""
msgid "Showing <b>%{visible}</b> of <b>%{total}</b> records"
msgstr ""
#: lib/music_library_web/components/core_components.ex:176
#, elixir-autogen, elixir-format
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
#, elixir-autogen, elixir-format
msgid "Stats"
msgstr ""
#: lib/music_library_web/components/core_components.ex:159
#, elixir-autogen, elixir-format
msgid "Success!"
msgstr ""
#: lib/music_library_web/live/record_live/index.ex:17
#: lib/music_library_web/live/record_live/show.ex:19
#: lib/music_library_web/live/wishlist_live/index.ex:18
@@ -255,61 +287,6 @@ msgstr ""
msgid "The application has been updated, please reload."
msgstr ""
#: lib/music_library_web/live/record_live/index.html.heex:147
#: lib/music_library_web/live/wishlist_live/index.html.heex:147
#, elixir-autogen, elixir-format
msgid "View on MusicBrainz"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:95
#, elixir-autogen, elixir-format
msgid "Back to records"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:49
#: lib/music_library_web/live/wishlist_live/show.html.heex:49
#, elixir-autogen, elixir-format
msgid "Genres"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:75
#: lib/music_library_web/live/wishlist_live/show.html.heex:67
#, elixir-autogen, elixir-format
msgid "Inserted at"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:83
#: lib/music_library_web/live/wishlist_live/show.html.heex:75
#, elixir-autogen, elixir-format
msgid "Updated at"
msgstr ""
#: lib/music_library_web/live/wishlist_live/show.html.heex:87
#, elixir-autogen, elixir-format
msgid "Back to wishlist"
msgstr ""
#: lib/music_library_web/live/wishlist_live/index.html.heex:167
#, elixir-autogen, elixir-format
msgid "Purchase"
msgstr ""
#: lib/music_library_web/components/layouts/app.html.heex:19
#: lib/music_library_web/live/wishlist_live/index.ex:72
#, elixir-autogen, elixir-format
msgid "Wishlist"
msgstr ""
#: lib/music_library_web/controllers/session_html/new.html.heex:44
#, elixir-autogen, elixir-format
msgid "Login"
msgstr ""
#: lib/music_library_web/live/stats_live/index.html.heex:17
#, elixir-autogen, elixir-format
msgid "Latest purchase"
msgstr ""
#: lib/music_library_web/live/stats_live/index.html.heex:38
#, elixir-autogen, elixir-format
msgid "Total collection"
@@ -320,28 +297,51 @@ msgstr ""
msgid "Total wishlist"
msgstr ""
#: lib/music_library_web/live/stats_live/index.html.heex:3
#: lib/music_library_web/live/record_live/form_component.ex:34
#, elixir-autogen, elixir-format
msgid "Basics"
msgid "Type"
msgstr ""
#: lib/music_library_web/live/stats_live/index.html.heex:70
#, elixir-autogen, elixir-format
msgid "Formats"
msgstr ""
#: lib/music_library_web/live/stats_live/index.html.heex:91
#: lib/music_library_web/live/stats_live/index.html.heex:74
#, elixir-autogen, elixir-format
msgid "Types"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:57
#: lib/music_library_web/live/wishlist_live/show.html.heex:57
#: lib/music_library_web/live/record_live/show.html.heex:83
#: lib/music_library_web/live/wishlist_live/show.html.heex:75
#, elixir-autogen, elixir-format
msgid "MusicBrainz ID"
msgid "Updated at"
msgstr ""
#: lib/music_library_web/live/record_live/show.html.heex:67
#: lib/music_library_web/live/record_live/index.html.heex:147
#: lib/music_library_web/live/wishlist_live/index.html.heex:147
#, elixir-autogen, elixir-format
msgid "Purchased on"
msgid "View on MusicBrainz"
msgstr ""
#: lib/music_library_web/components/core_components.ex:164
#, elixir-autogen, elixir-format
msgid "We can't find the internet"
msgstr ""
#: lib/music_library_web/controllers/session_html/new.html.heex:5
#, elixir-autogen, elixir-format
msgid "Welcome to your Music Library"
msgstr ""
#: lib/music_library_web/components/layouts/app.html.heex:19
#: lib/music_library_web/live/wishlist_live/index.ex:72
#, elixir-autogen, elixir-format
msgid "Wishlist"
msgstr ""
#: lib/music_library_web/plug/require_login.ex:17
#, elixir-autogen, elixir-format
msgid "You must be logged in to access this page"
msgstr ""
#: lib/music_library_web/components/core_components.ex:85
#: lib/music_library_web/components/core_components.ex:139
#, elixir-autogen, elixir-format
msgid "close"
msgstr ""
test/music_library_web/live/stats_index_test.exs
+4 -4
View File
@@ -35,15 +35,15 @@ defmodule MusicLibraryWeb.StatsIndexTest do
collection
|> Enum.frequencies_by(& &1.format)
|> Enum.each(fn {format, count} ->
assert html =~ "\n#{count}\n"
assert html =~ "\n#{Record.format_long_label(format)}\n"
assert html =~ "#{count}\n"
assert html =~ "#{Record.format_long_label(format)}\n"
end)
collection
|> Enum.frequencies_by(& &1.type)
|> Enum.each(fn {type, count} ->
assert html =~ "\n#{count}\n"
assert html =~ "\n#{Record.type_long_label(type)}\n"
assert html =~ "#{count}\n"
assert html =~ "#{Record.type_long_label(type)}\n"
end)
end