chore(webui): use select for "supported syndicate"

static/webui/index.html

@@ -645,7 +645,7 @@
                                 <form class="mt-2" onsubmit="doChangeSupportedSyndicate(); return false;">
                                     <label class="form-label" for="changeSyndicate" data-loc="cheats_changeSupportedSyndicate"></label>
                                     <div class="input-group">
-                                        <input class="form-control" id="changeSyndicate" list="datalist-Syndicates" />
+                                        <select class="form-control" id="changeSyndicate"></select>
                                         <button class="btn btn-primary" type="submit" data-loc="cheats_changeButton"></button>
                                     </div>
                                 </form>
@@ -672,7 +672,6 @@
     <datalist id="datalist-SentinelWeapons"></datalist>
     <datalist id="datalist-Sentinels"></datalist>
     <datalist id="datalist-MechSuits"></datalist>
-    <datalist id="datalist-Syndicates"></datalist>
     <datalist id="datalist-MoaPets"></datalist>
     <datalist id="datalist-QuestKeys"></datalist>
     <datalist id="datalist-miscitems"></datalist>

static/webui/script.js

@@ -178,9 +178,9 @@ function fetchItemList() {
             });
 
             const syndicateNone = document.createElement("option");
-            syndicateNone.setAttribute("data-key", "");
-            syndicateNone.value = loc("cheats_none");
-            document.getElementById("datalist-Syndicates").appendChild(syndicateNone);
+            syndicateNone.textContent = loc("cheats_none");
+            document.getElementById("changeSyndicate").innerHTML = "";
+            document.getElementById("changeSyndicate").appendChild(syndicateNone);
 
             window.archonCrystalUpgrades = data.archonCrystalUpgrades;
 
@@ -264,6 +264,16 @@ function fetchItemList() {
                     });
                 } else if (type == "uniqueLevelCaps") {
                     uniqueLevelCaps = items;
+                } else if (type == "Syndicates") {
+                    items.forEach(item => {
+                        if (item.uniqueName.startsWith("RadioLegion")) {
+                            item.name += " (" + item.uniqueName + ")";
+                        }
+                        const option = document.createElement("option");
+                        option.value = item.uniqueName;
+                        option.textContent = item.name;
+                        document.getElementById("changeSyndicate").appendChild(option);
+                    });
                 } else {
                     const nameSet = new Set();
                     items.forEach(item => {
@@ -277,9 +287,6 @@ function fetchItemList() {
                                 item.name += " " + loc("code_badItem");
                             }
                         }
-                        if (type == "Syndicates" && item.uniqueName.startsWith("RadioLegion")) {
-                            item.name += " (" + item.uniqueName + ")";
-                        }
                         if (type == "ModularParts") {
                             const supportedModularParts = [
                                 "LWPT_HB_DECK",
@@ -823,10 +830,7 @@ function updateInventory() {
                     single.loadRoute("/webui/inventory");
                 }
             }
-            document.getElementById("changeSyndicate").value =
-                [...document.querySelectorAll("#datalist-Syndicates option")].find(
-                    option => option.getAttribute("data-key") === (data.SupportedSyndicate ?? "")
-                )?.value ?? loc("cheats_none");
+            document.getElementById("changeSyndicate").value = data.SupportedSyndicate ?? "";
         });
     });
 }
@@ -1506,7 +1510,7 @@ function doImport() {
 }
 
 function doChangeSupportedSyndicate() {
-    const uniqueName = getKey(document.getElementById("changeSyndicate"));
+    const uniqueName = document.getElementById("changeSyndicate").value;
 
     revalidateAuthz(() => {
         $.get("/api/setSupportedSyndicate.php?" + window.authz + "&syndicate=" + uniqueName).done(function () {