From 3a012bd3b991ce154cd08136c0b08471478ce0eb Mon Sep 17 00:00:00 2001
From: Miodec <jack@monkeytype.com>
Date: Thu, 14 Mar 2024 20:37:45 +0100
Subject: [PATCH] fix: sign up captcha challenge appearing under the modal,
 making it impossible to sign up

---
 frontend/src/ts/modals/register-captcha.ts | 1 +
 frontend/src/ts/utils/animated-modal.ts    | 7 ++++++-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/frontend/src/ts/modals/register-captcha.ts b/frontend/src/ts/modals/register-captcha.ts
index 8e3e610cd8a7..7be9e58ba6ee 100644
--- a/frontend/src/ts/modals/register-captcha.ts
+++ b/frontend/src/ts/modals/register-captcha.ts
@@ -9,6 +9,7 @@ export let promise = new Promise<string | undefined>((resolve) => {
 
 export function show(): void {
   void modal.show({
+    mode: "dialog",
     beforeAnimation: async (modal) => {
       promise = new Promise((resolve) => {
         resolvePromise = resolve;
diff --git a/frontend/src/ts/utils/animated-modal.ts b/frontend/src/ts/utils/animated-modal.ts
index a30c1ae4fee8..099af995670c 100644
--- a/frontend/src/ts/utils/animated-modal.ts
+++ b/frontend/src/ts/utils/animated-modal.ts
@@ -27,6 +27,7 @@ type ShowHideOptions = {
 };
 
 export type ShowOptions = ShowHideOptions & {
+  mode?: "modal" | "dialog";
   focusFirstInput?: true | "focusAndSelect";
   modalChain?: AnimatedModal;
 };
@@ -199,7 +200,11 @@ export default class AnimatedModal {
       }
 
       this.open = true;
-      this.wrapperEl.showModal();
+      if (options?.mode === "dialog") {
+        this.wrapperEl.show();
+      } else if (options?.mode === "modal" || options?.mode === undefined) {
+        this.wrapperEl.showModal();
+      }
 
       //wait until the next event loop to allow the dialog to start animating
       setTimeout(async () => {