habsi/authentik
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

web: use single delete button with checkbox and icon-based action buttons

Browse Source 
Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer
2021-08-05 12:30:43 +02:00
parent ddd5047cc3
commit 1a17ce24f9
33 changed files with 911 additions and 631 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -28,6 +28,8 @@ export class BoundPoliciesList extends Table<PolicyBinding> {
@property({ type: Boolean })
policyOnly = false;
checkbox = true;
apiEndpoint(page: number): Promise<AKResponse<PolicyBinding>> {
return new PoliciesApi(DEFAULT_CONFIG).policiesBindingsList({
target: this.target || "",
@ -43,7 +45,7 @@ export class BoundPoliciesList extends Table<PolicyBinding> {
new TableColumn(t`Enabled`, "enabled"),
new TableColumn(t`Order`, "order"),
new TableColumn(t`Timeout`, "timeout"),
new TableColumn("Actions"),
new TableColumn(t`Actions`),
];
}
@ -93,6 +95,29 @@ export class BoundPoliciesList extends Table<PolicyBinding> {
}
}
renderToolbarSelected(): TemplateResult {
const disabled = this.selectedElements.length !== 1;
const item = this.selectedElements[0];
return html`<ak-forms-delete
.obj=${item}
objectLabel=${t`Policy binding`}
.usedBy=${() => {
return new PoliciesApi(DEFAULT_CONFIG).policiesBindingsUsedByList({
policyBindingUuid: item.pk,
});
}}
.delete=${() => {
return new PoliciesApi(DEFAULT_CONFIG).policiesBindingsDestroy({
policyBindingUuid: item.pk,
});
}}
>
<button ?disabled=${disabled} slot="trigger" class="pf-c-button pf-m-danger">
${t`Delete Binding`}
</button>
</ak-forms-delete>`;
}
row(item: PolicyBinding): TemplateResult[] {
return [
html`${this.getPolicyUserGroupRow(item)}`,
@ -113,25 +138,7 @@ export class BoundPoliciesList extends Table<PolicyBinding> {
<button slot="trigger" class="pf-c-button pf-m-secondary">
${t`Edit Binding`}
</button>
</ak-forms-modal>
<ak-forms-delete
.obj=${item}
objectLabel=${t`Policy binding`}
.usedBy=${() => {
return new PoliciesApi(DEFAULT_CONFIG).policiesBindingsUsedByList({
policyBindingUuid: item.pk,
});
}}
.delete=${() => {
return new PoliciesApi(DEFAULT_CONFIG).policiesBindingsDestroy({
policyBindingUuid: item.pk,
});
}}
>
<button slot="trigger" class="pf-c-button pf-m-danger">
${t`Delete Binding`}
</button>
</ak-forms-delete>`,
</ak-forms-modal>`,
];
}

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

@ -39,6 +39,8 @@ export class PolicyListPage extends TablePage<Policy> {
return "pf-icon pf-icon-infrastructure";
}
checkbox = true;
@property()
order = "name";
@ -97,7 +99,6 @@ export class PolicyListPage extends TablePage<Policy> {
}
renderToolbarSelected(): TemplateResult {
// TODO: bulk delete
const disabled = this.selectedElements.length !== 1;
const item = this.selectedElements[0];
return html`<ak-forms-delete

48
web/src/pages/policies/reputation/IPReputationListPage.ts
View File

@ -30,6 +30,8 @@ export class IPReputationListPage extends TablePage<IPReputation> {
@property()
order = "ip";
checkbox = true;
apiEndpoint(page: number): Promise<AKResponse<IPReputation>> {
return new PoliciesApi(DEFAULT_CONFIG).policiesReputationIpsList({
ordering: this.order,
@ -43,30 +45,34 @@ export class IPReputationListPage extends TablePage<IPReputation> {
return [
new TableColumn(t`IP`, "ip"),
new TableColumn(t`Score`, "score"),
new TableColumn("Actions"),
new TableColumn(t`Actions`),
];
}
renderToolbarSelected(): TemplateResult {
const disabled = this.selectedElements.length !== 1;
const item = this.selectedElements[0];
return html`<ak-forms-delete
.obj=${item}
objectLabel=${t`IP Reputation`}
.usedBy=${() => {
return new PoliciesApi(DEFAULT_CONFIG).policiesReputationIpsUsedByList({
id: item.pk,
});
}}
.delete=${() => {
return new PoliciesApi(DEFAULT_CONFIG).policiesReputationIpsDestroy({
id: item.pk,
});
}}
>
<button ?disabled=${disabled} slot="trigger" class="pf-c-button pf-m-danger">
${t`Delete`}
</button>
</ak-forms-delete>`;
}
row(item: IPReputation): TemplateResult[] {
return [
html`${item.ip}`,
html`${item.score}`,
html` <ak-forms-delete
.obj=${item}
objectLabel=${t`IP Reputation`}
.usedBy=${() => {
return new PoliciesApi(DEFAULT_CONFIG).policiesReputationIpsUsedByList({
id: item.pk,
});
}}
.delete=${() => {
return new PoliciesApi(DEFAULT_CONFIG).policiesReputationIpsDestroy({
id: item.pk,
});
}}
>
<button slot="trigger" class="pf-c-button pf-m-danger">${t`Delete`}</button>
</ak-forms-delete>`,
];
return [html`${item.ip}`, html`${item.score}`];
}
}

52
web/src/pages/policies/reputation/UserReputationListPage.ts
View File

@ -27,6 +27,8 @@ export class UserReputationListPage extends TablePage<UserReputation> {
return "fa fa-ban";
}
checkbox = true;
@property()
order = "username";
@ -40,33 +42,33 @@ export class UserReputationListPage extends TablePage<UserReputation> {
}
columns(): TableColumn[] {
return [
new TableColumn(t`Username`, "username"),
new TableColumn(t`Score`, "score"),
new TableColumn("Actions"),
];
return [new TableColumn(t`Username`, "username"), new TableColumn(t`Score`, "score")];
}
renderToolbarSelected(): TemplateResult {
const disabled = this.selectedElements.length !== 1;
const item = this.selectedElements[0];
return html`<ak-forms-delete
.obj=${item}
objectLabel=${t`User Reputation`}
.usedBy=${() => {
return new PoliciesApi(DEFAULT_CONFIG).policiesReputationUsersUsedByList({
id: item.pk,
});
}}
.delete=${() => {
return new PoliciesApi(DEFAULT_CONFIG).policiesReputationUsersDestroy({
id: item.pk,
});
}}
>
<button ?disabled=${disabled} slot="trigger" class="pf-c-button pf-m-danger">
${t`Delete`}
</button>
</ak-forms-delete>`;
}
row(item: UserReputation): TemplateResult[] {
return [
html`${item.username}`,
html`${item.score}`,
html` <ak-forms-delete
.obj=${item}
objectLabel=${t`User Reputation`}
.usedBy=${() => {
return new PoliciesApi(DEFAULT_CONFIG).policiesReputationUsersUsedByList({
id: item.pk,
});
}}
.delete=${() => {
return new PoliciesApi(DEFAULT_CONFIG).policiesReputationUsersDestroy({
id: item.pk,
});
}}
>
<button slot="trigger" class="pf-c-button pf-m-danger">${t`Delete`}</button>
</ak-forms-delete>`,
];
return [html`${item.username}`, html`${item.score}`];
}
}