Applied the select fix to all things runner 🏃‍♀️🏃‍♂️

ref #98

src/components/runners/RunnerDetail.svelte

@@ -19,6 +19,7 @@
   $: original_data_pdf = {};
   $: original_data = {};
   $: editable = {};
+  $: group = {}
   $: changes_performed = !lodashIsEqual(original_data, editable);
   $: isEmailValid =
     (editable.email || "") === "" ||
@@ -26,7 +27,11 @@
   $: isFirstnameValid = editable.firstname !== "";
   $: isLastnameValid = editable.lastname !== "";
   $: save_enabled =
-    changes_performed && isFirstnameValid && isLastnameValid && isEmailValid && (editable.group != null);
+    changes_performed &&
+    isFirstnameValid &&
+    isLastnameValid &&
+    isEmailValid &&
+    editable.group != null;
   runner_promise.then((data) => {
     data_loaded = true;
     original_data_pdf = Object.assign(original_data_pdf, data);
@@ -41,13 +46,19 @@
       sponsoring_contracts_download_open = false;
     }
   });
-  let orgs = [];
+  let groups = [];
   RunnerOrganizationService.runnerOrganizationControllerGetAll().then((val) => {
-    orgs = val;
-  });
-  let teams = [];
-  RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
-    teams = val;
+    const orgs = val.map((r) => {
+      return { label: r.name, value: r };
+    });
+    groups = groups.concat(orgs);
+    RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
+      const teams = val.map((r) => {
+        return { label: `${r.parentGroup.name} > ${r.name}`, value: r };
+      });
+      groups = groups.concat(teams);
+      group = groups.find(g => g.value.id == editable.group.id)
+    });
   });
   function submit() {
     if (data_loaded === true && save_enabled) {
@@ -363,28 +374,17 @@
       <span class="font-medium text-gray-700">{$_('group')}</span>
       <Select
         containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
-        getSelectionLabel={(option) => {
-          if (option.responseType == 'RUNNERORGANIZATION') {
-            return option.name;
-          }
-          return `${option.parentGroup.name} &gt; ${option.name}`;
-        }}
-        getOptionLabel={(option) => {
-          if (option.responseType == 'RUNNERORGANIZATION') {
-            return option.name;
-          }
-          return `${option.parentGroup.name} &gt; ${option.name}`;
-        }}
         itemFilter={(label, filterText, option) => label
             .toLowerCase()
             .includes(
               filterText.toLowerCase()
-            ) || option.id.toString().startsWith(filterText.toLowerCase())}
-        items={orgs.concat(orgs, teams)}
+            ) || option.id.value.toString().startsWith(filterText.toLowerCase())}
+        items={groups}
         showChevron={true}
         placeholder={$_('search-for-an-organization-or-team-by-name-or-id')}
         noOptionsMessage={$_('no-organization-or-team-found')}
-        bind:selectedValue={editable.group}
+        bind:selectedValue={group}
+        on:select={(selectedValue) => {editable.group = selectedValue.detail.value}}
         on:clear={() => (editable.group = null)} />
     </div>
     <div class="text-sm w-full">