From b2449757f9adb7890e6e6d3cc8c802995fc44fba Mon Sep 17 00:00:00 2001
From: Jens Langhammer <jens.langhammer@beryju.org>
Date: Tue, 2 Mar 2021 22:30:21 +0100
Subject: [PATCH] web/stages/authenticator_validate: only show back button when
 multiple challenges

---
 .../AuthenticatorValidateStage.ts             |  6 ++++--
 .../AuthenticatorValidateStageCode.ts         | 21 ++++++++++++-------
 .../AuthenticatorValidateStageWebAuthn.ts     | 21 ++++++++++++-------
 3 files changed, 30 insertions(+), 18 deletions(-)

diff --git a/web/src/elements/stages/authenticator_validate/AuthenticatorValidateStage.ts b/web/src/elements/stages/authenticator_validate/AuthenticatorValidateStage.ts
index e9acacf76..a342c9c28 100644
--- a/web/src/elements/stages/authenticator_validate/AuthenticatorValidateStage.ts
+++ b/web/src/elements/stages/authenticator_validate/AuthenticatorValidateStage.ts
@@ -119,13 +119,15 @@ export class AuthenticatorValidateStage extends BaseStage implements StageHost {
             return html`<ak-stage-authenticator-validate-code
                 .host=${this}
                 .challenge=${this.challenge}
-                .deviceChallenge=${this.selectedDeviceChallenge}>
+                .deviceChallenge=${this.selectedDeviceChallenge}
+                .showBackButton=${(this.challenge?.device_challenges.length || []) > 1}>
             </ak-stage-authenticator-validate-code>`;
         case DeviceClasses.WEBAUTHN:
             return html`<ak-stage-authenticator-validate-webauthn
                 .host=${this}
                 .challenge=${this.challenge}
-                .deviceChallenge=${this.selectedDeviceChallenge}>
+                .deviceChallenge=${this.selectedDeviceChallenge}
+                .showBackButton=${(this.challenge?.device_challenges.length || []) > 1}>
             </ak-stage-authenticator-validate-webauthn>`;
         }
     }
diff --git a/web/src/elements/stages/authenticator_validate/AuthenticatorValidateStageCode.ts b/web/src/elements/stages/authenticator_validate/AuthenticatorValidateStageCode.ts
index 712c9677b..a54799627 100644
--- a/web/src/elements/stages/authenticator_validate/AuthenticatorValidateStageCode.ts
+++ b/web/src/elements/stages/authenticator_validate/AuthenticatorValidateStageCode.ts
@@ -14,6 +14,9 @@ export class AuthenticatorValidateStageWebCode extends BaseStage {
     @property({ attribute: false })
     deviceChallenge?: DeviceChallenge;
 
+    @@property({ type: Boolean })
+    showBackButton = false;
+
     static get styles(): CSSResult[] {
         return COMMON_STYLES;
     }
@@ -61,14 +64,16 @@ export class AuthenticatorValidateStageWebCode extends BaseStage {
         </div>
         <footer class="pf-c-login__main-footer">
             <ul class="pf-c-login__main-footer-links">
-                <li class="pf-c-login__main-footer-links-item">
-                    <button class="pf-c-button pf-m-secondary pf-m-block" @click=${() => {
-                        if (!this.host) return;
-                        (this.host as AuthenticatorValidateStage).selectedDeviceChallenge = undefined;
-                    }}>
-                        ${gettext("Return to device picker")}
-                    </button>
-                </li>
+                ${this.showBackButton ?
+                    html`<li class="pf-c-login__main-footer-links-item">
+                        <button class="pf-c-button pf-m-secondary pf-m-block" @click=${() => {
+                            if (!this.host) return;
+                            (this.host as AuthenticatorValidateStage).selectedDeviceChallenge = undefined;
+                        }}>
+                            ${gettext("Return to device picker")}
+                        </button>
+                    </li>`:
+                    html``}
             </ul>
         </footer>`;
     }
diff --git a/web/src/elements/stages/authenticator_validate/AuthenticatorValidateStageWebAuthn.ts b/web/src/elements/stages/authenticator_validate/AuthenticatorValidateStageWebAuthn.ts
index 276352e15..089e47a73 100644
--- a/web/src/elements/stages/authenticator_validate/AuthenticatorValidateStageWebAuthn.ts
+++ b/web/src/elements/stages/authenticator_validate/AuthenticatorValidateStageWebAuthn.ts
@@ -21,6 +21,9 @@ export class AuthenticatorValidateStageWebAuthn extends BaseStage {
     @property()
     authenticateMessage = "";
 
+    @property({type: Boolean})
+    showBackButton = false;
+
     static get styles(): CSSResult[] {
         return COMMON_STYLES;
     }
@@ -98,14 +101,16 @@ export class AuthenticatorValidateStageWebAuthn extends BaseStage {
         </div>
         <footer class="pf-c-login__main-footer">
             <ul class="pf-c-login__main-footer-links">
-                <li class="pf-c-login__main-footer-links-item">
-                    <button class="pf-c-button pf-m-secondary pf-m-block" @click=${() => {
-                        if (!this.host) return;
-                        (this.host as AuthenticatorValidateStage).selectedDeviceChallenge = undefined;
-                    }}>
-                        ${gettext("Return to device picker")}
-                    </button>
-                </li>
+                ${this.showBackButton ?
+                    html`<li class="pf-c-login__main-footer-links-item">
+                        <button class="pf-c-button pf-m-secondary pf-m-block" @click=${() => {
+                            if (!this.host) return;
+                            (this.host as AuthenticatorValidateStage).selectedDeviceChallenge = undefined;
+                        }}>
+                            ${gettext("Return to device picker")}
+                        </button>
+                    </li>`:
+                    html``}
             </ul>
         </footer>`;
     }