local-it/mitgliederverwaltung
2
3
Fork 0
Code Issues 59 Pull requests 5 Projects 2 Releases Packages 1 Activity Actions

feat: consistent and accessible modal on delete
Some checks failed
continuous-integration/drone/push Build is failing
Details

Browse source
This commit is contained in:
carla 2026-02-26 11:17:21 +01:00
parent 2922a4d1ee
commit e422e5f4ef
10 changed files with 424 additions and 102 deletions
Download patch file Download diff file Expand all files Collapse all files

72
lib/mv_web/live/member_live/show.ex
View file

@ -316,13 +316,7 @@ defmodule MvWeb.MemberLive.Show do
</p>
<.button
variant="danger"
phx-click="delete"
phx-value-id={@member.id}
data-confirm={
gettext("Are you sure you want to delete %{name}? This action cannot be undone.",
name: MvWeb.Helpers.MemberHelpers.display_name(@member)
)
}
phx-click="open_delete_modal"
data-testid="member-delete"
aria-label={
gettext("Delete member %{name}",
@ -336,6 +330,40 @@ defmodule MvWeb.MemberLive.Show do
</div>
</section>
<% end %>
<%!-- Delete Member Confirmation Modal (WCAG: focus in modal, keyboard confirm/cancel) --%>
<%= if assigns[:show_delete_modal] do %>
<dialog id="delete-member-modal" class="modal modal-open" role="dialog" aria-labelledby="delete-member-modal-title">
<div class="modal-box">
<h3 id="delete-member-modal-title" class="text-lg font-bold">{gettext("Delete Member")}</h3>
<p class="py-4">
{gettext("Are you sure you want to delete %{name}? This action cannot be undone.",
name: MvWeb.Helpers.MemberHelpers.display_name(@member)
)}
</p>
<div class="modal-action">
<.button
type="button"
variant="neutral"
phx-click="cancel_delete_modal"
phx-mounted={JS.focus()}
id="delete-member-modal-cancel"
aria-label={gettext("Cancel")}
>
{gettext("Cancel")}
</.button>
<.button
type="button"
variant="danger"
phx-click={JS.push("delete", value: %{id: @member.id})}
aria-label={gettext("Delete member")}
>
{gettext("Delete")}
</.button>
</div>
</div>
</dialog>
<% end %>
</div>
</Layouts.app>
"""
@ -346,7 +374,8 @@ defmodule MvWeb.MemberLive.Show do
{:ok,
socket
|> assign(:active_tab, :contact)
|> assign(:vereinfacht_receipts, nil)}
|> assign(:vereinfacht_receipts, nil)
|> assign_new(:show_delete_modal, fn -> false end)}
end
@impl true
@ -398,13 +427,26 @@ defmodule MvWeb.MemberLive.Show do
{:noreply, assign(socket, :active_tab, :membership_fees)}
end
@impl true
def handle_event("open_delete_modal", _params, socket) do
{:noreply, assign(socket, :show_delete_modal, true)}
end
@impl true
def handle_event("cancel_delete_modal", _params, socket) do
{:noreply, assign(socket, :show_delete_modal, false)}
end
@impl true
def handle_event("delete", %{"id" => id}, socket) do
member = socket.assigns.member
actor = current_actor(socket)
if to_string(id) != to_string(member.id) do
{:noreply, put_flash(socket, :error, gettext("Member not found"))}
{:noreply,
socket
|> put_flash(:error, gettext("Member not found"))
|> assign(:show_delete_modal, false)}
else
case Ash.destroy(member, actor: actor) do
:ok ->
@ -415,16 +457,20 @@ defmodule MvWeb.MemberLive.Show do
{:error, %Ash.Error.Forbidden{}} ->
{:noreply,
put_flash(
socket,
socket
|> put_flash(
:error,
gettext("You do not have permission to delete this member")
)}
)
|> assign(:show_delete_modal, false)}
{:error, error} ->
require Logger
Logger.warning("Member delete failed: member_id=#{member.id} error=#{inspect(error)}")
{:noreply, put_flash(socket, :error, format_error(error))}
{:noreply,
socket
|> put_flash(:error, format_error(error))
|> assign(:show_delete_modal, false)}
end
end
end