From 0ac7433ea7fa952c46062daef1c3de535d92b7f3 Mon Sep 17 00:00:00 2001
From: Sebastian <sebasjm@gmail.com>
Date: Wed, 10 Nov 2021 18:10:45 -0300
Subject: confirm personal information fix #7090

---
 .../src/pages/home/ConfirmModal.tsx                | 52 ++++++++++++++++++++++
 1 file changed, 52 insertions(+)
 create mode 100644 packages/anastasis-webui/src/pages/home/ConfirmModal.tsx

(limited to 'packages/anastasis-webui/src/pages/home/ConfirmModal.tsx')

diff --git a/packages/anastasis-webui/src/pages/home/ConfirmModal.tsx b/packages/anastasis-webui/src/pages/home/ConfirmModal.tsx
new file mode 100644
index 000000000..cab70de63
--- /dev/null
+++ b/packages/anastasis-webui/src/pages/home/ConfirmModal.tsx
@@ -0,0 +1,52 @@
+import { ComponentChildren, h, VNode } from "preact";
+
+export interface ConfirmModelProps {
+  active?: boolean;
+  description?: string;
+  onCancel?: () => void;
+  onConfirm?: () => void;
+  label?: string;
+  cancelLabel?: string;
+  children?: ComponentChildren;
+  danger?: boolean;
+  disabled?: boolean;
+}
+
+export function ConfirmModal({
+  active, description, onCancel, onConfirm, children, danger, disabled, label = "Confirm", cancelLabel = "Dismiss"
+}: ConfirmModelProps): VNode {
+  return (
+    <div class={active ? "modal is-active" : "modal"}>
+      <div class="modal-background " onClick={onCancel} />
+      <div class="modal-card" style={{ maxWidth: 700 }}>
+        <header class="modal-card-head">
+          {!description ? null : (
+            <p class="modal-card-title">
+              <b>{description}</b>
+            </p>
+          )}
+          <button class="delete " aria-label="close" onClick={onCancel} />
+        </header>
+        <section class="modal-card-body">{children}</section>
+        <footer class="modal-card-foot">
+          <button class="button" onClick={onCancel}>
+            {cancelLabel}
+          </button>
+          <div class="buttons is-right" style={{ width: "100%" }}>
+            <button
+              class={danger ? "button is-danger " : "button is-info "}
+              disabled={disabled}
+              onClick={onConfirm}
+            >
+              {label}
+            </button>
+          </div>
+        </footer>
+      </div>
+      <button
+        class="modal-close is-large "
+        aria-label="close"
+        onClick={onCancel} />
+    </div>
+  );
+}
-- 
cgit v1.2.3