diff --git a/web/src/admin/applications/wizard/methods/oauth/ak-application-wizard-authentication-by-oauth.ts b/web/src/admin/applications/wizard/methods/oauth/ak-application-wizard-authentication-by-oauth.ts
index f649b4ac8f25..94e5f07c1517 100644
--- a/web/src/admin/applications/wizard/methods/oauth/ak-application-wizard-authentication-by-oauth.ts
+++ b/web/src/admin/applications/wizard/methods/oauth/ak-application-wizard-authentication-by-oauth.ts
@@ -39,7 +39,7 @@ import BaseProviderPanel from "../BaseProviderPanel";
 @customElement("ak-application-wizard-authentication-by-oauth")
 export class ApplicationWizardAuthenticationByOauth extends BaseProviderPanel {
     @state()
-    showClientSecret = false;
+    showClientSecret = true;
 
     @state()
     propertyMappings?: PaginatedScopeMappingList;
@@ -87,12 +87,13 @@ export class ApplicationWizardAuthenticationByOauth extends BaseProviderPanel {
                         flowType=${FlowsInstancesListDesignationEnum.Authentication}
                         .currentFlow=${provider?.authenticationFlow}
                         required
-                        @change=${(ev: CustomEvent<{ value: ClientTypeEnum }>) => {
-                            this.showClientSecret = ev.detail.value !== ClientTypeEnum.Public;
-                        }}
-                        .options=${clientTypeOptions}
-                    >
-                    </ak-radio-input>
+                    ></ak-flow-search>
+                    <p class="pf-c-form__helper-text">
+                        ${msg(
+                            "Flow used when a user access this provider and is not authenticated."
+                        )}
+                    </p>
+                </ak-form-element-horizontal>
                 <ak-form-element-horizontal
                     name="authorizationFlow"
                     label=${msg("Authorization flow")}
@@ -116,8 +117,8 @@ export class ApplicationWizardAuthenticationByOauth extends BaseProviderPanel {
                             label=${msg("Client type")}
                             .value=${provider?.clientType}
                             required
-                            @change=${(ev: CustomEvent<ClientTypeEnum>) => {
-                                this.showClientSecret = ev.detail !== ClientTypeEnum.Public;
+                            @change=${(ev: CustomEvent<{ value: ClientTypeEnum }>) => {
+                                this.showClientSecret = ev.detail.value !== ClientTypeEnum.Public;
                             }}
                             .options=${clientTypeOptions}
                         >
@@ -208,13 +209,13 @@ export class ApplicationWizardAuthenticationByOauth extends BaseProviderPanel {
                                     if (!provider?.propertyMappings) {
                                         selected =
                                             scope.managed?.startsWith(
-                                                "goauthentik.io/providers/oauth2/scope-",
+                                                "goauthentik.io/providers/oauth2/scope-"
                                             ) || false;
                                     } else {
                                         selected = Array.from(provider?.propertyMappings).some(
                                             (su) => {
                                                 return su == scope.pk;
-                                            },
+                                            }
                                         );
                                     }
                                     return html`<option
@@ -227,7 +228,7 @@ export class ApplicationWizardAuthenticationByOauth extends BaseProviderPanel {
                             </select>
                             <p class="pf-c-form__helper-text">
                                 ${msg(
-                                    "Select which scopes can be used by the client. The client still has to specify the scope to access the data.",
+                                    "Select which scopes can be used by the client. The client still has to specify the scope to access the data."
                                 )}
                             </p>
                             <p class="pf-c-form__helper-text">
@@ -242,7 +243,7 @@ export class ApplicationWizardAuthenticationByOauth extends BaseProviderPanel {
                             .options=${subjectModeOptions}
                             .value=${provider?.subMode}
                             help=${msg(
-                                "Configure what data should be used as unique User Identifier. For most cases, the default should be fine.",
+                                "Configure what data should be used as unique User Identifier. For most cases, the default should be fine."
                             )}
                         >
                         </ak-radio-input>
@@ -251,7 +252,7 @@ export class ApplicationWizardAuthenticationByOauth extends BaseProviderPanel {
                             label=${msg("Include claims in id_token")}
                             ?checked=${first(provider?.includeClaimsInIdToken, true)}
                             help=${msg(
-                                "Include User claims from scopes in the id_token, for applications that don't access the userinfo endpoint.",
+                                "Include User claims from scopes in the id_token, for applications that don't access the userinfo endpoint."
                             )}
                         ></ak-switch-input>
                         <ak-radio-input
@@ -261,7 +262,7 @@ export class ApplicationWizardAuthenticationByOauth extends BaseProviderPanel {
                             .options=${issuerModeOptions}
                             .value=${provider?.issuerMode}
                             help=${msg(
-                                "Configure how the issuer field of the ID Token should be filled.",
+                                "Configure how the issuer field of the ID Token should be filled."
                             )}
                         >
                         </ak-radio-input>
@@ -287,7 +288,7 @@ export class ApplicationWizardAuthenticationByOauth extends BaseProviderPanel {
                             </select>
                             <p class="pf-c-form__helper-text">
                                 ${msg(
-                                    "JWTs signed by certificates configured in the selected sources can be used to authenticate to this provider.",
+                                    "JWTs signed by certificates configured in the selected sources can be used to authenticate to this provider."
                                 )}
                             </p>
                             <p class="pf-c-form__helper-text">
diff --git a/web/src/elements/forms/Form.ts b/web/src/elements/forms/Form.ts
index d171aae0bbd2..d465a24350fd 100644
--- a/web/src/elements/forms/Form.ts
+++ b/web/src/elements/forms/Form.ts
@@ -133,93 +133,6 @@ export function serializeForm<T extends KeyUnknown>(
     return json as unknown as T;
 }
 
-/**
- * Recursively assign `value` into `json` while interpreting the dot-path of `element.name`
- */
-function assignValue(element: HTMLInputElement, value: unknown, json: KeyUnknown): void {
-    let parent = json;
-    if (!element.name?.includes(".")) {
-        parent[element.name] = value;
-        return;
-    }
-    const nameElements = element.name.split(".");
-    for (let index = 0; index < nameElements.length - 1; index++) {
-        const nameEl = nameElements[index];
-        // Ensure all nested structures exist
-        if (!(nameEl in parent)) parent[nameEl] = {};
-        parent = parent[nameEl] as { [key: string]: unknown };
-    }
-    parent[nameElements[nameElements.length - 1]] = value;
-}
-
-/**
- * Convert the elements of the form to JSON.[4]
- *
- */
-export function serializeForm<T extends KeyUnknown>(
-    elements: NodeListOf<HorizontalFormElement>,
-): T | undefined {
-    const json: { [key: string]: unknown } = {};
-    elements.forEach((element) => {
-        element.requestUpdate();
-        const inputElement = element.querySelector<HTMLInputElement>("[name]");
-        if (element.hidden || !inputElement) {
-            return;
-        }
-        // Skip elements that are writeOnly where the user hasn't clicked on the value
-        if (element.writeOnly && !element.writeOnlyActivated) {
-            return;
-        }
-        if (
-            inputElement.tagName.toLowerCase() === "select" &&
-            "multiple" in inputElement.attributes
-        ) {
-            const selectElement = inputElement as unknown as HTMLSelectElement;
-            assignValue(
-                inputElement,
-                Array.from(selectElement.selectedOptions).map((v) => v.value),
-                json,
-            );
-        } else if (inputElement.tagName.toLowerCase() === "input" && inputElement.type === "date") {
-            assignValue(inputElement, inputElement.valueAsDate, json);
-        } else if (
-            inputElement.tagName.toLowerCase() === "input" &&
-            inputElement.type === "datetime-local"
-        ) {
-            assignValue(inputElement, new Date(inputElement.valueAsNumber), json);
-        } else if (
-            inputElement.tagName.toLowerCase() === "input" &&
-            "type" in inputElement.dataset &&
-            inputElement.dataset["type"] === "datetime-local"
-        ) {
-            // Workaround for Firefox <93, since 92 and older don't support
-            // datetime-local fields
-            assignValue(inputElement, new Date(inputElement.value), json);
-        } else if (
-            inputElement.tagName.toLowerCase() === "input" &&
-            inputElement.type === "checkbox"
-        ) {
-            assignValue(inputElement, inputElement.checked, json);
-        } else if ("selectedFlow" in inputElement) {
-            assignValue(inputElement, inputElement.value, json);
-        } else if (inputElement.tagName.toLowerCase() === "ak-search-select") {
-            const select = inputElement as unknown as SearchSelect<unknown>;
-            try {
-                const value = select.toForm();
-                assignValue(inputElement, value, json);
-            } catch (exc) {
-                if (exc instanceof PreventFormSubmit) {
-                    throw new PreventFormSubmit(exc.message, element);
-                }
-                throw exc;
-            }
-        } else {
-            assignValue(inputElement, inputElement.value, json);
-        }
-    });
-    return json as unknown as T;
-}
-
 /**
  * Form
  *