From 8962d17e03d3feb9f17baefac9452d9e7e69b7e4 Mon Sep 17 00:00:00 2001
From: "gcp-cherry-pick-bot[bot]"
 <98988430+gcp-cherry-pick-bot[bot]@users.noreply.github.com>
Date: Fri, 30 Aug 2024 19:07:36 +0200
Subject: [PATCH] web: fix dual-select with dynamic selection (cherry-pick
 #11133) (#11134)

web: fix dual-select with dynamic selection (#11133)

* web: fix dual-select with dynamic selection

For dynamic selection, the property name is `.selector` to message that it's a function the
API layer uses to select the elements.

A few bits of lint picked.

* web: added comment to clarify what the fallback selector does

Co-authored-by: Ken Sternberg <133134217+kensternberg-authentik@users.noreply.github.com>
---
 .../identification/IdentificationStageForm.ts   | 17 +++++++++--------
 .../ak-dual-select-dynamic-selected-provider.ts |  6 ++++++
 2 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/web/src/admin/stages/identification/IdentificationStageForm.ts b/web/src/admin/stages/identification/IdentificationStageForm.ts
index 8b4c553c9639..6b541d08c88c 100644
--- a/web/src/admin/stages/identification/IdentificationStageForm.ts
+++ b/web/src/admin/stages/identification/IdentificationStageForm.ts
@@ -46,7 +46,8 @@ async function makeSourcesSelector(instanceSources: string[] | undefined) {
 
     return localSources
         ? ([pk, _]: DualSelectPair) => localSources.has(pk)
-        : ([_0, _1, _2, source]: DualSelectPair<Source>) =>
+        : // Creating a new instance, auto-select built-in source only when no other sources exist
+          ([_0, _1, _2, source]: DualSelectPair<Source>) =>
               source !== undefined && source.component === "";
 }
 
@@ -75,11 +76,11 @@ export class IdentificationStageForm extends BaseStageForm<IdentificationStage>
                 stageUuid: this.instance.pk || "",
                 identificationStageRequest: data,
             });
-        } else {
-            return new StagesApi(DEFAULT_CONFIG).stagesIdentificationCreate({
-                identificationStageRequest: data,
-            });
         }
+
+        return new StagesApi(DEFAULT_CONFIG).stagesIdentificationCreate({
+            identificationStageRequest: data,
+        });
     }
 
     isUserFieldSelected(field: UserFieldsEnum): boolean {
@@ -232,12 +233,12 @@ export class IdentificationStageForm extends BaseStageForm<IdentificationStage>
                         ?required=${true}
                         name="sources"
                     >
-                        <ak-dual-select-provider-dynamic-selected
+                        <ak-dual-select-dynamic-selected
                             .provider=${sourcesProvider}
-                            .selected=${makeSourcesSelector(this.instance?.sources)}
+                            .selector=${makeSourcesSelector(this.instance?.sources)}
                             available-label="${msg("Available Stages")}"
                             selected-label="${msg("Selected Stages")}"
-                        ></ak-dual-select-provider-dynamic-selected>
+                        ></ak-dual-select-dynamic-selected>
                         <p class="pf-c-form__helper-text">
                             ${msg(
                                 "Select sources should be shown for users to authenticate with. This only affects web-based sources, not LDAP.",
diff --git a/web/src/elements/ak-dual-select/ak-dual-select-dynamic-selected-provider.ts b/web/src/elements/ak-dual-select/ak-dual-select-dynamic-selected-provider.ts
index e5d834f3c10a..59037776ef2d 100644
--- a/web/src/elements/ak-dual-select/ak-dual-select-dynamic-selected-provider.ts
+++ b/web/src/elements/ak-dual-select/ak-dual-select-dynamic-selected-provider.ts
@@ -50,3 +50,9 @@ export class AkDualSelectDynamic extends AkDualSelectProvider {
         ></ak-dual-select>`;
     }
 }
+
+declare global {
+    interface HTMLElementTagNameMap {
+        "ak-dual-select-dynamic-selected": AkDualSelectDynamic;
+    }
+}