web: break circular dependency between AKElement & Interface. (#7165)
* web: break circular dependency between AKElement & Interface. This commit changes the way the root node of the web application shell is discovered by child components, such that the base class shared by both no longer results in a circular dependency between the two models. I've run this in isolation and have seen no failures of discovery; the identity token exists as soon as the Interface is constructed and is found by every item on the page. * web: fix broken typescript references This built... and then it didn't? Anyway, the current fix is to provide type information the AkInterface for the data that consumers require.
This commit is contained in:
parent
7e213f3ca6
commit
9582cd4599
|
@ -13,12 +13,15 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
|
||||||
|
|
||||||
import { Config, CurrentTenant, UiThemeEnum } from "@goauthentik/api";
|
import { Config, CurrentTenant, UiThemeEnum } from "@goauthentik/api";
|
||||||
|
|
||||||
export function rootInterface<T extends Interface>(): T | undefined {
|
type AkInterface = HTMLElement & {
|
||||||
const el = Array.from(document.body.querySelectorAll("*")).filter(
|
getTheme: () => Promise<UiThemeEnum>;
|
||||||
(el) => el instanceof Interface,
|
tenant?: CurrentTenant;
|
||||||
);
|
uiConfig?: UIConfig;
|
||||||
return el[0] as T;
|
config?: Config;
|
||||||
}
|
};
|
||||||
|
|
||||||
|
export const rootInterface = <T extends AkInterface>(): T | undefined =>
|
||||||
|
(document.body.querySelector("[data-ak-interface-root]") as T) ?? undefined;
|
||||||
|
|
||||||
export function ensureCSSStyleSheet(css: CSSStyleSheet | CSSResult): CSSStyleSheet {
|
export function ensureCSSStyleSheet(css: CSSStyleSheet | CSSResult): CSSStyleSheet {
|
||||||
if (css instanceof CSSResult) {
|
if (css instanceof CSSResult) {
|
||||||
|
@ -171,7 +174,7 @@ export class AKElement extends LitElement {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export class Interface extends AKElement {
|
export class Interface extends AKElement implements AkInterface {
|
||||||
@state()
|
@state()
|
||||||
tenant?: CurrentTenant;
|
tenant?: CurrentTenant;
|
||||||
|
|
||||||
|
@ -186,6 +189,7 @@ export class Interface extends AKElement {
|
||||||
document.adoptedStyleSheets = [...document.adoptedStyleSheets, ensureCSSStyleSheet(PFBase)];
|
document.adoptedStyleSheets = [...document.adoptedStyleSheets, ensureCSSStyleSheet(PFBase)];
|
||||||
tenant().then((tenant) => (this.tenant = tenant));
|
tenant().then((tenant) => (this.tenant = tenant));
|
||||||
config().then((config) => (this.config = config));
|
config().then((config) => (this.config = config));
|
||||||
|
this.dataset.akInterfaceRoot = "true";
|
||||||
}
|
}
|
||||||
|
|
||||||
_activateTheme(root: AdoptedStyleSheetsElement, theme: UiThemeEnum): void {
|
_activateTheme(root: AdoptedStyleSheetsElement, theme: UiThemeEnum): void {
|
||||||
|
|
Reference in New Issue