[Refactor] ui_configs: rename the keys.

src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/TranslatorSelectorOpenButton.jsx

@@ -13,11 +13,11 @@ export const TranslatorSelectorOpenButton = () => {
         currentSelectedTranslationEngines,
     } = useLanguageSettings();
 
-    const selected_translator_name = (currentTranslationEngines.state === "pending")
+    const selected_label = (currentTranslationEngines.state === "pending")
     ? "Loading..."
     : currentTranslationEngines.data.find(
-        translator_data => translator_data.translator_id === currentSelectedTranslationEngines.data[currentSelectedPresetTabNumber.data]
-    )?.translator_name;
+        translator_data => translator_data.id === currentSelectedTranslationEngines.data[currentSelectedPresetTabNumber.data]
+    )?.label;
 
 
     const { currentIsOpenedTranslatorSelector, updateIsOpenedTranslatorSelector} = useStore_IsOpenedTranslatorSelector();
@@ -30,11 +30,11 @@ export const TranslatorSelectorOpenButton = () => {
         <div className={styles.container}>
             <div className={styles.translator_selector_button} onClick={openTranslatorSelector}>
                 <p className={styles.label}>{t("main_page.translator")}: </p>
-                <p className={styles.label}>{selected_translator_name}</p>
+                <p className={styles.label}>{selected_label}</p>
             </div>
             {currentIsOpenedTranslatorSelector.data &&
                 <TranslatorSelector
-                    selected_translator_id={currentSelectedTranslationEngines}
+                    selected_id={currentSelectedTranslationEngines}
                     translation_engines={currentTranslationEngines}
                 />
             }

src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/translator_selector/TranslatorSelector.jsx

@@ -5,7 +5,7 @@ import { chunkArray } from "@utils/chunkArray";
 import { useStore_IsOpenedTranslatorSelector } from "@store";
 import { useLanguageSettings } from "@logics_main";
 
-export const TranslatorSelector = ({selected_translator_id, translation_engines}) => {
+export const TranslatorSelector = ({selected_id, translation_engines}) => {
     const columns = (translation_engines.data !== undefined) ? chunkArray(translation_engines.data, 2) : [];
 
     return (
@@ -13,13 +13,13 @@ export const TranslatorSelector = ({selected_translator_id, translation_engines}
             <div className={styles.wrapper}>
                 {columns.map((column, column_index) => (
                     <div className={styles.column_wrapper} key={`column_${column_index}`}>
-                        {column.map(({ translator_id, translator_name, is_available }) => (
+                        {column.map(({ id, label, is_available }) => (
                             <TranslatorBox
-                                key={translator_id}
-                                translator_id={translator_id}
-                                translator_name={translator_name}
+                                key={id}
+                                id={id}
+                                label={label}
                                 is_available={is_available}
-                                is_selected={(translator_id === selected_translator_id)}
+                                is_selected={(id === selected_id)}
                             />
                         ))}
                     </div>
@@ -35,17 +35,17 @@ const TranslatorBox = (props) => {
 
     const box_class_name = clsx(
         styles.box,
-        { [styles["is_selected"]]: (currentSelectedTranslationEngines.data[currentSelectedPresetTabNumber.data] === props.translator_id) ? true : false },
+        { [styles["is_selected"]]: (currentSelectedTranslationEngines.data[currentSelectedPresetTabNumber.data] === props.id) ? true : false },
         { [styles["is_available"]]: (props.is_available === true) ? true : false }
     );
 
     const selectTranslator = () => {
-        setSelectedTranslationEngines(props.translator_id);
+        setSelectedTranslationEngines(props.id);
         updateIsOpenedTranslatorSelector(false);
     };
     return (
         <div className={box_class_name} onClick={selectTranslator}>
-            <p className={styles.translator_name}>{props.translator_name}</p>
+            <p className={styles.translator_name}>{props.label}</p>
         </div>
     );
 };

src-ui/logics/useReceiveRoutes.js

@@ -177,7 +177,7 @@ export const useReceiveRoutes = () => {
             const updateTranslatorAvailability = (keys) => {
                 return translator_status.map(translator => ({
                     ...translator,
-                    is_available: keys.includes(translator.translator_id),
+                    is_available: keys.includes(translator.id),
                 }));
             };
             const updated_list = updateTranslatorAvailability(payload);
@@ -187,7 +187,7 @@ export const useReceiveRoutes = () => {
             const updateTranslatorAvailability = (keys) => {
                 return translator_status.map(translator => ({
                     ...translator,
-                    is_available: keys.includes(translator.translator_id),
+                    is_available: keys.includes(translator.id),
                 }));
             };
             const updated_list = updateTranslatorAvailability(payload);

src-ui/ui_configs.js

@@ -1,12 +1,3 @@
-export const translator_status = [
-    { translator_id: "DeepL", translator_name: "DeepL", is_available: false },
-    { translator_id: "DeepL_API", translator_name: `DeepL\nAPI`, is_available: false },
-    { translator_id: "Google", translator_name: "Google", is_available: false },
-    { translator_id: "Bing", translator_name: "Bing", is_available: false },
-    { translator_id: "Papago", translator_name: "Papago", is_available: false },
-    { translator_id: "CTranslate2", translator_name: `Internal\n(Default)`, is_available: false },
-];
-
 export const ui_configs = {
     mic_threshold_min: 0,
     mic_threshold_max: 2000,
@@ -20,6 +11,15 @@ export const ui_configs = {
     ]
 };
 
+export const translator_status = [
+    { id: "DeepL", label: "DeepL", is_available: false },
+    { id: "DeepL_API", label: `DeepL\nAPI`, is_available: false },
+    { id: "Google", label: "Google", is_available: false },
+    { id: "Bing", label: "Bing", is_available: false },
+    { id: "Papago", label: "Papago", is_available: false },
+    { id: "CTranslate2", label: `Internal\n(Default)`, is_available: false },
+];
+
 export const ctranslate2_weight_type_status = [
     { id: "small", label: "small", is_downloaded: false, progress: null },
     { id: "large", label: "large", is_downloaded: false, progress: null },