d30defc6fa
* web: fix esbuild issue with style sheets
Getting ESBuild, Lit, and Storybook to all agree on how to read and parse stylesheets is a serious
pain. This fix better identifies the value types (instances) being passed from various sources in
the repo to the three *different* kinds of style processors we're using (the native one, the
polyfill one, and whatever the heck Storybook does internally).
Falling back to using older CSS instantiating techniques one era at a time seems to do the trick.
It's ugly, but in the face of the aggressive styling we use to avoid Flashes of Unstyled Content
(FLoUC), it's the logic with which we're left.
In standard mode, the following warning appears on the console when running a Flow:
```
Autofocus processing was blocked because a document already has a focused element.
```
In compatibility mode, the following **error** appears on the console when running a Flow:
```
crawler-inject.js:1106 Uncaught TypeError: Failed to execute 'observe' on 'MutationObserver': parameter 1 is not of type 'Node'.
at initDomMutationObservers (crawler-inject.js:1106:18)
at crawler-inject.js:1114:24
at Array.forEach (<anonymous>)
at initDomMutationObservers (crawler-inject.js:1114:10)
at crawler-inject.js:1549:1
initDomMutationObservers @ crawler-inject.js:1106
(anonymous) @ crawler-inject.js:1114
initDomMutationObservers @ crawler-inject.js:1114
(anonymous) @ crawler-inject.js:1549
```
Despite this error, nothing seems to be broken and flows work as anticipated.
* web: you have no missed messages
This commit uncovers a few places where a human-readable string was not property cast into the
internationalized form and internationalizes them in order to conform to our policy of keeping the
product viable outside of the English-speaking world.
* Restored SAML spacing manually. Not sure why that was necessary.
* Restored WS spacing manually. Not sure why that was necessary.
* Restored RouteMatch spacing manually. Not sure why that was necessary.
* Restored RAC spacing manually. Not sure why that was necessary.
98 lines
4.1 KiB
TypeScript
98 lines
4.1 KiB
TypeScript
import { policyOptions } from "@goauthentik/admin/applications/ApplicationForm";
|
|
import { first } from "@goauthentik/common/utils";
|
|
import "@goauthentik/components/ak-radio-input";
|
|
import "@goauthentik/components/ak-slug-input";
|
|
import "@goauthentik/components/ak-switch-input";
|
|
import "@goauthentik/components/ak-text-input";
|
|
import "@goauthentik/elements/forms/FormGroup";
|
|
import "@goauthentik/elements/forms/HorizontalFormElement";
|
|
|
|
import { msg } from "@lit/localize";
|
|
import { customElement } from "@lit/reactive-element/decorators/custom-element.js";
|
|
import { TemplateResult, html } from "lit";
|
|
import { ifDefined } from "lit/directives/if-defined.js";
|
|
|
|
import BasePanel from "../BasePanel";
|
|
|
|
@customElement("ak-application-wizard-application-details")
|
|
export class ApplicationWizardApplicationDetails extends BasePanel {
|
|
handleChange(_ev: Event) {
|
|
const formValues = this.formValues;
|
|
if (!formValues) {
|
|
throw new Error("No application values on form?");
|
|
}
|
|
this.dispatchWizardUpdate({
|
|
update: {
|
|
...this.wizard,
|
|
app: formValues,
|
|
},
|
|
status: this.valid ? "valid" : "invalid",
|
|
});
|
|
}
|
|
|
|
render(): TemplateResult {
|
|
return html` <form class="pf-c-form pf-m-horizontal" @input=${this.handleChange}>
|
|
<ak-text-input
|
|
name="name"
|
|
value=${ifDefined(this.wizard.app?.name)}
|
|
label=${msg("Name")}
|
|
required
|
|
help=${msg("Application's display Name.")}
|
|
id="ak-application-wizard-details-name"
|
|
.errorMessages=${this.wizard.errors.app?.name ?? []}
|
|
></ak-text-input>
|
|
<ak-slug-input
|
|
name="slug"
|
|
value=${ifDefined(this.wizard.app?.slug)}
|
|
label=${msg("Slug")}
|
|
source="#ak-application-wizard-details-name"
|
|
required
|
|
help=${msg("Internal application name used in URLs.")}
|
|
.errorMessages=${this.wizard.errors.app?.slug ?? []}
|
|
></ak-slug-input>
|
|
<ak-text-input
|
|
name="group"
|
|
value=${ifDefined(this.wizard.app?.group)}
|
|
label=${msg("Group")}
|
|
.errorMessages=${this.wizard.errors.app?.group ?? []}
|
|
help=${msg(
|
|
"Optionally enter a group name. Applications with identical groups are shown grouped together.",
|
|
)}
|
|
></ak-text-input>
|
|
<ak-radio-input
|
|
label=${msg("Policy engine mode")}
|
|
required
|
|
name="policyEngineMode"
|
|
.options=${policyOptions}
|
|
.value=${this.wizard.app?.policyEngineMode}
|
|
.errorMessages=${this.wizard.errors.app?.policyEngineMode ?? []}
|
|
></ak-radio-input>
|
|
<ak-form-group aria-label=${msg("UI Settings")}>
|
|
<span slot="header"> ${msg("UI Settings")} </span>
|
|
<div slot="body" class="pf-c-form">
|
|
<ak-text-input
|
|
name="metaLaunchUrl"
|
|
label=${msg("Launch URL")}
|
|
value=${ifDefined(this.wizard.app?.metaLaunchUrl)}
|
|
help=${msg(
|
|
"If left empty, authentik will try to extract the launch URL based on the selected provider.",
|
|
)}
|
|
.errorMessages=${this.wizard.errors.app?.metaLaunchUrl ?? []}
|
|
></ak-text-input>
|
|
<ak-switch-input
|
|
name="openInNewTab"
|
|
?checked=${first(this.wizard.app?.openInNewTab, false)}
|
|
label=${msg("Open in new tab")}
|
|
help=${msg(
|
|
"If checked, the launch URL will open in a new browser tab or window from the user's application library.",
|
|
)}
|
|
>
|
|
</ak-switch-input>
|
|
</div>
|
|
</ak-form-group>
|
|
</form>`;
|
|
}
|
|
}
|
|
|
|
export default ApplicationWizardApplicationDetails;
|