diff --git a/lib/music_library_web/live/record_live/import_component.ex b/lib/music_library_web/live/record_live/import_component.ex index 6c16d8af..5c348486 100644 --- a/lib/music_library_web/live/record_live/import_component.ex +++ b/lib/music_library_web/live/record_live/import_component.ex @@ -57,19 +57,61 @@ defmodule MusicLibraryWeb.RecordLive.ImportComponent do -
- +
+
- + + <.focus_wrap + id={"actions-#{@release_group.id}"} + class={[ + "hidden pointer-events-auto absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-white dark:bg-zinc-800 py-2 shadow-lg ring-1 ring-gray-900/5 focus:outline-none" + ]} + role="menu" + aria-orientation="vertical" + aria-labelledby="options-menu-0-button" + tabindex="-1" + > + <.link + :for={format <- Records.Record.formats()} + 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" + tabindex="-1" + id={"actions-#{format}-import"} + phx-click={ + JS.push("import", value: %{id: @release_group.id, format: format}, page_loading: true) + } + > + <%= Records.Record.format_short_label(format) %> + + +
""" @@ -108,4 +150,14 @@ defmodule MusicLibraryWeb.RecordLive.ImportComponent do defp search(mb_query) do Records.search_release_group(mb_query, limit: 10) end + + defp toggle_actions_menu(record_id) do + JS.toggle(to: "#actions-#{record_id}") + |> JS.toggle_class("pointer-events-none", to: "#records > li") + end + + def close_actions_menu(record_id) do + JS.hide(to: "#actions-#{record_id}") + |> JS.remove_class("pointer-events-none", to: "#records > li") + end end diff --git a/priv/gettext/default.pot b/priv/gettext/default.pot index 6f219c98..68e14241 100644 --- a/priv/gettext/default.pot +++ b/priv/gettext/default.pot @@ -219,6 +219,7 @@ msgstr "" msgid "Import from MusicBrainz" msgstr "" +#: lib/music_library_web/live/record_live/import_component.ex:70 #: lib/music_library_web/live/record_live/index.html.heex:99 #: lib/music_library_web/live/wishlist_live/index.html.heex:99 #, elixir-autogen, elixir-format diff --git a/test/music_library_web/live/record_index_test.exs b/test/music_library_web/live/record_index_test.exs index 13593dd2..fa5bc678 100644 --- a/test/music_library_web/live/record_index_test.exs +++ b/test/music_library_web/live/record_index_test.exs @@ -377,7 +377,7 @@ defmodule MusicLibraryWeb.RecordIndexTest do end) import_live - |> element("#musicbrainz_#{first_result_id} button", "CD") + |> element("#musicbrainz_#{first_result_id} a", "CD") |> render_click() [record] = MusicLibrary.Repo.all(MusicLibrary.Records.Record)