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

web: refactor rendering of source icons

Browse Source 
closes #4718

Signed-off-by: Jens Langhammer <jens@goauthentik.io>
This commit is contained in:
Jens Langhammer
2023-02-19 20:17:58 +01:00
parent 99baf1a29e
commit 6f1721a728
3 changed files with 19 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
web/src/admin/sources/SourceViewPage.ts
View File

@ -14,6 +14,18 @@ import { ifDefined } from "lit/directives/if-defined.js";
import { Source, SourcesApi } from "@goauthentik/api";
export function renderSourceIcon(name: string, iconUrl: string | undefined | null): TemplateResult {
const icon = html`<i class="fas fa-share-square" title="${name}"></i>`;
if (iconUrl) {
if (iconUrl.startsWith("fa://")) {
const url = iconUrl.replaceAll("fa://", "");
return html`<i class="fas ${url}" title="${name}"></i>`;
}
return html`<img src="${iconUrl}" alt="${name}" />`;
}
return icon;
}
@customElement("ak-source-view")
export class SourceViewPage extends AKElement {
@property({ type: String })

11
web/src/flow/stages/identification/IdentificationStage.ts
View File

@ -1,3 +1,4 @@
import { renderSourceIcon } from "@goauthentik/admin/sources/SourceViewPage";
import "@goauthentik/elements/Divider";
import "@goauthentik/elements/EmptyState";
import "@goauthentik/elements/forms/FormElement";
@ -156,15 +157,7 @@ export class IdentificationStage extends BaseStage<
}
renderSource(source: LoginSource): TemplateResult {
let icon = html`<i class="fas fa-share-square" title="${source.name}"></i>`;
if (source.iconUrl) {
if (source.iconUrl.startsWith("fa://")) {
const url = source.iconUrl.replaceAll("fa://", "");
icon = html`<i class="fas ${url}" title="${source.name}"></i>`;
} else {
icon = html`<img src="${source.iconUrl}" alt="${source.name}" />`;
}
}
const icon = renderSourceIcon(source.name, source.iconUrl);
return html`<li class="pf-c-login__main-footer-links-item">
<button
type="button"

10
web/src/user/user-settings/sources/SourceSettings.ts
View File

@ -1,3 +1,4 @@
import { renderSourceIcon } from "@goauthentik/admin/sources/SourceViewPage";
import { DEFAULT_CONFIG } from "@goauthentik/common/api/config";
import { EVENT_REFRESH } from "@goauthentik/common/constants";
import { AKElement } from "@goauthentik/elements/Base";
@ -10,7 +11,6 @@ import { t } from "@lingui/macro";
import { CSSResult, TemplateResult, css, html } from "lit";
import { customElement, property } from "lit/decorators.js";
import { ifDefined } from "lit/directives/if-defined.js";
import { until } from "lit/directives/until.js";
import AKGlobal from "@goauthentik/common/styles/authentik.css";
@ -124,15 +124,15 @@ export class UserSourceSettingsPage extends AKElement {
header=${t`No services available.`}
></ak-empty-state>`;
}
return source.map((stage) => {
return source.map((source) => {
return html`<li class="pf-c-data-list__item">
<div class="pf-c-data-list__item-content">
<div class="pf-c-data-list__cell">
<img src="${ifDefined(stage.iconUrl)}" alt=${stage.title} />
${stage.title}
${renderSourceIcon(source.title, source.iconUrl)}
${source.title}
</div>
<div class="pf-c-data-list__cell">
${this.renderSourceSettings(stage)}
${this.renderSourceSettings(source)}
</div>
</div>
</li>`;