web: housekeeping, optimizations and small fixes (#12450)

* web/user: fix incorrect font in RAC endpoint popup

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* fix navbar button colour in light mode

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* add about modal

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* fix sidebar overlapping page header

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* fix wizard hint alignment

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* add loading state to about modal

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* add version context

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* stub out init functions on loading interface

saves 4 HTTP requests on each full page load 🎉

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* fix z-index for panels

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* remove redundant api request

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

---------

Signed-off-by: Jens Langhammer <jens@goauthentik.io>
This commit is contained in:
Jens L.
2024-12-22 17:01:46 +01:00
committed by GitHub
parent 02bd699917
commit dc3559c7e9
16 changed files with 288 additions and 67 deletions

View File

@ -5,11 +5,12 @@ import "@goauthentik/elements/AppIcon";
import { AKElement, rootInterface } from "@goauthentik/elements/Base";
import "@goauthentik/elements/Expand";
import "@goauthentik/user/LibraryApplication/RACLaunchEndpointModal";
import type { RACLaunchEndpointModal } from "@goauthentik/user/LibraryApplication/RACLaunchEndpointModal";
import { UserInterface } from "@goauthentik/user/UserInterface";
import { msg } from "@lit/localize";
import { CSSResult, TemplateResult, css, html, nothing } from "lit";
import { customElement, property } from "lit/decorators.js";
import { customElement, property, query } from "lit/decorators.js";
import { classMap } from "lit/directives/class-map.js";
import { ifDefined } from "lit/directives/if-defined.js";
import { styleMap } from "lit/directives/style-map.js";
@ -31,6 +32,9 @@ export class LibraryApplication extends AKElement {
@property()
background = "";
@query("ak-library-rac-endpoint-launch")
racEndpointLaunch?: RACLaunchEndpointModal;
static get styles(): CSSResult[] {
return [
PFBase,
@ -94,14 +98,24 @@ export class LibraryApplication extends AKElement {
}
if (this.application?.launchUrl === "goauthentik.io://providers/rac/launch") {
return html`<ak-library-rac-endpoint-launch .app=${this.application}>
<a slot="trigger"> ${this.application.name} </a>
</ak-library-rac-endpoint-launch>`;
</ak-library-rac-endpoint-launch>
<div class="pf-c-card__title">
<a
@click=${() => {
this.racEndpointLaunch?.onClick();
}}
>
${this.application.name}
</a>
</div>`;
}
return html`<a
href="${ifDefined(this.application.launchUrl ?? "")}"
target="${ifDefined(this.application.openInNewTab ? "_blank" : undefined)}"
>${this.application.name}</a
>`;
return html`<div class="pf-c-card__title">
<a
href="${ifDefined(this.application.launchUrl ?? "")}"
target="${ifDefined(this.application.openInNewTab ? "_blank" : undefined)}"
>${this.application.name}</a
>
</div>`;
}
render(): TemplateResult {
@ -133,7 +147,7 @@ export class LibraryApplication extends AKElement {
></ak-app-icon>
</a>
</div>
<div class="pf-c-card__title">${this.renderLaunch()}</div>
${this.renderLaunch()}
<div class="expander"></div>
${expandable ? this.renderExpansion(this.application) : nothing}
</div>`;