From 756cfcca4c0509ef82c418d4e1d43d9872cf681c Mon Sep 17 00:00:00 2001
From: Brandon Thomas <echelon@gmail.com>
Date: Tue, 4 Jan 2022 02:35:54 -0500
Subject: [PATCH] now it defaults to "Select.." on change !

---
 .../v2/view/tts/tts_model_list/MultiDropdownSearch.tsx | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/fakeyou/src/v2/view/tts/tts_model_list/MultiDropdownSearch.tsx b/fakeyou/src/v2/view/tts/tts_model_list/MultiDropdownSearch.tsx
index 006b52caca..e9e897a0b6 100644
--- a/fakeyou/src/v2/view/tts/tts_model_list/MultiDropdownSearch.tsx
+++ b/fakeyou/src/v2/view/tts/tts_model_list/MultiDropdownSearch.tsx
@@ -120,19 +120,22 @@ export function MultiDropdownSearch(props: Props) {
 
   let dropdowns = [];
 
+  console.log('-------render-------');
+
   for (let i = 0; i < dropdownCategories.length; i++) {
     const currentDropdownCategories = dropdownCategories[i];
 
     let maybeSelectedToken = (!!selectedCategories[i])? selectedCategories[i].category_token : undefined;
 
-    console.log('maybeSelectedToken', maybeSelectedToken, i, selectedCategories.map(c => c.category_token));
+    console.log('maybeSelectedToken', i, maybeSelectedToken, selectedCategories.map(c => c.category_token));
 
     let dropdownOptions = [];
-    dropdownOptions.push(<option value="">Select...</option>);
+    dropdownOptions.push(<option key={`option-${i}-*`} value="*">Select...</option>);
 
     currentDropdownCategories.forEach(category => {
       dropdownOptions.push(
         <option
+          key={`option-${i}-${category.category_token}`}
           value={category.category_token}>
           {category.name}
         </option>
@@ -142,8 +145,9 @@ export function MultiDropdownSearch(props: Props) {
 
     dropdowns.push(
       <select
-        value={maybeSelectedToken}
+        key={i}
         onChange={(ev) => handleChangeCategory(ev, i)}
+        defaultValue="*"
         >
         {dropdownOptions}
       </select>