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

web: began rename, but had to stop and go back for a revision.

Browse Source
This commit is contained in:
Ken Sternberg
2023-12-04 10:19:02 -08:00
parent c52fa631b4
commit 21b50838db
18 changed files with 98 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
web/src/admin/applications/wizard/methods/ldap/ak-application-wizard-authentication-by-ldap.ts
View File

@ -6,7 +6,7 @@ import "@goauthentik/components/ak-number-input";
import "@goauthentik/components/ak-radio-input";
import "@goauthentik/components/ak-switch-input";
import "@goauthentik/components/ak-text-input";
import { WithTenantConfig } from "@goauthentik/elements/Interface/tenantProvider";
import { WithBrandConfig } from "@goauthentik/elements/Interface/brandProvider";
import "@goauthentik/elements/forms/FormGroup";
import "@goauthentik/elements/forms/HorizontalFormElement";
@ -31,7 +31,7 @@ import {
} from "./LDAPOptionsAndHelp";
@customElement("ak-application-wizard-authentication-by-ldap")
export class ApplicationWizardApplicationDetails extends WithTenantConfig(BaseProviderPanel, true) {
export class ApplicationWizardApplicationDetails extends WithBrandConfig(BaseProviderPanel) {
render() {
const provider = this.wizard.provider as LDAPProvider | undefined;
@ -52,7 +52,7 @@ export class ApplicationWizardApplicationDetails extends WithTenantConfig(BasePr
<ak-tenanted-flow-search
flowType=${FlowsInstancesListDesignationEnum.Authentication}
.currentFlow=${provider?.authorizationFlow}
.tenantFlow=${this.tenant.flowAuthentication}
.tenantFlow=${this.brand.flowAuthentication}
required
></ak-tenanted-flow-search>
<p class="pf-c-form__helper-text">${msg("Flow used for users to authenticate.")}</p>

9
web/src/admin/applications/wizard/methods/radius/ak-application-wizard-authentication-by-radius.ts
View File

@ -2,7 +2,7 @@ import "@goauthentik/admin/common/ak-crypto-certificate-search";
import "@goauthentik/admin/common/ak-flow-search/ak-tenanted-flow-search";
import { ascii_letters, digits, first, randomString } from "@goauthentik/common/utils";
import "@goauthentik/components/ak-text-input";
import { WithTenantConfig } from "@goauthentik/elements/Interface/tenantProvider";
import { WithBrandConfig } from "@goauthentik/elements/Interface/brandProvider";
import "@goauthentik/elements/forms/FormGroup";
import "@goauthentik/elements/forms/HorizontalFormElement";
@ -16,10 +16,7 @@ import { FlowsInstancesListDesignationEnum, RadiusProvider } from "@goauthentik/
import BaseProviderPanel from "../BaseProviderPanel";
@customElement("ak-application-wizard-authentication-by-radius")
export class ApplicationWizardAuthenticationByRadius extends WithTenantConfig(
BaseProviderPanel,
true,
) {
export class ApplicationWizardAuthenticationByRadius extends WithBrandConfig(BaseProviderPanel) {
render() {
const provider = this.wizard.provider as RadiusProvider | undefined;
@ -40,7 +37,7 @@ export class ApplicationWizardAuthenticationByRadius extends WithTenantConfig(
<ak-tenanted-flow-search
flowType=${FlowsInstancesListDesignationEnum.Authentication}
.currentFlow=${provider?.authorizationFlow}
.tenantFlow=${this.tenant.flowAuthentication}
.tenantFlow=${this.brand.flowAuthentication}
required
></ak-tenanted-flow-search>
<p class="pf-c-form__helper-text">${msg("Flow used for users to authenticate.")}</p>

7
web/src/admin/groups/RelatedUserList.ts
View File

@ -9,11 +9,11 @@ import { MessageLevel } from "@goauthentik/common/messages";
import { uiConfig } from "@goauthentik/common/ui/config";
import { first } from "@goauthentik/common/utils";
import "@goauthentik/components/ak-status-label";
import { WithBrandConfig } from "@goauthentik/elements/Interface/brandProvider";
import {
CapabilitiesEnum,
WithCapabilitiesConfig,
} from "@goauthentik/elements/Interface/capabilitiesProvider";
import { WithTenantConfig } from "@goauthentik/elements/Interface/tenantProvider";
import "@goauthentik/elements/buttons/ActionButton";
import "@goauthentik/elements/buttons/Dropdown";
import "@goauthentik/elements/forms/DeleteBulkForm";
@ -110,9 +110,8 @@ export class RelatedUserAdd extends Form<{ users: number[] }> {
}
@customElement("ak-user-related-list")
export class RelatedUserList extends WithTenantConfig(
export class RelatedUserList extends WithBrandConfig(
WithCapabilitiesConfig(Table<User>, true),
true,
) {
expandable = true;
checkbox = true;
@ -298,7 +297,7 @@ export class RelatedUserList extends WithTenantConfig(
${msg("Set password")}
</button>
</ak-forms-modal>
${this.tenant?.flowRecovery
${this.brand?.flowRecovery
? html`
<ak-action-button
class="pf-m-secondary"

6
web/src/admin/providers/ldap/LDAPProviderForm.ts
View File

@ -2,7 +2,7 @@ import "@goauthentik/admin/common/ak-crypto-certificate-search";
import "@goauthentik/admin/common/ak-flow-search/ak-tenanted-flow-search";
import { DEFAULT_CONFIG } from "@goauthentik/common/api/config";
import { first } from "@goauthentik/common/utils";
import { WithTenantConfig } from "@goauthentik/elements/Interface/tenantProvider";
import { WithBrandConfig } from "@goauthentik/elements/Interface/brandProvider";
import "@goauthentik/elements/forms/FormGroup";
import "@goauthentik/elements/forms/HorizontalFormElement";
import { ModelForm } from "@goauthentik/elements/forms/ModelForm";
@ -25,7 +25,7 @@ import {
} from "@goauthentik/api";
@customElement("ak-provider-ldap-form")
export class LDAPProviderFormPage extends WithTenantConfig(ModelForm<LDAPProvider, number>, true) {
export class LDAPProviderFormPage extends WithBrandConfig(ModelForm<LDAPProvider, number>, true) {
async loadInstance(pk: number): Promise<LDAPProvider> {
return new ProvidersApi(DEFAULT_CONFIG).providersLdapRetrieve({
id: pk,
@ -76,7 +76,7 @@ export class LDAPProviderFormPage extends WithTenantConfig(ModelForm<LDAPProvide
<ak-tenanted-flow-search
flowType=${FlowsInstancesListDesignationEnum.Authentication}
.currentFlow=${this.instance?.authorizationFlow}
.tenantFlow=${this.tenant?.flowAuthentication}
.tenantFlow=${this.brand?.flowAuthentication}
required
></ak-tenanted-flow-search>
<p class="pf-c-form__helper-text">${msg("Flow used for users to authenticate.")}</p>

6
web/src/admin/providers/radius/RadiusProviderForm.ts
View File

@ -1,6 +1,6 @@
import { DEFAULT_CONFIG } from "@goauthentik/common/api/config";
import { ascii_letters, digits, first, randomString } from "@goauthentik/common/utils";
import { WithTenantConfig } from "@goauthentik/elements/Interface/tenantProvider";
import { WithBrandConfig } from "@goauthentik/elements/Interface/brandProvider";
import "@goauthentik/elements/forms/FormGroup";
import "@goauthentik/elements/forms/HorizontalFormElement";
import { ModelForm } from "@goauthentik/elements/forms/ModelForm";
@ -14,7 +14,7 @@ import { customElement } from "lit/decorators.js";
import { FlowsInstancesListDesignationEnum, ProvidersApi, RadiusProvider } from "@goauthentik/api";
@customElement("ak-provider-radius-form")
export class RadiusProviderFormPage extends WithTenantConfig(
export class RadiusProviderFormPage extends WithBrandConfig(
ModelForm<RadiusProvider, number>,
true,
) {
@ -68,7 +68,7 @@ export class RadiusProviderFormPage extends WithTenantConfig(
<ak-tenanted-flow-search
flowType=${FlowsInstancesListDesignationEnum.Authentication}
.currentFlow=${this.instance?.authorizationFlow}
.tenantFlow=${this.tenant?.flowAuthentication}
.tenantFlow=${this.brand?.flowAuthentication}
required
></ak-tenanted-flow-search>
<p class="pf-c-form__helper-text">${msg("Flow used for users to authenticate.")}</p>

10
web/src/admin/users/UserListPage.ts
View File

@ -12,11 +12,11 @@ import { DefaultUIConfig, uiConfig } from "@goauthentik/common/ui/config";
import { first } from "@goauthentik/common/utils";
import "@goauthentik/components/ak-status-label";
import { rootInterface } from "@goauthentik/elements/Base";
import { WithBrandConfig } from "@goauthentik/elements/Interface/brandProvider";
import {
CapabilitiesEnum,
WithCapabilitiesConfig,
} from "@goauthentik/elements/Interface/capabilitiesProvider";
import { WithTenantConfig } from "@goauthentik/elements/Interface/tenantProvider";
import { PFSize } from "@goauthentik/elements/Spinner";
import "@goauthentik/elements/TreeView";
import "@goauthentik/elements/buttons/ActionButton";
@ -91,10 +91,8 @@ const recoveryButtonStyles = css`
`;
@customElement("ak-user-list")
export class UserListPage extends WithTenantConfig(
WithCapabilitiesConfig(TablePage<User>, true),
true,
) {
export class UserListPage extends WithBrandConfig(
WithCapabilitiesConfig(TablePage<User>, true)) {
expandable = true;
checkbox = true;
@ -355,7 +353,7 @@ export class UserListPage extends WithTenantConfig(
${msg("Set password")}
</button>
</ak-forms-modal>
${this.tenant.flowRecovery
${this.brand.flowRecovery
? html`
<ak-action-button
class="pf-m-secondary"

42
web/src/common/api/config.ts
View File

@ -6,7 +6,13 @@ import {
import { EVENT_LOCALE_REQUEST, EVENT_REFRESH, VERSION } from "@goauthentik/common/constants";
import { globalAK } from "@goauthentik/common/global";
import { Config, Configuration, CoreApi, CurrentTenant, RootApi } from "@goauthentik/api";
import {
Config,
Configuration,
CoreApi,
CurrentTenant as CurrentBrand,
RootApi,
} from "@goauthentik/api";
let globalConfigPromise: Promise<Config> | undefined = Promise.resolve(globalAK().config);
export function config(): Promise<Config> {
@ -16,7 +22,7 @@ export function config(): Promise<Config> {
return globalConfigPromise;
}
export function tenantSetFavicon(tenant: CurrentTenant) {
export function brandSetFavicon(brand: CurrentBrand) {
/**
* <link rel="icon" href="/static/dist/assets/icons/icon.png">
* <link rel="shortcut icon" href="/static/dist/assets/icons/icon.png">
@ -29,36 +35,36 @@ export function tenantSetFavicon(tenant: CurrentTenant) {
relIcon.rel = rel;
document.getElementsByTagName("head")[0].appendChild(relIcon);
}
relIcon.href = tenant.brandingFavicon;
relIcon.href = brand.brandingFavicon;
});
}
export function tenantSetLocale(tenant: CurrentTenant) {
if (tenant.defaultLocale === "") {
export function brandSetLocale(brand: CurrentBrand) {
if (brand.defaultLocale === "") {
return;
}
console.debug("authentik/locale: setting locale from tenant default");
console.debug("authentik/locale: setting locale from brand default");
window.dispatchEvent(
new CustomEvent(EVENT_LOCALE_REQUEST, {
composed: true,
bubbles: true,
detail: { locale: tenant.defaultLocale },
detail: { locale: brand.defaultLocale },
}),
);
}
let globalTenantPromise: Promise<CurrentTenant> | undefined = Promise.resolve(globalAK().tenant);
export function tenant(): Promise<CurrentTenant> {
if (!globalTenantPromise) {
globalTenantPromise = new CoreApi(DEFAULT_CONFIG)
let globalBrandPromise: Promise<CurrentBrand> | undefined = Promise.resolve(globalAK().tenant);
export function brand(): Promise<CurrentBrand> {
if (!globalBrandPromise) {
globalBrandPromise = new CoreApi(DEFAULT_CONFIG)
.coreTenantsCurrentRetrieve()
.then((tenant) => {
tenantSetFavicon(tenant);
tenantSetLocale(tenant);
return tenant;
.then((brand) => {
brandSetFavicon(brand);
brandSetLocale(brand);
return brand;
});
}
return globalTenantPromise;
return globalBrandPromise;
}
export function getMetaContent(key: string): string {
@ -90,9 +96,9 @@ window.addEventListener(EVENT_REFRESH, () => {
// Upon global refresh, disregard whatever was pre-hydrated and
// actually load info from API
globalConfigPromise = undefined;
globalTenantPromise = undefined;
globalBrandPromise = undefined;
config();
tenant();
brand();
});
console.debug(`authentik(early): version ${VERSION}, apiBase ${DEFAULT_CONFIG.basePath}`);

8
web/src/common/api/middleware.ts
View File

@ -18,13 +18,13 @@ export interface RequestInfo {
}
export class LoggingMiddleware implements Middleware {
tenant: CurrentTenant;
constructor(tenant: CurrentTenant) {
this.tenant = tenant;
brand: CurrentTenant;
constructor(brand: CurrentTenant) {
this.brand = brand;
}
post(context: ResponseContext): Promise<Response | void> {
let msg = `authentik/api[${this.tenant.matchedDomain}]: `;
let msg = `authentik/api[${this.brand.matchedDomain}]: `;
// https://developer.mozilla.org/en-US/docs/Web/API/console#styling_console_output
msg += `%c${context.response.status}%c ${context.init.method} ${context.url}`;
let style = "";

6
web/src/elements/AuthentikContexts.ts
View File

@ -1,11 +1,9 @@
import { createContext } from "@lit-labs/context";
import type { Config, CurrentTenant } from "@goauthentik/api";
import type { Config, CurrentTenant as CurrentBrand } from "@goauthentik/api";
export const authentikConfigContext = createContext<Config>(Symbol("authentik-config-context"));
export const authentikTenantContext = createContext<CurrentTenant>(
Symbol("authentik-tenant-context"),
);
export const authentikBrandContext = createContext<CurrentBrand>(Symbol("authentik-brand-context"));
export default authentikConfigContext;

26
web/src/elements/Interface/Interface.ts
View File

@ -1,8 +1,8 @@
import { config, tenant } from "@goauthentik/common/api/config";
import { brand, config } from "@goauthentik/common/api/config";
import { UIConfig, uiConfig } from "@goauthentik/common/ui/config";
import {
authentikBrandContext,
authentikConfigContext,
authentikTenantContext,
} from "@goauthentik/elements/AuthentikContexts";
import type { AdoptedStyleSheetsElement } from "@goauthentik/elements/types";
import { ensureCSSStyleSheet } from "@goauthentik/elements/utils/ensureCSSStyleSheet";
@ -12,13 +12,13 @@ import { state } from "lit/decorators.js";
import PFBase from "@patternfly/patternfly/patternfly-base.css";
import { Config, CurrentTenant, UiThemeEnum } from "@goauthentik/api";
import { Config, CurrentTenant as CurrentBrand, UiThemeEnum } from "@goauthentik/api";
import { AKElement } from "../Base";
type AkInterface = HTMLElement & {
getTheme: () => Promise<UiThemeEnum>;
tenant?: CurrentTenant;
brand?: CurrentBrand;
uiConfig?: UIConfig;
config?: Config;
};
@ -45,28 +45,28 @@ export class Interface extends AKElement implements AkInterface {
return this._config;
}
_tenantContext = new ContextProvider(this, {
context: authentikTenantContext,
_brandContext = new ContextProvider(this, {
context: authentikBrandContext,
initialValue: undefined,
});
_tenant?: CurrentTenant;
_brand?: CurrentBrand;
@state()
set tenant(c: CurrentTenant) {
this._tenant = c;
this._tenantContext.setValue(c);
set brand(c: CurrentBrand) {
this._brand = c;
this._brandContext.setValue(c);
this.requestUpdate();
}
get tenant(): CurrentTenant | undefined {
return this._tenant;
get brand(): CurrentBrand | undefined {
return this._brand;
}
constructor() {
super();
document.adoptedStyleSheets = [...document.adoptedStyleSheets, ensureCSSStyleSheet(PFBase)];
tenant().then((tenant) => (this.tenant = tenant));
brand().then((brand) => (this.brand = brand));
config().then((config) => (this.config = config));
this.dataset.akInterfaceRoot = "true";
}

20
web/src/elements/Interface/brandProvider.ts Normal file
View File

@ -0,0 +1,20 @@
import { authentikBrandContext } from "@goauthentik/elements/AuthentikContexts";
import { consume } from "@lit-labs/context";
import type { LitElement } from "lit";
import type { CurrentTenant as CurrentBrand } from "@goauthentik/api";
// eslint-disable-next-line @typescript-eslint/no-explicit-any
type Constructor<T = object> = abstract new (...args: any[]) => T;
export function WithBrandConfig<T extends Constructor<LitElement>>(
superclass: T,
subscribe = true,
) {
abstract class WithBrandProvider extends superclass {
@consume({ context: authentikBrandContext, subscribe })
public brand!: CurrentBrand;
}
return WithBrandProvider;
}

20
web/src/elements/Interface/tenantProvider.ts
View File

@ -1,20 +0,0 @@
import { authentikTenantContext } from "@goauthentik/elements/AuthentikContexts";
import { consume } from "@lit-labs/context";
import type { LitElement } from "lit";
import type { CurrentTenant } from "@goauthentik/api";
// eslint-disable-next-line @typescript-eslint/no-explicit-any
type Constructor<T = object> = abstract new (...args: any[]) => T;
export function WithTenantConfig<T extends Constructor<LitElement>>(
superclass: T,
subscribe = false,
) {
abstract class WithTenantProvider extends superclass {
@consume({ context: authentikTenantContext, subscribe })
public tenant!: CurrentTenant;
}
return WithTenantProvider;
}

6
web/src/elements/PageHeader.ts
View File

@ -9,7 +9,7 @@ import {
import { currentInterface } from "@goauthentik/common/sentry";
import { me } from "@goauthentik/common/users";
import { AKElement } from "@goauthentik/elements/Base";
import { WithTenantConfig } from "@goauthentik/elements/Interface/tenantProvider";
import { WithBrandConfig } from "@goauthentik/elements/Interface/brandProvider";
import "@patternfly/elements/pf-tooltip/pf-tooltip.js";
import { msg } from "@lit/localize";
@ -24,7 +24,7 @@ import PFBase from "@patternfly/patternfly/patternfly-base.css";
import { EventsApi } from "@goauthentik/api";
@customElement("ak-page-header")
export class PageHeader extends WithTenantConfig(AKElement, true) {
export class PageHeader extends WithBrandConfig(AKElement) {
@property()
icon?: string;
@ -37,7 +37,7 @@ export class PageHeader extends WithTenantConfig(AKElement, true) {
@property()
set header(value: string) {
const currentIf = currentInterface();
let title = this.tenant?.brandingTitle || TITLE_DEFAULT;
let title = this.brand?.brandingTitle || TITLE_DEFAULT;
if (currentIf === "admin") {
title = `${msg("Admin")} - ${title}`;
}

6
web/src/elements/sidebar/SidebarBrand.ts
View File

@ -1,6 +1,6 @@
import { EVENT_SIDEBAR_TOGGLE } from "@goauthentik/common/constants";
import { AKElement } from "@goauthentik/elements/Base";
import { WithTenantConfig } from "@goauthentik/elements/Interface/tenantProvider";
import { WithBrandConfig } from "@goauthentik/elements/Interface/brandProvider";
import { CSSResult, TemplateResult, css, html } from "lit";
import { customElement } from "lit/decorators.js";
@ -27,7 +27,7 @@ export const DefaultTenant: CurrentTenant = {
};
@customElement("ak-sidebar-brand")
export class SidebarBrand extends WithTenantConfig(AKElement, true) {
export class SidebarBrand extends WithBrandConfig(AKElement) {
static get styles(): CSSResult[] {
return [
PFBase,
@ -85,7 +85,7 @@ export class SidebarBrand extends WithTenantConfig(AKElement, true) {
<a href="#/" class="pf-c-page__header-brand-link">
<div class="pf-c-brand ak-brand">
<img
src=${this.tenant?.brandingLogo ?? DefaultTenant.brandingLogo}
src=${this.brand?.brandingLogo ?? DefaultTenant.brandingLogo}
alt="authentik Logo"
loading="lazy"
/>

8
web/src/flow/FlowExecutor.ts
View File

@ -54,9 +54,9 @@ export class FlowExecutor extends Interface implements StageHost {
set challenge(value: ChallengeTypes | undefined) {
this._challenge = value;
if (value?.flowInfo?.title) {
document.title = `${value.flowInfo?.title} - ${this.tenant?.brandingTitle}`;
document.title = `${value.flowInfo?.title} - ${this.brand?.brandingTitle}`;
} else {
document.title = this.tenant?.brandingTitle || TITLE_DEFAULT;
document.title = this.brand?.brandingTitle || TITLE_DEFAULT;
}
this.requestUpdate();
}
@ -500,7 +500,7 @@ export class FlowExecutor extends Interface implements StageHost {
<header class="pf-c-login__header">
<div class="pf-c-brand ak-brand">
<img
src="${first(this.tenant?.brandingLogo, "")}"
src="${first(this.brand?.brandingLogo, "")}"
alt="authentik Logo"
/>
</div>
@ -510,7 +510,7 @@ export class FlowExecutor extends Interface implements StageHost {
</div>
<footer class="pf-c-login__footer">
<ul class="pf-c-list pf-m-inline">
${this.tenant?.uiFooterLinks?.map((link) => {
${this.brand?.uiFooterLinks?.map((link) => {
return html`<li>
<a href="${link.href || ""}"
>${link.name}</a

2
web/src/standalone/api-browser/index.ts
View File

@ -103,7 +103,7 @@ export class APIBrowser extends Interface {
<img
alt="authentik Logo"
class="logo"
src="${first(this.tenant?.brandingLogo, DefaultTenant.brandingLogo)}"
src="${first(this.brand?.brandingLogo, DefaultTenant.brandingLogo)}"
/>
</div>
</rapi-doc>

7
web/src/user/UserInterface.ts
View File

@ -192,11 +192,8 @@ export class UserInterface extends Interface {
<a href="#/" class="pf-c-page__header-brand-link">
<img
class="pf-c-brand"
src="${first(
this.tenant?.brandingLogo,
DefaultTenant.brandingLogo,
)}"
alt="${(this.tenant?.brandingTitle, DefaultTenant.brandingTitle)}"
src="${first(this.brand?.brandingLogo, DefaultTenant.brandingLogo)}"
alt="${(this.brand?.brandingTitle, DefaultTenant.brandingTitle)}"
/>
</a>
</div>

6
web/src/user/user-settings/details/UserSettingsFlowExecutor.ts
View File

@ -3,7 +3,7 @@ import { EVENT_REFRESH } from "@goauthentik/common/constants";
import { MessageLevel } from "@goauthentik/common/messages";
import { refreshMe } from "@goauthentik/common/users";
import { AKElement } from "@goauthentik/elements/Base";
import { WithTenantConfig } from "@goauthentik/elements/Interface/tenantProvider";
import { WithBrandConfig } from "@goauthentik/elements/Interface/brandProvider";
import { showMessage } from "@goauthentik/elements/messages/MessageContainer";
import { StageHost } from "@goauthentik/flow/stages/base";
import "@goauthentik/user/user-settings/details/stages/prompt/PromptStage";
@ -32,7 +32,7 @@ import {
@customElement("ak-user-settings-flow-executor")
export class UserSettingsFlowExecutor
extends WithTenantConfig(AKElement, true)
extends WithBrandConfig(AKElement)
implements StageHost
{
@property()
@ -87,7 +87,7 @@ export class UserSettingsFlowExecutor
}
firstUpdated(): void {
this.flowSlug = this.tenant?.flowUserSettings;
this.flowSlug = this.brand?.flowUserSettings;
if (!this.flowSlug) {
return;
}