web/stages/authenticator_validate: only show back button when multiple challenges

This commit is contained in:
Jens Langhammer 2021-03-02 22:30:21 +01:00
parent a0753bfc88
commit b2449757f9
3 changed files with 30 additions and 18 deletions

View File

@ -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>`;
}
}

View File

@ -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>`;
}

View File

@ -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>`;
}