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

Extract top albums to components

Browse Source
This commit is contained in:
Claudio Ortolina
2025-06-14 09:44:47 +03:00
parent 268aff9918
commit 109913cbfd
4 changed files with 41 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/music_library_web/live/stats_live/index.ex
+33
View File
@@ -71,6 +71,39 @@ defmodule MusicLibraryWeb.StatsLive.Index do
""" """
end end
attr :albums, :list, required: true
attr :title, :string, required: true
def top_albums_by_period(assigns) do
~H"""
<div>
<h2 class="text-base font-semibold text-zinc-900 dark:text-zinc-200 mb-3">
{@title}
</h2>
<div class="space-y-2">
<div :for={album <- @albums} class="flex items-center space-x-3 p-2">
<img
class="w-12 h-12 rounded-md object-cover"
src={album.cover_url}
alt={album.album_title}
/>
<div class="flex-1 min-w-0">
<p class="text-xs text-zinc-600 dark:text-zinc-400 truncate">
{album.artist_name}
</p>
<p class="text-sm font-medium text-zinc-900 dark:text-zinc-300 truncate">
{album.album_title}
</p>
</div>
<div class="text-sm font-semibold text-zinc-900 dark:text-zinc-300">
{album.play_count}
</div>
</div>
</div>
</div>
"""
end
def mount(_params, _session, socket) do def mount(_params, _session, socket) do
latest_record = Collection.get_latest_record!() latest_record = Collection.get_latest_record!()
recent_tracks = LastFm.get_scrobbled_tracks() recent_tracks = LastFm.get_scrobbled_tracks()
lib/music_library_web/live/stats_live/index.html.heex
+3 -77
View File
@@ -118,83 +118,9 @@
</h1> </h1>
<div class="mt-5 grid grid-cols-1 lg:grid-cols-3 gap-5"> <div class="mt-5 grid grid-cols-1 lg:grid-cols-3 gap-5">
<div> <.top_albums_by_period albums={@top_albums.last_30_days} title={gettext("Last 30 days")} />
<h2 class="text-base font-semibold text-zinc-900 dark:text-zinc-200 mb-3"> <.top_albums_by_period albums={@top_albums.last_90_days} title={gettext("Last 90 days")} />
{gettext("Last 30 days")} <.top_albums_by_period albums={@top_albums.last_365_days} title={gettext("Last year")} />
</h2>
<div class="space-y-2">
<div :for={album <- @top_albums.last_30_days} class="flex items-center space-x-3 p-2">
<img
class="w-12 h-12 rounded-md object-cover"
src={album.cover_url}
alt={album.album_title}
/>
<div class="flex-1 min-w-0">
<p class="text-xs text-zinc-600 dark:text-zinc-400 truncate">
{album.artist_name}
</p>
<p class="text-sm font-medium text-zinc-900 dark:text-zinc-300 truncate">
{album.album_title}
</p>
</div>
<div class="text-sm font-semibold text-zinc-900 dark:text-zinc-300">
{album.play_count}
</div>
</div>
</div>
</div>
<div>
<h2 class="text-base font-semibold text-zinc-900 dark:text-zinc-200 mb-3">
{gettext("Last 90 days")}
</h2>
<div class="space-y-2">
<div :for={album <- @top_albums.last_90_days} class="flex items-center space-x-3 p-2">
<img
class="w-12 h-12 rounded-md object-cover"
src={album.cover_url}
alt={album.album_title}
/>
<div class="flex-1 min-w-0">
<p class="text-xs text-zinc-600 dark:text-zinc-400 truncate">
{album.artist_name}
</p>
<p class="text-sm font-medium text-zinc-900 dark:text-zinc-300 truncate">
{album.album_title}
</p>
</div>
<div class="text-sm font-semibold text-zinc-900 dark:text-zinc-300">
{album.play_count}
</div>
</div>
</div>
</div>
<div>
<h2 class="text-base font-semibold text-zinc-900 dark:text-zinc-200 mb-3">
{gettext("Last Year")}
</h2>
<div class="space-y-2">
<div :for={album <- @top_albums.last_365_days} class="flex items-center space-x-3 p-2">
<img
class="w-12 h-12 rounded-md object-cover"
src={album.cover_url}
alt={album.album_title}
/>
<div class="flex-1 min-w-0">
<p class="text-xs text-zinc-600 dark:text-zinc-400 truncate">
{album.artist_name}
</p>
<p class="text-sm font-medium text-zinc-900 dark:text-zinc-300 truncate">
{album.album_title}
</p>
</div>
<div class="text-sm font-semibold text-zinc-900 dark:text-zinc-300">
{album.play_count}
</div>
</div>
</div>
</div>
</div> </div>
</div> </div>
priv/gettext/default.pot
+2 -2
View File
@@ -898,10 +898,10 @@ msgstr ""
#: lib/music_library_web/live/stats_live/index.html.heex #: lib/music_library_web/live/stats_live/index.html.heex
#, elixir-autogen, elixir-format #, elixir-autogen, elixir-format
msgid "Last Year" msgid "Top Albums"
msgstr "" msgstr ""
#: lib/music_library_web/live/stats_live/index.html.heex #: lib/music_library_web/live/stats_live/index.html.heex
#, elixir-autogen, elixir-format #, elixir-autogen, elixir-format
msgid "Top Albums" msgid "Last year"
msgstr "" msgstr ""
priv/gettext/en/LC_MESSAGES/default.po
+3 -3
View File
@@ -897,11 +897,11 @@ msgid "Last 90 days"
msgstr "" msgstr ""
#: lib/music_library_web/live/stats_live/index.html.heex #: lib/music_library_web/live/stats_live/index.html.heex
#, elixir-autogen, elixir-format #, elixir-autogen, elixir-format, fuzzy
msgid "Last Year" msgid "Top Albums"
msgstr "" msgstr ""
#: lib/music_library_web/live/stats_live/index.html.heex #: lib/music_library_web/live/stats_live/index.html.heex
#, elixir-autogen, elixir-format, fuzzy #, elixir-autogen, elixir-format, fuzzy
msgid "Top Albums" msgid "Last year"
msgstr "" msgstr ""