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/components/AsyncButton.tsx | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

(limited to 'packages/anastasis-webui/src/components/AsyncButton.tsx')

diff --git a/packages/anastasis-webui/src/components/AsyncButton.tsx b/packages/anastasis-webui/src/components/AsyncButton.tsx
index 33f3a7258..8f855f29f 100644
--- a/packages/anastasis-webui/src/components/AsyncButton.tsx
+++ b/packages/anastasis-webui/src/components/AsyncButton.tsx
@@ -20,6 +20,7 @@
  */
 
 import { ComponentChildren, h, VNode } from "preact";
+import { useLayoutEffect, useRef } from "preact/hooks";
 // import { LoadingModal } from "../modal";
 import { useAsync } from "../hooks/async";
 // import { Translate } from "../../i18n";
@@ -28,17 +29,26 @@ type Props = {
   children: ComponentChildren;
   disabled?: boolean;
   onClick?: () => Promise<void>;
+  grabFocus?: boolean;
   [rest: string]: any;
 };
 
 export function AsyncButton({
   onClick,
+  grabFocus,
   disabled,
   children,
   ...rest
 }: Props): VNode {
   const { isLoading, request } = useAsync(onClick);
 
+  const buttonRef = useRef<HTMLButtonElement>(null);
+  useLayoutEffect(() => {
+    if (grabFocus) {
+      buttonRef.current?.focus();
+    }
+  }, [grabFocus]);
+
   // if (isSlow) {
   //   return <LoadingModal onCancel={cancel} />;
   // }
@@ -48,7 +58,7 @@ export function AsyncButton({
 
   return (
     <span data-tooltip={rest["data-tooltip"]} style={{ marginLeft: 5 }}>
-      <button {...rest} onClick={request} disabled={disabled}>
+      <button {...rest} ref={buttonRef} onClick={request} disabled={disabled}>
         {children}
       </button>
     </span>
-- 
cgit v1.2.3

