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

Inline DataComponents functions and remove the component

Browse Source 
No need to abstract out when it's used only in one place
This commit is contained in:
Claudio Ortolina
2025-04-09 19:05:22 +01:00
parent 76a4533e75
commit 0aa1da14ad
2 changed files with 65 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/music_library_web/components/data_components.ex
-68
View File
@@ -1,68 +0,0 @@
defmodule MusicLibraryWeb.DataComponents do
use MusicLibraryWeb, :live_component
attr :record, MusicLibrary.Records.Record, required: true
attr :title, :string, required: true
attr :class, :string
def album_preview(assigns) do
~H"""
<div
class={[
"relative overflow-hidden rounded-md bg-white dark:bg-zinc-800 px-4 pb-3 pt-5 shadow-sm sm:px-6 sm:pt-6 cursor-pointer",
@class
]}
phx-click={JS.navigate(~p"/collection/#{@record}")}
>
<dt>
<img
class="absolute w-20 rounded-md shadow-sm"
src={~p"/covers/#{@record.id}?vsn=#{@record.cover_hash}"}
alt={@record.title}
/>
<p class="ml-24 truncate text-xs sm:text-sm font-medium text-zinc-500 dark:text-zinc-400">
{@title}
</p>
</dt>
<dd class="ml-24 flex items-baseline pb-4 sm:pb-6">
<p class="font-semibold">
<span class="text-sm md:text-base lg:text-2xl block text-zinc-900 dark:text-zinc-300">
{@record.title}
</span>
<.link
:for={artist <- @record.artists}
class="text-sm md:text-base text-zinc-600 dark:text-zinc-200 hover:text-zinc-500 dark:text-zinc-300 dark:hover:text-zinc-200"
navigate={~p"/artists/#{artist.musicbrainz_id}"}
>
{artist.name}
</.link>
</p>
</dd>
</div>
"""
end
attr :title, :string, required: true
attr :count, :integer, required: true
attr :path, :string, required: true
def counter(assigns) do
~H"""
<div class="overflow-hidden rounded-md bg-white dark:bg-zinc-800 px-4 pb-3 pt-5 shadow-sm sm:px-6 sm:pt-6">
<dt class="sm:mt-3">
<p class="truncate text-sm font-medium text-center text-zinc-500 dark:text-zinc-400">
{@title}
</p>
</dt>
<dd class="mt-1">
<.link
navigate={@path}
class="block text-2xl sm:text-3xl font-semibold text-center text-zinc-900 hover:text-zinc-500 dark:text-zinc-300 dark:hover:text-zinc-200"
>
{@count}
</.link>
</dd>
</div>
"""
end
end
lib/music_library_web/live/stats_live/index.ex
+65 -1
View File
@@ -1,12 +1,76 @@
defmodule MusicLibraryWeb.StatsLive.Index do
use MusicLibraryWeb, :live_view
import MusicLibraryWeb.DataComponents
import MusicLibraryWeb.RecordComponents, only: [format_label: 1, type_label: 1]
import MusicLibraryWeb.ChartComponents
alias MusicLibrary.{Artists, Collection, Records, Wishlist}
attr :record, MusicLibrary.Records.Record, required: true
attr :title, :string, required: true
attr :class, :string
defp album_preview(assigns) do
~H"""
<div
class={[
"relative overflow-hidden rounded-md bg-white dark:bg-zinc-800 px-4 pb-3 pt-5 shadow-sm sm:px-6 sm:pt-6 cursor-pointer",
@class
]}
phx-click={JS.navigate(~p"/collection/#{@record}")}
>
<dt>
<img
class="absolute w-20 rounded-md shadow-sm"
src={~p"/covers/#{@record.id}?vsn=#{@record.cover_hash}"}
alt={@record.title}
/>
<p class="ml-24 truncate text-xs sm:text-sm font-medium text-zinc-500 dark:text-zinc-400">
{@title}
</p>
</dt>
<dd class="ml-24 flex items-baseline pb-4 sm:pb-6">
<p class="font-semibold">
<span class="text-sm md:text-base lg:text-2xl block text-zinc-900 dark:text-zinc-300">
{@record.title}
</span>
<.link
:for={artist <- @record.artists}
class="text-sm md:text-base text-zinc-600 dark:text-zinc-200 hover:text-zinc-500 dark:text-zinc-300 dark:hover:text-zinc-200"
navigate={~p"/artists/#{artist.musicbrainz_id}"}
>
{artist.name}
</.link>
</p>
</dd>
</div>
"""
end
attr :title, :string, required: true
attr :count, :integer, required: true
attr :path, :string, required: true
defp counter(assigns) do
~H"""
<div class="overflow-hidden rounded-md bg-white dark:bg-zinc-800 px-4 pb-3 pt-5 shadow-sm sm:px-6 sm:pt-6">
<dt class="sm:mt-3">
<p class="truncate text-sm font-medium text-center text-zinc-500 dark:text-zinc-400">
{@title}
</p>
</dt>
<dd class="mt-1">
<.link
navigate={@path}
class="block text-2xl sm:text-3xl font-semibold text-center text-zinc-900 hover:text-zinc-500 dark:text-zinc-300 dark:hover:text-zinc-200"
>
{@count}
</.link>
</dd>
</div>
"""
end
def mount(_params, _session, socket) do
latest_record = Collection.get_latest_record!()
recent_tracks = LastFm.get_scrobbled_tracks()