trustchain-oc1-orchestral/authentik
Archived
10
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

web/stages/prompt: render later so fields aren't cached

Browse source
This commit is contained in:
Jens Langhammer 2021-02-27 21:04:19 +01:00
parent 05a5b5b675
commit b9a9da4ec7
1 changed files with 15 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
web/src/elements/stages/prompt/PromptStage.ts
View file

@ -1,5 +1,6 @@
import { gettext } from "django"; import { gettext } from "django";
import { CSSResult, customElement, html, property, TemplateResult } from "lit-element"; import { CSSResult, customElement, html, property, TemplateResult } from "lit-element";
import { unsafeHTML } from "lit-html/directives/unsafe-html";
import { Challenge } from "../../../api/Flows"; import { Challenge } from "../../../api/Flows";
import { COMMON_STYLES } from "../../../common/styles"; import { COMMON_STYLES } from "../../../common/styles";
import { BaseStage } from "../base"; import { BaseStage } from "../base";
@ -28,10 +29,10 @@ export class PromptStage extends BaseStage {
return COMMON_STYLES; return COMMON_STYLES;
} }
renderPromptInner(prompt: Prompt): TemplateResult { renderPromptInner(prompt: Prompt): string {
switch (prompt.type) { switch (prompt.type) {
case "text": case "text":
return html`<input return `<input
type="text" type="text"
name="${prompt.field_key}" name="${prompt.field_key}"
placeholder="${prompt.placeholder}" placeholder="${prompt.placeholder}"
@ -40,7 +41,7 @@ export class PromptStage extends BaseStage {
?required=${prompt.required} ?required=${prompt.required}
value="">`; value="">`;
case "username": case "username":
return html`<input return `<input
type="text" type="text"
name="${prompt.field_key}" name="${prompt.field_key}"
placeholder="${prompt.placeholder}" placeholder="${prompt.placeholder}"
@ -49,7 +50,7 @@ export class PromptStage extends BaseStage {
?required=${prompt.required} ?required=${prompt.required}
value="">`; value="">`;
case "email": case "email":
return html`<input return `<input
type="email" type="email"
name="${prompt.field_key}" name="${prompt.field_key}"
placeholder="${prompt.placeholder}" placeholder="${prompt.placeholder}"
@ -57,7 +58,7 @@ export class PromptStage extends BaseStage {
?required=${prompt.required} ?required=${prompt.required}
value="">`; value="">`;
case "password": case "password":
return html`<input return `<input
type="password" type="password"
name="${prompt.field_key}" name="${prompt.field_key}"
placeholder="${prompt.placeholder}" placeholder="${prompt.placeholder}"
@ -65,48 +66,48 @@ export class PromptStage extends BaseStage {
class="pf-c-form-control" class="pf-c-form-control"
?required=${prompt.required}>`; ?required=${prompt.required}>`;
case "number": case "number":
return html`<input return `<input
type="number" type="number"
name="${prompt.field_key}" name="${prompt.field_key}"
placeholder="${prompt.placeholder}" placeholder="${prompt.placeholder}"
class="pf-c-form-control" class="pf-c-form-control"
?required=${prompt.required}>`; ?required=${prompt.required}>`;
case "checkbox": case "checkbox":
return html`<input return `<input
type="checkbox" type="checkbox"
name="${prompt.field_key}" name="${prompt.field_key}"
placeholder="${prompt.placeholder}" placeholder="${prompt.placeholder}"
class="pf-c-form-control" class="pf-c-form-control"
?required=${prompt.required}>`; ?required=${prompt.required}>`;
case "date": case "date":
return html`<input return `<input
type="date" type="date"
name="${prompt.field_key}" name="${prompt.field_key}"
placeholder="${prompt.placeholder}" placeholder="${prompt.placeholder}"
class="pf-c-form-control" class="pf-c-form-control"
?required=${prompt.required}>`; ?required=${prompt.required}>`;
case "date-time": case "date-time":
return html`<input return `<input
type="datetime" type="datetime"
name="${prompt.field_key}" name="${prompt.field_key}"
placeholder="${prompt.placeholder}" placeholder="${prompt.placeholder}"
class="pf-c-form-control" class="pf-c-form-control"
?required=${prompt.required}>`; ?required=${prompt.required}>`;
case "separator": case "separator":
return html`<hr>`; return "<hr>";
case "hidden": case "hidden":
return html`<input return `<input
type="hidden" type="hidden"
name="${prompt.field_key}" name="${prompt.field_key}"
value="${prompt.placeholder}" value="${prompt.placeholder}"
class="pf-c-form-control" class="pf-c-form-control"
?required=${prompt.required}>`; ?required=${prompt.required}>`;
case "static": case "static":
return html`<p return `<p
class="pf-c-form-control">${prompt.placeholder} class="pf-c-form-control">${prompt.placeholder}
</p>`; </p>`;
} }
return html``; return "";
} }
render(): TemplateResult { render(): TemplateResult {
@ -126,7 +127,7 @@ export class PromptStage extends BaseStage {
?required="${prompt.required}" ?required="${prompt.required}"
class="pf-c-form__group" class="pf-c-form__group"
.errors=${(this.challenge?.response_errors || {})[prompt.field_key]}> .errors=${(this.challenge?.response_errors || {})[prompt.field_key]}>
${this.renderPromptInner(prompt)} ${unsafeHTML(this.renderPromptInner(prompt))}
</ak-form-element>`; </ak-form-element>`;
})} })}
<div class="pf-c-form__group pf-m-action"> <div class="pf-c-form__group pf-m-action">