Feature/579

core/frameworks/pixel/components/confirmation_modal.ex

@@ -0,0 +1,56 @@
+defmodule Frameworks.Pixel.ConfirmationModal do
+  use CoreWeb, :live_component
+
+  @impl true
+  def update(_params, socket) do
+    {
+      :ok,
+      update_buttons(socket)
+    }
+  end
+
+  defp update_buttons(%{assigns: %{myself: myself}} = socket) do
+    confirm = %{
+      action: %{type: :send, target: myself, event: "confirm"},
+      face: %{type: :primary, label: dgettext("eyra-ui", "confirm.button")}
+    }
+
+    cancel = %{
+      action: %{type: :send, target: myself, event: "cancel"},
+      face: %{type: :secondary, label: dgettext("eyra-ui", "cancel.button")}
+    }
+
+    assign(socket, buttons: [confirm, cancel])
+  end
+
+  def handle_event("confirm", _, socket) do
+    {:noreply, socket |> send_event(:parent, "confirmed")}
+  end
+
+  def handle_event("cancel", _, socket) do
+    {:noreply, socket |> send_event(:parent, "cancelled")}
+  end
+
+  @impl true
+  @spec render(any()) :: Phoenix.LiveView.Rendered.t()
+  def render(assigns) do
+    ~H"""
+      <div>
+        <Text.title2>
+          <%= dgettext("eyra-ui", "confirmation_modal.title") %>
+        </Text.title2>
+        <.spacing value="M" />
+        <Text.body_large>
+          <%= dgettext("eyra-ui", "confirmation_modal.body") %>
+        </Text.body_large>
+        <.spacing value="M" />
+
+        <div class="flex flex-row gap-4">
+        <%= for button <- @buttons do %>
+          <Button.dynamic {button} />
+        <% end %>
+      </div>
+      </div>
+    """
+  end
+end

core/frameworks/pixel/components/modal_view.ex

@@ -34,7 +34,14 @@ defmodule Frameworks.Pixel.ModalView do
   attr(:style, :atom, required: true)
   attr(:live_component, :map, required: true)
 
