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

Update to new interpolation syntax

Browse Source 
Includes a fix to a brittle test that failed due to changes in the
number of linebreaks.
This commit is contained in:
Claudio Ortolina
2024-12-02 23:28:11 +00:00
parent 9448e77e23
commit ccefc6e697
16 changed files with 191 additions and 191 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/music_library_web/live/collection_live/index.html.heex
+19 -19
View File
@@ -14,17 +14,17 @@
/>
</form>
<.link patch={~p"/collection/import"}>
<.button><%= gettext("Import") %></.button>
<.button>{gettext("Import")}</.button>
</.link>
</div>
</header>
<p class="text-right text-sm max-sm:text-xs mt-8 text-zinc-900 dark:text-zinc-400">
<%= gettext(
{gettext(
"Showing <b>%{visible}</b> of <b>%{total}</b> records",
%{visible: Enum.count(@streams.records), total: @record_list_params.total_entries}
)
|> raw() %>
|> raw()}
</p>
</div>
@@ -53,22 +53,22 @@
class="text-zinc-700 hover:text-zinc-500 dark:text-zinc-400 dark:hover:text-zinc-300"
patch={~p"/artists/#{artist.musicbrainz_id}"}
>
<%= artist.name %>
{artist.name}
</.link>
</h1>
<h2 class="mt-1 flex font-semibold text-sm sm:text-base leading-5 text-zinc-700 dark:text-zinc-300 text-wrap">
<%= record.title %>
{record.title}
</h2>
<p class="mt-1 text-xs leading-5 text-zinc-500 dark:text-zinc-400">
<%= Records.Record.format_release(record.release) %>
{Records.Record.format_release(record.release)}
<span class="sm:hidden">
· <%= Records.Record.format_long_label(record.format) %> · <%= Records.Record.type_long_label(
· {Records.Record.format_long_label(record.format)} · {Records.Record.type_long_label(
record.type
) %>
)}
<span :if={Records.Record.child_release_groups_count(record) > 0}>
·
<span class="sr-only">
<%= gettext("Number of included records") %>
{gettext("Number of included records")}
</span>
<span class={[
"inline-flex items-center rounded-full",
@@ -78,7 +78,7 @@
"text-gray-600 dark:text-gray-500",
"ring-gray-500/10 dark:ring-gray-400/20"
]}>
<%= Records.Record.child_release_groups_count(record) %>
{Records.Record.child_release_groups_count(record)}
</span>
</span>
</span>
@@ -88,13 +88,13 @@
<div class="flex shrink-0 items-center gap-x-6">
<div class="hidden sm:flex sm:flex-col sm:items-end">
<p class="text-xs leading-6 text-zinc-900 dark:text-zinc-300">
<%= Records.Record.format_long_label(record.format) %> · <%= Records.Record.type_long_label(
{Records.Record.format_long_label(record.format)} · {Records.Record.type_long_label(
record.type
) %>
)}
<span :if={Records.Record.child_release_groups_count(record) > 0}>
·
<span class="sr-only">
<%= gettext("Number of included records") %>
{gettext("Number of included records")}
</span>
<span class={[
"inline-flex items-center rounded-full",
@@ -104,7 +104,7 @@
"text-gray-600 dark:text-gray-500",
"ring-gray-500/10 dark:ring-gray-400/20"
]}>
<%= Records.Record.child_release_groups_count(record) %>
{Records.Record.child_release_groups_count(record)}
</span>
</span>
</p>
@@ -118,7 +118,7 @@
phx-click={toggle_actions_menu(record.id)}
phx-click-away={close_actions_menu(record.id)}
>
<span class="sr-only"><%= gettext("Open options") %></span>
<span class="sr-only">{gettext("Open options")}</span>
<.icon
name="hero-ellipsis-vertical"
class="-mt-1 h-5 w-5"
@@ -153,7 +153,7 @@
id={"actions-#{record.id}-show"}
navigate={~p"/collection/#{record}"}
>
<%= gettext("Show") %>
{gettext("Show")}
</.link>
<a
href={musicbrainz_url(record)}
@@ -163,7 +163,7 @@
tabindex="-1"
id={"actions-#{record.id}-musicbrainz"}
>
<%= gettext("View on MusicBrainz") %>
{gettext("View on MusicBrainz")}
</a>
<.link
@@ -173,7 +173,7 @@
id={"actions-#{record.id}-edit"}
patch={~p"/collection/#{record}/edit"}
>
<%= gettext("Edit") %>
{gettext("Edit")}
</.link>
<.link
@@ -184,7 +184,7 @@
phx-click={JS.push("delete", value: %{id: record.id}) |> hide("##{id}")}
data-confirm={gettext("Are you sure?")}
>
<%= gettext("Delete") %>
{gettext("Delete")}
</.link>
</.focus_wrap>
</div>
lib/music_library_web/live/collection_live/show.html.heex
+25 -25
View File
@@ -14,46 +14,46 @@
class="text-zinc-700 hover:text-zinc-500 dark:text-zinc-400 dark:hover:text-zinc-300"
patch={~p"/artists/#{artist.musicbrainz_id}"}
>
<%= artist.name %>
{artist.name}
</.link>
</h1>
<h2 class="mt-1 flex font-semibold text-base sm:text-lg leading-5 text-zinc-700 dark:text-zinc-300 text-wrap">
<%= @record.title %>
{@record.title}
</h2>
<p class="mt-2 text-sm leading-5 text-zinc-500 dark:text-zinc-400">
<%= Records.Record.format_release(@record.release) %> · <%= Records.Record.format_long_label(
{Records.Record.format_release(@record.release)} · {Records.Record.format_long_label(
@record.format
) %> · <%= Records.Record.type_long_label(@record.type) %>
)} · {Records.Record.type_long_label(@record.type)}
</p>
<!-- TODO: extract to a component -->
<nav class="mt-5 isolate inline-flex rounded-md shadow-sm">
<.link patch={~p"/collection/#{@record}/show/edit"} phx-click={JS.push_focus()}>
<.button type="button" class="relative inline-flex items-center rounded-r-none">
<%= gettext("Edit") %>
{gettext("Edit")}
</.button>
</.link>
<.link phx-click={JS.push("refresh_cover", value: %{id: @record.id})}>
<.button type="button" class="relative -ml-px inline-flex items-center rounded-none">
<span class="sr-only"><%= gettext("Refresh") %></span>
<span class="sr-only">{gettext("Refresh")}</span>
<.icon
name="hero-arrow-path"
class="h-4 w-4 mr-1 phx-click-loading:animate-spin"
aria-hidden="true"
data-slot="icon"
/>
<%= gettext("Cover") %>
{gettext("Cover")}
</.button>
</.link>
<.link phx-click={JS.push("refresh_musicbrainz_data", value: %{id: @record.id})}>
<.button type="button" class="relative -ml-px inline-flex items-center rounded-none">
<span class="sr-only"><%= gettext("Refresh") %></span>
<span class="sr-only">{gettext("Refresh")}</span>
<.icon
name="hero-arrow-path"
class="h-4 w-4 mr-1 phx-click-loading:animate-spin"
aria-hidden="true"
data-slot="icon"
/>
<%= gettext("MB Data") %>
{gettext("MB Data")}
</.button>
</.link>
<.link
@@ -64,7 +64,7 @@
type="button"
class="relative -ml-px inline-flex items-center rounded-l-none !text-red-600 hover:!text-red-500 dark:!text-red-700 hover:dark:!text-red-500"
>
<%= gettext("Delete") %>
{gettext("Delete")}
</.button>
</.link>
</nav>
@@ -74,7 +74,7 @@
<dl class="mt-4 divide-y divide-zinc-100 dark:divide-slate-300/30">
<div class="py-2 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0">
<dt class="text-sm font-medium leading-6 text-zinc-900 dark:text-zinc-400">
<%= gettext("Genres") %>
{gettext("Genres")}
</dt>
<dd class="mt-1 text-sm leading-6 text-zinc-700 dark:text-zinc-300 sm:col-span-2 sm:mt-0">
<.link
@@ -82,23 +82,23 @@
class="mr-2 text-zinc-700 hover:text-zinc-500 dark:text-zinc-400 dark:hover:text-zinc-300"
patch={~p"/collection?#{%{query: ~s(genre:"#{genre}")}}"}
>
<%= genre %>
{genre}
</.link>
</dd>
</div>
<div class="py-2 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0">
<dt class="text-sm font-medium leading-6 text-zinc-900 dark:text-zinc-400">
<%= gettext("MusicBrainz ID") %>
{gettext("MusicBrainz ID")}
</dt>
<dd class="mt-1 text-sm flex justify-between leading-6 text-zinc-700 dark:text-zinc-300 sm:col-span-2 sm:mt-0">
<a href={musicbrainz_url(@record)}>
<code id={"mb-#{@record.musicbrainz_id}"}><%= @record.musicbrainz_id %></code>
<code id={"mb-#{@record.musicbrainz_id}"}>{@record.musicbrainz_id}</code>
</a>
<button phx-click={
JS.dispatch("music_library:clipcopy", to: "#mb-" <> @record.musicbrainz_id)
|> JS.transition("animate-shake")
}>
<span class="sr-only"><%= gettext("Copy MusicBrainz ID to clipboard") %></span>
<span class="sr-only">{gettext("Copy MusicBrainz ID to clipboard")}</span>
<.icon
name="hero-clipboard-document"
class="-mt-1 h-5 w-5"
@@ -110,10 +110,10 @@
</div>
<div class="py-2 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0">
<dt class="text-sm font-medium leading-6 text-zinc-900 dark:text-zinc-400">
<%= gettext("Purchased on") %>
{gettext("Purchased on")}
</dt>
<dd class="mt-1 text-sm leading-6 text-zinc-700 dark:text-zinc-300 sm:col-span-2 sm:mt-0">
<%= human_datetime(@record.purchased_at) %>
{human_datetime(@record.purchased_at)}
</dd>
</div>
<div
@@ -121,30 +121,30 @@
class="py-2 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0"
>
<dt class="text-sm font-medium leading-6 text-zinc-900 dark:text-zinc-400">
<%= gettext("Includes") %>
{gettext("Includes")}
</dt>
<dd class="mt-1 text-sm leading-6 text-zinc-700 dark:text-zinc-300 sm:col-span-2 sm:mt-0">
<ul>
<li :for={child_release_group <- Records.Record.child_release_groups(@record)}>
<%= child_release_group.artists %> - <%= child_release_group.title %>
{child_release_group.artists} - {child_release_group.title}
</li>
</ul>
</dd>
</div>
<div class="py-2 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0">
<dt class="text-sm font-medium leading-6 text-zinc-900 dark:text-zinc-400">
<%= gettext("Inserted at") %>
{gettext("Inserted at")}
</dt>
<dd class="mt-1 text-sm leading-6 text-zinc-700 dark:text-zinc-300 sm:col-span-2 sm:mt-0">
<%= human_datetime(@record.inserted_at) %>
{human_datetime(@record.inserted_at)}
</dd>
</div>
<div class="py-2 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-0">
<dt class="text-sm font-medium leading-6 text-zinc-900 dark:text-zinc-400">
<%= gettext("Updated at") %>
{gettext("Updated at")}
</dt>
<dd class="mt-1 text-sm leading-6 text-zinc-700 dark:text-zinc-300 sm:col-span-2 sm:mt-0">
<%= human_datetime(@record.updated_at) %>
{human_datetime(@record.updated_at)}
</dd>
</div>
</dl>
@@ -152,13 +152,13 @@
</div>
<!-- TODO: extract to a component -->
<details class="mt-4 px-4 text-zinc-700 hover:text-zinc-500 dark:text-zinc-400 dark:hover:text-zinc-300">
<summary class="text-xs sm:text-sm"><%= gettext("MusicBrainz data") %></summary>
<summary class="text-xs sm:text-sm">{gettext("MusicBrainz data")}</summary>
<pre><code class="text-xs sm:text-sm"><%= Jason.encode!(@record.musicbrainz_data, pretty: true) %></code></pre>
</details>
<div class="mt-4">
<.back navigate={@back_url}>
<%= gettext("Back to records") %>
{gettext("Back to records")}
</.back>
</div>