Group status labels in scrobble activity

This commit is contained in:
Claudio Ortolina
2024-12-23 17:49:15 +00:00
parent 1102c40d16
commit b88b77cb78
2 changed files with 45 additions and 43 deletions
@@ -128,45 +128,47 @@
</div>
</div>
<span
:if={track.album.musicbrainz_id == ""}
class={[
"inline-flex items-center rounded-md",
"px-2 py-1 text-xs font-medium",
"ring-1 ring-inset",
"bg-zinc-50 dark:bg-zinc-500/10",
"text-zinc-700 dark:text-zinc-400",
"ring-zinc-600/20 dark:ring-zinc-500/20"
]}
>
{gettext("No MB ID")}
</span>
<span
:if={track.album.musicbrainz_id in @collected_release_ids}
class={[
"inline-flex items-center rounded-md",
"px-2 py-1 text-xs font-medium",
"ring-1 ring-inset",
"bg-green-50 dark:bg-green-500/10",
"text-green-700 dark:text-green-400",
"ring-green-600/20 dark:ring-green-500/20"
]}
>
{gettext("Collected")}
</span>
<span
:if={track.album.musicbrainz_id in @wishlisted_release_ids}
class={[
"inline-flex items-center rounded-md",
"px-2 py-1 text-xs font-medium",
"ring-1 ring-inset",
"bg-yellow-50 dark:bg-yellow-400/10",
"text-yellow-800 dark:text-yellow-500",
"ring-yellow-600/20 dark:ring-yellow-400/20"
]}
>
{gettext("Wishlisted")}
</span>
<div class="flex gap-2">
<span
:if={track.album.musicbrainz_id == ""}
class={[
"inline-flex items-center rounded-md",
"px-2 py-1 text-xs font-medium",
"ring-1 ring-inset",
"bg-zinc-50 dark:bg-zinc-500/10",
"text-zinc-700 dark:text-zinc-400",
"ring-zinc-600/20 dark:ring-zinc-500/20"
]}
>
{gettext("No MB ID")}
</span>
<span
:if={track.album.musicbrainz_id in @collected_release_ids}
class={[
"inline-flex items-center rounded-md",
"px-2 py-1 text-xs font-medium",
"ring-1 ring-inset",
"bg-green-50 dark:bg-green-500/10",
"text-green-700 dark:text-green-400",
"ring-green-600/20 dark:ring-green-500/20"
]}
>
{gettext("Collected")}
</span>
<span
:if={track.album.musicbrainz_id in @wishlisted_release_ids}
class={[
"inline-flex items-center rounded-md",
"px-2 py-1 text-xs font-medium",
"ring-1 ring-inset",
"bg-yellow-50 dark:bg-yellow-400/10",
"text-yellow-800 dark:text-yellow-500",
"ring-yellow-600/20 dark:ring-yellow-400/20"
]}
>
{gettext("Wishlisted")}
</span>
</div>
<div
:if={