handle "name_for_dropdown" natural+lexographical backend sort

fakeyou/src/v2/api/category/ListTtsCategories.ts

@@ -15,7 +15,7 @@ export interface TtsCategory {
   can_only_mods_apply: boolean,
 
   name: string,
-  maybe_dropdown_name?: string,
+  name_for_dropdown: string,
 
   is_mod_approved?: boolean,
 

fakeyou/src/v2/view/_common/CategoryBreadcrumb.tsx

@@ -5,11 +5,16 @@ import { Link } from 'react-router-dom';
 import { FrontendUrlConfig } from '../../../common/FrontendUrlConfig';
 import { TtsCategory } from '../../api/category/ListTtsCategories';
 import { TtsModelCategory } from '../../api/category/ListTtsCategoriesForModel';
+import { ModerationTtsCategory } from '../../api/moderation/category/ListTtsCategoriesForModeration';
+
+interface CategoryLike {
+
+}
 
 export interface Props {
   // This is a list of categories in order: [grandparent/root, parent, child/leaf]
   // Note: The two possible types differ in their timestamp names.
-  categoryHierarchy: (TtsCategory|TtsModelCategory)[]
+  categoryHierarchy: (TtsCategory|TtsModelCategory|ModerationTtsCategory)[]
 
   // Whether we're rendering for a moderator
   isCategoryMod: boolean,

fakeyou/src/v2/view/tts/tts_model_list/MultiDropdownSearch.tsx

@@ -157,7 +157,7 @@ export function MultiDropdownSearch(props: Props) {
         <option
           key={`option-${i}-${category.category_token}`}
           value={category.category_token}>
-          {category.name}
+          {category.name_for_dropdown}
         </option>
       )
     })

fakeyou/src/v2/view/tts/tts_model_list/TtsModelListFc.tsx

@@ -198,19 +198,13 @@ function TtsModelListFc(props: Props) {
   let categoryList : JSX.Element[] = [];
 
   props.allTtsCategories.forEach(ttsCategory => {
-    let categoryName = !!ttsCategory.maybe_dropdown_name ? ttsCategory.maybe_dropdown_name : ttsCategory.name;
-
     let option = (
       <option 
         key={ttsCategory.category_token} 
         value={ttsCategory.category_token} 
-        >{categoryName}</option>
+        >{ttsCategory.name_for_dropdown}</option>
     );
 
-    //if (defaultSelectValue === '') {
-    //  defaultSelectValue = m.model_token;
-    //}
-
     categoryList.push(option);
   });