import { t } from "@lingui/macro"; import { CSSResult, LitElement, TemplateResult, css, html } from "lit"; import { customElement, property } from "lit/decorators.js"; import { until } from "lit/directives/until.js"; import AKGlobal from "../authentik.css"; import PFButton from "@patternfly/patternfly/components/Button/button.css"; import PFDrawer from "@patternfly/patternfly/components/Drawer/drawer.css"; import PFPage from "@patternfly/patternfly/components/Page/page.css"; import PFBase from "@patternfly/patternfly/patternfly-base.css"; import { AdminApi, Version } from "@goauthentik/api"; import { DEFAULT_CONFIG } from "../api/Config"; import { me } from "../api/Users"; import { WebsocketClient } from "../common/ws"; import { EVENT_API_DRAWER_TOGGLE, EVENT_NOTIFICATION_DRAWER_TOGGLE, EVENT_SIDEBAR_TOGGLE, VERSION, } from "../constants"; import "../elements/messages/MessageContainer"; import "../elements/messages/MessageContainer"; import "../elements/notifications/NotificationDrawer"; import { ID_REGEX, SLUG_REGEX, UUID_REGEX } from "../elements/router/Route"; import { getURLParam, updateURLParams } from "../elements/router/RouteMatch"; import "../elements/router/RouterOutlet"; import "../elements/sidebar/Sidebar"; import "../elements/sidebar/SidebarItem"; import { ROUTES } from "../routesAdmin"; import "./locale"; @customElement("ak-interface-admin") export class AdminInterface extends LitElement { @property({ type: Boolean }) sidebarOpen = true; @property({ type: Boolean }) notificationDrawerOpen = getURLParam("notificationDrawerOpen", false); @property({ type: Boolean }) apiDrawerOpen = getURLParam("apiDrawerOpen", false); ws: WebsocketClient; private version: Promise; static get styles(): CSSResult[] { return [ PFBase, PFPage, PFButton, PFDrawer, AKGlobal, css` .pf-c-page__main, .pf-c-drawer__content, .pf-c-page__drawer { z-index: auto !important; background-color: transparent; } .display-none { display: none; } .pf-c-page { background-color: var(--pf-c-page--BackgroundColor) !important; } @media (prefers-color-scheme: dark) { /* Global page background colour */ .pf-c-page { --pf-c-page--BackgroundColor: var(--ak-dark-background); } } `, ]; } constructor() { super(); this.ws = new WebsocketClient(); this.sidebarOpen = window.innerWidth >= 1280; window.addEventListener("resize", () => { this.sidebarOpen = window.innerWidth >= 1280; }); window.addEventListener(EVENT_SIDEBAR_TOGGLE, () => { this.sidebarOpen = !this.sidebarOpen; }); window.addEventListener(EVENT_NOTIFICATION_DRAWER_TOGGLE, () => { this.notificationDrawerOpen = !this.notificationDrawerOpen; updateURLParams({ notificationDrawerOpen: this.notificationDrawerOpen, }); }); window.addEventListener(EVENT_API_DRAWER_TOGGLE, () => { this.apiDrawerOpen = !this.apiDrawerOpen; updateURLParams({ apiDrawerOpen: this.apiDrawerOpen, }); }); this.version = new AdminApi(DEFAULT_CONFIG).adminVersionRetrieve(); } render(): TemplateResult { return html`

`; } renderSidebarItems(): TemplateResult { me().then((u) => { if (!u.user.isSuperuser) { window.location.assign("/if/user"); } }); return html` ${until( this.version.then((version) => { if (version.versionCurrent !== VERSION) { return html` ${t`A newer version of the frontend is available.`} `; } return html``; }), )} ${until( me().then((u) => { if (u.original) { return html` ${t`You're currently impersonating ${u.user.username}. Click to stop.`} `; } return html``; }), )} ${t`User interface`}

${t`Overview`}

${t`System Tasks`}

${t`Resources`}

${SLUG_REGEX})$`]} > ${t`Applications`}

${SLUG_REGEX})$`]} > ${t`Sources`}

${ID_REGEX})$`]} > ${t`Providers`}

${t`Tenants`}

${t`Outposts`}

${t`Integrations`}

${t`Events`}

${UUID_REGEX})$`]} > ${t`Logs`}

${t`Notification Rules`}

${t`Notification Transports`}

${t`Customisation`}

${t`Policies`}

${t`Reputation policy - IPs`}

${t`Reputation policy - Users`}

${t`Property Mappings`}

${t`Flows`}

${SLUG_REGEX})$`]} > ${t`Flows`}

${t`Stages`}

${t`Prompts`}

${t`Invitations`}

${t`Identity & Cryptography`}

${ID_REGEX})$`]} > ${t`Users`}

${t`Groups`}

${t`Certificates`}

${t`Tokens & App passwords`}

`; } }