stages/password: migrate to web

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer
2021-04-03 00:22:23 +02:00
parent 31226e3c75
commit a9bee998f2
6 changed files with 166 additions and 46 deletions

View File

@ -112,7 +112,7 @@ export class IdentificationStageForm extends Form<IdentificationStage> {
});
}))}
</select>
<p class="pf-c-form__helper-text">${gettext("Optional enrollment flow, which is linked at the bottom of the page..")}</p>
<p class="pf-c-form__helper-text">${gettext("Optional enrollment flow, which is linked at the bottom of the page.")}</p>
</ak-form-element-horizontal>
<ak-form-element-horizontal
label=${gettext("Recovery flow")}

View File

@ -0,0 +1,114 @@
import { FlowDesignationEnum, FlowsApi, PasswordStage, PasswordStageBackendsEnum, StagesApi } from "authentik-api";
import { gettext } from "django";
import { customElement, property } from "lit-element";
import { html, TemplateResult } from "lit-html";
import { DEFAULT_CONFIG } from "../../../api/Config";
import { Form } from "../../../elements/forms/Form";
import { ifDefined } from "lit-html/directives/if-defined";
import "../../../elements/forms/HorizontalFormElement";
import "../../../elements/forms/FormGroup";
import { until } from "lit-html/directives/until";
@customElement("ak-stage-password-form")
export class PasswordStageForm extends Form<PasswordStage> {
set stageUUID(value: string) {
new StagesApi(DEFAULT_CONFIG).stagesPasswordRead({
stageUuid: value,
}).then(stage => {
this.stage = stage;
});
}
@property({attribute: false})
stage?: PasswordStage;
getSuccessMessage(): string {
if (this.stage) {
return gettext("Successfully updated stage.");
} else {
return gettext("Successfully created stage.");
}
}
send = (data: PasswordStage): Promise<PasswordStage> => {
if (this.stage) {
return new StagesApi(DEFAULT_CONFIG).stagesPasswordUpdate({
stageUuid: this.stage.pk || "",
data: data
});
} else {
return new StagesApi(DEFAULT_CONFIG).stagesPasswordCreate({
data: data
});
}
};
isBackendSelected(field: PasswordStageBackendsEnum): boolean {
return (this.stage?.backends || []).filter(isField => {
return field === isField;
}).length > 0;
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal
label=${gettext("Name")}
?required=${true}
name="name">
<input type="text" value="${ifDefined(this.stage?.name || "")}" class="pf-c-form-control" required>
</ak-form-element-horizontal>
<ak-form-group .expanded=${true}>
<span slot="header">
${gettext("Stage-specific settings")}
</span>
<div slot="body" class="pf-c-form">
<ak-form-element-horizontal
label=${gettext("User fields")}
?required=${true}
name="transports">
<select name="users" class="pf-c-form-control" multiple>
<option value=${PasswordStageBackendsEnum.DjangoContribAuthBackendsModelBackend} ?selected=${this.isBackendSelected(PasswordStageBackendsEnum.DjangoContribAuthBackendsModelBackend)}>
${gettext("authentik Builtin Database")}
</option>
<option value=${PasswordStageBackendsEnum.AuthentikSourcesLdapAuthLdapBackend} ?selected=${this.isBackendSelected(PasswordStageBackendsEnum.AuthentikSourcesLdapAuthLdapBackend)}>
${gettext("authentik LDAP Backend")}
</option>
</select>
<p class="pf-c-form__helper-text">${gettext("Selection of backends to test the password against.")}</p>
<p class="pf-c-form__helper-text">${gettext("Hold control/command to select multiple items.")}</p>
</ak-form-element-horizontal>
<ak-form-element-horizontal
label=${gettext("Configuration flow")}
?required=${true}
name="configureFlow">
<select class="pf-c-form-control">
<option value="" ?selected=${this.stage?.configureFlow === undefined}>---------</option>
${until(new FlowsApi(DEFAULT_CONFIG).flowsInstancesList({
ordering: "pk",
designation: FlowDesignationEnum.StageConfiguration,
}).then(flows => {
return flows.results.map(flow => {
let selected = this.stage?.configureFlow === flow.pk;
if (!this.stage?.configureFlow && flow.slug === "default-password-change") {
selected = true;
}
return html`<option value=${ifDefined(flow.pk)} ?selected=${selected}>${flow.name} (${flow.slug})</option>`;
});
}))}
</select>
<p class="pf-c-form__helper-text">${gettext("Flow used by an authenticated user to configure their password. If empty, user will not be able to configure change their password.")}</p>
</ak-form-element-horizontal>
<ak-form-element-horizontal
label=${gettext("Failed attempts before cancel")}
?required=${true}
name="failedAttemptsBeforeCancel">
<input type="number" value="${ifDefined(this.stage?.failedAttemptsBeforeCancel || 5)}" class="pf-c-form-control" required>
<p class="pf-c-form__helper-text">${gettext("How many attempts a user has before the flow is canceled. To lock the user out, use a reputation policy and a user_write stage.")}</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
}
}