diff --git a/web/src/admin/applications/wizard/oauth/TypeOAuthCodeApplicationWizardPage.ts b/web/src/admin/applications/wizard/oauth/TypeOAuthCodeApplicationWizardPage.ts
index 9ba7bcf8b..0d40be61e 100644
--- a/web/src/admin/applications/wizard/oauth/TypeOAuthCodeApplicationWizardPage.ts
+++ b/web/src/admin/applications/wizard/oauth/TypeOAuthCodeApplicationWizardPage.ts
@@ -60,10 +60,10 @@ export class TypeOAuthCodeApplicationWizardPage extends WizardFormPage {
                         return flows.results;
                     }}
                     .renderElement=${(flow: Flow): string => {
-                        return flow.name;
+                        return flow.slug;
                     }}
                     .renderDescription=${(flow: Flow): TemplateResult => {
-                        return html`${flow.slug}`;
+                        return html`${flow.name}`;
                     }}
                     .value=${(flow: Flow | undefined): string | undefined => {
                         return flow?.pk;
diff --git a/web/src/admin/providers/oauth2/OAuth2ProviderForm.ts b/web/src/admin/providers/oauth2/OAuth2ProviderForm.ts
index af2e790c8..348092197 100644
--- a/web/src/admin/providers/oauth2/OAuth2ProviderForm.ts
+++ b/web/src/admin/providers/oauth2/OAuth2ProviderForm.ts
@@ -95,10 +95,10 @@ export class OAuth2ProviderFormPage extends ModelForm<OAuth2Provider, number> {
                         return flows.results;
                     }}
                     .renderElement=${(flow: Flow): string => {
-                        return flow.name;
+                        return flow.slug;
                     }}
                     .renderDescription=${(flow: Flow): TemplateResult => {
-                        return html`${flow.slug}`;
+                        return html`${flow.name}`;
                     }}
                     .value=${(flow: Flow | undefined): string | undefined => {
                         return flow?.pk;
diff --git a/web/src/admin/providers/proxy/ProxyProviderForm.ts b/web/src/admin/providers/proxy/ProxyProviderForm.ts
index ab584cd09..5998d311a 100644
--- a/web/src/admin/providers/proxy/ProxyProviderForm.ts
+++ b/web/src/admin/providers/proxy/ProxyProviderForm.ts
@@ -311,10 +311,10 @@ export class ProxyProviderFormPage extends ModelForm<ProxyProvider, number> {
                         return flows.results;
                     }}
                     .renderElement=${(flow: Flow): string => {
-                        return flow.name;
+                        return flow.slug;
                     }}
                     .renderDescription=${(flow: Flow): TemplateResult => {
-                        return html`${flow.slug}`;
+                        return html`${flow.name}`;
                     }}
                     .value=${(flow: Flow | undefined): string | undefined => {
                         return flow?.pk;
diff --git a/web/src/admin/providers/saml/SAMLProviderForm.ts b/web/src/admin/providers/saml/SAMLProviderForm.ts
index b4c9aa81c..bfad8c32a 100644
--- a/web/src/admin/providers/saml/SAMLProviderForm.ts
+++ b/web/src/admin/providers/saml/SAMLProviderForm.ts
@@ -87,10 +87,10 @@ export class SAMLProviderFormPage extends ModelForm<SAMLProvider, number> {
                         return flows.results;
                     }}
                     .renderElement=${(flow: Flow): string => {
-                        return flow.name;
+                        return flow.slug;
                     }}
                     .renderDescription=${(flow: Flow): TemplateResult => {
-                        return html`${flow.slug}`;
+                        return html`${flow.name}`;
                     }}
                     .value=${(flow: Flow | undefined): string | undefined => {
                         return flow?.pk;
diff --git a/web/src/admin/providers/saml/SAMLProviderImportForm.ts b/web/src/admin/providers/saml/SAMLProviderImportForm.ts
index 4996d3e2b..e36ddba37 100644
--- a/web/src/admin/providers/saml/SAMLProviderImportForm.ts
+++ b/web/src/admin/providers/saml/SAMLProviderImportForm.ts
@@ -60,10 +60,10 @@ export class SAMLProviderImportForm extends Form<SAMLProvider> {
                         return flows.results;
                     }}
                     .renderElement=${(flow: Flow): string => {
-                        return flow.name;
+                        return flow.slug;
                     }}
                     .renderDescription=${(flow: Flow): TemplateResult => {
-                        return html`${flow.slug}`;
+                        return html`${flow.name}`;
                     }}
                     .value=${(flow: Flow | undefined): string | undefined => {
                         return flow?.pk;
diff --git a/web/src/admin/sources/oauth/OAuthSourceForm.ts b/web/src/admin/sources/oauth/OAuthSourceForm.ts
index b18cfcb72..6003c1b13 100644
--- a/web/src/admin/sources/oauth/OAuthSourceForm.ts
+++ b/web/src/admin/sources/oauth/OAuthSourceForm.ts
@@ -417,10 +417,10 @@ export class OAuthSourceForm extends ModelForm<OAuthSource, string> {
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
@@ -463,10 +463,10 @@ export class OAuthSourceForm extends ModelForm<OAuthSource, string> {
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
diff --git a/web/src/admin/sources/plex/PlexSourceForm.ts b/web/src/admin/sources/plex/PlexSourceForm.ts
index 5b83aeb9a..45c1a8d36 100644
--- a/web/src/admin/sources/plex/PlexSourceForm.ts
+++ b/web/src/admin/sources/plex/PlexSourceForm.ts
@@ -346,10 +346,10 @@ export class PlexSourceForm extends ModelForm<PlexSource, string> {
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
@@ -392,10 +392,10 @@ export class PlexSourceForm extends ModelForm<PlexSource, string> {
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
diff --git a/web/src/admin/sources/saml/SAMLSourceForm.ts b/web/src/admin/sources/saml/SAMLSourceForm.ts
index 3447f3e46..feccca1e9 100644
--- a/web/src/admin/sources/saml/SAMLSourceForm.ts
+++ b/web/src/admin/sources/saml/SAMLSourceForm.ts
@@ -496,10 +496,10 @@ export class SAMLSourceForm extends ModelForm<SAMLSource, string> {
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
@@ -540,10 +540,10 @@ export class SAMLSourceForm extends ModelForm<SAMLSource, string> {
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
@@ -586,10 +586,10 @@ export class SAMLSourceForm extends ModelForm<SAMLSource, string> {
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
diff --git a/web/src/admin/stages/authenticator_duo/AuthenticatorDuoStageForm.ts b/web/src/admin/stages/authenticator_duo/AuthenticatorDuoStageForm.ts
index 114e4256e..430988110 100644
--- a/web/src/admin/stages/authenticator_duo/AuthenticatorDuoStageForm.ts
+++ b/web/src/admin/stages/authenticator_duo/AuthenticatorDuoStageForm.ts
@@ -146,10 +146,10 @@ export class AuthenticatorDuoStageForm extends ModelForm<AuthenticatorDuoStage,
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
diff --git a/web/src/admin/stages/authenticator_sms/AuthenticatorSMSStageForm.ts b/web/src/admin/stages/authenticator_sms/AuthenticatorSMSStageForm.ts
index c43741018..9781fb02c 100644
--- a/web/src/admin/stages/authenticator_sms/AuthenticatorSMSStageForm.ts
+++ b/web/src/admin/stages/authenticator_sms/AuthenticatorSMSStageForm.ts
@@ -10,7 +10,6 @@ import { t } from "@lingui/macro";
 import { TemplateResult, 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 {
     AuthTypeEnum,
@@ -286,10 +285,10 @@ export class AuthenticatorSMSStageForm extends ModelForm<AuthenticatorSMSStage,
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
diff --git a/web/src/admin/stages/authenticator_static/AuthenticatorStaticStageForm.ts b/web/src/admin/stages/authenticator_static/AuthenticatorStaticStageForm.ts
index 271825585..8ce7f62ab 100644
--- a/web/src/admin/stages/authenticator_static/AuthenticatorStaticStageForm.ts
+++ b/web/src/admin/stages/authenticator_static/AuthenticatorStaticStageForm.ts
@@ -93,10 +93,10 @@ export class AuthenticatorStaticStageForm extends ModelForm<AuthenticatorStaticS
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
diff --git a/web/src/admin/stages/authenticator_totp/AuthenticatorTOTPStageForm.ts b/web/src/admin/stages/authenticator_totp/AuthenticatorTOTPStageForm.ts
index 0f129fd0e..6489a24c0 100644
--- a/web/src/admin/stages/authenticator_totp/AuthenticatorTOTPStageForm.ts
+++ b/web/src/admin/stages/authenticator_totp/AuthenticatorTOTPStageForm.ts
@@ -98,10 +98,10 @@ export class AuthenticatorTOTPStageForm extends ModelForm<AuthenticatorTOTPStage
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
diff --git a/web/src/admin/stages/authenticator_webauthn/AuthenticateWebAuthnStageForm.ts b/web/src/admin/stages/authenticator_webauthn/AuthenticateWebAuthnStageForm.ts
index cc8d9c3cd..d48791b34 100644
--- a/web/src/admin/stages/authenticator_webauthn/AuthenticateWebAuthnStageForm.ts
+++ b/web/src/admin/stages/authenticator_webauthn/AuthenticateWebAuthnStageForm.ts
@@ -172,10 +172,10 @@ export class AuthenticateWebAuthnStageForm extends ModelForm<AuthenticateWebAuth
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
diff --git a/web/src/admin/stages/identification/IdentificationStageForm.ts b/web/src/admin/stages/identification/IdentificationStageForm.ts
index 7110dc304..737212d96 100644
--- a/web/src/admin/stages/identification/IdentificationStageForm.ts
+++ b/web/src/admin/stages/identification/IdentificationStageForm.ts
@@ -247,10 +247,10 @@ export class IdentificationStageForm extends ModelForm<IdentificationStage, stri
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
@@ -281,10 +281,10 @@ export class IdentificationStageForm extends ModelForm<IdentificationStage, stri
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
@@ -315,10 +315,10 @@ export class IdentificationStageForm extends ModelForm<IdentificationStage, stri
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
diff --git a/web/src/admin/stages/invitation/InvitationForm.ts b/web/src/admin/stages/invitation/InvitationForm.ts
index b594cc233..83f943478 100644
--- a/web/src/admin/stages/invitation/InvitationForm.ts
+++ b/web/src/admin/stages/invitation/InvitationForm.ts
@@ -88,10 +88,10 @@ export class InvitationForm extends ModelForm<Invitation, string> {
                         return flows.results;
                     }}
                     .renderElement=${(flow: Flow): string => {
-                        return flow.name;
+                        return flow.slug;
                     }}
                     .renderDescription=${(flow: Flow): TemplateResult => {
-                        return html`${flow.slug}`;
+                        return html`${flow.name}`;
                     }}
                     .value=${(flow: Flow | undefined): string | undefined => {
                         return flow?.pk;
diff --git a/web/src/admin/stages/password/PasswordStageForm.ts b/web/src/admin/stages/password/PasswordStageForm.ts
index b248f75dd..d0de11a55 100644
--- a/web/src/admin/stages/password/PasswordStageForm.ts
+++ b/web/src/admin/stages/password/PasswordStageForm.ts
@@ -136,10 +136,10 @@ export class PasswordStageForm extends ModelForm<PasswordStage, string> {
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
diff --git a/web/src/admin/tenants/TenantForm.ts b/web/src/admin/tenants/TenantForm.ts
index 9677cc5a4..ce5e301be 100644
--- a/web/src/admin/tenants/TenantForm.ts
+++ b/web/src/admin/tenants/TenantForm.ts
@@ -160,10 +160,10 @@ export class TenantForm extends ModelForm<Tenant, string> {
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
@@ -197,10 +197,10 @@ export class TenantForm extends ModelForm<Tenant, string> {
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
@@ -232,10 +232,10 @@ export class TenantForm extends ModelForm<Tenant, string> {
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
@@ -269,10 +269,10 @@ export class TenantForm extends ModelForm<Tenant, string> {
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
@@ -307,10 +307,10 @@ export class TenantForm extends ModelForm<Tenant, string> {
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;
@@ -342,10 +342,10 @@ export class TenantForm extends ModelForm<Tenant, string> {
                                 return flows.results;
                             }}
                             .renderElement=${(flow: Flow): string => {
-                                return flow.name;
+                                return flow.slug;
                             }}
                             .renderDescription=${(flow: Flow): TemplateResult => {
-                                return html`${flow.slug}`;
+                                return html`${flow.name}`;
                             }}
                             .value=${(flow: Flow | undefined): string | undefined => {
                                 return flow?.pk;