Add a release tracked badge to records in lists

This commit is contained in:
Claudio Ortolina
2026-04-02 11:52:07 +01:00
parent b3af5be00d
commit 3f7da55e50
9 changed files with 374 additions and 14 deletions
@@ -30,6 +30,25 @@ defmodule MusicLibraryWeb.RecordComponents do
"""
end
attr :record, :map, required: true
def release_status_icon(assigns) do
~H"""
<.icon
:if={@record.selected_release_id}
name="hero-check-circle-solid"
class="inline-block size-4 text-green-500"
aria-hidden="true"
/>
<.icon
:if={!@record.selected_release_id}
name="hero-question-mark-circle-solid"
class="inline-block size-4 text-yellow-500"
aria-hidden="true"
/>
"""
end
attr :record, :map, required: true
attr :class, :string, required: false, default: "rounded-lg"
attr :width, :integer, default: nil
@@ -107,8 +126,9 @@ defmodule MusicLibraryWeb.RecordComponents do
<h1 class="text-sm/6 text-zinc-700">
<.artist_links joinphrase_class="text-xs" artists={record.artists} />
</h1>
<h2 class="mt-1 flex text-sm/5 font-semibold text-wrap text-zinc-700 sm:text-base dark:text-zinc-300">
<h2 class="mt-1 flex items-center gap-1 text-sm/5 font-semibold text-wrap text-zinc-700 sm:text-base dark:text-zinc-300">
{record.title}
<.release_status_icon record={record} />
</h2>
<p class="mt-1 text-xs/5 text-zinc-500 dark:text-zinc-400">
{Records.Record.format_release_date(record.release_date)}
@@ -356,7 +376,7 @@ defmodule MusicLibraryWeb.RecordComponents do
<.artist_links joinphrase_class="text-xs" artists={record.artists} />
</h1>
<p class="pointer-events-none text-sm font-medium text-zinc-900 dark:text-zinc-300">
{record.title}
{record.title} <.release_status_icon record={record} />
</p>
</div>
<p class="pointer-events-none block text-sm font-medium text-zinc-500">
@@ -6,7 +6,13 @@ defmodule MusicLibraryWeb.SearchComponents do
use MusicLibraryWeb, :html
import MusicLibraryWeb.RecordComponents,
only: [format_label: 1, type_label: 1, record_cover: 1, artist_image: 1]
only: [
format_label: 1,
type_label: 1,
record_cover: 1,
artist_image: 1,
release_status_icon: 1
]
alias MusicLibrary.Records.Record
alias MusicLibraryWeb.Components.BarcodeScanner
@@ -44,7 +50,7 @@ defmodule MusicLibraryWeb.SearchComponents do
</div>
<div class="min-w-0 flex-1">
<p class="truncate text-sm font-medium text-zinc-900 dark:text-zinc-100">
{@record.title}
{@record.title} <.release_status_icon record={@record} />
</p>
<p class="truncate text-sm font-medium text-zinc-500 dark:text-zinc-400">
{Record.artist_names(@record)}
@@ -7,7 +7,8 @@ defmodule MusicLibraryWeb.StatsComponents do
type_label: 1,
artist_links: 1,
record_cover: 1,
release_groups_badge: 1
release_groups_badge: 1,
release_status_icon: 1
]
alias MusicLibrary.Records
@@ -185,8 +186,9 @@ defmodule MusicLibraryWeb.StatsComponents do
<h1 class="truncate text-xs">
<.artist_links joinphrase_class="text-xs" artists={rep.artists} />
</h1>
<h2 class="flex text-sm font-medium text-wrap text-zinc-700 dark:text-zinc-300">
<h2 class="flex items-center gap-1 text-sm font-medium text-wrap text-zinc-700 dark:text-zinc-300">
{rep.title}
<.release_status_icon record={rep} />
</h2>
<p class="text-xs/5 text-zinc-500 dark:text-zinc-400">
<.released_how_long_ago record={rep} current_date={@current_date} />
@@ -257,8 +259,9 @@ defmodule MusicLibraryWeb.StatsComponents do
<h1 class="truncate text-xs">
<.artist_links joinphrase_class="text-xs" artists={@record.artists} />
</h1>
<h2 class="flex text-sm font-medium text-wrap text-zinc-700 dark:text-zinc-300">
<h2 class="flex items-center gap-1 text-sm font-medium text-wrap text-zinc-700 dark:text-zinc-300">
{@record.title}
<.release_status_icon record={@record} />
</h2>
<p class="text-xs text-zinc-500 dark:text-zinc-400">
<.released_how_long_ago record={@record} current_date={@current_date} />