mirror of
https://github.com/goauthentik/authentik
synced 2026-05-05 06:32:15 +02:00
web/admin: Allow binding users/groups in policy binding wizard and existing stage in stage binding wizard (#21697)
* web/admin: allow creating only binding for policies Signed-off-by: Jens Langhammer <jens@goauthentik.io> * dont show type selector if only one is allowed Signed-off-by: Jens Langhammer <jens@goauthentik.io> * do the same for stage wizard Signed-off-by: Jens Langhammer <jens@goauthentik.io> * minor unrelated fix: alignment in table desc Signed-off-by: Jens Langhammer <jens@goauthentik.io> * add option to bind existing policy Signed-off-by: Jens Langhammer <jens@goauthentik.io> * adjust labels? Signed-off-by: Jens Langhammer <jens@goauthentik.io> * Clean up post-type select state. Types. * Clean up brand form. * Flesh out parse. * Tidy textarea. * Fix table alignment when images are present. * Simplify radio. * Fix form group layout, styles. * Flesh out plural helper. * Flesh out formatted user display name. * Allow slotted HTML in page description. * Clean up transclusion types. * Allow null. * Flesh out user activation toggle. * Clean up activation labeling. --------- Signed-off-by: Jens Langhammer <jens@goauthentik.io> Co-authored-by: Teffen Ellis <592134+GirlBossRush@users.noreply.github.com>
This commit is contained in:
Jens L.
@@ -1,111 +1,19 @@
|
||||
import "#elements/buttons/SpinnerButton/index";
|
||||
import "#elements/entities/UsedByTable";
|
||||
|
||||
import { EVENT_REFRESH } from "#common/constants";
|
||||
import { PFSize } from "#common/enums";
|
||||
import { parseAPIResponseError, pluckErrorDetail } from "#common/errors/network";
|
||||
import { MessageLevel } from "#common/messages";
|
||||
|
||||
import { ModalButton } from "#elements/buttons/ModalButton";
|
||||
import { BulkDeleteMetadata } from "#elements/entities/UsedByTable";
|
||||
import { showMessage } from "#elements/messages/MessageContainer";
|
||||
import { StaticTable } from "#elements/table/StaticTable";
|
||||
import { TableColumn } from "#elements/table/Table";
|
||||
import { SlottedTemplateResult } from "#elements/types";
|
||||
|
||||
import { UsedBy, UsedByActionEnum } from "@goauthentik/api";
|
||||
import { UsedBy } from "@goauthentik/api";
|
||||
|
||||
import { msg, str } from "@lit/localize";
|
||||
import { CSSResult, html, nothing, PropertyValues, TemplateResult } from "lit";
|
||||
import { customElement, property, state } from "lit/decorators.js";
|
||||
import { until } from "lit/directives/until.js";
|
||||
|
||||
import PFList from "@patternfly/patternfly/components/List/list.css";
|
||||
|
||||
type BulkDeleteMetadata = { key: string; value: string }[];
|
||||
|
||||
@customElement("ak-delete-objects-table")
|
||||
export class DeleteObjectsTable<T extends object> extends StaticTable<T> {
|
||||
static styles: CSSResult[] = [...super.styles, PFList];
|
||||
|
||||
@property({ attribute: false })
|
||||
public metadata: (item: T) => BulkDeleteMetadata = (item: T) => {
|
||||
const metadata: BulkDeleteMetadata = [];
|
||||
if ("name" in item) {
|
||||
metadata.push({ key: msg("Name"), value: item.name as string });
|
||||
}
|
||||
return metadata;
|
||||
};
|
||||
|
||||
@property({ attribute: false })
|
||||
public usedBy?: (item: T) => Promise<UsedBy[]>;
|
||||
|
||||
@state()
|
||||
protected usedByData: Map<T, UsedBy[]> = new Map();
|
||||
|
||||
protected override rowLabel(item: T): string | null {
|
||||
const name = "name" in item && typeof item.name === "string" ? item.name.trim() : null;
|
||||
return name || null;
|
||||
}
|
||||
|
||||
@state()
|
||||
protected get columns(): TableColumn[] {
|
||||
return this.metadata(this.items![0]).map((element) => [element.key]);
|
||||
}
|
||||
|
||||
protected row(item: T): SlottedTemplateResult[] {
|
||||
return this.metadata(item).map((element) => {
|
||||
return html`${element.value}`;
|
||||
});
|
||||
}
|
||||
|
||||
protected override renderToolbarContainer(): SlottedTemplateResult {
|
||||
return nothing;
|
||||
}
|
||||
|
||||
protected override firstUpdated(changedProperties: PropertyValues<this>): void {
|
||||
this.expandable = !!this.usedBy;
|
||||
super.firstUpdated(changedProperties);
|
||||
}
|
||||
|
||||
protected override renderExpanded(item: T): TemplateResult {
|
||||
const handler = async () => {
|
||||
if (!this.usedByData.has(item) && this.usedBy) {
|
||||
this.usedByData.set(item, await this.usedBy(item));
|
||||
}
|
||||
return this.renderUsedBy(this.usedByData.get(item) || []);
|
||||
};
|
||||
return html`${this.usedBy
|
||||
? until(handler(), html`<ak-spinner size=${PFSize.Large}></ak-spinner>`)
|
||||
: nothing}`;
|
||||
}
|
||||
|
||||
protected renderUsedBy(usedBy: UsedBy[]): TemplateResult {
|
||||
if (usedBy.length < 1) {
|
||||
return html`<span>${msg("Not used by any other object.")}</span>`;
|
||||
}
|
||||
return html`<ul class="pf-c-list">
|
||||
${usedBy.map((ub) => {
|
||||
let consequence = "";
|
||||
switch (ub.action) {
|
||||
case UsedByActionEnum.Cascade:
|
||||
consequence = msg("object will be DELETED");
|
||||
break;
|
||||
case UsedByActionEnum.CascadeMany:
|
||||
consequence = msg("connection will be deleted");
|
||||
break;
|
||||
case UsedByActionEnum.SetDefault:
|
||||
consequence = msg("reference will be reset to default value");
|
||||
break;
|
||||
case UsedByActionEnum.SetNull:
|
||||
consequence = msg("reference will be set to an empty value");
|
||||
break;
|
||||
case UsedByActionEnum.LeftDangling:
|
||||
consequence = msg("reference will be left dangling");
|
||||
break;
|
||||
}
|
||||
return html`<li>${msg(str`${ub.name} (${consequence})`)}</li>`;
|
||||
})}
|
||||
</ul>`;
|
||||
}
|
||||
}
|
||||
import { html, TemplateResult } from "lit";
|
||||
import { customElement, property } from "lit/decorators.js";
|
||||
|
||||
@customElement("ak-forms-delete-bulk")
|
||||
export class DeleteBulkForm<T> extends ModalButton {
|
||||
@@ -127,61 +35,58 @@ export class DeleteBulkForm<T> extends ModalButton {
|
||||
/**
|
||||
* Action shown in messages, for example `deleted` or `removed`
|
||||
*/
|
||||
@property()
|
||||
action = msg("deleted");
|
||||
@property({ type: String })
|
||||
public action = msg("deleted");
|
||||
|
||||
@property({ attribute: false })
|
||||
metadata: (item: T) => BulkDeleteMetadata = (item: T) => {
|
||||
public metadata: (item: T) => BulkDeleteMetadata[] = (item: T) => {
|
||||
const rec = item as Record<string, unknown>;
|
||||
const meta = [];
|
||||
if (Object.prototype.hasOwnProperty.call(rec, "name")) {
|
||||
const meta: BulkDeleteMetadata[] = [];
|
||||
|
||||
if (Object.hasOwn(rec, "name")) {
|
||||
meta.push({ key: msg("Name"), value: rec.name as string });
|
||||
}
|
||||
if (Object.prototype.hasOwnProperty.call(rec, "pk")) {
|
||||
|
||||
if (Object.hasOwn(rec, "pk")) {
|
||||
meta.push({ key: msg("ID"), value: rec.pk as string });
|
||||
}
|
||||
|
||||
return meta;
|
||||
};
|
||||
|
||||
@property({ attribute: false })
|
||||
usedBy?: (item: T) => Promise<UsedBy[]>;
|
||||
public usedBy?: (item: T) => Promise<UsedBy[]>;
|
||||
|
||||
@property({ attribute: false })
|
||||
delete!: (item: T) => Promise<unknown>;
|
||||
public delete!: (item: T) => Promise<unknown>;
|
||||
|
||||
async confirm(): Promise<void> {
|
||||
try {
|
||||
await Promise.all(
|
||||
this.objects.map((item) => {
|
||||
return this.delete(item);
|
||||
}),
|
||||
);
|
||||
this.onSuccess();
|
||||
this.dispatchEvent(
|
||||
new CustomEvent(EVENT_REFRESH, {
|
||||
bubbles: true,
|
||||
composed: true,
|
||||
}),
|
||||
);
|
||||
this.open = false;
|
||||
} catch (e) {
|
||||
this.onError(e as Error);
|
||||
throw e;
|
||||
}
|
||||
}
|
||||
protected async confirm(): Promise<void> {
|
||||
return Promise.all(this.objects.map((item) => this.delete(item)))
|
||||
.then(() => {
|
||||
showMessage({
|
||||
message: msg(
|
||||
str`Successfully deleted ${this.objects.length} ${this.objectLabel}`,
|
||||
),
|
||||
level: MessageLevel.success,
|
||||
});
|
||||
|
||||
onSuccess(): void {
|
||||
showMessage({
|
||||
message: msg(str`Successfully deleted ${this.objects.length} ${this.objectLabel}`),
|
||||
level: MessageLevel.success,
|
||||
});
|
||||
}
|
||||
|
||||
onError(e: Error): void {
|
||||
showMessage({
|
||||
message: msg(str`Failed to delete ${this.objectLabel}: ${e.toString()}`),
|
||||
level: MessageLevel.error,
|
||||
});
|
||||
this.dispatchEvent(
|
||||
new CustomEvent(EVENT_REFRESH, {
|
||||
bubbles: true,
|
||||
composed: true,
|
||||
}),
|
||||
);
|
||||
this.open = false;
|
||||
})
|
||||
.catch((parsedError: unknown) => {
|
||||
return parseAPIResponseError(parsedError).then(() => {
|
||||
showMessage({
|
||||
message: msg(str`Failed to delete ${this.objectLabel}`),
|
||||
description: pluckErrorDetail(parsedError),
|
||||
level: MessageLevel.error,
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
renderModalInner(): TemplateResult {
|
||||
@@ -207,12 +112,12 @@ export class DeleteBulkForm<T> extends ModalButton {
|
||||
</form>
|
||||
</section>
|
||||
<section class="pf-c-modal-box__body pf-m-light">
|
||||
<ak-delete-objects-table
|
||||
<ak-used-by-table
|
||||
.items=${this.objects}
|
||||
.usedBy=${this.usedBy}
|
||||
.metadata=${this.metadata}
|
||||
>
|
||||
</ak-delete-objects-table>
|
||||
</ak-used-by-table>
|
||||
</section>
|
||||
<fieldset class="pf-c-modal-box__footer">
|
||||
<legend class="sr-only">${msg("Form actions")}</legend>
|
||||
@@ -234,7 +139,6 @@ export class DeleteBulkForm<T> extends ModalButton {
|
||||
|
||||
declare global {
|
||||
interface HTMLElementTagNameMap {
|
||||
"ak-delete-objects-table": DeleteObjectsTable<object>;
|
||||
"ak-forms-delete-bulk": DeleteBulkForm<object>;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user