+
+ ${this.renderSidebarItems()}
+
+
`;
+ }
+
+ renderSidebarItems(): TemplateResult {
+ return html`
+ ${until(
+ this.version.then((version) => {
+ if (version.versionCurrent !== VERSION) {
+ return html`
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
- Loading...
-
-
-
-
-
-
-
-
-
- Loading...
-
+
`;
+ }
+}
+
+@customElement("ak-library")
+export class LibraryPage extends LitElement {
+ @property({ attribute: false })
+ apps?: AKResponse
+ ${this.application.metaIcon
+ ? html`})
`
+ : html``}
+ ${until(
+ me().then((u) => {
+ if (!u.user.isSuperuser) return html``;
+ return html`
+
+
+
+ `;
+ }),
+ )}
+
+
+
+
+
+ ${this.application.metaPublisher}
+
+ ${truncate(this.application.metaDescription, 35)}
+
+
`;
+ }
+
+ renderApps(): TemplateResult {
+ return html`
+
+
+ ${t`No Applications available.`}
+
+ ${t`Either no applications are defined, or you don't have access to any.`}
+
+
+ ${this.apps?.results.map(
+ (app) => html`
`;
+ }
+
+ render(): TemplateResult {
+ return html`${t`Error: unsupported stage settings: ${stage.component}`}
`; + } + } + + renderSourceSettings(source: UserSetting): TemplateResult { + switch (source.component) { + case "ak-user-settings-source-oauth": + return html`${t`Error: unsupported source settings: ${source.component}`}
`; + } + } + + render(): TemplateResult { + return html`
+
+
+
+
+
+
+
+
+ ${until(
+ this.userSettings?.then((stages) => {
+ return stages.map((stage) => {
+ return html`
+ ${this.renderStageSettings(stage)}
+ `;
+ });
+ }),
+ )}
+ ${until(
+ this.sourceSettings?.then((source) => {
+ return source.map((stage) => {
+ return html`
+ ${this.renderSourceSettings(stage)}
+ `;
+ });
+ }),
+ )}
+
+
+
`;
+ }
+}
diff --git a/web/src/user/user-settings/settings/BaseUserSettings.ts b/web/src/user/user-settings/settings/BaseUserSettings.ts
new file mode 100644
index 000000000..7b7863d9d
--- /dev/null
+++ b/web/src/user/user-settings/settings/BaseUserSettings.ts
@@ -0,0 +1,19 @@
+import { CSSResult, LitElement, property } from "lit-element";
+import PFBase from "@patternfly/patternfly/patternfly-base.css";
+import PFCard from "@patternfly/patternfly/components/Card/card.css";
+import PFButton from "@patternfly/patternfly/components/Button/button.css";
+import AKGlobal from "../../../authentik.css";
+import PFForm from "@patternfly/patternfly/components/Form/form.css";
+import PFFormControl from "@patternfly/patternfly/components/FormControl/form-control.css";
+
+export abstract class BaseUserSettings extends LitElement {
+ @property()
+ objectId!: string;
+
+ @property()
+ configureUrl?: string;
+
+ static get styles(): CSSResult[] {
+ return [PFBase, PFCard, PFButton, PFForm, PFFormControl, AKGlobal];
+ }
+}
diff --git a/web/src/user/user-settings/settings/SourceSettingsOAuth.ts b/web/src/user/user-settings/settings/SourceSettingsOAuth.ts
new file mode 100644
index 000000000..42ada8723
--- /dev/null
+++ b/web/src/user/user-settings/settings/SourceSettingsOAuth.ts
@@ -0,0 +1,50 @@
+import { customElement, html, property, TemplateResult } from "lit-element";
+import { BaseUserSettings } from "./BaseUserSettings";
+import { SourcesApi } from "@goauthentik/api";
+import { until } from "lit-html/directives/until";
+import { DEFAULT_CONFIG } from "../../../api/Config";
+import { t } from "@lingui/macro";
+import { ifDefined } from "lit-html/directives/if-defined";
+
+@customElement("ak-user-settings-source-oauth")
+export class SourceSettingsOAuth extends BaseUserSettings {
+ @property()
+ title!: string;
+
+ render(): TemplateResult {
+ return html`
+
+ ${t`Update details`}
+
+
+
+
`;
+ }
+
+ renderInner(): TemplateResult {
+ return html`${until(
+ new SourcesApi(DEFAULT_CONFIG)
+ .sourcesUserConnectionsOauthList({
+ sourceSlug: this.objectId,
+ })
+ .then((connection) => {
+ if (connection.results.length > 0) {
+ return html`${t`Source ${this.title}`}
+ ${this.renderInner()}
+ ${t`Connected.`}
+ `; + } + return html`${t`Not connected.`}
+ + ${t`Connect`} + `; + }), + )}`; + } +} diff --git a/web/src/user/user-settings/settings/SourceSettingsPlex.ts b/web/src/user/user-settings/settings/SourceSettingsPlex.ts new file mode 100644 index 000000000..cd015b6a2 --- /dev/null +++ b/web/src/user/user-settings/settings/SourceSettingsPlex.ts @@ -0,0 +1,46 @@ +import { customElement, html, property, TemplateResult } from "lit-element"; +import { BaseUserSettings } from "./BaseUserSettings"; +import { SourcesApi } from "@goauthentik/api"; +import { until } from "lit-html/directives/until"; +import { DEFAULT_CONFIG } from "../../../api/Config"; +import { t } from "@lingui/macro"; + +@customElement("ak-user-settings-source-plex") +export class SourceSettingsPlex extends BaseUserSettings { + @property() + title!: string; + + render(): TemplateResult { + return html`
+
`;
+ }
+
+ renderInner(): TemplateResult {
+ return html`${until(
+ new SourcesApi(DEFAULT_CONFIG)
+ .sourcesUserConnectionsPlexList({
+ sourceSlug: this.objectId,
+ })
+ .then((connection) => {
+ if (connection.results.length > 0) {
+ return html`${t`Source ${this.title}`}
+ ${this.renderInner()}
+ ${t`Connected.`}
+ `; + } + return html`${t`Not connected.`}
`; + }), + )}`; + } +} diff --git a/web/src/user/user-settings/settings/UserSettingsAuthenticatorDuo.ts b/web/src/user/user-settings/settings/UserSettingsAuthenticatorDuo.ts new file mode 100644 index 000000000..86f34c66b --- /dev/null +++ b/web/src/user/user-settings/settings/UserSettingsAuthenticatorDuo.ts @@ -0,0 +1,79 @@ +import { AuthenticatorsApi } from "@goauthentik/api"; +import { t } from "@lingui/macro"; +import { customElement, html, TemplateResult } from "lit-element"; +import { until } from "lit-html/directives/until"; +import { DEFAULT_CONFIG } from "../../../api/Config"; +import { BaseUserSettings } from "./BaseUserSettings"; +import { EVENT_REFRESH } from "../../../constants"; + +@customElement("ak-user-settings-authenticator-duo") +export class UserSettingsAuthenticatorDuo extends BaseUserSettings { + renderEnabled(): TemplateResult { + return html`
+
+ `;
+ }
+
+ renderDisabled(): TemplateResult {
+ return html` + ${t`Status: Enabled`} + +
+
+
+ `;
+ }
+
+ render(): TemplateResult {
+ return html`+ ${t`Status: Disabled`} + +
+
+
`;
+ }
+}
diff --git a/web/src/user/user-settings/settings/UserSettingsAuthenticatorStatic.ts b/web/src/user/user-settings/settings/UserSettingsAuthenticatorStatic.ts
new file mode 100644
index 000000000..077980a92
--- /dev/null
+++ b/web/src/user/user-settings/settings/UserSettingsAuthenticatorStatic.ts
@@ -0,0 +1,100 @@
+import { AuthenticatorsApi } from "@goauthentik/api";
+import { t } from "@lingui/macro";
+import { CSSResult, customElement, html, TemplateResult } from "lit-element";
+import { until } from "lit-html/directives/until";
+import { DEFAULT_CONFIG } from "../../../api/Config";
+import { STATIC_TOKEN_STYLE } from "../../../flows/stages/authenticator_static/AuthenticatorStaticStage";
+import { BaseUserSettings } from "./BaseUserSettings";
+import { EVENT_REFRESH } from "../../../constants";
+
+@customElement("ak-user-settings-authenticator-static")
+export class UserSettingsAuthenticatorStatic extends BaseUserSettings {
+ static get styles(): CSSResult[] {
+ return super.styles.concat(STATIC_TOKEN_STYLE);
+ }
+
+ renderEnabled(): TemplateResult {
+ return html`${t`Duo`}
+ ${until(
+ new AuthenticatorsApi(DEFAULT_CONFIG).authenticatorsDuoList({}).then((devices) => {
+ return devices.results.length > 0
+ ? this.renderEnabled()
+ : this.renderDisabled();
+ }),
+ )}
+
+
+ `;
+ }
+
+ renderDisabled(): TemplateResult {
+ return html` + ${t`Status: Enabled`} + +
+-
+ ${until(
+ new AuthenticatorsApi(DEFAULT_CONFIG)
+ .authenticatorsStaticList({})
+ .then((devices) => {
+ if (devices.results.length < 1) {
+ return;
+ }
+ return devices.results[0].tokenSet?.map((token) => {
+ return html`
- ${token.token} `; + }); + }), + )} +
+
+ `;
+ }
+
+ render(): TemplateResult {
+ return html`+ ${t`Status: Disabled`} + +
+
+
`;
+ }
+}
diff --git a/web/src/user/user-settings/settings/UserSettingsAuthenticatorTOTP.ts b/web/src/user/user-settings/settings/UserSettingsAuthenticatorTOTP.ts
new file mode 100644
index 000000000..827973df1
--- /dev/null
+++ b/web/src/user/user-settings/settings/UserSettingsAuthenticatorTOTP.ts
@@ -0,0 +1,79 @@
+import { AuthenticatorsApi } from "@goauthentik/api";
+import { t } from "@lingui/macro";
+import { customElement, html, TemplateResult } from "lit-element";
+import { until } from "lit-html/directives/until";
+import { DEFAULT_CONFIG } from "../../../api/Config";
+import { BaseUserSettings } from "./BaseUserSettings";
+import { EVENT_REFRESH } from "../../../constants";
+
+@customElement("ak-user-settings-authenticator-totp")
+export class UserSettingsAuthenticatorTOTP extends BaseUserSettings {
+ renderEnabled(): TemplateResult {
+ return html`${t`Static tokens`}
+ ${until(
+ new AuthenticatorsApi(DEFAULT_CONFIG)
+ .authenticatorsStaticList({})
+ .then((devices) => {
+ return devices.results.length > 0
+ ? this.renderEnabled()
+ : this.renderDisabled();
+ }),
+ )}
+
+
+ `;
+ }
+
+ renderDisabled(): TemplateResult {
+ return html` + ${t`Status: Enabled`} + +
+
+
+ `;
+ }
+
+ render(): TemplateResult {
+ return html`+ ${t`Status: Disabled`} + +
+
+
`;
+ }
+}
diff --git a/web/src/user/user-settings/settings/UserSettingsAuthenticatorWebAuthn.ts b/web/src/user/user-settings/settings/UserSettingsAuthenticatorWebAuthn.ts
new file mode 100644
index 000000000..8436125fe
--- /dev/null
+++ b/web/src/user/user-settings/settings/UserSettingsAuthenticatorWebAuthn.ts
@@ -0,0 +1,125 @@
+import { CSSResult, customElement, html, TemplateResult } from "lit-element";
+import { t } from "@lingui/macro";
+import { AuthenticatorsApi, WebAuthnDevice } from "@goauthentik/api";
+import { until } from "lit-html/directives/until";
+import { DEFAULT_CONFIG } from "../../../api/Config";
+import { BaseUserSettings } from "./BaseUserSettings";
+import PFDataList from "@patternfly/patternfly/components/DataList/data-list.css";
+import "../../../elements/buttons/ModalButton";
+import "../../../elements/buttons/SpinnerButton";
+import "../../../elements/forms/DeleteForm";
+import "../../../elements/forms/Form";
+import "../../../elements/forms/ModalForm";
+import "../../../elements/forms/HorizontalFormElement";
+import { ifDefined } from "lit-html/directives/if-defined";
+import { EVENT_REFRESH } from "../../../constants";
+
+@customElement("ak-user-settings-authenticator-webauthn")
+export class UserSettingsAuthenticatorWebAuthn extends BaseUserSettings {
+ static get styles(): CSSResult[] {
+ return super.styles.concat(PFDataList);
+ }
+
+ renderDelete(device: WebAuthnDevice): TemplateResult {
+ return html`${t`Time-based One-Time Passwords`}
+ ${until(
+ new AuthenticatorsApi(DEFAULT_CONFIG).authenticatorsTotpList({}).then((devices) => {
+ return devices.results.length > 0
+ ? this.renderEnabled()
+ : this.renderDisabled();
+ }),
+ )}
+
+
`;
+ }
+}
diff --git a/web/src/user/user-settings/settings/UserSettingsPassword.ts b/web/src/user/user-settings/settings/UserSettingsPassword.ts
new file mode 100644
index 000000000..f92f4eecc
--- /dev/null
+++ b/web/src/user/user-settings/settings/UserSettingsPassword.ts
@@ -0,0 +1,20 @@
+import { customElement, html, TemplateResult } from "lit-element";
+import { t } from "@lingui/macro";
+import { BaseUserSettings } from "./BaseUserSettings";
+import { ifDefined } from "lit-html/directives/if-defined";
+
+@customElement("ak-user-settings-password")
+export class UserSettingsPassword extends BaseUserSettings {
+ render(): TemplateResult {
+ // For this stage we don't need to check for a configureFlow,
+ // as the stage won't return any UI Elements if no configureFlow is set.
+ return html`${t`WebAuthn Devices`}
+
+
+
+ -
+ ${until(
+ new AuthenticatorsApi(DEFAULT_CONFIG)
+ .authenticatorsWebauthnList({})
+ .then((devices) => {
+ return devices.results.map((device) => {
+ return html`
-
+ +++++ ${device.name || "-"} +++ ${t`Created ${device.createdOn?.toLocaleString()}`} +++ ${this.renderUpdate(device)} + ${this.renderDelete(device)} ++ `;
+ });
+ }),
+ )}
+
+
`;
+ }
+}
diff --git a/web/src/user/user-settings/tokens/UserTokenForm.ts b/web/src/user/user-settings/tokens/UserTokenForm.ts
new file mode 100644
index 000000000..3c4ffd4c2
--- /dev/null
+++ b/web/src/user/user-settings/tokens/UserTokenForm.ts
@@ -0,0 +1,62 @@
+import { CoreApi, IntentEnum, Token } from "@goauthentik/api";
+import { t } from "@lingui/macro";
+import { customElement, property } from "lit-element";
+import { html, TemplateResult } from "lit-html";
+import { DEFAULT_CONFIG } from "../../../api/Config";
+import { ifDefined } from "lit-html/directives/if-defined";
+import "../../../elements/forms/HorizontalFormElement";
+import { ModelForm } from "../../../elements/forms/ModelForm";
+
+@customElement("ak-user-token-form")
+export class UserTokenForm extends ModelForm${t`Change your password`}
+
+