aboutsummaryrefslogtreecommitdiff
path: root/packages/anastasis-webui/src/components/AsyncButton.tsx
diff options
context:
space:
mode:
authorSebastian <sebasjm@gmail.com>2021-11-12 13:12:27 -0300
committerSebastian <sebasjm@gmail.com>2021-11-12 13:12:27 -0300
commit38b84bb8051db2f03b152d66c34a1cb4c8944a12 (patch)
tree1e7a23bacb5287a53da51f93faee8667292c56ee /packages/anastasis-webui/src/components/AsyncButton.tsx
parent377e78e8543b67c22798479fcf2d2f8d1dae5b28 (diff)
downloadwallet-core-38b84bb8051db2f03b152d66c34a1cb4c8944a12.tar.xz
fix #7059
Diffstat (limited to 'packages/anastasis-webui/src/components/AsyncButton.tsx')
-rw-r--r--packages/anastasis-webui/src/components/AsyncButton.tsx12
1 files changed, 11 insertions, 1 deletions
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>