From 18672d6dd1cffdf68a47b9c21e26d9572a0b0cc1 Mon Sep 17 00:00:00 2001
From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com>
Date: Tue, 3 Sep 2024 11:15:34 +0900
Subject: [PATCH] [bugfix/Refactor] Config Page: Device Tab. Fix render error
 when open config page before preparing backend. And remove the code that is
 no longer in use.

---
 .../components/dropdown_menu/DropdownMenu.jsx     | 15 +--------------
 .../setting_section/setting_box/device/Device.jsx |  6 ++++--
 src-ui/store.js                                   |  1 -
 3 files changed, 5 insertions(+), 17 deletions(-)

diff --git a/src-ui/app/config_page/setting_section/setting_box/components/dropdown_menu/DropdownMenu.jsx b/src-ui/app/config_page/setting_section/setting_box/components/dropdown_menu/DropdownMenu.jsx
index 1fd8e76a..8e34ffad 100644
--- a/src-ui/app/config_page/setting_section/setting_box/components/dropdown_menu/DropdownMenu.jsx
+++ b/src-ui/app/config_page/setting_section/setting_box/components/dropdown_menu/DropdownMenu.jsx
@@ -2,27 +2,15 @@ import styles from "./DropdownMenu.module.scss";
 import clsx from "clsx";
 import ArrowLeftSvg from "@images/arrow_left.svg?react";
 import { useIsOpenedDropdownMenu } from "@store";
-import { useConfig } from "@logics/useConfig";
 
 export const DropdownMenu = (props) => {
     const { updateIsOpenedDropdownMenu, currentIsOpenedDropdownMenu } = useIsOpenedDropdownMenu();
-    const { getMicHostList, getMicDeviceList } = useConfig();
 
     const toggleDropdownMenu = () => {
         if (currentIsOpenedDropdownMenu === props.dropdown_id) {
             updateIsOpenedDropdownMenu("");
         } else {
-            switch (props.dropdown_id) {
-                case "mic_host":
-                    getMicHostList();
-                    break;
-                case "mic_device":
-                    getMicDeviceList();
-                    break;
-
-                default:
-                    break;
-            }
+            if (props.openListFunction !== undefined) props.openListFunction();
             updateIsOpenedDropdownMenu(props.dropdown_id);
         }
     };
@@ -50,7 +38,6 @@ export const DropdownMenu = (props) => {
     const getSelectedText = () => {
         if (props.state !== "hasData") return;
         return props.selected_id;
-        // return (props.list[props.selected_id]) ? props.list[props.selected_id] : "Nothing selected";
     };
     const list = (props.list === undefined) ? {} : props.list;
 
diff --git a/src-ui/app/config_page/setting_section/setting_box/device/Device.jsx b/src-ui/app/config_page/setting_section/setting_box/device/Device.jsx
index 76d8ce06..626078bc 100644
--- a/src-ui/app/config_page/setting_section/setting_box/device/Device.jsx
+++ b/src-ui/app/config_page/setting_section/setting_box/device/Device.jsx
@@ -1,6 +1,4 @@
 import { useTranslation } from "react-i18next";
-import FolderOpenSvg from "@images/folder_open.svg?react";
-
 import { useSettingBox } from "../components/useSettingBox";
 import {
     useMicHostList,
@@ -28,6 +26,8 @@ export const Device = () => {
     const {
         setSelectedMicHost,
         setSelectedMicDevice,
+        getMicHostList,
+        getMicDeviceList,
     } = useConfig();
 
     const selectFunction = (selected_data) => {
@@ -54,6 +54,7 @@ export const Device = () => {
                 selected_id={currentSelectedMicHost.data}
                 list={currentMicHostList.data}
                 selectFunction={selectFunction}
+                openListFunction={getMicHostList}
                 state={currentSelectedMicHost.state}
             />
 
@@ -63,6 +64,7 @@ export const Device = () => {
                 selected_id={currentSelectedMicDevice.data}
                 list={currentMicDeviceList.data}
                 selectFunction={selectFunction}
+                openListFunction={getMicDeviceList}
                 state={currentSelectedMicDevice.state}
             />
 {/*
diff --git a/src-ui/store.js b/src-ui/store.js
index d1f181fd..b9db8364 100644
--- a/src-ui/store.js
+++ b/src-ui/store.js
@@ -6,7 +6,6 @@ import {
 
 import {
     translator_list,
-    test_device_list,
     generateTestData,
     word_filter_list,
 } from "@data";