web/admin: migrate outposts to web
Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer
@ -16,10 +16,6 @@ export class AdminURLManager {
|
||||
return `/administration/property-mappings/${rest}`;
|
||||
}
|
||||
|
||||
static outposts(rest: string): string {
|
||||
return `/administration/outposts/${rest}`;
|
||||
}
|
||||
|
||||
static outpostServiceConnections(rest: string): string {
|
||||
return `/administration/outpost_service_connections/${rest}`;
|
||||
}
|
||||
|
||||
@ -84,7 +84,7 @@ export class FlowViewPage extends LitElement {
|
||||
class="pf-c-button pf-m-secondary"
|
||||
@click=${() => {
|
||||
new FlowsApi(DEFAULT_CONFIG).flowsInstancesExecute({
|
||||
slug: flow.slug
|
||||
slug: this.flow.slug
|
||||
}).then(link => {
|
||||
window.location.assign(`${link.link}?next=/%23${window.location.href}`);
|
||||
});
|
||||
|
||||
102
web/src/pages/outposts/OutpostForm.ts
Normal file
102
web/src/pages/outposts/OutpostForm.ts
Normal file
@ -0,0 +1,102 @@
|
||||
import { CoreApi, Outpost, OutpostsApi, ProvidersApi } 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 { until } from "lit-html/directives/until";
|
||||
import { ifDefined } from "lit-html/directives/if-defined";
|
||||
import "../../elements/forms/HorizontalFormElement";
|
||||
import "../../elements/CodeMirror";
|
||||
import YAML from "yaml";
|
||||
|
||||
@customElement("ak-outpost-form")
|
||||
export class OutpostForm extends Form<Outpost> {
|
||||
|
||||
@property({attribute: false})
|
||||
outpost?: Outpost;
|
||||
|
||||
getSuccessMessage(): string {
|
||||
if (this.outpost) {
|
||||
return gettext("Successfully updated outpost.");
|
||||
} else {
|
||||
return gettext("Successfully created outpost.");
|
||||
}
|
||||
}
|
||||
|
||||
send = (data: Outpost): Promise<Outpost> => {
|
||||
if (this.outpost) {
|
||||
return new OutpostsApi(DEFAULT_CONFIG).outpostsOutpostsUpdate({
|
||||
uuid: this.outpost.pk || "",
|
||||
data: data
|
||||
});
|
||||
} else {
|
||||
return new OutpostsApi(DEFAULT_CONFIG).outpostsOutpostsCreate({
|
||||
data: data
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
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.outpost?.name)}" class="pf-c-form-control" required>
|
||||
</ak-form-element-horizontal>
|
||||
<ak-form-element-horizontal
|
||||
label=${gettext("Type")}
|
||||
?required=${true}
|
||||
name="type">
|
||||
<select class="pf-c-form-control">
|
||||
<option value="proxy" ?selected=${true}>${gettext("Proxy")}</option>s
|
||||
</select>
|
||||
</ak-form-element-horizontal>
|
||||
<ak-form-element-horizontal
|
||||
label=${gettext("Service connection")}
|
||||
name="serviceConnection">
|
||||
<select class="pf-c-form-control">
|
||||
<option value="" ?selected=${this.outpost?.serviceConnection === undefined}>---------</option>
|
||||
${until(new OutpostsApi(DEFAULT_CONFIG).outpostsServiceConnectionsAllList({
|
||||
ordering: "pk"
|
||||
}).then(scs => {
|
||||
return scs.results.map(sc => {
|
||||
return html`<option value=${ifDefined(sc.pk)} ?selected=${this.outpost?.serviceConnection === sc.pk}>${sc.name}</option>`;
|
||||
});
|
||||
}), html``)}
|
||||
</select>
|
||||
</ak-form-element-horizontal>
|
||||
<ak-form-element-horizontal
|
||||
label=${gettext("Providers")}
|
||||
?required=${true}
|
||||
name="providers">
|
||||
<select class="pf-c-form-control" multiple>
|
||||
${until(new ProvidersApi(DEFAULT_CONFIG).providersProxyList({
|
||||
ordering: "pk"
|
||||
}).then(providers => {
|
||||
return providers.results.map(provider => {
|
||||
const selected = Array.from(this.outpost?.providers || []).some(sp => {
|
||||
return sp == provider.pk;
|
||||
});
|
||||
return html`<option value=${ifDefined(provider.pk)} ?selected=${selected}>${provider.verboseName} ${provider.name}</option>`;
|
||||
});
|
||||
}))}
|
||||
</select>
|
||||
<p class="pf-c-form__helper-text">${gettext("Hold control/command to select multiple items.")}</p>
|
||||
</ak-form-element-horizontal>
|
||||
${until(new OutpostsApi(DEFAULT_CONFIG).outpostsOutpostsDefaultSettings({}).then(config => {
|
||||
let fc = config.config;
|
||||
if (this.outpost) {
|
||||
fc = this.outpost.config;
|
||||
}
|
||||
return html`<ak-form-element-horizontal
|
||||
label=${gettext("Configuration")}
|
||||
name="config">
|
||||
<ak-codemirror mode="yaml" value="${YAML.stringify(fc)}"></ak-codemirror>
|
||||
</ak-form-element-horizontal>`;
|
||||
}))}
|
||||
</form>`;
|
||||
}
|
||||
|
||||
}
|
||||
@ -6,14 +6,13 @@ import { TableColumn } from "../../elements/table/Table";
|
||||
import { TablePage } from "../../elements/table/TablePage";
|
||||
|
||||
import "./OutpostHealth";
|
||||
import "./OutpostForm";
|
||||
import "../../elements/buttons/SpinnerButton";
|
||||
import "../../elements/buttons/ModalButton";
|
||||
import "../../elements/buttons/TokenCopyButton";
|
||||
import "../../elements/forms/DeleteForm";
|
||||
import { PAGE_SIZE } from "../../constants";
|
||||
import { Outpost, OutpostsApi } from "authentik-api";
|
||||
import { DEFAULT_CONFIG } from "../../api/Config";
|
||||
import { AdminURLManager } from "../../api/legacy";
|
||||
import { ifDefined } from "lit-html/directives/if-defined";
|
||||
|
||||
@customElement("ak-outpost-list")
|
||||
@ -58,12 +57,19 @@ export class OutpostListPage extends TablePage<Outpost> {
|
||||
})}</ul>`,
|
||||
html`<ak-outpost-health outpostId=${ifDefined(item.pk)}></ak-outpost-health>`,
|
||||
html`
|
||||
<ak-modal-button href="${AdminURLManager.outposts(`${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 Outpost")}
|
||||
</span>
|
||||
<ak-outpost-form slot="form" .outpost=${item}>
|
||||
</ak-outpost-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("Outpost")}
|
||||
@ -122,12 +128,19 @@ export class OutpostListPage extends TablePage<Outpost> {
|
||||
|
||||
renderToolbar(): TemplateResult {
|
||||
return html`
|
||||
<ak-modal-button href=${AdminURLManager.outposts("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 Outpost")}
|
||||
</span>
|
||||
<ak-outpost-form slot="form">
|
||||
</ak-outpost-form>
|
||||
<button slot="trigger" class="pf-c-button pf-m-primary">
|
||||
${gettext("Create")}
|
||||
</button>
|
||||
</ak-forms-modal>
|
||||
${super.renderToolbar()}
|
||||
`;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user