stages/email: migrate to SPA
This commit is contained in:
49
web/src/elements/stages/email/EmailStage.ts
Normal file
49
web/src/elements/stages/email/EmailStage.ts
Normal file
@ -0,0 +1,49 @@
|
||||
import { gettext } from "django";
|
||||
import { CSSResult, customElement, html, property, TemplateResult } from "lit-element";
|
||||
import { Challenge } from "../../../api/Flows";
|
||||
import { COMMON_STYLES } from "../../../common/styles";
|
||||
import { BaseStage } from "../base";
|
||||
|
||||
export type EmailChallenge = Challenge
|
||||
|
||||
@customElement("ak-stage-email")
|
||||
export class EmailStage extends BaseStage {
|
||||
|
||||
@property({ attribute: false })
|
||||
challenge?: EmailChallenge;
|
||||
|
||||
static get styles(): CSSResult[] {
|
||||
return COMMON_STYLES;
|
||||
}
|
||||
|
||||
render(): TemplateResult {
|
||||
if (!this.challenge) {
|
||||
return html`<ak-loading-state></ak-loading-state>`;
|
||||
}
|
||||
return html`<header class="pf-c-login__main-header">
|
||||
<h1 class="pf-c-title pf-m-3xl">
|
||||
${this.challenge.title}
|
||||
</h1>
|
||||
</header>
|
||||
<div class="pf-c-login__main-body">
|
||||
<form class="pf-c-form" @submit=${(e: Event) => { this.submit(e); }}>
|
||||
<div class="pf-c-form__group">
|
||||
<p>
|
||||
${gettext("Check your Emails for a password reset link.")}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="pf-c-form__group pf-m-action">
|
||||
<button type="submit" class="pf-c-button pf-m-primary pf-m-block">
|
||||
${gettext("Send Email again.")}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<footer class="pf-c-login__main-footer">
|
||||
<ul class="pf-c-login__main-footer-links">
|
||||
</ul>
|
||||
</footer>`;
|
||||
}
|
||||
|
||||
}
|
@ -5,11 +5,13 @@ import { getCookie } from "../../utils";
|
||||
import "../../elements/stages/identification/IdentificationStage";
|
||||
import "../../elements/stages/password/PasswordStage";
|
||||
import "../../elements/stages/consent/ConsentStage";
|
||||
import "../../elements/stages/email/EmailStage";
|
||||
import { ShellChallenge, Challenge, ChallengeTypes, Flow, RedirectChallenge } from "../../api/Flows";
|
||||
import { DefaultClient } from "../../api/Client";
|
||||
import { IdentificationChallenge } from "../../elements/stages/identification/IdentificationStage";
|
||||
import { PasswordChallenge } from "../../elements/stages/password/PasswordStage";
|
||||
import { ConsentChallenge } from "../../elements/stages/consent/ConsentStage";
|
||||
import { EmailChallenge } from "../../elements/stages/email/EmailStage";
|
||||
|
||||
@customElement("ak-flow-executor")
|
||||
export class FlowExecutor extends LitElement {
|
||||
@ -112,6 +114,8 @@ export class FlowExecutor extends LitElement {
|
||||
return html`<ak-stage-password .host=${this} .challenge=${this.challenge as PasswordChallenge}></ak-stage-password>`;
|
||||
case "ak-stage-consent":
|
||||
return html`<ak-stage-consent .host=${this} .challenge=${this.challenge as ConsentChallenge}></ak-stage-consent>`;
|
||||
case "ak-stage-email":
|
||||
return html`<ak-stage-email .host=${this} .challenge=${this.challenge as EmailChallenge}></ak-stage-email>`;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
|
Reference in New Issue
Block a user