web/admin: replace more selects with search select
Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
parent
1149a61986
commit
5fba08c911
|
@ -1,6 +1,7 @@
|
||||||
import "@goauthentik/admin/providers/ProviderWizard";
|
import "@goauthentik/admin/providers/ProviderWizard";
|
||||||
import { DEFAULT_CONFIG, config } from "@goauthentik/common/api/config";
|
import { DEFAULT_CONFIG, config } from "@goauthentik/common/api/config";
|
||||||
import { first } from "@goauthentik/common/utils";
|
import { first, groupBy } from "@goauthentik/common/utils";
|
||||||
|
import "@goauthentik/elements/SearchSelect";
|
||||||
import "@goauthentik/elements/forms/FormGroup";
|
import "@goauthentik/elements/forms/FormGroup";
|
||||||
import "@goauthentik/elements/forms/HorizontalFormElement";
|
import "@goauthentik/elements/forms/HorizontalFormElement";
|
||||||
import "@goauthentik/elements/forms/ModalForm";
|
import "@goauthentik/elements/forms/ModalForm";
|
||||||
|
@ -20,6 +21,7 @@ import {
|
||||||
CoreApi,
|
CoreApi,
|
||||||
PolicyEngineMode,
|
PolicyEngineMode,
|
||||||
Provider,
|
Provider,
|
||||||
|
ProvidersAllListRequest,
|
||||||
ProvidersApi,
|
ProvidersApi,
|
||||||
} from "@goauthentik/api";
|
} from "@goauthentik/api";
|
||||||
|
|
||||||
|
@ -78,29 +80,6 @@ export class ApplicationForm extends ModelForm<Application, string> {
|
||||||
return app;
|
return app;
|
||||||
};
|
};
|
||||||
|
|
||||||
groupProviders(providers: Provider[]): TemplateResult {
|
|
||||||
const m = new Map<string, Provider[]>();
|
|
||||||
providers.forEach((p) => {
|
|
||||||
if (!m.has(p.verboseName || "")) {
|
|
||||||
m.set(p.verboseName || "", []);
|
|
||||||
}
|
|
||||||
const tProviders = m.get(p.verboseName || "") || [];
|
|
||||||
tProviders.push(p);
|
|
||||||
});
|
|
||||||
return html`
|
|
||||||
${Array.from(m).map(([group, providers]) => {
|
|
||||||
return html`<optgroup label=${group}>
|
|
||||||
${providers.map((p) => {
|
|
||||||
const selected = this.instance?.provider === p.pk || this.provider === p.pk;
|
|
||||||
return html`<option ?selected=${selected} value=${ifDefined(p.pk)}>
|
|
||||||
${p.name}
|
|
||||||
</option>`;
|
|
||||||
})}
|
|
||||||
</optgroup>`;
|
|
||||||
})}
|
|
||||||
`;
|
|
||||||
}
|
|
||||||
|
|
||||||
renderForm(): TemplateResult {
|
renderForm(): TemplateResult {
|
||||||
return html`<form class="pf-c-form pf-m-horizontal">
|
return html`<form class="pf-c-form pf-m-horizontal">
|
||||||
<ak-form-element-horizontal label=${t`Name`} ?required=${true} name="name">
|
<ak-form-element-horizontal label=${t`Name`} ?required=${true} name="name">
|
||||||
|
@ -132,17 +111,32 @@ export class ApplicationForm extends ModelForm<Application, string> {
|
||||||
</p>
|
</p>
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>
|
||||||
<ak-form-element-horizontal label=${t`Provider`} name="provider">
|
<ak-form-element-horizontal label=${t`Provider`} name="provider">
|
||||||
<select class="pf-c-form-control">
|
<ak-search-select
|
||||||
<option value="" ?selected=${this.instance?.provider === undefined}>
|
.fetchObjects=${async (query?: string): Promise<Provider[]> => {
|
||||||
---------
|
const args: ProvidersAllListRequest = {
|
||||||
</option>
|
ordering: "name",
|
||||||
${until(
|
};
|
||||||
new ProvidersApi(DEFAULT_CONFIG).providersAllList({}).then((providers) => {
|
if (query !== undefined) {
|
||||||
return this.groupProviders(providers.results);
|
args.search = query;
|
||||||
}),
|
}
|
||||||
html`<option>${t`Loading...`}</option>`,
|
const items = await new ProvidersApi(DEFAULT_CONFIG).providersAllList(args);
|
||||||
)}
|
return items.results;
|
||||||
</select>
|
}}
|
||||||
|
.renderElement=${(item: Provider): string => {
|
||||||
|
return item.name;
|
||||||
|
}}
|
||||||
|
.value=${(item: Provider | undefined): number | undefined => {
|
||||||
|
return item?.pk;
|
||||||
|
}}
|
||||||
|
.groupBy=${(items: Provider[]) => {
|
||||||
|
return groupBy(items, (item) => item.verboseName);
|
||||||
|
}}
|
||||||
|
.selected=${(item: Provider): boolean => {
|
||||||
|
return this.instance?.provider === item.pk;
|
||||||
|
}}
|
||||||
|
?blankable=${true}
|
||||||
|
>
|
||||||
|
</ak-search-select>
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
${t`Select a provider that this application should use. Alternatively, create a new provider.`}
|
${t`Select a provider that this application should use. Alternatively, create a new provider.`}
|
||||||
</p>
|
</p>
|
||||||
|
|
|
@ -70,6 +70,9 @@ export class ApplicationListPage extends TablePage<Application> {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
.pf-c-sidebar.pf-m-gutter > .pf-c-sidebar__main > * + * {
|
||||||
|
margin-left: calc(var(--pf-c-sidebar__main--child--MarginLeft) / 2);
|
||||||
|
}
|
||||||
`,
|
`,
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -50,7 +50,7 @@ export class TypeOAuthCodeApplicationWizardPage extends WizardFormPage {
|
||||||
<ak-search-select
|
<ak-search-select
|
||||||
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
const args: FlowsInstancesListRequest = {
|
const args: FlowsInstancesListRequest = {
|
||||||
ordering: "name",
|
ordering: "slug",
|
||||||
designation: FlowsInstancesListDesignationEnum.Authorization,
|
designation: FlowsInstancesListDesignationEnum.Authorization,
|
||||||
};
|
};
|
||||||
if (query !== undefined) {
|
if (query !== undefined) {
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import { DEFAULT_CONFIG } from "@goauthentik/common/api/config";
|
import { DEFAULT_CONFIG } from "@goauthentik/common/api/config";
|
||||||
import { first } from "@goauthentik/common/utils";
|
import { first } from "@goauthentik/common/utils";
|
||||||
|
import "@goauthentik/elements/SearchSelect";
|
||||||
import "@goauthentik/elements/forms/HorizontalFormElement";
|
import "@goauthentik/elements/forms/HorizontalFormElement";
|
||||||
import { ModelForm } from "@goauthentik/elements/forms/ModelForm";
|
import { ModelForm } from "@goauthentik/elements/forms/ModelForm";
|
||||||
|
|
||||||
|
@ -8,13 +9,14 @@ import { t } from "@lingui/macro";
|
||||||
import { TemplateResult, html } from "lit";
|
import { TemplateResult, html } from "lit";
|
||||||
import { customElement, property } from "lit/decorators.js";
|
import { customElement, property } from "lit/decorators.js";
|
||||||
import { ifDefined } from "lit/directives/if-defined.js";
|
import { ifDefined } from "lit/directives/if-defined.js";
|
||||||
import { until } from "lit/directives/until.js";
|
|
||||||
|
|
||||||
import {
|
import {
|
||||||
EventsApi,
|
EventsApi,
|
||||||
NotificationTransport,
|
NotificationTransport,
|
||||||
NotificationTransportModeEnum,
|
NotificationTransportModeEnum,
|
||||||
|
NotificationWebhookMapping,
|
||||||
PropertymappingsApi,
|
PropertymappingsApi,
|
||||||
|
PropertymappingsNotificationListRequest,
|
||||||
} from "@goauthentik/api";
|
} from "@goauthentik/api";
|
||||||
|
|
||||||
@customElement("ak-event-transport-form")
|
@customElement("ak-event-transport-form")
|
||||||
|
@ -132,26 +134,33 @@ export class TransportForm extends ModelForm<NotificationTransport, string> {
|
||||||
label=${t`Webhook Mapping`}
|
label=${t`Webhook Mapping`}
|
||||||
name="webhookMapping"
|
name="webhookMapping"
|
||||||
>
|
>
|
||||||
<select class="pf-c-form-control">
|
<ak-search-select
|
||||||
<option value="" ?selected=${this.instance?.webhookMapping === undefined}>
|
.fetchObjects=${async (
|
||||||
---------
|
query?: string,
|
||||||
</option>
|
): Promise<NotificationWebhookMapping[]> => {
|
||||||
${until(
|
const args: PropertymappingsNotificationListRequest = {
|
||||||
new PropertymappingsApi(DEFAULT_CONFIG)
|
ordering: "name",
|
||||||
.propertymappingsNotificationList({})
|
};
|
||||||
.then((mappings) => {
|
if (query !== undefined) {
|
||||||
return mappings.results.map((mapping) => {
|
args.search = query;
|
||||||
return html`<option
|
}
|
||||||
value=${ifDefined(mapping.pk)}
|
const items = await new PropertymappingsApi(
|
||||||
?selected=${this.instance?.webhookMapping === mapping.pk}
|
DEFAULT_CONFIG,
|
||||||
>
|
).propertymappingsNotificationList(args);
|
||||||
${mapping.name}
|
return items.results;
|
||||||
</option>`;
|
}}
|
||||||
});
|
.renderElement=${(item: NotificationWebhookMapping): string => {
|
||||||
}),
|
return item.name;
|
||||||
html`<option>${t`Loading...`}</option>`,
|
}}
|
||||||
)}
|
.value=${(item: NotificationWebhookMapping | undefined): string | undefined => {
|
||||||
</select>
|
return item?.pk;
|
||||||
|
}}
|
||||||
|
.selected=${(item: NotificationWebhookMapping): boolean => {
|
||||||
|
return this.instance?.webhookMapping === item.pk;
|
||||||
|
}}
|
||||||
|
?blankable=${true}
|
||||||
|
>
|
||||||
|
</ak-search-select>
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>
|
||||||
<ak-form-element-horizontal name="sendOnce">
|
<ak-form-element-horizontal name="sendOnce">
|
||||||
<div class="pf-c-check">
|
<div class="pf-c-check">
|
||||||
|
|
|
@ -1,6 +1,8 @@
|
||||||
import { DEFAULT_CONFIG } from "@goauthentik/common/api/config";
|
import { DEFAULT_CONFIG } from "@goauthentik/common/api/config";
|
||||||
import { docLink } from "@goauthentik/common/global";
|
import { docLink } from "@goauthentik/common/global";
|
||||||
|
import { groupBy } from "@goauthentik/common/utils";
|
||||||
import "@goauthentik/elements/CodeMirror";
|
import "@goauthentik/elements/CodeMirror";
|
||||||
|
import "@goauthentik/elements/SearchSelect";
|
||||||
import "@goauthentik/elements/forms/HorizontalFormElement";
|
import "@goauthentik/elements/forms/HorizontalFormElement";
|
||||||
import { ModelForm } from "@goauthentik/elements/forms/ModelForm";
|
import { ModelForm } from "@goauthentik/elements/forms/ModelForm";
|
||||||
import YAML from "yaml";
|
import YAML from "yaml";
|
||||||
|
@ -12,7 +14,14 @@ import { customElement, property } from "lit/decorators.js";
|
||||||
import { ifDefined } from "lit/directives/if-defined.js";
|
import { ifDefined } from "lit/directives/if-defined.js";
|
||||||
import { until } from "lit/directives/until.js";
|
import { until } from "lit/directives/until.js";
|
||||||
|
|
||||||
import { Outpost, OutpostTypeEnum, OutpostsApi, ProvidersApi } from "@goauthentik/api";
|
import {
|
||||||
|
Outpost,
|
||||||
|
OutpostTypeEnum,
|
||||||
|
OutpostsApi,
|
||||||
|
OutpostsServiceConnectionsAllListRequest,
|
||||||
|
ProvidersApi,
|
||||||
|
ServiceConnection,
|
||||||
|
} from "@goauthentik/api";
|
||||||
|
|
||||||
@customElement("ak-outpost-form")
|
@customElement("ak-outpost-form")
|
||||||
export class OutpostForm extends ModelForm<Outpost, string> {
|
export class OutpostForm extends ModelForm<Outpost, string> {
|
||||||
|
@ -134,32 +143,38 @@ export class OutpostForm extends ModelForm<Outpost, string> {
|
||||||
</select>
|
</select>
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>
|
||||||
<ak-form-element-horizontal label=${t`Integration`} name="serviceConnection">
|
<ak-form-element-horizontal label=${t`Integration`} name="serviceConnection">
|
||||||
<select class="pf-c-form-control">
|
<ak-search-select
|
||||||
<option value="" ?selected=${this.instance?.serviceConnection === undefined}>
|
.fetchObjects=${async (query?: string): Promise<ServiceConnection[]> => {
|
||||||
---------
|
const args: OutpostsServiceConnectionsAllListRequest = {
|
||||||
</option>
|
ordering: "name",
|
||||||
${until(
|
};
|
||||||
new OutpostsApi(DEFAULT_CONFIG)
|
if (query !== undefined) {
|
||||||
.outpostsServiceConnectionsAllList({
|
args.search = query;
|
||||||
ordering: "name",
|
}
|
||||||
})
|
const items = await new OutpostsApi(
|
||||||
.then((scs) => {
|
DEFAULT_CONFIG,
|
||||||
return scs.results.map((sc) => {
|
).outpostsServiceConnectionsAllList(args);
|
||||||
let selected = this.instance?.serviceConnection === sc.pk;
|
return items.results;
|
||||||
if (scs.results.length === 1 && !this.instance) {
|
}}
|
||||||
selected = true;
|
.renderElement=${(item: ServiceConnection): string => {
|
||||||
}
|
return item.name;
|
||||||
return html`<option
|
}}
|
||||||
value=${ifDefined(sc.pk)}
|
.value=${(item: ServiceConnection | undefined): string | undefined => {
|
||||||
?selected=${selected}
|
return item?.pk;
|
||||||
>
|
}}
|
||||||
${sc.name} (${sc.verboseName})
|
.groupBy=${(items: ServiceConnection[]) => {
|
||||||
</option>`;
|
return groupBy(items, (item) => item.verboseName);
|
||||||
});
|
}}
|
||||||
}),
|
.selected=${(item: ServiceConnection, items: ServiceConnection[]): boolean => {
|
||||||
html`<option>${t`Loading...`}</option>`,
|
let selected = this.instance?.serviceConnection === sc.pk;
|
||||||
)}
|
if (items.length === 1 && !this.instance) {
|
||||||
</select>
|
selected = true;
|
||||||
|
}
|
||||||
|
return selected;
|
||||||
|
}}
|
||||||
|
?blankable=${true}
|
||||||
|
>
|
||||||
|
</ak-search-select>
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
${t`Selecting an integration enables the management of the outpost by authentik.`}
|
${t`Selecting an integration enables the management of the outpost by authentik.`}
|
||||||
</p>
|
</p>
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import { DEFAULT_CONFIG } from "@goauthentik/common/api/config";
|
import { DEFAULT_CONFIG } from "@goauthentik/common/api/config";
|
||||||
import { first } from "@goauthentik/common/utils";
|
import { first } from "@goauthentik/common/utils";
|
||||||
|
import "@goauthentik/elements/SearchSelect";
|
||||||
import "@goauthentik/elements/forms/HorizontalFormElement";
|
import "@goauthentik/elements/forms/HorizontalFormElement";
|
||||||
import { ModelForm } from "@goauthentik/elements/forms/ModelForm";
|
import { ModelForm } from "@goauthentik/elements/forms/ModelForm";
|
||||||
|
|
||||||
|
@ -8,9 +9,14 @@ import { t } from "@lingui/macro";
|
||||||
import { TemplateResult, html } from "lit";
|
import { TemplateResult, html } from "lit";
|
||||||
import { customElement } from "lit/decorators.js";
|
import { customElement } from "lit/decorators.js";
|
||||||
import { ifDefined } from "lit/directives/if-defined.js";
|
import { ifDefined } from "lit/directives/if-defined.js";
|
||||||
import { until } from "lit/directives/until.js";
|
|
||||||
|
|
||||||
import { CryptoApi, DockerServiceConnection, OutpostsApi } from "@goauthentik/api";
|
import {
|
||||||
|
CertificateKeyPair,
|
||||||
|
CryptoApi,
|
||||||
|
CryptoCertificatekeypairsListRequest,
|
||||||
|
DockerServiceConnection,
|
||||||
|
OutpostsApi,
|
||||||
|
} from "@goauthentik/api";
|
||||||
|
|
||||||
@customElement("ak-service-connection-docker-form")
|
@customElement("ak-service-connection-docker-form")
|
||||||
export class ServiceConnectionDockerForm extends ModelForm<DockerServiceConnection, string> {
|
export class ServiceConnectionDockerForm extends ModelForm<DockerServiceConnection, string> {
|
||||||
|
@ -79,34 +85,33 @@ export class ServiceConnectionDockerForm extends ModelForm<DockerServiceConnecti
|
||||||
label=${t`TLS Verification Certificate`}
|
label=${t`TLS Verification Certificate`}
|
||||||
name="tlsVerification"
|
name="tlsVerification"
|
||||||
>
|
>
|
||||||
<select class="pf-c-form-control">
|
<ak-search-select
|
||||||
<option value="" ?selected=${this.instance?.tlsVerification === undefined}>
|
.fetchObjects=${async (query?: string): Promise<CertificateKeyPair[]> => {
|
||||||
---------
|
const args: CryptoCertificatekeypairsListRequest = {
|
||||||
</option>
|
ordering: "name",
|
||||||
${until(
|
hasKey: true,
|
||||||
new CryptoApi(DEFAULT_CONFIG)
|
includeDetails: false,
|
||||||
.cryptoCertificatekeypairsList({
|
};
|
||||||
ordering: "name",
|
if (query !== undefined) {
|
||||||
includeDetails: false,
|
args.search = query;
|
||||||
})
|
}
|
||||||
.then((certs) => {
|
const certificates = await new CryptoApi(
|
||||||
return certs.results.map((cert) => {
|
DEFAULT_CONFIG,
|
||||||
return html`<option
|
).cryptoCertificatekeypairsList(args);
|
||||||
value=${ifDefined(cert.pk)}
|
return certificates.results;
|
||||||
?selected=${this.instance?.tlsVerification === cert.pk}
|
}}
|
||||||
>
|
.renderElement=${(item: CertificateKeyPair): string => {
|
||||||
${cert.name}
|
return item.name;
|
||||||
</option>`;
|
}}
|
||||||
});
|
.value=${(item: CertificateKeyPair | undefined): string | undefined => {
|
||||||
}),
|
return item?.pk;
|
||||||
html`<option
|
}}
|
||||||
value=${ifDefined(this.instance?.tlsVerification || undefined)}
|
.selected=${(item: CertificateKeyPair): boolean => {
|
||||||
?selected=${this.instance?.tlsVerification !== undefined}
|
return this.instance?.tlsVerification === item.pk;
|
||||||
>
|
}}
|
||||||
${t`Loading...`}
|
?blankable=${true}
|
||||||
</option>`,
|
>
|
||||||
)}
|
</ak-search-select>
|
||||||
</select>
|
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
${t`CA which the endpoint's Certificate is verified against. Can be left empty for no validation.`}
|
${t`CA which the endpoint's Certificate is verified against. Can be left empty for no validation.`}
|
||||||
</p>
|
</p>
|
||||||
|
@ -115,34 +120,33 @@ export class ServiceConnectionDockerForm extends ModelForm<DockerServiceConnecti
|
||||||
label=${t`TLS Authentication Certificate/SSH Keypair`}
|
label=${t`TLS Authentication Certificate/SSH Keypair`}
|
||||||
name="tlsAuthentication"
|
name="tlsAuthentication"
|
||||||
>
|
>
|
||||||
<select class="pf-c-form-control">
|
<ak-search-select
|
||||||
<option value="" ?selected=${this.instance?.tlsAuthentication === undefined}>
|
.fetchObjects=${async (query?: string): Promise<CertificateKeyPair[]> => {
|
||||||
---------
|
const args: CryptoCertificatekeypairsListRequest = {
|
||||||
</option>
|
ordering: "name",
|
||||||
${until(
|
hasKey: true,
|
||||||
new CryptoApi(DEFAULT_CONFIG)
|
includeDetails: false,
|
||||||
.cryptoCertificatekeypairsList({
|
};
|
||||||
ordering: "name",
|
if (query !== undefined) {
|
||||||
includeDetails: false,
|
args.search = query;
|
||||||
})
|
}
|
||||||
.then((certs) => {
|
const certificates = await new CryptoApi(
|
||||||
return certs.results.map((cert) => {
|
DEFAULT_CONFIG,
|
||||||
return html`<option
|
).cryptoCertificatekeypairsList(args);
|
||||||
value=${ifDefined(cert.pk)}
|
return certificates.results;
|
||||||
?selected=${this.instance?.tlsAuthentication === cert.pk}
|
}}
|
||||||
>
|
.renderElement=${(item: CertificateKeyPair): string => {
|
||||||
${cert.name}
|
return item.name;
|
||||||
</option>`;
|
}}
|
||||||
});
|
.value=${(item: CertificateKeyPair | undefined): string | undefined => {
|
||||||
}),
|
return item?.pk;
|
||||||
html`<option
|
}}
|
||||||
value=${ifDefined(this.instance?.tlsAuthentication || undefined)}
|
.selected=${(item: CertificateKeyPair): boolean => {
|
||||||
?selected=${this.instance?.tlsAuthentication !== undefined}
|
return this.instance?.tlsAuthentication === item.pk;
|
||||||
>
|
}}
|
||||||
${t`Loading...`}
|
?blankable=${true}
|
||||||
</option>`,
|
>
|
||||||
)}
|
</ak-search-select>
|
||||||
</select>
|
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
${t`Certificate/Key used for authentication. Can be left empty for no authentication.`}
|
${t`Certificate/Key used for authentication. Can be left empty for no authentication.`}
|
||||||
</p>
|
</p>
|
||||||
|
|
|
@ -85,7 +85,7 @@ export class OAuth2ProviderFormPage extends ModelForm<OAuth2Provider, number> {
|
||||||
<ak-search-select
|
<ak-search-select
|
||||||
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
const args: FlowsInstancesListRequest = {
|
const args: FlowsInstancesListRequest = {
|
||||||
ordering: "name",
|
ordering: "slug",
|
||||||
designation: FlowsInstancesListDesignationEnum.Authorization,
|
designation: FlowsInstancesListDesignationEnum.Authorization,
|
||||||
};
|
};
|
||||||
if (query !== undefined) {
|
if (query !== undefined) {
|
||||||
|
@ -103,6 +103,9 @@ export class OAuth2ProviderFormPage extends ModelForm<OAuth2Provider, number> {
|
||||||
.value=${(flow: Flow | undefined): string | undefined => {
|
.value=${(flow: Flow | undefined): string | undefined => {
|
||||||
return flow?.pk;
|
return flow?.pk;
|
||||||
}}
|
}}
|
||||||
|
.selected=${(flow: Flow): boolean => {
|
||||||
|
return flow.pk === this.instance?.authorizationFlow;
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
</ak-search-select>
|
</ak-search-select>
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
|
|
|
@ -301,7 +301,7 @@ export class ProxyProviderFormPage extends ModelForm<ProxyProvider, number> {
|
||||||
<ak-search-select
|
<ak-search-select
|
||||||
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
const args: FlowsInstancesListRequest = {
|
const args: FlowsInstancesListRequest = {
|
||||||
ordering: "name",
|
ordering: "slug",
|
||||||
designation: FlowsInstancesListDesignationEnum.Authorization,
|
designation: FlowsInstancesListDesignationEnum.Authorization,
|
||||||
};
|
};
|
||||||
if (query !== undefined) {
|
if (query !== undefined) {
|
||||||
|
|
|
@ -75,7 +75,7 @@ export class SAMLProviderFormPage extends ModelForm<SAMLProvider, number> {
|
||||||
<ak-search-select
|
<ak-search-select
|
||||||
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
const args: FlowsInstancesListRequest = {
|
const args: FlowsInstancesListRequest = {
|
||||||
ordering: "name",
|
ordering: "slug",
|
||||||
designation: FlowsInstancesListDesignationEnum.Authorization,
|
designation: FlowsInstancesListDesignationEnum.Authorization,
|
||||||
};
|
};
|
||||||
if (query !== undefined) {
|
if (query !== undefined) {
|
||||||
|
|
|
@ -50,7 +50,7 @@ export class SAMLProviderImportForm extends Form<SAMLProvider> {
|
||||||
<ak-search-select
|
<ak-search-select
|
||||||
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
const args: FlowsInstancesListRequest = {
|
const args: FlowsInstancesListRequest = {
|
||||||
ordering: "name",
|
ordering: "slug",
|
||||||
designation: FlowsInstancesListDesignationEnum.Authorization,
|
designation: FlowsInstancesListDesignationEnum.Authorization,
|
||||||
};
|
};
|
||||||
if (query !== undefined) {
|
if (query !== undefined) {
|
||||||
|
|
|
@ -20,8 +20,10 @@ import {
|
||||||
CryptoApi,
|
CryptoApi,
|
||||||
CryptoCertificatekeypairsListRequest,
|
CryptoCertificatekeypairsListRequest,
|
||||||
DigestAlgorithmEnum,
|
DigestAlgorithmEnum,
|
||||||
|
Flow,
|
||||||
FlowsApi,
|
FlowsApi,
|
||||||
FlowsInstancesListDesignationEnum,
|
FlowsInstancesListDesignationEnum,
|
||||||
|
FlowsInstancesListRequest,
|
||||||
NameIdPolicyEnum,
|
NameIdPolicyEnum,
|
||||||
SAMLSource,
|
SAMLSource,
|
||||||
SignatureAlgorithmEnum,
|
SignatureAlgorithmEnum,
|
||||||
|
@ -478,42 +480,44 @@ export class SAMLSourceForm extends ModelForm<SAMLSource, string> {
|
||||||
?required=${true}
|
?required=${true}
|
||||||
name="preAuthenticationFlow"
|
name="preAuthenticationFlow"
|
||||||
>
|
>
|
||||||
<select class="pf-c-form-control">
|
<ak-search-select
|
||||||
<option
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
value=""
|
const args: FlowsInstancesListRequest = {
|
||||||
?selected=${this.instance?.preAuthenticationFlow === undefined}
|
ordering: "slug",
|
||||||
>
|
designation:
|
||||||
---------
|
FlowsInstancesListDesignationEnum.StageConfiguration,
|
||||||
</option>
|
};
|
||||||
${until(
|
if (query !== undefined) {
|
||||||
new FlowsApi(DEFAULT_CONFIG)
|
args.search = query;
|
||||||
.flowsInstancesList({
|
}
|
||||||
ordering: "slug",
|
const flows = await new FlowsApi(DEFAULT_CONFIG).flowsInstancesList(
|
||||||
designation:
|
args,
|
||||||
FlowsInstancesListDesignationEnum.StageConfiguration,
|
);
|
||||||
})
|
return flows.results;
|
||||||
.then((flows) => {
|
}}
|
||||||
return flows.results.map((flow) => {
|
.renderElement=${(flow: Flow): string => {
|
||||||
let selected =
|
return flow.name;
|
||||||
this.instance?.preAuthenticationFlow === flow.pk;
|
}}
|
||||||
if (
|
.renderDescription=${(flow: Flow): string => {
|
||||||
!this.instance?.pk &&
|
return flow.slug;
|
||||||
!this.instance?.preAuthenticationFlow &&
|
}}
|
||||||
flow.slug === "default-source-pre-authentication"
|
.value=${(flow: Flow | undefined): string | undefined => {
|
||||||
) {
|
return flow?.pk;
|
||||||
selected = true;
|
}}
|
||||||
}
|
.selected=${(flow: Flow): boolean => {
|
||||||
return html`<option
|
let selected = this.instance?.preAuthenticationFlow === flow.pk;
|
||||||
value=${ifDefined(flow.pk)}
|
if (
|
||||||
?selected=${selected}
|
!this.instance?.pk &&
|
||||||
>
|
!this.instance?.preAuthenticationFlow &&
|
||||||
${flow.name} (${flow.slug})
|
flow.slug === "default-source-pre-authentication"
|
||||||
</option>`;
|
) {
|
||||||
});
|
selected = true;
|
||||||
}),
|
}
|
||||||
html`<option>${t`Loading...`}</option>`,
|
return selected;
|
||||||
)}
|
}}
|
||||||
</select>
|
?blankable=${true}
|
||||||
|
>
|
||||||
|
</ak-search-select>
|
||||||
<p class="pf-c-form__helper-text">${t`Flow used before authentication.`}</p>
|
<p class="pf-c-form__helper-text">${t`Flow used before authentication.`}</p>
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>
|
||||||
<ak-form-element-horizontal
|
<ak-form-element-horizontal
|
||||||
|
@ -521,42 +525,43 @@ export class SAMLSourceForm extends ModelForm<SAMLSource, string> {
|
||||||
?required=${true}
|
?required=${true}
|
||||||
name="authenticationFlow"
|
name="authenticationFlow"
|
||||||
>
|
>
|
||||||
<select class="pf-c-form-control">
|
<ak-search-select
|
||||||
<option
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
value=""
|
const args: FlowsInstancesListRequest = {
|
||||||
?selected=${this.instance?.authenticationFlow === undefined}
|
ordering: "slug",
|
||||||
>
|
designation: FlowsInstancesListDesignationEnum.Authentication,
|
||||||
---------
|
};
|
||||||
</option>
|
if (query !== undefined) {
|
||||||
${until(
|
args.search = query;
|
||||||
new FlowsApi(DEFAULT_CONFIG)
|
}
|
||||||
.flowsInstancesList({
|
const flows = await new FlowsApi(DEFAULT_CONFIG).flowsInstancesList(
|
||||||
ordering: "slug",
|
args,
|
||||||
designation:
|
);
|
||||||
FlowsInstancesListDesignationEnum.Authentication,
|
return flows.results;
|
||||||
})
|
}}
|
||||||
.then((flows) => {
|
.renderElement=${(flow: Flow): string => {
|
||||||
return flows.results.map((flow) => {
|
return flow.name;
|
||||||
let selected =
|
}}
|
||||||
this.instance?.authenticationFlow === flow.pk;
|
.renderDescription=${(flow: Flow): string => {
|
||||||
if (
|
return flow.slug;
|
||||||
!this.instance?.pk &&
|
}}
|
||||||
!this.instance?.authenticationFlow &&
|
.value=${(flow: Flow | undefined): string | undefined => {
|
||||||
flow.slug === "default-source-authentication"
|
return flow?.pk;
|
||||||
) {
|
}}
|
||||||
selected = true;
|
.selected=${(flow: Flow): boolean => {
|
||||||
}
|
let selected = this.instance?.authenticationFlow === flow.pk;
|
||||||
return html`<option
|
if (
|
||||||
value=${ifDefined(flow.pk)}
|
!this.instance?.pk &&
|
||||||
?selected=${selected}
|
!this.instance?.authenticationFlow &&
|
||||||
>
|
flow.slug === "default-source-authentication"
|
||||||
${flow.name} (${flow.slug})
|
) {
|
||||||
</option>`;
|
selected = true;
|
||||||
});
|
}
|
||||||
}),
|
return selected;
|
||||||
html`<option>${t`Loading...`}</option>`,
|
}}
|
||||||
)}
|
?blankable=${true}
|
||||||
</select>
|
>
|
||||||
|
</ak-search-select>
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
${t`Flow to use when authenticating existing users.`}
|
${t`Flow to use when authenticating existing users.`}
|
||||||
</p>
|
</p>
|
||||||
|
@ -566,41 +571,43 @@ export class SAMLSourceForm extends ModelForm<SAMLSource, string> {
|
||||||
?required=${true}
|
?required=${true}
|
||||||
name="enrollmentFlow"
|
name="enrollmentFlow"
|
||||||
>
|
>
|
||||||
<select class="pf-c-form-control">
|
<ak-search-select
|
||||||
<option
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
value=""
|
const args: FlowsInstancesListRequest = {
|
||||||
?selected=${this.instance?.enrollmentFlow === undefined}
|
ordering: "slug",
|
||||||
>
|
designation: FlowsInstancesListDesignationEnum.Enrollment,
|
||||||
---------
|
};
|
||||||
</option>
|
if (query !== undefined) {
|
||||||
${until(
|
args.search = query;
|
||||||
new FlowsApi(DEFAULT_CONFIG)
|
}
|
||||||
.flowsInstancesList({
|
const flows = await new FlowsApi(DEFAULT_CONFIG).flowsInstancesList(
|
||||||
ordering: "slug",
|
args,
|
||||||
designation: FlowsInstancesListDesignationEnum.Enrollment,
|
);
|
||||||
})
|
return flows.results;
|
||||||
.then((flows) => {
|
}}
|
||||||
return flows.results.map((flow) => {
|
.renderElement=${(flow: Flow): string => {
|
||||||
let selected =
|
return flow.name;
|
||||||
this.instance?.enrollmentFlow === flow.pk;
|
}}
|
||||||
if (
|
.renderDescription=${(flow: Flow): string => {
|
||||||
!this.instance?.pk &&
|
return flow.slug;
|
||||||
!this.instance?.enrollmentFlow &&
|
}}
|
||||||
flow.slug === "default-source-enrollment"
|
.value=${(flow: Flow | undefined): string | undefined => {
|
||||||
) {
|
return flow?.pk;
|
||||||
selected = true;
|
}}
|
||||||
}
|
.selected=${(flow: Flow): boolean => {
|
||||||
return html`<option
|
let selected = this.instance?.enrollmentFlow === flow.pk;
|
||||||
value=${ifDefined(flow.pk)}
|
if (
|
||||||
?selected=${selected}
|
!this.instance?.pk &&
|
||||||
>
|
!this.instance?.enrollmentFlow &&
|
||||||
${flow.name} (${flow.slug})
|
flow.slug === "default-source-enrollment"
|
||||||
</option>`;
|
) {
|
||||||
});
|
selected = true;
|
||||||
}),
|
}
|
||||||
html`<option>${t`Loading...`}</option>`,
|
return selected;
|
||||||
)}
|
}}
|
||||||
</select>
|
?blankable=${true}
|
||||||
|
>
|
||||||
|
</ak-search-select>
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
${t`Flow to use when enrolling new users.`}
|
${t`Flow to use when enrolling new users.`}
|
||||||
</p>
|
</p>
|
||||||
|
|
|
@ -78,7 +78,7 @@ export class InvitationForm extends ModelForm<Invitation, string> {
|
||||||
<ak-search-select
|
<ak-search-select
|
||||||
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
const args: FlowsInstancesListRequest = {
|
const args: FlowsInstancesListRequest = {
|
||||||
ordering: "name",
|
ordering: "slug",
|
||||||
designation: FlowsInstancesListDesignationEnum.Enrollment,
|
designation: FlowsInstancesListDesignationEnum.Enrollment,
|
||||||
};
|
};
|
||||||
if (query !== undefined) {
|
if (query !== undefined) {
|
||||||
|
|
|
@ -12,15 +12,16 @@ import { t } from "@lingui/macro";
|
||||||
|
|
||||||
import { TemplateResult, html } from "lit";
|
import { TemplateResult, html } from "lit";
|
||||||
import { customElement } from "lit/decorators.js";
|
import { customElement } from "lit/decorators.js";
|
||||||
import { until } from "lit/directives/until.js";
|
|
||||||
|
|
||||||
import {
|
import {
|
||||||
CertificateKeyPair,
|
CertificateKeyPair,
|
||||||
CoreApi,
|
CoreApi,
|
||||||
CryptoApi,
|
CryptoApi,
|
||||||
CryptoCertificatekeypairsListRequest,
|
CryptoCertificatekeypairsListRequest,
|
||||||
|
Flow,
|
||||||
FlowsApi,
|
FlowsApi,
|
||||||
FlowsInstancesListDesignationEnum,
|
FlowsInstancesListDesignationEnum,
|
||||||
|
FlowsInstancesListRequest,
|
||||||
Tenant,
|
Tenant,
|
||||||
} from "@goauthentik/api";
|
} from "@goauthentik/api";
|
||||||
|
|
||||||
|
@ -144,35 +145,35 @@ export class TenantForm extends ModelForm<Tenant, string> {
|
||||||
label=${t`Authentication flow`}
|
label=${t`Authentication flow`}
|
||||||
name="flowAuthentication"
|
name="flowAuthentication"
|
||||||
>
|
>
|
||||||
<select class="pf-c-form-control">
|
<ak-search-select
|
||||||
<option
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
value=""
|
const args: FlowsInstancesListRequest = {
|
||||||
?selected=${this.instance?.flowAuthentication === undefined}
|
ordering: "slug",
|
||||||
>
|
designation: FlowsInstancesListDesignationEnum.Authentication,
|
||||||
---------
|
};
|
||||||
</option>
|
if (query !== undefined) {
|
||||||
${until(
|
args.search = query;
|
||||||
new FlowsApi(DEFAULT_CONFIG)
|
}
|
||||||
.flowsInstancesList({
|
const flows = await new FlowsApi(DEFAULT_CONFIG).flowsInstancesList(
|
||||||
ordering: "slug",
|
args,
|
||||||
designation:
|
);
|
||||||
FlowsInstancesListDesignationEnum.Authentication,
|
return flows.results;
|
||||||
})
|
}}
|
||||||
.then((flows) => {
|
.renderElement=${(flow: Flow): string => {
|
||||||
return flows.results.map((flow) => {
|
return flow.name;
|
||||||
const selected =
|
}}
|
||||||
this.instance?.flowAuthentication === flow.pk;
|
.renderDescription=${(flow: Flow): string => {
|
||||||
return html`<option
|
return flow.slug;
|
||||||
value=${flow.pk}
|
}}
|
||||||
?selected=${selected}
|
.value=${(flow: Flow | undefined): string | undefined => {
|
||||||
>
|
return flow?.pk;
|
||||||
${flow.name} (${flow.slug})
|
}}
|
||||||
</option>`;
|
.selected=${(flow: Flow): boolean => {
|
||||||
});
|
return this.instance?.flowAuthentication === flow.pk;
|
||||||
}),
|
}}
|
||||||
html`<option>${t`Loading...`}</option>`,
|
?blankable=${true}
|
||||||
)}
|
>
|
||||||
</select>
|
</ak-search-select>
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
${t`Flow used to authenticate users. If left empty, the first applicable flow sorted by the slug is used.`}
|
${t`Flow used to authenticate users. If left empty, the first applicable flow sorted by the slug is used.`}
|
||||||
</p>
|
</p>
|
||||||
|
@ -181,64 +182,70 @@ export class TenantForm extends ModelForm<Tenant, string> {
|
||||||
label=${t`Invalidation flow`}
|
label=${t`Invalidation flow`}
|
||||||
name="flowInvalidation"
|
name="flowInvalidation"
|
||||||
>
|
>
|
||||||
<select class="pf-c-form-control">
|
<ak-search-select
|
||||||
<option
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
value=""
|
const args: FlowsInstancesListRequest = {
|
||||||
?selected=${this.instance?.flowInvalidation === undefined}
|
ordering: "slug",
|
||||||
>
|
designation: FlowsInstancesListDesignationEnum.Invalidation,
|
||||||
---------
|
};
|
||||||
</option>
|
if (query !== undefined) {
|
||||||
${until(
|
args.search = query;
|
||||||
new FlowsApi(DEFAULT_CONFIG)
|
}
|
||||||
.flowsInstancesList({
|
const flows = await new FlowsApi(DEFAULT_CONFIG).flowsInstancesList(
|
||||||
ordering: "slug",
|
args,
|
||||||
designation: FlowsInstancesListDesignationEnum.Invalidation,
|
);
|
||||||
})
|
return flows.results;
|
||||||
.then((flows) => {
|
}}
|
||||||
return flows.results.map((flow) => {
|
.renderElement=${(flow: Flow): string => {
|
||||||
const selected =
|
return flow.name;
|
||||||
this.instance?.flowInvalidation === flow.pk;
|
}}
|
||||||
return html`<option
|
.renderDescription=${(flow: Flow): string => {
|
||||||
value=${flow.pk}
|
return flow.slug;
|
||||||
?selected=${selected}
|
}}
|
||||||
>
|
.value=${(flow: Flow | undefined): string | undefined => {
|
||||||
${flow.name} (${flow.slug})
|
return flow?.pk;
|
||||||
</option>`;
|
}}
|
||||||
});
|
.selected=${(flow: Flow): boolean => {
|
||||||
}),
|
return this.instance?.flowInvalidation === flow.pk;
|
||||||
html`<option>${t`Loading...`}</option>`,
|
}}
|
||||||
)}
|
?blankable=${true}
|
||||||
</select>
|
>
|
||||||
|
</ak-search-select>
|
||||||
|
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
${t`Flow used to logout. If left empty, the first applicable flow sorted by the slug is used.`}
|
${t`Flow used to logout. If left empty, the first applicable flow sorted by the slug is used.`}
|
||||||
</p>
|
</p>
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>
|
||||||
<ak-form-element-horizontal label=${t`Recovery flow`} name="flowRecovery">
|
<ak-form-element-horizontal label=${t`Recovery flow`} name="flowRecovery">
|
||||||
<select class="pf-c-form-control">
|
<ak-search-select
|
||||||
<option value="" ?selected=${this.instance?.flowRecovery === undefined}>
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
---------
|
const args: FlowsInstancesListRequest = {
|
||||||
</option>
|
ordering: "slug",
|
||||||
${until(
|
designation: FlowsInstancesListDesignationEnum.Recovery,
|
||||||
new FlowsApi(DEFAULT_CONFIG)
|
};
|
||||||
.flowsInstancesList({
|
if (query !== undefined) {
|
||||||
ordering: "slug",
|
args.search = query;
|
||||||
designation: FlowsInstancesListDesignationEnum.Recovery,
|
}
|
||||||
})
|
const flows = await new FlowsApi(DEFAULT_CONFIG).flowsInstancesList(
|
||||||
.then((flows) => {
|
args,
|
||||||
return flows.results.map((flow) => {
|
);
|
||||||
const selected =
|
return flows.results;
|
||||||
this.instance?.flowRecovery === flow.pk;
|
}}
|
||||||
return html`<option
|
.renderElement=${(flow: Flow): string => {
|
||||||
value=${flow.pk}
|
return flow.name;
|
||||||
?selected=${selected}
|
}}
|
||||||
>
|
.renderDescription=${(flow: Flow): string => {
|
||||||
${flow.name} (${flow.slug})
|
return flow.slug;
|
||||||
</option>`;
|
}}
|
||||||
});
|
.value=${(flow: Flow | undefined): string | undefined => {
|
||||||
}),
|
return flow?.pk;
|
||||||
html`<option>${t`Loading...`}</option>`,
|
}}
|
||||||
)}
|
.selected=${(flow: Flow): boolean => {
|
||||||
</select>
|
return this.instance?.flowRecovery === flow.pk;
|
||||||
|
}}
|
||||||
|
?blankable=${true}
|
||||||
|
>
|
||||||
|
</ak-search-select>
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
${t`Recovery flow. If left empty, the first applicable flow sorted by the slug is used.`}
|
${t`Recovery flow. If left empty, the first applicable flow sorted by the slug is used.`}
|
||||||
</p>
|
</p>
|
||||||
|
@ -247,34 +254,35 @@ export class TenantForm extends ModelForm<Tenant, string> {
|
||||||
label=${t`Unenrollment flow`}
|
label=${t`Unenrollment flow`}
|
||||||
name="flowUnenrollment"
|
name="flowUnenrollment"
|
||||||
>
|
>
|
||||||
<select class="pf-c-form-control">
|
<ak-search-select
|
||||||
<option
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
value=""
|
const args: FlowsInstancesListRequest = {
|
||||||
?selected=${this.instance?.flowUnenrollment === undefined}
|
ordering: "slug",
|
||||||
>
|
designation: FlowsInstancesListDesignationEnum.Unenrollment,
|
||||||
---------
|
};
|
||||||
</option>
|
if (query !== undefined) {
|
||||||
${until(
|
args.search = query;
|
||||||
new FlowsApi(DEFAULT_CONFIG)
|
}
|
||||||
.flowsInstancesList({
|
const flows = await new FlowsApi(DEFAULT_CONFIG).flowsInstancesList(
|
||||||
ordering: "slug",
|
args,
|
||||||
designation: FlowsInstancesListDesignationEnum.Unenrollment,
|
);
|
||||||
})
|
return flows.results;
|
||||||
.then((flows) => {
|
}}
|
||||||
return flows.results.map((flow) => {
|
.renderElement=${(flow: Flow): string => {
|
||||||
const selected =
|
return flow.name;
|
||||||
this.instance?.flowUnenrollment === flow.pk;
|
}}
|
||||||
return html`<option
|
.renderDescription=${(flow: Flow): string => {
|
||||||
value=${flow.pk}
|
return flow.slug;
|
||||||
?selected=${selected}
|
}}
|
||||||
>
|
.value=${(flow: Flow | undefined): string | undefined => {
|
||||||
${flow.name} (${flow.slug})
|
return flow?.pk;
|
||||||
</option>`;
|
}}
|
||||||
});
|
.selected=${(flow: Flow): boolean => {
|
||||||
}),
|
return this.instance?.flowUnenrollment === flow.pk;
|
||||||
html`<option>${t`Loading...`}</option>`,
|
}}
|
||||||
)}
|
?blankable=${true}
|
||||||
</select>
|
>
|
||||||
|
</ak-search-select>
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
${t`If set, users are able to unenroll themselves using this flow. If no flow is set, option is not shown.`}
|
${t`If set, users are able to unenroll themselves using this flow. If no flow is set, option is not shown.`}
|
||||||
</p>
|
</p>
|
||||||
|
@ -283,69 +291,71 @@ export class TenantForm extends ModelForm<Tenant, string> {
|
||||||
label=${t`User settings flow`}
|
label=${t`User settings flow`}
|
||||||
name="flowUserSettings"
|
name="flowUserSettings"
|
||||||
>
|
>
|
||||||
<select class="pf-c-form-control">
|
<ak-search-select
|
||||||
<option
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
value=""
|
const args: FlowsInstancesListRequest = {
|
||||||
?selected=${this.instance?.flowUserSettings === undefined}
|
ordering: "slug",
|
||||||
>
|
designation:
|
||||||
---------
|
FlowsInstancesListDesignationEnum.StageConfiguration,
|
||||||
</option>
|
};
|
||||||
${until(
|
if (query !== undefined) {
|
||||||
new FlowsApi(DEFAULT_CONFIG)
|
args.search = query;
|
||||||
.flowsInstancesList({
|
}
|
||||||
ordering: "slug",
|
const flows = await new FlowsApi(DEFAULT_CONFIG).flowsInstancesList(
|
||||||
designation:
|
args,
|
||||||
FlowsInstancesListDesignationEnum.StageConfiguration,
|
);
|
||||||
})
|
return flows.results;
|
||||||
.then((flows) => {
|
}}
|
||||||
return flows.results.map((flow) => {
|
.renderElement=${(flow: Flow): string => {
|
||||||
const selected =
|
return flow.name;
|
||||||
this.instance?.flowUserSettings === flow.pk;
|
}}
|
||||||
return html`<option
|
.renderDescription=${(flow: Flow): string => {
|
||||||
value=${flow.pk}
|
return flow.slug;
|
||||||
?selected=${selected}
|
}}
|
||||||
>
|
.value=${(flow: Flow | undefined): string | undefined => {
|
||||||
${flow.name} (${flow.slug})
|
return flow?.pk;
|
||||||
</option>`;
|
}}
|
||||||
});
|
.selected=${(flow: Flow): boolean => {
|
||||||
}),
|
return this.instance?.flowUserSettings === flow.pk;
|
||||||
html`<option>${t`Loading...`}</option>`,
|
}}
|
||||||
)}
|
?blankable=${true}
|
||||||
</select>
|
>
|
||||||
|
</ak-search-select>
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
${t`If set, users are able to configure details of their profile.`}
|
${t`If set, users are able to configure details of their profile.`}
|
||||||
</p>
|
</p>
|
||||||
</ak-form-element-horizontal>
|
</ak-form-element-horizontal>
|
||||||
<ak-form-element-horizontal label=${t`Device code flow`} name="flowDeviceCode">
|
<ak-form-element-horizontal label=${t`Device code flow`} name="flowDeviceCode">
|
||||||
<select class="pf-c-form-control">
|
<ak-search-select
|
||||||
<option
|
.fetchObjects=${async (query?: string): Promise<Flow[]> => {
|
||||||
value=""
|
const args: FlowsInstancesListRequest = {
|
||||||
?selected=${this.instance?.flowDeviceCode === undefined}
|
ordering: "slug",
|
||||||
>
|
designation:
|
||||||
---------
|
FlowsInstancesListDesignationEnum.StageConfiguration,
|
||||||
</option>
|
};
|
||||||
${until(
|
if (query !== undefined) {
|
||||||
new FlowsApi(DEFAULT_CONFIG)
|
args.search = query;
|
||||||
.flowsInstancesList({
|
}
|
||||||
ordering: "slug",
|
const flows = await new FlowsApi(DEFAULT_CONFIG).flowsInstancesList(
|
||||||
designation:
|
args,
|
||||||
FlowsInstancesListDesignationEnum.StageConfiguration,
|
);
|
||||||
})
|
return flows.results;
|
||||||
.then((flows) => {
|
}}
|
||||||
return flows.results.map((flow) => {
|
.renderElement=${(flow: Flow): string => {
|
||||||
const selected =
|
return flow.name;
|
||||||
this.instance?.flowDeviceCode === flow.pk;
|
}}
|
||||||
return html`<option
|
.renderDescription=${(flow: Flow): string => {
|
||||||
value=${flow.pk}
|
return flow.slug;
|
||||||
?selected=${selected}
|
}}
|
||||||
>
|
.value=${(flow: Flow | undefined): string | undefined => {
|
||||||
${flow.name} (${flow.slug})
|
return flow?.pk;
|
||||||
</option>`;
|
}}
|
||||||
});
|
.selected=${(flow: Flow): boolean => {
|
||||||
}),
|
return this.instance?.flowDeviceCode === flow.pk;
|
||||||
html`<option>${t`Loading...`}</option>`,
|
}}
|
||||||
)}
|
?blankable=${true}
|
||||||
</select>
|
>
|
||||||
|
</ak-search-select>
|
||||||
<p class="pf-c-form__helper-text">
|
<p class="pf-c-form__helper-text">
|
||||||
${t`If set, the OAuth Device Code profile can be used, and the selected flow will be used to enter the code.`}
|
${t`If set, the OAuth Device Code profile can be used, and the selected flow will be used to enter the code.`}
|
||||||
</p>
|
</p>
|
||||||
|
|
Reference in New Issue