diff --git a/lib/music_library_web/live/scrobble_rules_live/index.ex b/lib/music_library_web/live/scrobble_rules_live/index.ex index e33c8391..2777a517 100644 --- a/lib/music_library_web/live/scrobble_rules_live/index.ex +++ b/lib/music_library_web/live/scrobble_rules_live/index.ex @@ -118,20 +118,4 @@ defmodule MusicLibraryWeb.ScrobbleRulesLive.Index do "Disabled" end end - - defp enabled_badge_class(enabled) do - if enabled do - "text-green-800 bg-green-100 dark:bg-green-900 dark:text-green-300" - else - "text-red-800 bg-red-100 dark:bg-red-900 dark:text-red-300" - end - end - - defp type_badge_class(type) do - case type do - "album" -> "text-blue-800 bg-blue-100 dark:bg-blue-900 dark:text-blue-300" - "artist" -> "text-purple-800 bg-purple-100 dark:bg-purple-900 dark:text-purple-300" - _ -> "text-gray-800 bg-gray-100 dark:bg-gray-900 dark:text-gray-300" - end - end end diff --git a/lib/music_library_web/live/scrobble_rules_live/index.html.heex b/lib/music_library_web/live/scrobble_rules_live/index.html.heex index 77e1290a..d3ceafae 100644 --- a/lib/music_library_web/live/scrobble_rules_live/index.html.heex +++ b/lib/music_library_web/live/scrobble_rules_live/index.html.heex @@ -14,136 +14,75 @@ <.icon name="hero-plus" class="h-4 w-4 mr-2" /> {gettext("New Rule")} + <.button phx-click="apply_all_rules" class="!bg-green-600 hover:!bg-green-700"> + <.icon name="hero-play" class="h-4 w-4 mr-2" /> + {gettext("Apply All Rules")} +
- {gettext( - "Rules are applied automatically by the background worker, or you can apply them manually." - )} -
- <.button phx-click="apply_all_rules" class="!bg-green-600 hover:!bg-green-700"> - <.icon name="hero-play" class="h-4 w-4 mr-2" /> - {gettext("Apply All Rules")} - -| - {gettext("Type")} - | -- {gettext("Match Value")} - | -- {gettext("Target MusicBrainz ID")} - | -- {gettext("Status")} - | -- {gettext("Description")} - | -- {gettext("Created")} - | -- {gettext("Actions")} - | -
|---|---|---|---|---|---|---|
| - - {rule_type_badge(scrobble_rule.type)} - - | -- {scrobble_rule.match_value} - | -- {scrobble_rule.target_musicbrainz_id} - | -- - {enabled_badge(scrobble_rule.enabled)} - - | -- {scrobble_rule.description} - | -- {Calendar.strftime(scrobble_rule.inserted_at, "%Y-%m-%d")} - | -
- <.button
- phx-click="apply_rule"
- phx-value-id={scrobble_rule.id}
- class="!bg-green-600 hover:!bg-green-700 !text-white !text-xs !px-2 !py-1"
- >
- <.icon name="hero-play" class="h-3 w-3" />
-
-
- <.button
- phx-click="toggle_enabled"
- phx-value-id={scrobble_rule.id}
- class={[
- "!text-white !text-xs !px-2 !py-1",
- if(scrobble_rule.enabled,
- do: "!bg-yellow-600 hover:!bg-yellow-700",
- else: "!bg-green-600 hover:!bg-green-700"
- )
- ]}
- >
+ <.table>
+ <.table_head>
+ <:col>{gettext("Type")}
+ <:col>{gettext("Match Value")}
+ <:col>{gettext("Target MusicBrainz ID")}
+ <:col>{gettext("Status")}
+ <:col>{gettext("Description")}
+ <:col>{gettext("Created")}
+ <:col>
+
+ <.table_body>
+ <.table_row :for={{dom_id, scrobble_rule} <- @streams.scrobble_rules} id={dom_id}>
+ <:cell>{rule_type_badge(scrobble_rule.type)}
+ <:cell>{scrobble_rule.match_value}
+ <:cell class="whitespace-nowrap font-mono">{scrobble_rule.target_musicbrainz_id}
+ <:cell>{enabled_badge(scrobble_rule.enabled)}
+ <:cell>{scrobble_rule.description}
+ <:cell>{Calendar.strftime(scrobble_rule.inserted_at, "%Y-%m-%d")}
+ <:cell>
+ <.dropdown id={"actions-#{scrobble_rule.id}"} placement="bottom-end">
+ <:toggle>
+
+ {gettext("Actions")}
<.icon
- name={if scrobble_rule.enabled, do: "hero-pause", else: "hero-play"}
- class="h-3 w-3"
+ name="hero-ellipsis-vertical"
+ class="-mt-1 h-5 w-5 text-zinc-500 dark:text-zinc-400 cursor-pointer"
+ aria-hidden="true"
+ data-slot="icon"
/>
-
-
- <.link patch={~p"/scrobble-rules/#{scrobble_rule}/edit"}>
- <.button class="!bg-blue-600 hover:!bg-blue-700 !text-white !text-xs !px-2 !py-1">
- <.icon name="hero-pencil" class="h-3 w-3" />
-
-
-
- <.button
- phx-click="delete"
- phx-value-id={scrobble_rule.id}
- data-confirm={gettext("Are you sure you want to delete this rule?")}
- class="!bg-red-600 hover:!bg-red-700 !text-white !text-xs !px-2 !py-1"
- >
- <.icon name="hero-trash" class="h-3 w-3" />
-
- |
-