web: better label table actions

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer 2021-08-05 10:40:44 +02:00
parent 919946609d
commit ddd5047cc3
29 changed files with 76 additions and 61 deletions

8
web/package-lock.json generated
View File

@ -67,8 +67,8 @@
},
"api": {
"name": "authentik-api",
"version": "0.0.1",
"dependencies": {
"version": "1.0.0",
"devDependencies": {
"typescript": "^3.9.5"
}
},
@ -76,6 +76,7 @@
"version": "3.9.9",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.9.9.tgz",
"integrity": "sha512-kdMjTiekY+z/ubJCATUPlRDl39vXYiMV9iyeMuEuXZh2we6zz80uovNN2WlAxmmdE/Z/YQe+EbOEXB5RHEED3w==",
"dev": true,
"bin": {
"tsc": "bin/tsc",
"tsserver": "bin/tsserver"
@ -10230,7 +10231,8 @@
"typescript": {
"version": "3.9.9",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.9.9.tgz",
"integrity": "sha512-kdMjTiekY+z/ubJCATUPlRDl39vXYiMV9iyeMuEuXZh2we6zz80uovNN2WlAxmmdE/Z/YQe+EbOEXB5RHEED3w=="
"integrity": "sha512-kdMjTiekY+z/ubJCATUPlRDl39vXYiMV9iyeMuEuXZh2we6zz80uovNN2WlAxmmdE/Z/YQe+EbOEXB5RHEED3w==",
"dev": true
}
}
},

View File

