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

Use a tooltip for release status

Browse Source
This commit is contained in:
Claudio Ortolina
2026-04-02 11:57:41 +01:00
parent 3f7da55e50
commit 98c2f85258
8 changed files with 52 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/music_library_web/components/record_components.ex
+13 -5
View File
@@ -32,20 +32,28 @@ defmodule MusicLibraryWeb.RecordComponents do
attr :record, :map, required: true attr :record, :map, required: true
def release_status_icon(assigns) do def release_status_tooltip(assigns) do
~H""" ~H"""
<.icon <Fluxon.Components.Tooltip.tooltip
:if={@record.selected_release_id} :if={@record.selected_release_id}
value={gettext("Record has a selected release")}
>
<.icon
name="hero-check-circle-solid" name="hero-check-circle-solid"
class="inline-block size-4 text-green-500" class="inline-block size-4 text-green-500"
aria-hidden="true" aria-hidden="true"
/> />
<.icon </Fluxon.Components.Tooltip.tooltip>
<Fluxon.Components.Tooltip.tooltip
:if={!@record.selected_release_id} :if={!@record.selected_release_id}
value={gettext("Record doesn't have a selected release")}
>
<.icon
name="hero-question-mark-circle-solid" name="hero-question-mark-circle-solid"
class="inline-block size-4 text-yellow-500" class="inline-block size-4 text-yellow-500"
aria-hidden="true" aria-hidden="true"
/> />
</Fluxon.Components.Tooltip.tooltip>
""" """
end end
@@ -128,7 +136,7 @@ defmodule MusicLibraryWeb.RecordComponents do
</h1> </h1>
<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"> <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} {record.title}
<.release_status_icon record={record} /> <.release_status_tooltip record={record} />
</h2> </h2>
<p class="mt-1 text-xs/5 text-zinc-500 dark:text-zinc-400"> <p class="mt-1 text-xs/5 text-zinc-500 dark:text-zinc-400">
{Records.Record.format_release_date(record.release_date)} {Records.Record.format_release_date(record.release_date)}
@@ -376,7 +384,7 @@ defmodule MusicLibraryWeb.RecordComponents do
<.artist_links joinphrase_class="text-xs" artists={record.artists} /> <.artist_links joinphrase_class="text-xs" artists={record.artists} />
</h1> </h1>
<p class="pointer-events-none text-sm font-medium text-zinc-900 dark:text-zinc-300"> <p class="pointer-events-none text-sm font-medium text-zinc-900 dark:text-zinc-300">
{record.title} <.release_status_icon record={record} /> {record.title} <.release_status_tooltip record={record} />
</p> </p>
</div> </div>
<p class="pointer-events-none block text-sm font-medium text-zinc-500"> <p class="pointer-events-none block text-sm font-medium text-zinc-500">
lib/music_library_web/components/search_components.ex
+2 -2
View File
@@ -11,7 +11,7 @@ defmodule MusicLibraryWeb.SearchComponents do
type_label: 1, type_label: 1,
record_cover: 1, record_cover: 1,
artist_image: 1, artist_image: 1,
release_status_icon: 1 release_status_tooltip: 1
] ]
alias MusicLibrary.Records.Record alias MusicLibrary.Records.Record
@@ -50,7 +50,7 @@ defmodule MusicLibraryWeb.SearchComponents do
</div> </div>
<div class="min-w-0 flex-1"> <div class="min-w-0 flex-1">
<p class="truncate text-sm font-medium text-zinc-900 dark:text-zinc-100"> <p class="truncate text-sm font-medium text-zinc-900 dark:text-zinc-100">
{@record.title} <.release_status_icon record={@record} /> {@record.title} <.release_status_tooltip record={@record} />
</p> </p>
<p class="truncate text-sm font-medium text-zinc-500 dark:text-zinc-400"> <p class="truncate text-sm font-medium text-zinc-500 dark:text-zinc-400">
{Record.artist_names(@record)} {Record.artist_names(@record)}
lib/music_library_web/components/stats_components.ex
+3 -3
View File
@@ -8,7 +8,7 @@ defmodule MusicLibraryWeb.StatsComponents do
artist_links: 1, artist_links: 1,
record_cover: 1, record_cover: 1,
release_groups_badge: 1, release_groups_badge: 1,
release_status_icon: 1 release_status_tooltip: 1
] ]
alias MusicLibrary.Records alias MusicLibrary.Records
@@ -188,7 +188,7 @@ defmodule MusicLibraryWeb.StatsComponents do
</h1> </h1>
<h2 class="flex items-center gap-1 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} {rep.title}
<.release_status_icon record={rep} /> <.release_status_tooltip record={rep} />
</h2> </h2>
<p class="text-xs/5 text-zinc-500 dark:text-zinc-400"> <p class="text-xs/5 text-zinc-500 dark:text-zinc-400">
<.released_how_long_ago record={rep} current_date={@current_date} /> <.released_how_long_ago record={rep} current_date={@current_date} />
@@ -261,7 +261,7 @@ defmodule MusicLibraryWeb.StatsComponents do
</h1> </h1>
<h2 class="flex items-center gap-1 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} {@record.title}
<.release_status_icon record={@record} /> <.release_status_tooltip record={@record} />
</h2> </h2>
<p class="text-xs text-zinc-500 dark:text-zinc-400"> <p class="text-xs text-zinc-500 dark:text-zinc-400">
<.released_how_long_ago record={@record} current_date={@current_date} /> <.released_how_long_ago record={@record} current_date={@current_date} />
lib/music_library_web/live/record_set_live/index.ex
+2 -2
View File
@@ -5,7 +5,7 @@ defmodule MusicLibraryWeb.RecordSetLive.Index do
import MusicLibraryWeb.LiveHelpers.Params import MusicLibraryWeb.LiveHelpers.Params
import MusicLibraryWeb.RecordComponents, import MusicLibraryWeb.RecordComponents,
only: [artist_links: 1, type_label: 1, format_label: 1, release_status_icon: 1] only: [artist_links: 1, type_label: 1, format_label: 1, release_status_tooltip: 1]
alias MusicLibrary.{Records, RecordSets} alias MusicLibrary.{Records, RecordSets}
alias MusicLibrary.RecordSets.RecordSet alias MusicLibrary.RecordSets.RecordSet
@@ -399,7 +399,7 @@ defmodule MusicLibraryWeb.RecordSetLive.Index do
</h2> </h2>
<h3 class="flex items-center gap-1 text-sm/5 font-semibold text-wrap text-zinc-700 dark:text-zinc-300"> <h3 class="flex items-center gap-1 text-sm/5 font-semibold text-wrap text-zinc-700 dark:text-zinc-300">
{item.record.title} {item.record.title}
<.release_status_icon record={item.record} /> <.release_status_tooltip record={item.record} />
</h3> </h3>
<p class="pointer-events-none block text-sm font-medium text-zinc-500"> <p class="pointer-events-none block text-sm font-medium text-zinc-500">
{format_label(item.record.format)} · {type_label(item.record.type)} {format_label(item.record.format)} · {type_label(item.record.type)}
lib/music_library_web/live/record_set_live/record_picker.ex
+2 -2
View File
@@ -6,7 +6,7 @@ defmodule MusicLibraryWeb.RecordSetLive.RecordPicker do
alias MusicLibrary.Wishlist alias MusicLibrary.Wishlist
import MusicLibraryWeb.RecordComponents, import MusicLibraryWeb.RecordComponents,
only: [format_label: 1, type_label: 1, release_status_icon: 1] only: [format_label: 1, type_label: 1, release_status_tooltip: 1]
@impl true @impl true
def render(assigns) do def render(assigns) do
@@ -94,7 +94,7 @@ defmodule MusicLibraryWeb.RecordSetLive.RecordPicker do
</div> </div>
<div class="min-w-0 flex-auto"> <div class="min-w-0 flex-auto">
<p class="truncate text-sm font-medium text-zinc-900 dark:text-zinc-100"> <p class="truncate text-sm font-medium text-zinc-900 dark:text-zinc-100">
{@record.title} <.release_status_icon record={@record} /> {@record.title} <.release_status_tooltip record={@record} />
</p> </p>
<p class="truncate text-xs text-zinc-500 dark:text-zinc-400"> <p class="truncate text-xs text-zinc-500 dark:text-zinc-400">
{Record.artist_names(@record)} {Record.artist_names(@record)}
lib/music_library_web/live/record_set_live/show.ex
+2 -2
View File
@@ -2,7 +2,7 @@ defmodule MusicLibraryWeb.RecordSetLive.Show do
use MusicLibraryWeb, :live_view use MusicLibraryWeb, :live_view
import MusicLibraryWeb.RecordComponents, import MusicLibraryWeb.RecordComponents,
only: [artist_links: 1, type_label: 1, format_label: 1, release_status_icon: 1] only: [artist_links: 1, type_label: 1, format_label: 1, release_status_tooltip: 1]
alias MusicLibrary.{Records, RecordSets} alias MusicLibrary.{Records, RecordSets}
alias MusicLibrary.RecordSets.RecordSet alias MusicLibrary.RecordSets.RecordSet
@@ -133,7 +133,7 @@ defmodule MusicLibraryWeb.RecordSetLive.Show do
</h2> </h2>
<h3 class="flex items-center gap-1 text-sm/5 font-semibold text-wrap text-zinc-700 dark:text-zinc-300"> <h3 class="flex items-center gap-1 text-sm/5 font-semibold text-wrap text-zinc-700 dark:text-zinc-300">
{item.record.title} {item.record.title}
<.release_status_icon record={item.record} /> <.release_status_tooltip record={item.record} />
</h3> </h3>
<p class="pointer-events-none block text-sm font-medium text-zinc-500"> <p class="pointer-events-none block text-sm font-medium text-zinc-500">
{format_label(item.record.format)} · {type_label(item.record.type)} {format_label(item.record.format)} · {type_label(item.record.type)}
priv/gettext/default.pot
+10
View File
@@ -2385,3 +2385,13 @@ msgstr ""
#, elixir-autogen, elixir-format #, elixir-autogen, elixir-format
msgid "Failed to connect your Last.fm account" msgid "Failed to connect your Last.fm account"
msgstr "" msgstr ""
#: lib/music_library_web/components/record_components.ex
#, elixir-autogen, elixir-format
msgid "Record doesn't have a selected release"
msgstr ""
#: lib/music_library_web/components/record_components.ex
#, elixir-autogen, elixir-format
msgid "Record has a selected release"
msgstr ""
priv/gettext/en/LC_MESSAGES/default.po
+10
View File
@@ -2385,3 +2385,13 @@ msgstr ""
#, elixir-autogen, elixir-format #, elixir-autogen, elixir-format
msgid "Failed to connect your Last.fm account" msgid "Failed to connect your Last.fm account"
msgstr "" msgstr ""
#: lib/music_library_web/components/record_components.ex
#, elixir-autogen, elixir-format
msgid "Record doesn't have a selected release"
msgstr ""
#: lib/music_library_web/components/record_components.ex
#, elixir-autogen, elixir-format
msgid "Record has a selected release"
msgstr ""