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

web/admin: migrate more forms 

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer 2021-05-11 12:05:30 +02:00
parent 4d11d82c6e
commit ff9ff18c11
9 changed files with 100 additions and 114 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
web/src/pages/groups/GroupForm.ts
View File

@ -13,15 +13,19 @@ import "../../elements/chips/Chip";
import "./MemberSelectModal"; import "./MemberSelectModal";
import YAML from "yaml"; import YAML from "yaml";
import { first } from "../../utils"; import { first } from "../../utils";
import { ModelForm } from "../../elements/forms/ModelForm";
@customElement("ak-group-form") @customElement("ak-group-form")
export class GroupForm extends Form<Group> { export class GroupForm extends ModelForm<Group, string> {
@property({attribute: false}) loadInstance(pk: string): Promise<Group> {
group?: Group; return new CoreApi(DEFAULT_CONFIG).coreGroupsRead({
groupUuid: pk
});
}
getSuccessMessage(): string { getSuccessMessage(): string {
if (this.group) { if (this.instance) {
return t`Successfully updated group.`; return t`Successfully updated group.`;
} else { } else {
return t`Successfully created group.`; return t`Successfully created group.`;
@ -29,13 +33,13 @@ export class GroupForm extends Form<Group> {
} }
send = (data: Group): Promise<Group> => { send = (data: Group): Promise<Group> => {
if (this.group?.pk) { if (this.instance?.pk) {
return new CoreApi(DEFAULT_CONFIG).coreGroupsUpdate({ return new CoreApi(DEFAULT_CONFIG).coreGroupsUpdate({
groupUuid: this.group.pk || "", groupUuid: this.instance.pk || "",
data: data data: data
}); });
} else { } else {
data.users = Array.from(this.group?.users || []) as unknown as Set<number>; data.users = Array.from(this.instance?.users || []) as unknown as Set<number>;
return new CoreApi(DEFAULT_CONFIG).coreGroupsCreate({ return new CoreApi(DEFAULT_CONFIG).coreGroupsCreate({
data: data data: data
}); });
@ -48,11 +52,11 @@ export class GroupForm extends Form<Group> {
label=${t`Name`} label=${t`Name`}
?required=${true} ?required=${true}
name="name"> name="name">
<input type="text" value="${ifDefined(this.group?.name)}" class="pf-c-form-control" required> <input type="text" value="${ifDefined(this.instance?.name)}" class="pf-c-form-control" required>
</ak-form-element-horizontal> </ak-form-element-horizontal>
<ak-form-element-horizontal name="isSuperuser"> <ak-form-element-horizontal name="isSuperuser">
<div class="pf-c-check"> <div class="pf-c-check">
<input type="checkbox" class="pf-c-check__input" ?checked=${first(this.group?.isSuperuser, false)}> <input type="checkbox" class="pf-c-check__input" ?checked=${first(this.instance?.isSuperuser, false)}>
<label class="pf-c-check__label"> <label class="pf-c-check__label">
${t`Is superuser`} ${t`Is superuser`}
</label> </label>
@ -63,10 +67,10 @@ export class GroupForm extends Form<Group> {
label=${t`Parent`} label=${t`Parent`}
name="parent"> name="parent">
<select class="pf-c-form-control"> <select class="pf-c-form-control">
<option value="" ?selected=${this.group?.parent === undefined}>---------</option> <option value="" ?selected=${this.instance?.parent === undefined}>---------</option>
${until(new CoreApi(DEFAULT_CONFIG).coreGroupsList({}).then(groups => { ${until(new CoreApi(DEFAULT_CONFIG).coreGroupsList({}).then(groups => {
return groups.results.map(group => { return groups.results.map(group => {
return html`<option value=${ifDefined(group.pk)} ?selected=${this.group?.parent === group.pk}>${group.name}</option>`; return html`<option value=${ifDefined(group.pk)} ?selected=${this.instance?.parent === group.pk}>${group.name}</option>`;
}); });
}), html`<option>${t`Loading...`}</option>`)} }), html`<option>${t`Loading...`}</option>`)}
</select> </select>
@ -79,8 +83,8 @@ export class GroupForm extends Form<Group> {
.confirm=${(items: User[]) => { .confirm=${(items: User[]) => {
// Because the model only has the IDs, map the user list to IDs // Because the model only has the IDs, map the user list to IDs
const ids = items.map(u => u.pk || 0); const ids = items.map(u => u.pk || 0);
if (!this.group) this.group = {} as Group; if (!this.instance) this.instance = {} as Group;
this.group.users = new Set(Array.from(this.group?.users || []).concat(ids)); this.instance.users = new Set(Array.from(this.instance?.users || []).concat(ids));
this.requestUpdate(); this.requestUpdate();
return Promise.resolve(); return Promise.resolve();
}}> }}>
@ -94,7 +98,7 @@ export class GroupForm extends Form<Group> {
ordering: "username", ordering: "username",
}).then(users => { }).then(users => {
return users.results.map(user => { return users.results.map(user => {
const selected = Array.from(this.group?.users || []).some(su => { const selected = Array.from(this.instance?.users || []).some(su => {
return su == user.pk; return su == user.pk;
}); });
if (!selected) return; if (!selected) return;
@ -102,11 +106,11 @@ export class GroupForm extends Form<Group> {
.removable=${true} .removable=${true}
value=${ifDefined(user.pk)} value=${ifDefined(user.pk)}
@remove=${() => { @remove=${() => {
if (!this.group) return; if (!this.instance) return;
const users = Array.from(this.group?.users || []); const users = Array.from(this.instance?.users || []);
const idx = users.indexOf(user.pk || 0); const idx = users.indexOf(user.pk || 0);
users.splice(idx, 1); users.splice(idx, 1);
this.group.users = new Set(users); this.instance.users = new Set(users);
this.requestUpdate(); this.requestUpdate();
}}> }}>
${user.username} ${user.username}
@ -122,7 +126,7 @@ export class GroupForm extends Form<Group> {
label=${t`Attributes`} label=${t`Attributes`}
?required=${true} ?required=${true}
name="attributes"> name="attributes">
<ak-codemirror mode="yaml" value="${YAML.stringify(first(this.group?.attributes, {}))}"> <ak-codemirror mode="yaml" value="${YAML.stringify(first(this.instance?.attributes, {}))}">
</ak-codemirror> </ak-codemirror>
<p class="pf-c-form__helper-text">${t`Set custom attributes using YAML or JSON.`}</p> <p class="pf-c-form__helper-text">${t`Set custom attributes using YAML or JSON.`}</p>
</ak-form-element-horizontal> </ak-form-element-horizontal>

2
web/src/pages/groups/GroupListPage.ts
View File

@ -63,7 +63,7 @@ export class GroupListPage extends TablePage<Group> {
<span slot="header"> <span slot="header">
${t`Update Group`} ${t`Update Group`}
</span> </span>
<ak-group-form slot="form" .group=${item}> <ak-group-form slot="form" .instancePk=${item.pk}>
</ak-group-form> </ak-group-form>
<button slot="trigger" class="pf-c-button pf-m-secondary"> <button slot="trigger" class="pf-c-button pf-m-secondary">
${t`Edit`} ${t`Edit`}

37
web/src/pages/outposts/ServiceConnectionDockerForm.ts
View File

@ -1,30 +1,25 @@
import { CryptoApi, DockerServiceConnection, OutpostsApi } from "authentik-api"; import { CryptoApi, DockerServiceConnection, OutpostsApi } from "authentik-api";
import { t } from "@lingui/macro"; import { t } from "@lingui/macro";
import { customElement, property } from "lit-element"; import { customElement } from "lit-element";
import { html, TemplateResult } from "lit-html"; import { html, TemplateResult } from "lit-html";
import { DEFAULT_CONFIG } from "../../api/Config"; import { DEFAULT_CONFIG } from "../../api/Config";
import { Form } from "../../elements/forms/Form";
import { until } from "lit-html/directives/until"; import { until } from "lit-html/directives/until";
import { ifDefined } from "lit-html/directives/if-defined"; import { ifDefined } from "lit-html/directives/if-defined";
import "../../elements/forms/HorizontalFormElement"; import "../../elements/forms/HorizontalFormElement";
import { first } from "../../utils"; import { first } from "../../utils";
import { ModelForm } from "../../elements/forms/ModelForm";
@customElement("ak-service-connection-docker-form") @customElement("ak-service-connection-docker-form")
export class ServiceConnectionDockerForm extends Form<DockerServiceConnection> { export class ServiceConnectionDockerForm extends ModelForm<DockerServiceConnection, string> {
set scUUID(value: string) { loadInstance(pk: string): Promise<DockerServiceConnection> {
new OutpostsApi(DEFAULT_CONFIG).outpostsServiceConnectionsDockerRead({ return new OutpostsApi(DEFAULT_CONFIG).outpostsServiceConnectionsDockerRead({
uuid: value, uuid: pk,
}).then(sc => {
this.sc = sc;
}); });
} }
@property({attribute: false})
sc?: DockerServiceConnection;
getSuccessMessage(): string { getSuccessMessage(): string {
if (this.sc) { if (this.instance) {
return t`Successfully updated service-connection.`; return t`Successfully updated service-connection.`;
} else { } else {
return t`Successfully created service-connection.`; return t`Successfully created service-connection.`;
@ -32,9 +27,9 @@ export class ServiceConnectionDockerForm extends Form<DockerServiceConnection> {
} }
send = (data: DockerServiceConnection): Promise<DockerServiceConnection> => { send = (data: DockerServiceConnection): Promise<DockerServiceConnection> => {
if (this.sc) { if (this.instance) {
return new OutpostsApi(DEFAULT_CONFIG).outpostsServiceConnectionsDockerUpdate({ return new OutpostsApi(DEFAULT_CONFIG).outpostsServiceConnectionsDockerUpdate({
uuid: this.sc.pk || "", uuid: this.instance.pk || "",
data: data data: data
}); });
} else { } else {
@ -50,11 +45,11 @@ export class ServiceConnectionDockerForm extends Form<DockerServiceConnection> {
label=${t`Name`} label=${t`Name`}
?required=${true} ?required=${true}
name="name"> name="name">
<input type="text" value="${ifDefined(this.sc?.name)}" class="pf-c-form-control" required> <input type="text" value="${ifDefined(this.instance?.name)}" class="pf-c-form-control" required>
</ak-form-element-horizontal> </ak-form-element-horizontal>
<ak-form-element-horizontal name="local"> <ak-form-element-horizontal name="local">
<div class="pf-c-check"> <div class="pf-c-check">
<input type="checkbox" class="pf-c-check__input" ?checked=${first(this.sc?.local, false)}> <input type="checkbox" class="pf-c-check__input" ?checked=${first(this.instance?.local, false)}>
<label class="pf-c-check__label"> <label class="pf-c-check__label">
${t`Local`} ${t`Local`}
</label> </label>
@ -65,19 +60,19 @@ export class ServiceConnectionDockerForm extends Form<DockerServiceConnection> {
label=${t`Docker URL`} label=${t`Docker URL`}
?required=${true} ?required=${true}
name="url"> name="url">
<input type="text" value="${ifDefined(this.sc?.url)}" class="pf-c-form-control" required> <input type="text" value="${ifDefined(this.instance?.url)}" class="pf-c-form-control" required>
<p class="pf-c-form__helper-text">${t`Can be in the format of 'unix://' when connecting to a local docker daemon, or 'https://:2376' when connecting to a remote system.`}</p> <p class="pf-c-form__helper-text">${t`Can be in the format of 'unix://' when connecting to a local docker daemon, or 'https://:2376' when connecting to a remote system.`}</p>
</ak-form-element-horizontal> </ak-form-element-horizontal>
<ak-form-element-horizontal <ak-form-element-horizontal
label=${t`TLS Verification Certificate`} label=${t`TLS Verification Certificate`}
name="tlsVerification"> name="tlsVerification">
<select class="pf-c-form-control"> <select class="pf-c-form-control">
<option value="" ?selected=${this.sc?.tlsVerification === undefined}>---------</option> <option value="" ?selected=${this.instance?.tlsVerification === undefined}>---------</option>
${until(new CryptoApi(DEFAULT_CONFIG).cryptoCertificatekeypairsList({ ${until(new CryptoApi(DEFAULT_CONFIG).cryptoCertificatekeypairsList({
ordering: "pk" ordering: "pk"
}).then(certs => { }).then(certs => {
return certs.results.map(cert => { return certs.results.map(cert => {
return html`<option value=${ifDefined(cert.pk)} ?selected=${this.sc?.tlsVerification === cert.pk}>${cert.name}</option>`; return html`<option value=${ifDefined(cert.pk)} ?selected=${this.instance?.tlsVerification === cert.pk}>${cert.name}</option>`;
}); });
}), html`<option>${t`Loading...`}</option>`)} }), html`<option>${t`Loading...`}</option>`)}
</select> </select>
@ -87,12 +82,12 @@ export class ServiceConnectionDockerForm extends Form<DockerServiceConnection> {
label=${t`TLS Authentication Certificate`} label=${t`TLS Authentication Certificate`}
name="tlsAuthentication"> name="tlsAuthentication">
<select class="pf-c-form-control"> <select class="pf-c-form-control">
<option value="" ?selected=${this.sc?.tlsAuthentication === undefined}>---------</option> <option value="" ?selected=${this.instance?.tlsAuthentication === undefined}>---------</option>
${until(new CryptoApi(DEFAULT_CONFIG).cryptoCertificatekeypairsList({ ${until(new CryptoApi(DEFAULT_CONFIG).cryptoCertificatekeypairsList({
ordering: "pk" ordering: "pk"
}).then(certs => { }).then(certs => {
return certs.results.map(cert => { return certs.results.map(cert => {
return html`<option value=${ifDefined(cert.pk)} ?selected=${this.sc?.tlsAuthentication === cert.pk}>${cert.name}</option>`; return html`<option value=${ifDefined(cert.pk)} ?selected=${this.instance?.tlsAuthentication === cert.pk}>${cert.name}</option>`;
}); });
}), html`<option>${t`Loading...`}</option>`)} }), html`<option>${t`Loading...`}</option>`)}
</select> </select>

29
web/src/pages/outposts/ServiceConnectionKubernetesForm.ts
View File

@ -1,31 +1,26 @@
import { KubernetesServiceConnection, OutpostsApi } from "authentik-api"; import { KubernetesServiceConnection, OutpostsApi } from "authentik-api";
import { t } from "@lingui/macro"; import { t } from "@lingui/macro";
import { customElement, property } from "lit-element"; import { customElement } from "lit-element";
import { html, TemplateResult } from "lit-html"; import { html, TemplateResult } from "lit-html";
import { DEFAULT_CONFIG } from "../../api/Config"; import { DEFAULT_CONFIG } from "../../api/Config";
import { Form } from "../../elements/forms/Form";
import { ifDefined } from "lit-html/directives/if-defined"; import { ifDefined } from "lit-html/directives/if-defined";
import "../../elements/forms/HorizontalFormElement"; import "../../elements/forms/HorizontalFormElement";
import "../../elements/CodeMirror"; import "../../elements/CodeMirror";
import YAML from "yaml"; import YAML from "yaml";
import { first } from "../../utils"; import { first } from "../../utils";
import { ModelForm } from "../../elements/forms/ModelForm";
@customElement("ak-service-connection-kubernetes-form") @customElement("ak-service-connection-kubernetes-form")
export class ServiceConnectionKubernetesForm extends Form<KubernetesServiceConnection> { export class ServiceConnectionKubernetesForm extends ModelForm<KubernetesServiceConnection, string> {
set scUUID(value: string) { loadInstance(pk: string): Promise<KubernetesServiceConnection> {
new OutpostsApi(DEFAULT_CONFIG).outpostsServiceConnectionsKubernetesRead({ return new OutpostsApi(DEFAULT_CONFIG).outpostsServiceConnectionsKubernetesRead({
uuid: value, uuid: pk,
}).then(sc => {
this.sc = sc;
}); });
} }
@property({attribute: false})
sc?: KubernetesServiceConnection;
getSuccessMessage(): string { getSuccessMessage(): string {
if (this.sc) { if (this.instance) {
return t`Successfully updated service-connection.`; return t`Successfully updated service-connection.`;
} else { } else {
return t`Successfully created service-connection.`; return t`Successfully created service-connection.`;
@ -33,9 +28,9 @@ export class ServiceConnectionKubernetesForm extends Form<KubernetesServiceConne
} }
send = (data: KubernetesServiceConnection): Promise<KubernetesServiceConnection> => { send = (data: KubernetesServiceConnection): Promise<KubernetesServiceConnection> => {
if (this.sc) { if (this.instance) {
return new OutpostsApi(DEFAULT_CONFIG).outpostsServiceConnectionsKubernetesUpdate({ return new OutpostsApi(DEFAULT_CONFIG).outpostsServiceConnectionsKubernetesUpdate({
uuid: this.sc.pk || "", uuid: this.instance.pk || "",
data: data data: data
}); });
} else { } else {
@ -51,11 +46,11 @@ export class ServiceConnectionKubernetesForm extends Form<KubernetesServiceConne
label=${t`Name`} label=${t`Name`}
?required=${true} ?required=${true}
name="name"> name="name">
<input type="text" value="${ifDefined(this.sc?.name)}" class="pf-c-form-control" required> <input type="text" value="${ifDefined(this.instance?.name)}" class="pf-c-form-control" required>
</ak-form-element-horizontal> </ak-form-element-horizontal>
<ak-form-element-horizontal name="local"> <ak-form-element-horizontal name="local">
<div class="pf-c-check"> <div class="pf-c-check">
<input type="checkbox" class="pf-c-check__input" ?checked=${first(this.sc?.local, false)}> <input type="checkbox" class="pf-c-check__input" ?checked=${first(this.instance?.local, false)}>
<label class="pf-c-check__label"> <label class="pf-c-check__label">
${t`Local`} ${t`Local`}
</label> </label>
@ -65,7 +60,7 @@ export class ServiceConnectionKubernetesForm extends Form<KubernetesServiceConne
<ak-form-element-horizontal <ak-form-element-horizontal
label=${t`Kubeconfig`} label=${t`Kubeconfig`}
name="kubeconfig"> name="kubeconfig">
<ak-codemirror mode="yaml" value="${YAML.stringify(first(this.sc?.kubeconfig, {}))}"> <ak-codemirror mode="yaml" value="${YAML.stringify(first(this.instance?.kubeconfig, {}))}">
</ak-codemirror> </ak-codemirror>
<p class="pf-c-form__helper-text">${t`Set custom attributes using YAML or JSON.`}</p> <p class="pf-c-form__helper-text">${t`Set custom attributes using YAML or JSON.`}</p>
</ak-form-element-horizontal> </ak-form-element-horizontal>

2
web/src/pages/outposts/ServiceConnectionListPage.ts
View File

@ -82,7 +82,7 @@ export class OutpostServiceConnectionListPage extends TablePage<ServiceConnectio
<ak-proxy-form <ak-proxy-form
slot="form" slot="form"
.args=${{ .args=${{
"scUUID": item.pk "instancePk": item.pk
}} }}
type=${ifDefined(item.component)}> type=${ifDefined(item.component)}>
</ak-proxy-form> </ak-proxy-form>

4
web/src/pages/policies/BoundPoliciesList.ts
View File

@ -88,7 +88,7 @@ export class BoundPoliciesList extends Table<PolicyBinding> {
<span slot="header"> <span slot="header">
${t`Update Group`} ${t`Update Group`}
</span> </span>
<ak-group-form slot="form" .group=${item.groupObj}> <ak-group-form slot="form" .instancePk=${item.groupObj?.pk}>
</ak-group-form> </ak-group-form>
<button slot="trigger" class="pf-c-button pf-m-secondary"> <button slot="trigger" class="pf-c-button pf-m-secondary">
${t`Edit Group`} ${t`Edit Group`}
@ -128,7 +128,7 @@ export class BoundPoliciesList extends Table<PolicyBinding> {
<span slot="header"> <span slot="header">
${t`Update Binding`} ${t`Update Binding`}
</span> </span>
<ak-policy-binding-form slot="form" .binding=${item} targetPk=${ifDefined(this.target)} ?policyOnly=${this.policyOnly}> <ak-policy-binding-form slot="form" .instancePk=${item.pk} targetPk=${ifDefined(this.target)} ?policyOnly=${this.policyOnly}>
</ak-policy-binding-form> </ak-policy-binding-form>
<button slot="trigger" class="pf-c-button pf-m-secondary"> <button slot="trigger" class="pf-c-button pf-m-secondary">
${t`Edit Binding`} ${t`Edit Binding`}

65
web/src/pages/policies/PolicyBindingForm.ts
View File

@ -3,41 +3,38 @@ import { t } from "@lingui/macro";
import { css, CSSResult, customElement, property } from "lit-element"; import { css, CSSResult, customElement, property } from "lit-element";
import { html, TemplateResult } from "lit-html"; import { html, TemplateResult } from "lit-html";
import { DEFAULT_CONFIG } from "../../api/Config"; import { DEFAULT_CONFIG } from "../../api/Config";
import { Form } from "../../elements/forms/Form";
import { until } from "lit-html/directives/until"; import { until } from "lit-html/directives/until";
import { ifDefined } from "lit-html/directives/if-defined"; import { ifDefined } from "lit-html/directives/if-defined";
import { first, groupBy } from "../../utils"; import { first, groupBy } from "../../utils";
import "../../elements/forms/HorizontalFormElement"; import "../../elements/forms/HorizontalFormElement";
import PFToggleGroup from "@patternfly/patternfly/components/ToggleGroup/toggle-group.css"; import PFToggleGroup from "@patternfly/patternfly/components/ToggleGroup/toggle-group.css";
import PFContent from "@patternfly/patternfly/components/Content/content.css"; import PFContent from "@patternfly/patternfly/components/Content/content.css";
import { ModelForm } from "../../elements/forms/ModelForm";
enum target { enum target {
policy, group, user policy, group, user
} }
@customElement("ak-policy-binding-form") @customElement("ak-policy-binding-form")
export class PolicyBindingForm extends Form<PolicyBinding> { export class PolicyBindingForm extends ModelForm<PolicyBinding, string> {
@property({attribute: false}) loadInstance(pk: string): Promise<PolicyBinding> {
set binding(value: PolicyBinding | undefined) { return new PoliciesApi(DEFAULT_CONFIG).policiesBindingsRead({
this._binding = value; policyBindingUuid: pk
if (value?.policyObj) { }).then(binding => {
this.policyGroupUser = target.policy; if (binding?.policyObj) {
} this.policyGroupUser = target.policy;
if (value?.groupObj) { }
this.policyGroupUser = target.group; if (binding?.groupObj) {
} this.policyGroupUser = target.group;
if (value?.userObj) { }
this.policyGroupUser = target.user; if (binding?.userObj) {
} this.policyGroupUser = target.user;
}
return binding;
});
} }
get binding(): PolicyBinding | undefined {
return this._binding;
}
_binding?: PolicyBinding;
@property() @property()
targetPk?: string; targetPk?: string;
@ -48,7 +45,7 @@ export class PolicyBindingForm extends Form<PolicyBinding> {
policyOnly = false; policyOnly = false;
getSuccessMessage(): string { getSuccessMessage(): string {
if (this.binding) { if (this.instance) {
return t`Successfully updated binding.`; return t`Successfully updated binding.`;
} else { } else {
return t`Successfully created binding.`; return t`Successfully created binding.`;
@ -64,9 +61,9 @@ export class PolicyBindingForm extends Form<PolicyBinding> {
} }
send = (data: PolicyBinding): Promise<PolicyBinding> => { send = (data: PolicyBinding): Promise<PolicyBinding> => {
if (this.binding) { if (this.instance) {
return new PoliciesApi(DEFAULT_CONFIG).policiesBindingsUpdate({ return new PoliciesApi(DEFAULT_CONFIG).policiesBindingsUpdate({
policyBindingUuid: this.binding.pk || "", policyBindingUuid: this.instance.pk || "",
data: data data: data
}); });
} else { } else {
@ -81,7 +78,7 @@ export class PolicyBindingForm extends Form<PolicyBinding> {
${groupBy<Policy>(policies, (p => p.verboseName || "")).map(([group, policies]) => { ${groupBy<Policy>(policies, (p => p.verboseName || "")).map(([group, policies]) => {
return html`<optgroup label=${group}> return html`<optgroup label=${group}>
${policies.map(p => { ${policies.map(p => {
const selected = (this.binding?.policy === p.pk); const selected = (this.instance?.policy === p.pk);
return html`<option ?selected=${selected} value=${ifDefined(p.pk)}>${p.name}</option>`; return html`<option ?selected=${selected} value=${ifDefined(p.pk)}>${p.name}</option>`;
})} })}
</optgroup>`; </optgroup>`;
@ -90,8 +87,8 @@ export class PolicyBindingForm extends Form<PolicyBinding> {
} }
getOrder(): Promise<number> { getOrder(): Promise<number> {
if (this.binding) { if (this.instance) {
return Promise.resolve(this.binding.order); return Promise.resolve(this.instance.order);
} }
return new PoliciesApi(DEFAULT_CONFIG).policiesBindingsList({ return new PoliciesApi(DEFAULT_CONFIG).policiesBindingsList({
target: this.targetPk || "", target: this.targetPk || "",
@ -154,7 +151,7 @@ export class PolicyBindingForm extends Form<PolicyBinding> {
name="policy" name="policy"
?hidden=${this.policyGroupUser !== target.policy}> ?hidden=${this.policyGroupUser !== target.policy}>
<select class="pf-c-form-control"> <select class="pf-c-form-control">
<option value="" ?selected=${this.binding?.policy === undefined}>---------</option> <option value="" ?selected=${this.instance?.policy === undefined}>---------</option>
${until(new PoliciesApi(DEFAULT_CONFIG).policiesAllList({ ${until(new PoliciesApi(DEFAULT_CONFIG).policiesAllList({
ordering: "pk" ordering: "pk"
}).then(policies => { }).then(policies => {
@ -167,12 +164,12 @@ export class PolicyBindingForm extends Form<PolicyBinding> {
name="group" name="group"
?hidden=${this.policyGroupUser !== target.group}> ?hidden=${this.policyGroupUser !== target.group}>
<select class="pf-c-form-control"> <select class="pf-c-form-control">
<option value="" ?selected=${this.binding?.group === undefined}>---------</option> <option value="" ?selected=${this.instance?.group === undefined}>---------</option>
${until(new CoreApi(DEFAULT_CONFIG).coreGroupsList({ ${until(new CoreApi(DEFAULT_CONFIG).coreGroupsList({
ordering: "pk" ordering: "pk"
}).then(groups => { }).then(groups => {
return groups.results.map(group => { return groups.results.map(group => {
return html`<option value=${ifDefined(group.pk)} ?selected=${group.pk === this.binding?.group}>${group.name}</option>`; return html`<option value=${ifDefined(group.pk)} ?selected=${group.pk === this.instance?.group}>${group.name}</option>`;
}); });
}), html`<option>${t`Loading...`}</option>`)} }), html`<option>${t`Loading...`}</option>`)}
</select> </select>
@ -182,22 +179,22 @@ export class PolicyBindingForm extends Form<PolicyBinding> {
name="user" name="user"
?hidden=${this.policyGroupUser !== target.user}> ?hidden=${this.policyGroupUser !== target.user}>
<select class="pf-c-form-control"> <select class="pf-c-form-control">
<option value="" ?selected=${this.binding?.user === undefined}>---------</option> <option value="" ?selected=${this.instance?.user === undefined}>---------</option>
${until(new CoreApi(DEFAULT_CONFIG).coreUsersList({ ${until(new CoreApi(DEFAULT_CONFIG).coreUsersList({
ordering: "pk" ordering: "pk"
}).then(users => { }).then(users => {
return users.results.map(user => { return users.results.map(user => {
return html`<option value=${ifDefined(user.pk)} ?selected=${user.pk === this.binding?.user}>${user.name}</option>`; return html`<option value=${ifDefined(user.pk)} ?selected=${user.pk === this.instance?.user}>${user.name}</option>`;
}); });
}), html`<option>${t`Loading...`}</option>`)} }), html`<option>${t`Loading...`}</option>`)}
</select> </select>
</ak-form-element-horizontal> </ak-form-element-horizontal>
</div> </div>
</div> </div>
<input required name="target" type="hidden" value=${ifDefined(this.binding?.target || this.targetPk)}> <input required name="target" type="hidden" value=${ifDefined(this.instance?.target || this.targetPk)}>
<ak-form-element-horizontal name="enabled"> <ak-form-element-horizontal name="enabled">
<div class="pf-c-check"> <div class="pf-c-check">
<input type="checkbox" class="pf-c-check__input" ?checked=${first(this.binding?.enabled, true)}> <input type="checkbox" class="pf-c-check__input" ?checked=${first(this.instance?.enabled, true)}>
<label class="pf-c-check__label"> <label class="pf-c-check__label">
${t`Enabled`} ${t`Enabled`}
</label> </label>
@ -213,7 +210,7 @@ export class PolicyBindingForm extends Form<PolicyBinding> {
label=${t`Timeout`} label=${t`Timeout`}
?required=${true} ?required=${true}
name="timeout"> name="timeout">
<input type="number" value="${first(this.binding?.timeout, 30)}" class="pf-c-form-control" required> <input type="number" value="${first(this.instance?.timeout, 30)}" class="pf-c-form-control" required>
</ak-form-element-horizontal> </ak-form-element-horizontal>
</form>`; </form>`;
} }

2
web/src/pages/policies/PolicyListPage.ts
View File

@ -82,7 +82,7 @@ export class PolicyListPage extends TablePage<Policy> {
<ak-proxy-form <ak-proxy-form
slot="form" slot="form"
.args=${{ .args=${{
"policyUUID": item.pk "instancePk": item.pk
}} }}
type=${ifDefined(item.component)}> type=${ifDefined(item.component)}>
</ak-proxy-form> </ak-proxy-form>

33
web/src/pages/policies/dummy/DummyPolicyForm.ts
View File

@ -1,30 +1,25 @@
import { DummyPolicy, PoliciesApi } from "authentik-api"; import { DummyPolicy, PoliciesApi } from "authentik-api";
import { t } from "@lingui/macro"; import { t } from "@lingui/macro";
import { customElement, property } from "lit-element"; import { customElement } from "lit-element";
import { html, TemplateResult } from "lit-html"; import { html, TemplateResult } from "lit-html";
import { DEFAULT_CONFIG } from "../../../api/Config"; import { DEFAULT_CONFIG } from "../../../api/Config";
import { Form } from "../../../elements/forms/Form";
import { ifDefined } from "lit-html/directives/if-defined"; import { ifDefined } from "lit-html/directives/if-defined";
import "../../../elements/forms/HorizontalFormElement"; import "../../../elements/forms/HorizontalFormElement";
import "../../../elements/forms/FormGroup"; import "../../../elements/forms/FormGroup";
import { first } from "../../../utils"; import { first } from "../../../utils";
import { ModelForm } from "../../../elements/forms/ModelForm";
@customElement("ak-policy-dummy-form") @customElement("ak-policy-dummy-form")
export class DummyPolicyForm extends Form<DummyPolicy> { export class DummyPolicyForm extends ModelForm<DummyPolicy, string> {
set policyUUID(value: string) { loadInstance(pk: string): Promise<DummyPolicy> {
new PoliciesApi(DEFAULT_CONFIG).policiesDummyRead({ return new PoliciesApi(DEFAULT_CONFIG).policiesDummyRead({
policyUuid: value, policyUuid: pk,
}).then(policy => {
this.policy = policy;
}); });
} }
@property({attribute: false})
policy?: DummyPolicy;
getSuccessMessage(): string { getSuccessMessage(): string {
if (this.policy) { if (this.instance) {
return t`Successfully updated policy.`; return t`Successfully updated policy.`;
} else { } else {
return t`Successfully created policy.`; return t`Successfully created policy.`;
@ -32,9 +27,9 @@ export class DummyPolicyForm extends Form<DummyPolicy> {
} }
send = (data: DummyPolicy): Promise<DummyPolicy> => { send = (data: DummyPolicy): Promise<DummyPolicy> => {
if (this.policy) { if (this.instance) {
return new PoliciesApi(DEFAULT_CONFIG).policiesDummyUpdate({ return new PoliciesApi(DEFAULT_CONFIG).policiesDummyUpdate({
policyUuid: this.policy.pk || "", policyUuid: this.instance.pk || "",
data: data data: data
}); });
} else { } else {
@ -53,11 +48,11 @@ export class DummyPolicyForm extends Form<DummyPolicy> {
label=${t`Name`} label=${t`Name`}
?required=${true} ?required=${true}
name="name"> name="name">
<input type="text" value="${ifDefined(this.policy?.name || "")}" class="pf-c-form-control" required> <input type="text" value="${ifDefined(this.instance?.name || "")}" class="pf-c-form-control" required>
</ak-form-element-horizontal> </ak-form-element-horizontal>
<ak-form-element-horizontal name="executionLogging"> <ak-form-element-horizontal name="executionLogging">
<div class="pf-c-check"> <div class="pf-c-check">
<input type="checkbox" class="pf-c-check__input" ?checked=${first(this.policy?.executionLogging, false)}> <input type="checkbox" class="pf-c-check__input" ?checked=${first(this.instance?.executionLogging, false)}>
<label class="pf-c-check__label"> <label class="pf-c-check__label">
${t`Execution logging`} ${t`Execution logging`}
</label> </label>
@ -73,7 +68,7 @@ export class DummyPolicyForm extends Form<DummyPolicy> {
<div slot="body" class="pf-c-form"> <div slot="body" class="pf-c-form">
<ak-form-element-horizontal name="result"> <ak-form-element-horizontal name="result">
<div class="pf-c-check"> <div class="pf-c-check">
<input type="checkbox" class="pf-c-check__input" ?checked=${first(this.policy?.result, false)}> <input type="checkbox" class="pf-c-check__input" ?checked=${first(this.instance?.result, false)}>
<label class="pf-c-check__label"> <label class="pf-c-check__label">
${t`Pass policy?`} ${t`Pass policy?`}
</label> </label>
@ -83,14 +78,14 @@ export class DummyPolicyForm extends Form<DummyPolicy> {
label=${t`Wait (min)`} label=${t`Wait (min)`}
?required=${true} ?required=${true}
name="waitMin"> name="waitMin">
<input type="number" value="${first(this.policy?.waitMin, 1)}" class="pf-c-form-control" required> <input type="number" value="${first(this.instance?.waitMin, 1)}" class="pf-c-form-control" required>
<p class="pf-c-form__helper-text">${t`The policy takes a random time to execute. This controls the minimum time it will take.`}</p> <p class="pf-c-form__helper-text">${t`The policy takes a random time to execute. This controls the minimum time it will take.`}</p>
</ak-form-element-horizontal> </ak-form-element-horizontal>
<ak-form-element-horizontal <ak-form-element-horizontal
label=${t`Wait (max)`} label=${t`Wait (max)`}
?required=${true} ?required=${true}
name="waitMax"> name="waitMax">
<input type="number" value="${first(this.policy?.waitMax, 5)}" class="pf-c-form-control" required> <input type="number" value="${first(this.instance?.waitMax, 5)}" class="pf-c-form-control" required>
</ak-form-element-horizontal> </ak-form-element-horizontal>
</div> </div>
</ak-form-group> </ak-form-group>