From e84be59075fad512a95a6edd27de54c618df5297 Mon Sep 17 00:00:00 2001
From: Vincent Salucci <26154748+vincentsalucci@users.noreply.github.com>
Date: Thu, 3 Mar 2022 18:20:29 -0600
Subject: [PATCH] [Captcha] Implement captcha for 2fa (#1390)

* [Captcha] Implement captcha for 2fa

* Update jslib

* Added remaining items necessary for captcha // updated login to match 2fa style
---
 src/app/accounts/login.component.html      | 7 +++++--
 src/app/accounts/two-factor.component.html | 9 ++++++++-
 src/app/accounts/two-factor.component.ts   | 8 ++++++++
 3 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/src/app/accounts/login.component.html b/src/app/accounts/login.component.html
index dd794040d8b..5f44a6e5c00 100644
--- a/src/app/accounts/login.component.html
+++ b/src/app/accounts/login.component.html
@@ -65,12 +65,15 @@
               </a>
             </div>
           </div>
-          <div class="box-content-row" [hidden]="!showCaptcha()">
+        </div>
+      </div>
+      <div class="box last" [hidden]="!showCaptcha()">
+        <div class="box-content">
+          <div class="box-content-row">
             <iframe id="hcaptcha_iframe" height="80"></iframe>
           </div>
         </div>
       </div>
-
       <div class="buttons with-rows">
         <div class="buttons-row">
           <button type="submit" class="btn primary block" [disabled]="form.loading" appBlurClick>
diff --git a/src/app/accounts/two-factor.component.html b/src/app/accounts/two-factor.component.html
index e8d835eb8b9..aab55ab246a 100644
--- a/src/app/accounts/two-factor.component.html
+++ b/src/app/accounts/two-factor.component.html
@@ -5,7 +5,7 @@
   [appApiAction]="formPromise"
   attr.aria-hidden="{{ showingModal }}"
 >
-  <div class="content">
+  <div id="content" class="content">
     <h1>{{ title }}</h1>
     <p *ngIf="selectedProviderType === providerType.Authenticator">
       {{ "enterVerificationCodeApp" | i18n }}
@@ -100,6 +100,13 @@
         </div>
       </div>
     </div>
+    <div class="box last" [hidden]="!showCaptcha()">
+      <div class="box-content">
+        <div class="box-content-row">
+          <iframe id="hcaptcha_iframe" height="80"></iframe>
+        </div>
+      </div>
+    </div>
     <div class="buttons">
       <button
         type="submit"
diff --git a/src/app/accounts/two-factor.component.ts b/src/app/accounts/two-factor.component.ts
index a696d820be1..db482230148 100644
--- a/src/app/accounts/two-factor.component.ts
+++ b/src/app/accounts/two-factor.component.ts
@@ -80,4 +80,12 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
       modal.close();
     });
   }
+
+  async submit() {
+    await super.submit();
+    if (this.captchaSiteKey) {
+      const content = document.getElementById("content") as HTMLDivElement;
+      content.setAttribute("style", "width:335px");
+    }
+  }
 }