web/admin: migrate prompts to web

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer 2021-03-30 22:12:06 +02:00
parent 8a3b1ae29d
commit cb0b5f7146
6 changed files with 149 additions and 96 deletions

View File

@ -10,7 +10,6 @@ from authentik.admin.views import (
sources,
stages,
stages_bindings,
stages_prompts,
)
from authentik.providers.saml.views.metadata import MetadataImportView
@ -74,17 +73,6 @@ urlpatterns = [
stages_bindings.StageBindingUpdateView.as_view(),
name="stage-binding-update",
),
# Stage Prompts
path(
"stages_prompts/create/",
stages_prompts.PromptCreateView.as_view(),
name="stage-prompt-create",
),
path(
"stages_prompts/<uuid:pk>/update/",
stages_prompts.PromptUpdateView.as_view(),
name="stage-prompt-update",
),
# Property Mappings
path(
"property-mappings/create/",

View File

@ -1,48 +0,0 @@
"""authentik Prompt administration"""
from django.contrib.auth.mixins import LoginRequiredMixin
from django.contrib.auth.mixins import (
PermissionRequiredMixin as DjangoPermissionRequiredMixin,
)
from django.contrib.messages.views import SuccessMessageMixin
from django.urls import reverse_lazy
from django.utils.translation import gettext as _
from django.views.generic import UpdateView
from guardian.mixins import PermissionRequiredMixin
from authentik.lib.views import CreateAssignPermView
from authentik.stages.prompt.forms import PromptAdminForm
from authentik.stages.prompt.models import Prompt
class PromptCreateView(
SuccessMessageMixin,
LoginRequiredMixin,
DjangoPermissionRequiredMixin,
CreateAssignPermView,
):
"""Create new Prompt"""
model = Prompt
form_class = PromptAdminForm
permission_required = "authentik_stages_prompt.add_prompt"
template_name = "generic/create.html"
success_url = reverse_lazy("authentik_core:if-admin")
success_message = _("Successfully created Prompt")
class PromptUpdateView(
SuccessMessageMixin,
LoginRequiredMixin,
PermissionRequiredMixin,
UpdateView,
):
"""Update prompt"""
model = Prompt
form_class = PromptAdminForm
permission_required = "authentik_stages_prompt.change_prompt"
template_name = "generic/update.html"
success_url = reverse_lazy("authentik_core:if-admin")
success_message = _("Successfully updated Prompt")

View File

@ -1,7 +1,7 @@
"""Prompt forms"""
from django import forms
from authentik.stages.prompt.models import Prompt, PromptStage
from authentik.stages.prompt.models import PromptStage
class PromptStageForm(forms.ModelForm):
@ -14,23 +14,3 @@ class PromptStageForm(forms.ModelForm):
widgets = {
"name": forms.TextInput(),
}
class PromptAdminForm(forms.ModelForm):
"""Form to edit Prompt instances for admins"""
class Meta:
model = Prompt
fields = [
"field_key",
"label",
"type",
"required",
"placeholder",
"order",
]
widgets = {
"label": forms.TextInput(),
"placeholder": forms.TextInput(),
}

View File

@ -24,10 +24,6 @@ export class AdminURLManager {
return `/administration/stages/${rest}`;
}
static stagePrompts(rest: string): string {
return `/administration/stages_prompts/${rest}`;
}
static stageBindings(rest: string): string {
return `/administration/stages/bindings/${rest}`;
}

View File

@ -0,0 +1,122 @@
import { Prompt, PromptTypeEnum, 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";
@customElement("ak-stage-prompt-form")
export class PromptForm extends Form<Prompt> {
@property({attribute: false})
prompt?: Prompt;
getSuccessMessage(): string {
if (this.prompt) {
return gettext("Successfully updated prompt.");
} else {
return gettext("Successfully created prompt.");
}
}
send = (data: Prompt): Promise<Prompt> => {
if (this.prompt) {
return new StagesApi(DEFAULT_CONFIG).stagesPromptPromptsUpdate({
promptUuid: this.prompt.pk || "",
data: data
});
} else {
return new StagesApi(DEFAULT_CONFIG).stagesPromptPromptsCreate({
data: data
});
}
};
renderTypes(): TemplateResult {
return html`
<option value=${PromptTypeEnum.Text} ?selected=${this.prompt?.type === PromptTypeEnum.Text}>
${gettext("Text: Simple Text input")}
</option>
<option value=${PromptTypeEnum.Username} ?selected=${this.prompt?.type === PromptTypeEnum.Username}>
${gettext("Username: Same as Text input, but checks for and prevents duplicate usernames.")}
</option>
<option value=${PromptTypeEnum.Email} ?selected=${this.prompt?.type === PromptTypeEnum.Email}>
${gettext("Email: Text field with Email type.")}
</option>
<option value=${PromptTypeEnum.Password} ?selected=${this.prompt?.type === PromptTypeEnum.Password}>
${gettext("Password: Masked input, password is validated against sources. Policies still have to be applied to this Stage. If two of these are used in the same stage, they are ensured to be identical.")}
</option>
<option value=${PromptTypeEnum.Number} ?selected=${this.prompt?.type === PromptTypeEnum.Number}>
${gettext("Number")}
</option>
<option value=${PromptTypeEnum.Checkbox} ?selected=${this.prompt?.type === PromptTypeEnum.Checkbox}>
${gettext("Checkbox")}
</option>
<option value=${PromptTypeEnum.Date} ?selected=${this.prompt?.type === PromptTypeEnum.Date}>
${gettext("Date")}
</option>
<option value=${PromptTypeEnum.DateTime} ?selected=${this.prompt?.type === PromptTypeEnum.DateTime}>
${gettext("Date Time")}
</option>
<option value=${PromptTypeEnum.Separator} ?selected=${this.prompt?.type === PromptTypeEnum.Separator}>
${gettext("Separator: Static Separator Line")}
</option>
<option value=${PromptTypeEnum.Hidden} ?selected=${this.prompt?.type === PromptTypeEnum.Hidden}>
${gettext("Hidden: Hidden field, can be used to insert data into form.")}
</option>
<option value=${PromptTypeEnum.Static} ?selected=${this.prompt?.type === PromptTypeEnum.Static}>
${gettext("Static: Static value, displayed as-is.")}
</option>
`;
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal
label=${gettext("Field Key")}
?required=${true}
name="fieldKey">
<input type="text" value="${ifDefined(this.prompt?.fieldKey)}" class="pf-c-form-control" required>
<p class="pf-c-form__helper-text">${gettext("Name of the form field, also used to store the value.")}</p>
</ak-form-element-horizontal>
<ak-form-element-horizontal
label=${gettext("Label")}
?required=${true}
name="label">
<input type="text" value="${ifDefined(this.prompt?.label)}" class="pf-c-form-control" required>
<p class="pf-c-form__helper-text">${gettext("Label shown next to/above the prompt.")}</p>
</ak-form-element-horizontal>
<ak-form-element-horizontal
label=${gettext("Type")}
?required=${true}
name="type">
<select class="pf-c-form-control">
${this.renderTypes()}
</select>
</ak-form-element-horizontal>
<ak-form-element-horizontal name="required">
<div class="pf-c-check">
<input type="checkbox" class="pf-c-check__input" ?checked=${this.prompt?.required || false}>
<label class="pf-c-check__label">
${gettext("Required")}
</label>
</div>
</ak-form-element-horizontal>
<ak-form-element-horizontal
label=${gettext("Placeholder")}
name="placeholder">
<input type="text" value="${ifDefined(this.prompt?.placeholder)}" class="pf-c-form-control" required>
<p class="pf-c-form__helper-text">${gettext("Optionally pre-fill the input value")}</p>
</ak-form-element-horizontal>
<ak-form-element-horizontal
label=${gettext("Order")}
?required=${true}
name="order">
<input type="number" value="${ifDefined(this.prompt?.order)}" class="pf-c-form-control" required>
</ak-form-element-horizontal>
</form>`;
}
}

View File

@ -6,11 +6,12 @@ import { TablePage } from "../../elements/table/TablePage";
import "../../elements/buttons/ModalButton";
import "../../elements/buttons/SpinnerButton";
import "../../elements/forms/DeleteForm";
import "../../elements/forms/ModalForm";
import "./PromptForm";
import { TableColumn } from "../../elements/table/Table";
import { PAGE_SIZE } from "../../constants";
import { Prompt, StagesApi } from "authentik-api";
import { DEFAULT_CONFIG } from "../../api/Config";
import { AdminURLManager } from "../../api/legacy";
@customElement("ak-stage-prompt-list")
export class PromptListPage extends TablePage<Prompt> {
@ -60,12 +61,19 @@ export class PromptListPage extends TablePage<Prompt> {
return html`<li>${stage.name}</li>`;
})}`,
html`
<ak-modal-button href="${AdminURLManager.stagePrompts(`${item.pk}/update/`)}">
<ak-spinner-button slot="trigger" class="pf-m-secondary">
<ak-forms-modal>
<span slot="submit">
${gettext("Update")}
</span>
<span slot="header">
${gettext("Update Prompt")}
</span>
<ak-stage-prompt-form slot="form" .prompt=${item}>
</ak-stage-prompt-form>
<button slot="trigger" class="pf-c-button pf-m-secondary">
${gettext("Edit")}
</ak-spinner-button>
<div slot="modal"></div>
</ak-modal-button>
</button>
</ak-forms-modal>
<ak-forms-delete
.obj=${item}
objectLabel=${gettext("Prompt")}
@ -83,12 +91,19 @@ export class PromptListPage extends TablePage<Prompt> {
renderToolbar(): TemplateResult {
return html`
<ak-modal-button href=${AdminURLManager.stagePrompts("create/")}>
<ak-spinner-button slot="trigger" class="pf-m-primary">
<ak-forms-modal>
<span slot="submit">
${gettext("Create")}
</ak-spinner-button>
<div slot="modal"></div>
</ak-modal-button>
</span>
<span slot="header">
${gettext("Create Prompt")}
</span>
<ak-stage-prompt-form slot="form">
</ak-stage-prompt-form>
<button slot="trigger" class="pf-c-button pf-m-primary">
${gettext("Create")}
</button>
</ak-forms-modal>
${super.renderToolbar()}
`;
}