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

Redesign import dialog

Browse Source
This commit is contained in:
Claudio Ortolina
2024-10-25 23:20:13 +01:00
parent 781d9f8640
commit 750dae431b
4 changed files with 24 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/music_library_web/components/core_components.ex
+1 -1
View File
@@ -74,7 +74,7 @@ defmodule MusicLibraryWeb.CoreComponents do
"shadow-zinc-700/10 ring-zinc-700/10", "shadow-zinc-700/10 ring-zinc-700/10",
"relative hidden rounded-2xl", "relative hidden rounded-2xl",
"bg-white dark:bg-zinc-800", "bg-white dark:bg-zinc-800",
"p-14 shadow-lg ring-1 transition" "p-8 shadow-lg ring-1 transition"
]} ]}
> >
<div class="absolute top-6 right-5"> <div class="absolute top-6 right-5">
lib/music_library_web/live/record_live/import_component.ex
+18 -14
View File
@@ -13,6 +13,7 @@ defmodule MusicLibraryWeb.RecordLive.ImportComponent do
phx-target={@myself} phx-target={@myself}
phx-change="search" phx-change="search"
phx-submit="search" phx-submit="search"
class="px-4"
> >
<.input <.input
id={:mb_query} id={:mb_query}
@@ -24,7 +25,11 @@ defmodule MusicLibraryWeb.RecordLive.ImportComponent do
phx-debounce="500" phx-debounce="500"
/> />
</.simple_form> </.simple_form>
<ul :if={@release_groups !== []} role="list" class="divide-y divide-gray-100"> <ul
:if={@release_groups !== []}
role="list"
class="divide-y divide-gray-100 dark:divide-slate-300/30 mt-5"
>
<.result :for={release_group <- @release_groups} release_group={release_group} /> <.result :for={release_group <- @release_groups} release_group={release_group} />
</ul> </ul>
<div <div
@@ -41,23 +46,22 @@ defmodule MusicLibraryWeb.RecordLive.ImportComponent do
~H""" ~H"""
<li <li
id={"musicbrainz_" <> @release_group.id} id={"musicbrainz_" <> @release_group.id}
class="flex justify-between gap-x-6 py-5 hover:bg-gray-50" class="flex justify-between gap-x-6 py-5 hover:bg-gray-50 dark:hover:bg-zinc-700"
> >
<div class="flex min-w-0 gap-x-4"> <div class="shrink-0 flex items-center justify-between w-full px-4">
<div class="min-w-0 flex-auto"> <div class="min-w-0 flex-auto">
<p class="text-sm font-semibold leading-6 text-gray-900"> <h1 class="text-sm leading-6 text-zinc-700 dark:text-zinc-400">
<.type_badge type={@release_group.type} /> <%= @release_group.artists %>
</h1>
<h2 class="mt-1 flex font-semibold text-sm sm:text-base leading-5 text-zinc-700 dark:text-zinc-300 text-wrap">
<%= @release_group.title %> <%= @release_group.title %>
</h2>
<span class="mt-1 text-xs leading-5 text-gray-500"> <p class="mt-1 text-xs leading-5 text-zinc-500 dark:text-zinc-400">
<%= @release_group.release %> <%= Records.Record.format_release(@release_group.release) %> · <%= Records.Record.type_long_label(
</span> @release_group.type
) %>
</p> </p>
<p class="mt-1 truncate text-xs leading-5 text-gray-500"><%= @release_group.artists %></p>
</div> </div>
</div>
<div class="shrink-0 flex items-center">
<div class="relative flex-none"> <div class="relative flex-none">
<button <button
type="button" type="button"
@@ -103,7 +107,7 @@ defmodule MusicLibraryWeb.RecordLive.ImportComponent do
class="block px-3 py-1 text-sm leading-6 text-gray-900 dark:text-zinc-400 hover:bg-gray-50 dark:hover:text-zinc-300 dark:hover:bg-zinc-700" class="block px-3 py-1 text-sm leading-6 text-gray-900 dark:text-zinc-400 hover:bg-gray-50 dark:hover:text-zinc-300 dark:hover:bg-zinc-700"
role="menuitem" role="menuitem"
tabindex="-1" tabindex="-1"
id={"actions-#{format}-import"} id={"actions-#{@release_group.id}-#{format}-import"}
phx-click={ phx-click={
JS.push("import", value: %{id: @release_group.id, format: format}, page_loading: true) JS.push("import", value: %{id: @release_group.id, format: format}, page_loading: true)
} }
priv/gettext/default.pot
+4 -4
View File
@@ -158,17 +158,17 @@ msgstr ""
msgid "Type" msgid "Type"
msgstr "" msgstr ""
#: lib/music_library_web/live/record_live/import_component.ex:34 #: lib/music_library_web/live/record_live/import_component.ex:39
#, elixir-autogen, elixir-format #, elixir-autogen, elixir-format
msgid "No results" msgid "No results"
msgstr "" msgstr ""
#: lib/music_library_web/live/record_live/import_component.ex:22 #: lib/music_library_web/live/record_live/import_component.ex:23
#, elixir-autogen, elixir-format #, elixir-autogen, elixir-format
msgid "Search for a record on MusicBrainz" msgid "Search for a record on MusicBrainz"
msgstr "" msgstr ""
#: lib/music_library_web/live/record_live/import_component.ex:23 #: lib/music_library_web/live/record_live/import_component.ex:24
#, elixir-autogen, elixir-format #, elixir-autogen, elixir-format
msgid "Search for records" msgid "Search for records"
msgstr "" msgstr ""
@@ -219,7 +219,7 @@ msgstr ""
msgid "Import from MusicBrainz" msgid "Import from MusicBrainz"
msgstr "" msgstr ""
#: lib/music_library_web/live/record_live/import_component.ex:70 #: lib/music_library_web/live/record_live/import_component.ex:74
#: lib/music_library_web/live/record_live/index.html.heex:99 #: lib/music_library_web/live/record_live/index.html.heex:99
#: lib/music_library_web/live/wishlist_live/index.html.heex:99 #: lib/music_library_web/live/wishlist_live/index.html.heex:99
#, elixir-autogen, elixir-format #, elixir-autogen, elixir-format
test/music_library_web/live/record_index_test.exs
+1 -1
View File
@@ -282,7 +282,7 @@ defmodule MusicLibraryWeb.RecordIndexTest do
for result <- mock_results do for result <- mock_results do
assert updated_list =~ result.title assert updated_list =~ result.title
assert updated_list =~ result.release assert updated_list =~ Record.format_release(result.release)
assert updated_list =~ result.artists assert updated_list =~ result.artists
end end