Extract round badge component

This commit is contained in:
Claudio Ortolina
2025-01-01 21:11:44 +00:00
parent 69e71191b0
commit 0ce5326236
3 changed files with 33 additions and 31 deletions
@@ -621,6 +621,26 @@ defmodule MusicLibraryWeb.CoreComponents do
"""
end
@doc """
Renders a round badge.
"""
attr :text, :string, required: true
def round_badge(assigns) do
~H"""
<span class={[
"inline-flex items-center rounded-full",
"px-2 py-1 text-xs font-medium",
"ring-1 ring-inset",
"bg-gray-50 dark:bg-gray-400/10",
"text-gray-600 dark:text-gray-500",
"ring-gray-500/10 dark:ring-gray-400/20"
]}>
{assigns.text}
</span>
"""
end
## JS Commands
def show(js \\ %JS{}, selector) do
@@ -53,16 +53,7 @@ defmodule MusicLibraryWeb.RecordComponents do
<span class="sr-only">
{gettext("Number of included records")}
</span>
<span class={[
"inline-flex items-center rounded-full",
"px-2 py-1 text-xs font-medium",
"ring-1 ring-inset",
"bg-gray-50 dark:bg-gray-400/10",
"text-gray-600 dark:text-gray-500",
"ring-gray-500/10 dark:ring-gray-400/20"
]}>
{Records.Record.child_release_groups_count(record)}
</span>
<.round_badge text={Records.Record.child_release_groups_count(record)} />
</span>
<span :if={record.purchased_at}>
·
@@ -91,16 +82,7 @@ defmodule MusicLibraryWeb.RecordComponents do
<span class="sr-only">
{gettext("Number of included records")}
</span>
<span class={[
"inline-flex items-center rounded-full",
"px-2 py-1 text-xs font-medium",
"ring-1 ring-inset",
"bg-gray-50 dark:bg-gray-400/10",
"text-gray-600 dark:text-gray-500",
"ring-gray-500/10 dark:ring-gray-400/20"
]}>
{Records.Record.child_release_groups_count(record)}
</span>
<.round_badge text={Records.Record.child_release_groups_count(record)} />
</span>
</p>
<p :if={record.purchased_at} class="text-xs leading-6 text-zinc-900 dark:text-zinc-300">
+11 -11
View File
@@ -16,7 +16,7 @@ msgstr ""
msgid "Actions"
msgstr ""
#: lib/music_library_web/components/record_components.ex:199
#: lib/music_library_web/components/record_components.ex:181
#: lib/music_library_web/live/collection_live/show.html.heex:127
#: lib/music_library_web/live/wishlist_live/show.html.heex:144
#, elixir-autogen, elixir-format
@@ -43,14 +43,14 @@ msgstr ""
msgid "Cover art"
msgstr ""
#: lib/music_library_web/components/record_components.ex:201
#: lib/music_library_web/components/record_components.ex:183
#: lib/music_library_web/live/collection_live/show.html.heex:135
#: lib/music_library_web/live/wishlist_live/show.html.heex:152
#, elixir-autogen, elixir-format
msgid "Delete"
msgstr ""
#: lib/music_library_web/components/record_components.ex:179
#: lib/music_library_web/components/record_components.ex:161
#: lib/music_library_web/live/collection_live/show.ex:139
#: lib/music_library_web/live/collection_live/show.html.heex:70
#: lib/music_library_web/live/wishlist_live/show.ex:136
@@ -151,7 +151,7 @@ msgstr ""
msgid "No results"
msgstr ""
#: lib/music_library_web/components/record_components.ex:124
#: lib/music_library_web/components/record_components.ex:106
#: lib/music_library_web/live/collection_live/show.html.heex:38
#: lib/music_library_web/live/wishlist_live/show.html.heex:38
#, elixir-autogen, elixir-format
@@ -169,7 +169,7 @@ msgstr ""
msgid "Previous"
msgstr ""
#: lib/music_library_web/components/record_components.ex:190
#: lib/music_library_web/components/record_components.ex:172
#: lib/music_library_web/live/collection_live/index.html.heex:42
#: lib/music_library_web/live/wishlist_live/show.html.heex:135
#, elixir-autogen, elixir-format
@@ -181,8 +181,8 @@ msgstr ""
msgid "Purchased at"
msgstr ""
#: lib/music_library_web/components/record_components.ex:70
#: lib/music_library_web/components/record_components.ex:108
#: lib/music_library_web/components/record_components.ex:61
#: lib/music_library_web/components/record_components.ex:90
#: lib/music_library_web/live/collection_live/show.html.heex:181
#, elixir-autogen, elixir-format
msgid "Purchased on"
@@ -217,7 +217,7 @@ msgstr ""
msgid "Saving..."
msgstr ""
#: lib/music_library_web/components/record_components.ex:221
#: lib/music_library_web/components/record_components.ex:203
#, elixir-autogen, elixir-format
msgid "Search"
msgstr ""
@@ -232,7 +232,7 @@ msgstr ""
msgid "Search for records"
msgstr ""
#: lib/music_library_web/components/record_components.ex:159
#: lib/music_library_web/components/record_components.ex:141
#: lib/music_library_web/live/collection_live/show.ex:138
#: lib/music_library_web/live/wishlist_live/show.ex:135
#, elixir-autogen, elixir-format
@@ -295,7 +295,7 @@ msgstr ""
msgid "Updated at"
msgstr ""
#: lib/music_library_web/components/record_components.ex:169
#: lib/music_library_web/components/record_components.ex:151
#, elixir-autogen, elixir-format
msgid "View on MusicBrainz"
msgstr ""
@@ -358,7 +358,7 @@ msgid "Wishlisted"
msgstr ""
#: lib/music_library_web/components/record_components.ex:54
#: lib/music_library_web/components/record_components.ex:92
#: lib/music_library_web/components/record_components.ex:83
#, elixir-autogen, elixir-format
msgid "Number of included records"
msgstr ""