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

web/admin: add preview banner to RBAC pages (#7295)

Browse Source 
Signed-off-by: Jens Langhammer <jens@goauthentik.io>
This commit is contained in:
Jens L
2023-10-25 20:15:28 +02:00
committed by GitHub
parent 488420eeb6
commit f6118ec876
5 changed files with 169 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
web/src/elements/rbac/ObjectPermissionModal.ts
View File

@ -7,6 +7,7 @@ import { msg } from "@lit/localize";
import { CSSResult, TemplateResult, html } from "lit";
import { customElement, property } from "lit/decorators.js";
import PFBanner from "@patternfly/patternfly/components/Banner/banner.css";
import PFButton from "@patternfly/patternfly/components/Button/button.css";
import PFBase from "@patternfly/patternfly/patternfly-base.css";
@ -51,13 +52,17 @@ export class ObjectPermissionModal extends AKElement {
objectPk?: string | number;
static get styles(): CSSResult[] {
return [PFBase, PFButton];
return [PFBase, PFButton, PFBanner];
}
render(): TemplateResult {
return html`
<ak-forms-modal .showSubmitButton=${false} cancelText=${msg("Close")}>
<span slot="header"> ${msg("Update Permissions")} </span>
<div class="pf-c-banner pf-m-info" slot="above-form">
${msg("RBAC is in preview.")}
<a href="mailto:hello@goauthentik.io">${msg("Send us feedback!")}</a>
</div>
<ak-rbac-object-permission-modal-form
slot="form"
.model=${this.model}

80
web/src/elements/rbac/ObjectPermissionsPage.ts
View File

@ -7,6 +7,7 @@ import { msg } from "@lit/localize";
import { CSSResult, TemplateResult, html } from "lit";
import { customElement, property } from "lit/decorators.js";
import PFBanner from "@patternfly/patternfly/components/Banner/banner.css";
import PFCard from "@patternfly/patternfly/components/Card/card.css";
import PFPage from "@patternfly/patternfly/components/Page/page.css";
import PFGrid from "@patternfly/patternfly/layouts/Grid/grid.css";
@ -22,48 +23,57 @@ export class ObjectPermissionPage extends AKElement {
@property()
objectPk?: string | number;
@property({ type: Boolean })
showBanner = true;
static get styles(): CSSResult[] {
return [PFBase, PFGrid, PFPage, PFCard];
return [PFBase, PFGrid, PFPage, PFCard, PFBanner];
}
render(): TemplateResult {
return html`<ak-tabs pageIdentifier="permissionPage">
<section
slot="page-object-user"
data-tab-title="${msg("User Object Permissions")}"
class="pf-c-page__main-section pf-m-no-padding-mobile"
>
<div class="pf-l-grid pf-m-gutter">
<div class="pf-c-card pf-l-grid__item pf-m-12-col">
<div class="pf-c-card__title">User Object Permissions</div>
<div class="pf-c-card__body">
<ak-rbac-user-object-permission-table
.model=${this.model}
.objectPk=${this.objectPk}
>
</ak-rbac-user-object-permission-table>
return html`${this.showBanner
? html`<div class="pf-c-banner pf-m-info">
${msg("RBAC is in preview.")}
<a href="mailto:hello@goauthentik.io">${msg("Send us feedback!")}</a>
</div>`
: html``}
<ak-tabs pageIdentifier="permissionPage">
<section
slot="page-object-user"
data-tab-title="${msg("User Object Permissions")}"
class="pf-c-page__main-section pf-m-no-padding-mobile"
>
<div class="pf-l-grid pf-m-gutter">
<div class="pf-c-card pf-l-grid__item pf-m-12-col">
<div class="pf-c-card__title">User Object Permissions</div>
<div class="pf-c-card__body">
<ak-rbac-user-object-permission-table
.model=${this.model}
.objectPk=${this.objectPk}
>
</ak-rbac-user-object-permission-table>
</div>
</div>
</div>
</div>
</section>
<section
slot="page-object-role"
data-tab-title="${msg("Role Object Permissions")}"
class="pf-c-page__main-section pf-m-no-padding-mobile"
>
<div class="pf-l-grid pf-m-gutter">
<div class="pf-c-card pf-l-grid__item pf-m-12-col">
<div class="pf-c-card__title">Role Object Permissions</div>
<div class="pf-c-card__body">
<ak-rbac-role-object-permission-table
.model=${this.model}
.objectPk=${this.objectPk}
>
</ak-rbac-role-object-permission-table>
</section>
<section
slot="page-object-role"
data-tab-title="${msg("Role Object Permissions")}"
class="pf-c-page__main-section pf-m-no-padding-mobile"
>
<div class="pf-l-grid pf-m-gutter">
<div class="pf-c-card pf-l-grid__item pf-m-12-col">
<div class="pf-c-card__title">Role Object Permissions</div>
<div class="pf-c-card__body">
<ak-rbac-role-object-permission-table
.model=${this.model}
.objectPk=${this.objectPk}
>
</ak-rbac-role-object-permission-table>
</div>
</div>
</div>
</div>
</section>
</ak-tabs>`;
</section>
</ak-tabs>`;
}
}