@ -76,24 +76,12 @@ html > form > input {
.pf-m-success {
color: var(--pf-global--success-color--100);
}
.pf-c-button.pf-m-success {
color: var(--pf-c-button--m-primary--Color);
background-color: var(--pf-global--success-color--100);
}
.pf-m-warning {
color: var(--pf-global--warning-color--100);
}
.pf-c-button.pf-m-warning {
color: var(--pf-c-button--m-primary--Color);
background-color: var(--pf-global--warning-color--100);
}
.pf-m-danger {
color: var(--pf-global--danger-color--100);
}
.pf-c-button.pf-m-danger {
color: var(--pf-c-button--m-primary--Color);
background-color: var(--pf-global--danger-color--100);
}
body {
background-color: var(--ak-dark-background) !important;

View File

@ -29,7 +29,7 @@ export class UserOAuthCodeList extends Table<ExpiringBaseGrantModel> {
new TableColumn(t`Provider`, "provider"),
new TableColumn(t`Expires`, "expires"),
new TableColumn(t`Scopes`, "scope"),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -37,7 +37,7 @@ export class UserOAuthRefreshList extends Table<RefreshTokenModel> {
new TableColumn(t`Revoked?`, "revoked"),
new TableColumn(t`Expires`, "expires"),
new TableColumn(t`Scopes`, "scope"),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -279,6 +279,10 @@ export abstract class Table<T> extends LitElement {
</button>`;
}
renderToolbarSelected(): TemplateResult {
return html``;
}
renderToolbarAfter(): TemplateResult {
return html``;
}
@ -322,7 +326,7 @@ export abstract class Table<T> extends LitElement {
: html``}
<div class="pf-c-toolbar">
<div class="pf-c-toolbar__content">
${this.renderSearch()}
${this.renderToolbarSelected()} &nbsp; ${this.renderSearch()}
<div class="pf-c-toolbar__bulk-select">${this.renderToolbar()}</div>
${this.renderToolbarAfter()}
<ak-table-pagination

View File

@ -30,7 +30,7 @@ export class AuthenticatedSessionList extends Table<AuthenticatedSession> {
new TableColumn(t`Browser`, "user_agent"),
new TableColumn(t`Device`, "user_agent"),
new TableColumn(t`Expires`, "expires"),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -28,7 +28,7 @@ export class UserConsentList extends Table<UserConsent> {
return [
new TableColumn(t`Application`, "application"),
new TableColumn(t`Expires`, "expires"),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -62,7 +62,7 @@ export class ApplicationListPage extends TablePage<Application> {
new TableColumn(t`Slug`, "slug"),
new TableColumn(t`Provider`),
new TableColumn(t`Provider Type`),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -53,7 +53,7 @@ export class CertificateKeyPairListPage extends TablePage<CertificateKeyPair> {
new TableColumn(t`Name`, "name"),
new TableColumn(t`Private key available?`),
new TableColumn(t`Expiry date`),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -46,7 +46,7 @@ export class EventListPage extends TablePage<Event> {
new TableColumn(t`Creation Date`, "created"),
new TableColumn(t`Client IP`, "client_ip"),
new TableColumn(t`Tenant`, "tenant_name"),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -47,7 +47,7 @@ export class RuleListPage extends TablePage<NotificationRule> {
new TableColumn(t`Name`, "name"),
new TableColumn(t`Severity`, "severity"),
new TableColumn(t`Sent to group`, "group"),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -44,7 +44,7 @@ export class TransportListPage extends TablePage<NotificationTransport> {
return [
new TableColumn(t`Name`, "name"),
new TableColumn(t`Mode`, "mode"),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -38,7 +38,7 @@ export class BoundStagesList extends Table<FlowStageBinding> {
new TableColumn(t`Order`),
new TableColumn(t`Name`),
new TableColumn(t`Type`),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -48,7 +48,7 @@ export class FlowListPage extends TablePage<Flow> {
new TableColumn(t`Designation`, "designation"),
new TableColumn(t`Stages`),
new TableColumn(t`Policies`),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -45,7 +45,7 @@ export class GroupListPage extends TablePage<Group> {
new TableColumn(t`Parent`, "parent"),
new TableColumn(t`Members`),
new TableColumn(t`Superuser privileges?`),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -45,7 +45,7 @@ export class OutpostListPage extends TablePage<Outpost> {
new TableColumn(t`Providers`),
new TableColumn(t`Integration`, "service_connection__name"),
new TableColumn(t`Health and Version`),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -50,7 +50,7 @@ export class OutpostServiceConnectionListPage extends TablePage<ServiceConnectio
new TableColumn(t`Type`),
new TableColumn(t`Local`, "local"),
new TableColumn(t`State`),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -43,7 +43,7 @@ export class BoundPoliciesList extends Table<PolicyBinding> {
new TableColumn(t`Enabled`, "enabled"),
new TableColumn(t`Order`, "order"),
new TableColumn(t`Timeout`, "timeout"),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -52,7 +52,11 @@ export class PolicyListPage extends TablePage<Policy> {
}
columns(): TableColumn[] {
return [new TableColumn(t`Name`, "name"), new TableColumn(t`Type`), new TableColumn("")];
return [
new TableColumn(t`Name`, "name"),
new TableColumn(t`Type`),
new TableColumn(t`Actions`),
];
}
row(item: Policy): TemplateResult[] {
@ -77,15 +81,26 @@ export class PolicyListPage extends TablePage<Policy> {
type=${ifDefined(item.component)}
>
</ak-proxy-form>
<button slot="trigger" class="pf-c-button pf-m-secondary">${t`Edit`}</button>
<button slot="trigger" class="pf-c-button pf-m-plain">
<i class="fas fa-pencil-alt" aria-hidden="true"></i>
</button>
</ak-forms-modal>
<ak-forms-modal .closeAfterSuccessfulSubmit=${false}>
<span slot="submit"> ${t`Test`} </span>
<span slot="header"> ${t`Test Policy`} </span>
<ak-policy-test-form slot="form" .policy=${item}> </ak-policy-test-form>
<button slot="trigger" class="pf-c-button pf-m-secondary">${t`Test`}</button>
</ak-forms-modal>
<ak-forms-delete
<button slot="trigger" class="pf-c-button pf-m-plain">
<i class="fas fa-vial" aria-hidden="true"></i>
</button>
</ak-forms-modal>`,
];
}
renderToolbarSelected(): TemplateResult {
// TODO: bulk delete
const disabled = this.selectedElements.length !== 1;
const item = this.selectedElements[0];
return html`<ak-forms-delete
.obj=${item}
objectLabel=${t`Policy`}
.usedBy=${() => {
@ -99,9 +114,15 @@ export class PolicyListPage extends TablePage<Policy> {
});
}}
>
<button slot="trigger" class="pf-c-button pf-m-danger">${t`Delete`}</button>
</ak-forms-delete>`,
];
<button
?disabled=${disabled}
slot="trigger"
type="button"
class="pf-c-button pf-m-danger ${disabled && "pf-m-disabled"}"
>
${t`Delete`}
</button>
</ak-forms-delete>`;
}
renderToolbar(): TemplateResult {

View File

@ -43,7 +43,7 @@ export class IPReputationListPage extends TablePage<IPReputation> {
return [
new TableColumn(t`IP`, "ip"),
new TableColumn(t`Score`, "score"),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -43,7 +43,7 @@ export class UserReputationListPage extends TablePage<UserReputation> {
return [
new TableColumn(t`Username`, "username"),
new TableColumn(t`Score`, "score"),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -54,7 +54,7 @@ export class PropertyMappingListPage extends TablePage<PropertyMapping> {
return [
new TableColumn(t`Name`, "name"),
new TableColumn(t`Type`, "type"),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -52,7 +52,7 @@ export class ProviderListPage extends TablePage<Provider> {
new TableColumn(t`Name`, "name"),
new TableColumn(t`Application`),
new TableColumn(t`Type`),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -48,7 +48,7 @@ export class InvitationListPage extends TablePage<Invitation> {
new TableColumn(t`ID`, "pk"),
new TableColumn(t`Created by`, "created_by"),
new TableColumn(t`Expiry`),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -47,7 +47,7 @@ export class PromptListPage extends TablePage<Prompt> {
new TableColumn(t`Type`, "type"),
new TableColumn(t`Order`, "order"),
new TableColumn(t`Stages`),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -56,7 +56,7 @@ export class SystemTaskListPage extends TablePage<Task> {
new TableColumn(t`Description`),
new TableColumn(t`Last run`),
new TableColumn(t`Status`),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -43,7 +43,7 @@ export class TenantListPage extends TablePage<Tenant> {
return [
new TableColumn(t`Domain`, "domain"),
new TableColumn(t`Default?`, "default"),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -44,7 +44,7 @@ export class TokenListPage extends TablePage<Token> {
new TableColumn(t`User`, "user"),
new TableColumn(t`Expires?`, "expiring"),
new TableColumn(t`Expiry date`, "expires"),
new TableColumn(""),
new TableColumn("Actions"),
];
}

View File

@ -58,7 +58,7 @@ export class UserListPage extends TablePage<User> {
new TableColumn(t`Name`, "username"),
new TableColumn(t`Active`, "active"),
new TableColumn(t`Last login`, "last_login"),
new TableColumn(""),
new TableColumn("Actions"),
];
}