From 38b84bb8051db2f03b152d66c34a1cb4c8944a12 Mon Sep 17 00:00:00 2001
From: Sebastian <sebasjm@gmail.com>
Date: Fri, 12 Nov 2021 13:12:27 -0300
Subject: fix #7059

---
 packages/anastasis-webui/src/pages/home/ConfirmModal.tsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

(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
index e3561d892..c9c59c1b4 100644
--- a/packages/anastasis-webui/src/pages/home/ConfirmModal.tsx
+++ b/packages/anastasis-webui/src/pages/home/ConfirmModal.tsx
@@ -1,4 +1,6 @@
+import { differenceInBusinessDays } from "date-fns";
 import { ComponentChildren, h, VNode } from "preact";
+import { useLayoutEffect, useRef } from "preact/hooks";
 import { AsyncButton } from "../../components/AsyncButton";
 
 export interface ConfirmModelProps {
@@ -17,7 +19,7 @@ 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={active ? "modal is-active" : "modal"} >
       <div class="modal-background " onClick={onCancel} />
       <div class="modal-card" style={{ maxWidth: 700 }}>
         <header class="modal-card-head">
@@ -33,8 +35,11 @@ export function ConfirmModal({
           <button class="button" onClick={onCancel}>
             {cancelLabel}
           </button>
-          <div class="buttons is-right" style={{ width: "100%" }}>
+          <div class="buttons is-right" style={{ width: "100%" }} onKeyDown={(e) => {
+            if (e.key === 'Escape' && onCancel) onCancel()
+          }}>
             <AsyncButton
+              grabFocus
               class={danger ? "button is-danger " : "button is-info "}
               disabled={disabled}
               onClick={onConfirm}
-- 
cgit v1.2.3