-  def container(assigns) do
+  def container(%{style: style} = assigns) do
+    allowed_styles = [:page, :sheet, :dialog, :notification]
+
+    unless style in allowed_styles do
+      raise ArgumentError,
+            "Invalid style: #{style}. Allowed styles are: #{Enum.join(allowed_styles, ", ")}"
+    end
+
     ~H"""
     <%= if @style == :page do %>
       <.page live_component={@live_component} />

core/priv/gettext/de/LC_MESSAGES/eyra-ui.po

@@ -194,3 +194,15 @@ msgstr ""
 #, elixir-autogen, elixir-format
 msgid "menu.item.workspace"
 msgstr ""
+
+#, elixir-autogen, elixir-format, fuzzy
+msgid "confirm.button"
+msgstr ""
+
+#, elixir-autogen, elixir-format
+msgid "confirmation_modal.body"
+msgstr ""
+
+#, elixir-autogen, elixir-format
+msgid "confirmation_modal.title"
+msgstr ""

core/priv/gettext/en/LC_MESSAGES/eyra-ui.po

@@ -193,3 +193,15 @@ msgstr "Desktop"
 #, elixir-autogen, elixir-format, fuzzy
 msgid "menu.item.workspace"
 msgstr "My workspace"
+
+#, elixir-autogen, elixir-format, fuzzy
+msgid "confirm.button"
+msgstr "Confirm"
+
+#, elixir-autogen, elixir-format
+msgid "confirmation_modal.body"
+msgstr "Are you sure you would like to skip this page? Your text will be deleted."
+
+#, elixir-autogen, elixir-format
+msgid "confirmation_modal.title"
+msgstr "Are you sure?"

core/priv/gettext/eyra-ui.pot

@@ -193,3 +193,15 @@ msgstr ""
 #, elixir-autogen, elixir-format
 msgid "menu.item.workspace"
 msgstr ""
+
+#, elixir-autogen, elixir-format
+msgid "confirm.button"
+msgstr ""
+
+#, elixir-autogen, elixir-format
+msgid "confirmation_modal.body"
+msgstr ""
+
+#, elixir-autogen, elixir-format
+msgid "confirmation_modal.title"
+msgstr ""

core/priv/gettext/nl/LC_MESSAGES/eyra-ui.po

@@ -193,3 +193,15 @@ msgstr "To-do"
 #, elixir-autogen, elixir-format, fuzzy
 msgid "menu.item.workspace"
 msgstr "Mijn werkplek"
+
+#, elixir-autogen, elixir-format, fuzzy
+msgid "confirm.button"
+msgstr "Klaar"
+
+#, elixir-autogen, elixir-format
+msgid "confirmation_modal.body"
+msgstr ""
+
+#, elixir-autogen, elixir-format
+msgid "confirmation_modal.title"
+msgstr ""

core/systems/assignment/content_page_form.ex

@@ -64,6 +64,18 @@ defmodule Systems.Assignment.ContentPageForm do
     }
   end
 
+  @impl true
+  def compose(:confirmation_modal, %{page_ref: page_ref}) do
+    %{
+      module: Pixel.ConfirmationModal,
+      params: %{
+        assigns: %{
+          page_ref: page_ref
+        }
+      }
+    }
+  end
+
   @impl true
   def compose(:content_page_form, %{page_ref: nil}) do
     %{
@@ -99,16 +111,34 @@ defmodule Systems.Assignment.ContentPageForm do
   end
 
   @impl true
-  def handle_event("update", %{status: :off}, %{assigns: %{page_ref: page_ref}} = socket) do
-    {:ok, _} = Assignment.Public.delete_page_ref(page_ref)
-
+  def handle_event("update", %{status: :off}, socket) do
     {
       :noreply,
-      socket |> assign(page_ref: page_ref)
+      socket
+      |> compose_child(:confirmation_modal)
+      |> show_modal(:confirmation_modal, :dialog)
     }
   end
 
   @impl true
+  def handle_event("cancelled", %{source: %{name: :confirmation_modal}}, socket) do
+    {:noreply,
+     socket
+     |> hide_modal(:confirmation_modal)}
+  end
+
+  @impl true
+  def handle_event(
+        "confirmed",
+        %{source: %{name: :confirmation_modal}},
+        %{assigns: %{page_ref: page_ref}} = socket
+      ) do
+    {:ok, _} = Assignment.Public.delete_page_ref(page_ref)
+    {:noreply, socket |> hide_modal(:confirmation_modal)}
+  end
+
+  @impl true
+  @spec render(any()) :: Phoenix.LiveView.Rendered.t()
   def render(assigns) do
     ~H"""
       <div>

core/systems/assignment/gdpr_form.ex

@@ -55,6 +55,18 @@ defmodule Systems.Assignment.GdprForm do
     }
   end
 
+  @impl true
+  def compose(:confirmation_modal, %{entity: %{consent_agreement: consent_agreement}}) do
+    %{
+      module: Pixel.ConfirmationModal,
+      params: %{
+        assigns: %{
+          consent_agreement: consent_agreement
+        }
+      }
+    }
+  end
+
   @impl true
   def handle_event(
         "update",
@@ -71,15 +83,32 @@ defmodule Systems.Assignment.GdprForm do
   end
 
   @impl true
-  def handle_event("update", %{status: :off}, %{assigns: %{entity: assignment}} = socket) do
-    {:ok, _} = Assignment.Public.update_consent_agreement(assignment, nil)
-
+  def handle_event("update", %{status: :off}, socket) do
     {
       :noreply,
       socket
+      |> compose_child(:confirmation_modal)
+      |> show_modal(:confirmation_modal, :dialog)
     }
   end
 
+  @impl true
+  def handle_event("cancelled", %{source: %{name: :confirmation_modal}}, socket) do
+    {:noreply,
+     socket
+     |> hide_modal(:confirmation_modal)}
+  end
+
+  @impl true
+  def handle_event(
+        "confirmed",
+        %{source: %{name: :confirmation_modal}},
+        %{assigns: %{entity: assignment}} = socket
+      ) do
+    {:ok, _} = Assignment.Public.update_consent_agreement(assignment, nil)
+    {:noreply, socket |> hide_modal(:confirmation_modal)}
+  end
+
   @impl true
   def render(assigns) do
     ~H"""