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

Make top albums and artists async

Browse Source
This commit is contained in:
Claudio Ortolina
2025-07-07 10:19:47 +01:00
parent a49d8d8f07
commit 1492b197ce
2 changed files with 88 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/music_library_web/live/stats_live/index.ex
+18 -14
View File
@@ -133,28 +133,32 @@ defmodule MusicLibraryWeb.StatsLive.Index do
timezone = socket.assigns.timezone timezone = socket.assigns.timezone
current_time = DateTime.utc_now() current_time = DateTime.utc_now()
top_albums = assign_async(socket, :top_albums, fn ->
ScrobbleActivity.get_top_albums_by_periods( top_albums =
limit: 10, ScrobbleActivity.get_top_albums_by_periods(
current_time: current_time, limit: 10,
timezone: timezone current_time: current_time,
) timezone: timezone
)
assign(socket, top_albums: top_albums) {:ok, %{top_albums: top_albums}}
end)
end end
defp assign_top_artists(socket) do defp assign_top_artists(socket) do
timezone = socket.assigns.timezone timezone = socket.assigns.timezone
current_time = DateTime.utc_now() current_time = DateTime.utc_now()
top_artists = assign_async(socket, :top_artists, fn ->
ScrobbleActivity.get_top_artists_by_periods( top_artists =
limit: 10, ScrobbleActivity.get_top_artists_by_periods(
current_time: current_time, limit: 10,
timezone: timezone current_time: current_time,
) timezone: timezone
)
assign(socket, top_artists: top_artists) {:ok, %{top_artists: top_artists}}
end)
end end
# The Tailwind build step requires all needed classes to be explicitly referenced # The Tailwind build step requires all needed classes to be explicitly referenced
lib/music_library_web/live/stats_live/index.html.heex
+70 -56
View File
@@ -74,67 +74,81 @@
<h1 class="text-base lg:text-2xl text-zinc-900 dark:text-zinc-200 font-semibold"> <h1 class="text-base lg:text-2xl text-zinc-900 dark:text-zinc-200 font-semibold">
{gettext("Top Artists")} {gettext("Top Artists")}
</h1> </h1>
<.tabs class="mt-4"> <.async_result :let={top_artists} assign={@top_artists}>
<.tabs_list active_tab="top_artists_last_30_days" variant="segmented"> <:loading>
<:tab class="flex-1" name="top_artists_last_30_days">{gettext("Last 30 days")}</:tab> <div class="h-192 flex items-center justify-center">
<:tab class="flex-1" name="top_artists_last_90_days">{gettext("Last 90 days")}</:tab> <.loading />
<:tab class="flex-1" name="top_artists_last_365_days">{gettext("Last year")}</:tab> </div>
<:tab class="flex-1" name="top_artists_all_time">{gettext("All time")}</:tab> </:loading>
</.tabs_list> <.tabs class="mt-4">
<.tabs_panel active name="top_artists_last_30_days"> <.tabs_list active_tab="top_artists_last_30_days" variant="segmented">
<.top_artists_by_period artists={@top_artists.last_30_days} /> <:tab class="flex-1" name="top_artists_last_30_days">{gettext("Last 30 days")}</:tab>
</.tabs_panel> <:tab class="flex-1" name="top_artists_last_90_days">{gettext("Last 90 days")}</:tab>
<.tabs_panel name="top_artists_last_90_days"> <:tab class="flex-1" name="top_artists_last_365_days">{gettext("Last year")}</:tab>
<.top_artists_by_period artists={@top_artists.last_90_days} /> <:tab class="flex-1" name="top_artists_all_time">{gettext("All time")}</:tab>
</.tabs_panel> </.tabs_list>
<.tabs_panel name="top_artists_last_365_days"> <.tabs_panel active name="top_artists_last_30_days">
<.top_artists_by_period artists={@top_artists.last_365_days} /> <.top_artists_by_period artists={top_artists.last_30_days} />
</.tabs_panel> </.tabs_panel>
<.tabs_panel name="top_artists_all_time"> <.tabs_panel name="top_artists_last_90_days">
<.top_artists_by_period artists={@top_artists.all_time} /> <.top_artists_by_period artists={top_artists.last_90_days} />
</.tabs_panel> </.tabs_panel>
</.tabs> <.tabs_panel name="top_artists_last_365_days">
<.top_artists_by_period artists={top_artists.last_365_days} />
</.tabs_panel>
<.tabs_panel name="top_artists_all_time">
<.top_artists_by_period artists={top_artists.all_time} />
</.tabs_panel>
</.tabs>
</.async_result>
</div> </div>
<div> <div>
<h1 class="text-base lg:text-2xl text-zinc-900 dark:text-zinc-200 font-semibold"> <h1 class="text-base lg:text-2xl text-zinc-900 dark:text-zinc-200 font-semibold">
{gettext("Top Albums")} {gettext("Top Albums")}
</h1> </h1>
<.tabs class="mt-4"> <.async_result :let={top_albums} assign={@top_albums}>
<.tabs_list active_tab="top_albums_last_30_days" variant="segmented"> <:loading>
<:tab class="flex-1" name="top_albums_last_30_days">{gettext("Last 30 days")}</:tab> <div class="h-192 flex items-center justify-center">
<:tab class="flex-1" name="top_albums_last_90_days">{gettext("Last 90 days")}</:tab> <.loading />
<:tab class="flex-1" name="top_albums_last_365_days">{gettext("Last year")}</:tab> </div>
<:tab class="flex-1" name="top_albums_all_time">{gettext("All time")}</:tab> </:loading>
</.tabs_list> <.tabs class="mt-4">
<.tabs_panel active name="top_albums_last_30_days"> <.tabs_list active_tab="top_albums_last_30_days" variant="segmented">
<.top_albums_by_period <:tab class="flex-1" name="top_albums_last_30_days">{gettext("Last 30 days")}</:tab>
albums={@top_albums.last_30_days} <:tab class="flex-1" name="top_albums_last_90_days">{gettext("Last 90 days")}</:tab>
collected_releases={@top_albums.collected_releases} <:tab class="flex-1" name="top_albums_last_365_days">{gettext("Last year")}</:tab>
wishlisted_releases={@top_albums.wishlisted_releases} <:tab class="flex-1" name="top_albums_all_time">{gettext("All time")}</:tab>
/> </.tabs_list>
</.tabs_panel> <.tabs_panel active name="top_albums_last_30_days">
<.tabs_panel name="top_albums_last_90_days"> <.top_albums_by_period
<.top_albums_by_period albums={top_albums.last_30_days}
albums={@top_albums.last_90_days} collected_releases={top_albums.collected_releases}
collected_releases={@top_albums.collected_releases} wishlisted_releases={top_albums.wishlisted_releases}
wishlisted_releases={@top_albums.wishlisted_releases} />
/> </.tabs_panel>
</.tabs_panel> <.tabs_panel name="top_albums_last_90_days">
<.tabs_panel name="top_albums_last_365_days"> <.top_albums_by_period
<.top_albums_by_period albums={top_albums.last_90_days}
albums={@top_albums.last_365_days} collected_releases={top_albums.collected_releases}
collected_releases={@top_albums.collected_releases} wishlisted_releases={top_albums.wishlisted_releases}
wishlisted_releases={@top_albums.wishlisted_releases} />
/> </.tabs_panel>
</.tabs_panel> <.tabs_panel name="top_albums_last_365_days">
<.tabs_panel name="top_albums_all_time"> <.top_albums_by_period
<.top_albums_by_period albums={top_albums.last_365_days}
albums={@top_albums.all_time} collected_releases={top_albums.collected_releases}
collected_releases={@top_albums.collected_releases} wishlisted_releases={top_albums.wishlisted_releases}
wishlisted_releases={@top_albums.wishlisted_releases} />
/> </.tabs_panel>
</.tabs_panel> <.tabs_panel name="top_albums_all_time">
</.tabs> <.top_albums_by_period
albums={top_albums.all_time}
collected_releases={top_albums.collected_releases}
wishlisted_releases={top_albums.wishlisted_releases}
/>
</.tabs_panel>
</.tabs>
</.async_result>
</div> </div>
</div> </div>
</div> </div>