From 45c65627178ae06f2ef2e27d78937585ff4df9bd Mon Sep 17 00:00:00 2001 From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com> Date: Mon, 2 Sep 2024 12:27:25 +0900 Subject: [PATCH 1/5] [Update] Change the endpoint that send message from message box. --- src-ui/logics/useMessage.js | 2 +- src-ui/logics/useReceiveRoutes.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src-ui/logics/useMessage.js b/src-ui/logics/useMessage.js index 296bd1ed..8e74c081 100644 --- a/src-ui/logics/useMessage.js +++ b/src-ui/logics/useMessage.js @@ -16,7 +16,7 @@ export const useMessage = () => { id: uuid, message: encoder.encode(message), }; - asyncStdoutToPython("/controller/callback_messagebox_press_key_enter", send_message_object); + asyncStdoutToPython("/controller/callback_messagebox_send", send_message_object); addMessageLogsStatus({ id: uuid, diff --git a/src-ui/logics/useReceiveRoutes.js b/src-ui/logics/useReceiveRoutes.js index bfd33756..9b6a3394 100644 --- a/src-ui/logics/useReceiveRoutes.js +++ b/src-ui/logics/useReceiveRoutes.js @@ -29,7 +29,7 @@ export const useReceiveRoutes = () => { "/config/version": updateSoftwareVersion, - "/controller/callback_messagebox_press_key_enter": updateSentMessageLog, + "/controller/callback_messagebox_send": updateSentMessageLog, "/action/transcription_send_mic_message": addSentMessageLog, "/action/transcription_receive_speaker_message": addReceivedMessageLog }; From 6c68f3744fd4fc43ad91ce8df80ec02f384ade58 Mon Sep 17 00:00:00 2001 From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com> Date: Mon, 2 Sep 2024 12:36:37 +0900 Subject: [PATCH 2/5] [bugfix] Config Page: Fix get software version function that wasn't working because of typo. --- src-ui/app/App.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src-ui/app/App.jsx b/src-ui/app/App.jsx index 92e22258..98b35cb1 100644 --- a/src-ui/app/App.jsx +++ b/src-ui/app/App.jsx @@ -14,13 +14,13 @@ export const App = () => { const main_page = getCurrent(); const { currentIsOpenedConfigPage } = useIsOpenedConfigPage(); - const { get_software_version } = useConfig(); + const { getSoftwareVersion } = useConfig(); useEffect(() => { main_page.setDecorations(true); if (!hasRunRef.current) { asyncStartPython().then((result) => { - get_software_version(); + getSoftwareVersion(); }).catch((err) => { }); From 26691f773ff406cf5218a08673cc1aa2c88e75c8 Mon Sep 17 00:00:00 2001 From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com> Date: Mon, 2 Sep 2024 17:04:34 +0900 Subject: [PATCH 3/5] [Update] Config Page: Add Device tab. add mic host list.(not selectable yet.) --- locales/en.json | 1 + locales/ja.json | 1 + src-ui/app/App.jsx | 8 ++- .../setting_box/SettingBox.jsx | 11 ++-- .../setting_box/appearance/Appearance.jsx | 10 +-- .../components/dropdown_menu/DropdownMenu.jsx | 13 +++- .../label_component/LabelComponent.jsx | 5 +- .../components/useSettingBox.module.scss | 1 + .../setting_box/device/Device.jsx | 65 +++++++++++++++++++ .../sidebar_section/SidebarSection.jsx | 1 + src-ui/app/config_page/topbar/Topbar.jsx | 1 - src-ui/logics/useConfig.js | 28 +++++--- src-ui/logics/useReceiveRoutes.js | 5 ++ src-ui/store.js | 10 ++- src-ui/utils/arrayToObject.js | 6 ++ 15 files changed, 140 insertions(+), 26 deletions(-) create mode 100644 src-ui/app/config_page/setting_section/setting_box/device/Device.jsx create mode 100644 src-ui/utils/arrayToObject.js diff --git a/locales/en.json b/locales/en.json index 1d6cc59b..20523a0f 100644 --- a/locales/en.json +++ b/locales/en.json @@ -80,6 +80,7 @@ "invalid_value": "Invalid value." }, "side_menu_labels": { + "device": "Device", "appearance": "Appearance", "translation": "Translation", "transcription": "Transcription", diff --git a/locales/ja.json b/locales/ja.json index b98f5d06..d9bab947 100644 --- a/locales/ja.json +++ b/locales/ja.json @@ -78,6 +78,7 @@ "invalid_value": "無効な値です。" }, "side_menu_labels": { + "device": "デバイス", "appearance": "デザイン", "translation": "翻訳", "transcription": "音声認識", diff --git a/src-ui/app/App.jsx b/src-ui/app/App.jsx index 98b35cb1..fce5a72f 100644 --- a/src-ui/app/App.jsx +++ b/src-ui/app/App.jsx @@ -14,13 +14,19 @@ export const App = () => { const main_page = getCurrent(); const { currentIsOpenedConfigPage } = useIsOpenedConfigPage(); - const { getSoftwareVersion } = useConfig(); + const { + getSoftwareVersion, + getMicHostList, + getSelectedMicHost, + } = useConfig(); useEffect(() => { main_page.setDecorations(true); if (!hasRunRef.current) { asyncStartPython().then((result) => { getSoftwareVersion(); + getMicHostList(); + getSelectedMicHost(); }).catch((err) => { }); diff --git a/src-ui/app/config_page/setting_section/setting_box/SettingBox.jsx b/src-ui/app/config_page/setting_section/setting_box/SettingBox.jsx index 6a0fe095..a38b4f1e 100644 --- a/src-ui/app/config_page/setting_section/setting_box/SettingBox.jsx +++ b/src-ui/app/config_page/setting_section/setting_box/SettingBox.jsx @@ -1,15 +1,18 @@ import { useSelectedConfigTabId } from "@store"; +import { Device } from "./device/Device"; import { Appearance } from "./appearance/Appearance"; import { AboutVrct } from "./about_vrct/AboutVrct"; export const SettingBox = () => { const { currentSelectedConfigTabId } = useSelectedConfigTabId(); switch (currentSelectedConfigTabId) { - case "appearance": - return ; - case "about_vrct": - return ; + case "device": + return ; + // case "appearance": + // return ; + // case "about_vrct": + // return ; default: return null; diff --git a/src-ui/app/config_page/setting_section/setting_box/appearance/Appearance.jsx b/src-ui/app/config_page/setting_section/setting_box/appearance/Appearance.jsx index f15b05fb..fe89e3c6 100644 --- a/src-ui/app/config_page/setting_section/setting_box/appearance/Appearance.jsx +++ b/src-ui/app/config_page/setting_section/setting_box/appearance/Appearance.jsx @@ -2,11 +2,11 @@ import { useTranslation } from "react-i18next"; import FolderOpenSvg from "@images/folder_open.svg?react"; import { useSettingBox } from "../components/useSettingBox"; -import { useSelectedMicDeviceStatus, useMicDeviceListStatus } from "@store"; +import { useSelectedMicDevice, useMicDeviceList } from "@store"; export const Appearance = () => { const { t } = useTranslation(); - const { currentSelectedMicDeviceStatus, updateSelectedMicDeviceStatus } = useSelectedMicDeviceStatus(); - const { currentMicDeviceListStatus } = useMicDeviceListStatus(); + const { currentSelectedMicDevice, updateSelectedMicDevice } = useSelectedMicDevice(); + const { currentMicDeviceList } = useMicDeviceList(); const { DropdownMenuContainer, SliderContainer, @@ -29,13 +29,13 @@ export const Appearance = () => { }, 3000); }); }; - updateSelectedMicDeviceStatus(asyncFunction); + updateSelectedMicDevice(asyncFunction); }; return ( <> - + 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 6cc32ff7..c91d2620 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 @@ -35,12 +35,18 @@ export const DropdownMenu = (props) => { [styles["is_opened"]]: (currentIsOpenedDropdownMenu === props.dropdown_id) ? true : false }); + const getSelectedText = () => { + if (props.state !== "hasData") return; + return (props.list[props.selected_id]) ? props.list[props.selected_id] : "Nothing selected"; + }; + + return (
{(props.state === "loading") ?

Loading...

- :

{props.list[props.selected_id]}

+ :

{getSelectedText()}

} {(props.state === "loading") ? @@ -49,14 +55,15 @@ export const DropdownMenu = (props) => {
- { - Object.entries(props.list).map(([key, value]) => { + {(props.state === "hasData") + ? Object.entries(props.list).map(([key, value]) => { return (
selectValue(key)}>

{value}

); }) + : null }
diff --git a/src-ui/app/config_page/setting_section/setting_box/components/label_component/LabelComponent.jsx b/src-ui/app/config_page/setting_section/setting_box/components/label_component/LabelComponent.jsx index 8fea9a02..a4a520db 100644 --- a/src-ui/app/config_page/setting_section/setting_box/components/label_component/LabelComponent.jsx +++ b/src-ui/app/config_page/setting_section/setting_box/components/label_component/LabelComponent.jsx @@ -4,7 +4,10 @@ export const LabelComponent = (props) => { return (

{props.label}

-

{props.desc}

+ {props.desc + ?

{props.desc}

+ : null + }
); }; \ No newline at end of file diff --git a/src-ui/app/config_page/setting_section/setting_box/components/useSettingBox.module.scss b/src-ui/app/config_page/setting_section/setting_box/components/useSettingBox.module.scss index d3fe8462..6740a057 100644 --- a/src-ui/app/config_page/setting_section/setting_box/components/useSettingBox.module.scss +++ b/src-ui/app/config_page/setting_section/setting_box/components/useSettingBox.module.scss @@ -26,6 +26,7 @@ align-items: center; gap: 2rem; padding: 2rem; + border-bottom: solid 0.1rem var(--dark_800_color); } .threshold_switch_section { 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 new file mode 100644 index 00000000..10952f26 --- /dev/null +++ b/src-ui/app/config_page/setting_section/setting_box/device/Device.jsx @@ -0,0 +1,65 @@ +import { useTranslation } from "react-i18next"; +import FolderOpenSvg from "@images/folder_open.svg?react"; + +import { useSettingBox } from "../components/useSettingBox"; +import { + useMicHostList, + useSelectedMicHost, + useSelectedMicDevice, + useMicDeviceList, +} from "@store"; + +export const Device = () => { + const { t } = useTranslation(); + const { + DropdownMenuContainer, + ThresholdContainer, + } = useSettingBox(); + + + const { currentMicHostList, updateMicHostList } = useMicHostList(); + const { currentSelectedMicHost, updateSelectedMicHost } = useSelectedMicHost(); + + const { currentMicDeviceList } = useMicDeviceList(); + const { currentSelectedMicDevice, updateSelectedMicDevice } = useSelectedMicDevice(); + + const selectFunction = (selected_data) => { + switch (selected_data.dropdown_id) { + case "mic_host": + + break; + + default: + break; + } + }; + + + return ( + <> + + {/* */} +{/* + + + + + + */} + + ); +}; \ No newline at end of file diff --git a/src-ui/app/config_page/sidebar_section/SidebarSection.jsx b/src-ui/app/config_page/sidebar_section/SidebarSection.jsx index 9891bb75..e227989e 100644 --- a/src-ui/app/config_page/sidebar_section/SidebarSection.jsx +++ b/src-ui/app/config_page/sidebar_section/SidebarSection.jsx @@ -4,6 +4,7 @@ export const SidebarSection = () => { return (
+ diff --git a/src-ui/app/config_page/topbar/Topbar.jsx b/src-ui/app/config_page/topbar/Topbar.jsx index 716ba49d..b9f88ebe 100644 --- a/src-ui/app/config_page/topbar/Topbar.jsx +++ b/src-ui/app/config_page/topbar/Topbar.jsx @@ -12,7 +12,6 @@ export const Topbar = () => { const { currentIsOpenedConfigPage, updateIsOpenedConfigPage } = useIsOpenedConfigPage(); const closeConfigPage = () => { updateIsOpenedConfigPage(false); - }; return ( diff --git a/src-ui/logics/useConfig.js b/src-ui/logics/useConfig.js index 43ad4aea..05d71086 100644 --- a/src-ui/logics/useConfig.js +++ b/src-ui/logics/useConfig.js @@ -1,22 +1,34 @@ import { useSoftwareVersion, + useMicHostList, + useSelectedMicHost, } from "@store"; import { useStdoutToPython } from "./useStdoutToPython"; -export const useConfig = () => { - const { - updateSoftwareVersion, - } = useSoftwareVersion(); +import { arrayToObject } from "@utils/arrayToObject"; +export const useConfig = () => { const { asyncStdoutToPython } = useStdoutToPython(); + const { updateSoftwareVersion } = useSoftwareVersion(); + const { updateMicHostList } = useMicHostList(); + const { updateSelectedMicHost } = useSelectedMicHost(); + + return { - getSoftwareVersion: () => { - asyncStdoutToPython("/config/version"); + getSoftwareVersion: () => asyncStdoutToPython("/config/version"), + updateSoftwareVersion: (payload) => updateSoftwareVersion(payload.data), + + getMicHostList: () => asyncStdoutToPython("/controller/list_mic_host"), + updateMicHostList: (payload) => { + updateMicHostList(arrayToObject(payload.data)); }, - updateSoftwareVersion: (payload) => { - updateSoftwareVersion(payload.data); + getSelectedMicHost: () => asyncStdoutToPython("/config/choice_mic_host"), + updateSelectedMicHost: (payload) => { + updateSelectedMicHost(payload.data); }, + + }; }; \ No newline at end of file diff --git a/src-ui/logics/useReceiveRoutes.js b/src-ui/logics/useReceiveRoutes.js index 9b6a3394..28e9c014 100644 --- a/src-ui/logics/useReceiveRoutes.js +++ b/src-ui/logics/useReceiveRoutes.js @@ -17,6 +17,8 @@ export const useReceiveRoutes = () => { const { updateSoftwareVersion, + updateMicHostList, + updateSelectedMicHost, } = useConfig(); const routes = { @@ -28,6 +30,9 @@ export const useReceiveRoutes = () => { "/controller/callback_disable_transcription_receive": updateTranscriptionReceiveStatus, "/config/version": updateSoftwareVersion, + "/controller/list_mic_host": updateMicHostList, + "/config/choice_mic_host": updateSelectedMicHost, + "/controller/callback_messagebox_send": updateSentMessageLog, "/action/transcription_send_mic_message": addSentMessageLog, diff --git a/src-ui/store.js b/src-ui/store.js index a4571eca..196c3a57 100644 --- a/src-ui/store.js +++ b/src-ui/store.js @@ -112,12 +112,16 @@ export const { atomInstance: Atom_IsOpenedLanguageSelector, useHook: useIsOpened export const { atomInstance: Atom_SelectedPresetTabStatus, useHook: useSelectedPresetTabStatus } = createAtomWithHook(1, "SelectedPresetTabStatus"); export const { atomInstance: Atom_IsOpenedConfigPage, useHook: useIsOpenedConfigPage } = createAtomWithHook(false, "IsOpenedConfigPage"); -export const { atomInstance: Atom_SelectedConfigTabId, useHook: useSelectedConfigTabId } = createAtomWithHook("appearance", "SelectedConfigTabId"); +export const { atomInstance: Atom_SelectedConfigTabId, useHook: useSelectedConfigTabId } = createAtomWithHook("device", "SelectedConfigTabId"); export const { atomInstance: Atom_IsOpenedDropdownMenu, useHook: useIsOpenedDropdownMenu } = createAtomWithHook("", "IsOpenedDropdownMenu"); -export const { atomInstance: Atom_SelectedMicDeviceStatus, useHook: useSelectedMicDeviceStatus } = createAsyncAtomWithHook("device b", "SelectedMicDeviceStatus"); -export const { atomInstance: Atom_MicDeviceListStatus, useHook: useMicDeviceListStatus } = createAtomWithHook(test_device_list, "MicDeviceListStatus"); +// Config Page +export const { atomInstance: Atom_MicHostList, useHook: useMicHostList } = createAsyncAtomWithHook([], "MicHostList"); +export const { atomInstance: Atom_SelectedMicHost, useHook: useSelectedMicHost } = createAsyncAtomWithHook("Nothing Selected", "SelectedMicHost"); +export const { atomInstance: Atom_MicDeviceList, useHook: useMicDeviceList } = createAsyncAtomWithHook(test_device_list, "MicDeviceList"); +export const { atomInstance: Atom_SelectedMicDevice, useHook: useSelectedMicDevice } = createAsyncAtomWithHook("device b", "SelectedMicDevice"); + export const { atomInstance: Atom_SendMessageFormat, useHook: useSendMessageFormat } = createAtomWithHook({ before: "", diff --git a/src-ui/utils/arrayToObject.js b/src-ui/utils/arrayToObject.js new file mode 100644 index 00000000..69e7b597 --- /dev/null +++ b/src-ui/utils/arrayToObject.js @@ -0,0 +1,6 @@ +export const arrayToObject = (array) => { + return array.reduce((obj, item) => { + obj[item] = item; + return obj; + }, {}); +}; \ No newline at end of file From bf21a2031530c09552415ac6cdcb346de408bff0 Mon Sep 17 00:00:00 2001 From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com> Date: Mon, 2 Sep 2024 17:25:43 +0900 Subject: [PATCH 4/5] [Update] Config Page: Device tab. add mic device list.(not selectable yet.) --- src-ui/app/App.jsx | 6 +++++- .../setting_section/setting_box/device/Device.jsx | 9 +++++++-- src-ui/logics/useConfig.js | 13 +++++++++++++ src-ui/logics/useReceiveRoutes.js | 5 ++++- src-ui/store.js | 4 ++-- 5 files changed, 31 insertions(+), 6 deletions(-) diff --git a/src-ui/app/App.jsx b/src-ui/app/App.jsx index fce5a72f..3d69130c 100644 --- a/src-ui/app/App.jsx +++ b/src-ui/app/App.jsx @@ -18,6 +18,8 @@ export const App = () => { getSoftwareVersion, getMicHostList, getSelectedMicHost, + getMicDeviceList, + getSelectedMicDevice, } = useConfig(); useEffect(() => { @@ -27,8 +29,10 @@ export const App = () => { getSoftwareVersion(); getMicHostList(); getSelectedMicHost(); + getMicDeviceList(); + getSelectedMicDevice(); }).catch((err) => { - + console.error(err); }); } return () => hasRunRef.current = true; 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 10952f26..8babb5be 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 @@ -29,6 +29,10 @@ export const Device = () => { break; + case "mic_device": + + break; + default: break; } @@ -45,14 +49,15 @@ export const Device = () => { selectFunction={selectFunction} state={currentSelectedMicHost.state} /> - {/* */} + /> {/* diff --git a/src-ui/logics/useConfig.js b/src-ui/logics/useConfig.js index 05d71086..a8bb611b 100644 --- a/src-ui/logics/useConfig.js +++ b/src-ui/logics/useConfig.js @@ -2,6 +2,8 @@ import { useSoftwareVersion, useMicHostList, useSelectedMicHost, + useMicDeviceList, + useSelectedMicDevice, } from "@store"; import { useStdoutToPython } from "./useStdoutToPython"; @@ -14,6 +16,8 @@ export const useConfig = () => { const { updateSoftwareVersion } = useSoftwareVersion(); const { updateMicHostList } = useMicHostList(); const { updateSelectedMicHost } = useSelectedMicHost(); + const { updateMicDeviceList } = useMicDeviceList(); + const { updateSelectedMicDevice } = useSelectedMicDevice(); return { @@ -29,6 +33,15 @@ export const useConfig = () => { updateSelectedMicHost(payload.data); }, + getMicDeviceList: () => asyncStdoutToPython("/controller/list_mic_device"), + updateMicDeviceList: (payload) => { + updateMicDeviceList(arrayToObject(payload.data)); + }, + getSelectedMicDevice: () => asyncStdoutToPython("/config/choice_mic_device"), + updateSelectedMicDevice: (payload) => { + updateSelectedMicDevice(payload.data); + }, + }; }; \ No newline at end of file diff --git a/src-ui/logics/useReceiveRoutes.js b/src-ui/logics/useReceiveRoutes.js index 28e9c014..cd3e6c6b 100644 --- a/src-ui/logics/useReceiveRoutes.js +++ b/src-ui/logics/useReceiveRoutes.js @@ -19,6 +19,8 @@ export const useReceiveRoutes = () => { updateSoftwareVersion, updateMicHostList, updateSelectedMicHost, + updateMicDeviceList, + updateSelectedMicDevice, } = useConfig(); const routes = { @@ -32,7 +34,8 @@ export const useReceiveRoutes = () => { "/config/version": updateSoftwareVersion, "/controller/list_mic_host": updateMicHostList, "/config/choice_mic_host": updateSelectedMicHost, - + "/controller/list_mic_device": updateMicDeviceList, + "/config/choice_mic_device": updateSelectedMicDevice, "/controller/callback_messagebox_send": updateSentMessageLog, "/action/transcription_send_mic_message": addSentMessageLog, diff --git a/src-ui/store.js b/src-ui/store.js index 196c3a57..6472140d 100644 --- a/src-ui/store.js +++ b/src-ui/store.js @@ -119,8 +119,8 @@ export const { atomInstance: Atom_IsOpenedDropdownMenu, useHook: useIsOpenedDrop // Config Page export const { atomInstance: Atom_MicHostList, useHook: useMicHostList } = createAsyncAtomWithHook([], "MicHostList"); export const { atomInstance: Atom_SelectedMicHost, useHook: useSelectedMicHost } = createAsyncAtomWithHook("Nothing Selected", "SelectedMicHost"); -export const { atomInstance: Atom_MicDeviceList, useHook: useMicDeviceList } = createAsyncAtomWithHook(test_device_list, "MicDeviceList"); -export const { atomInstance: Atom_SelectedMicDevice, useHook: useSelectedMicDevice } = createAsyncAtomWithHook("device b", "SelectedMicDevice"); +export const { atomInstance: Atom_MicDeviceList, useHook: useMicDeviceList } = createAsyncAtomWithHook([], "MicDeviceList"); +export const { atomInstance: Atom_SelectedMicDevice, useHook: useSelectedMicDevice } = createAsyncAtomWithHook("Nothing Selected", "SelectedMicDevice"); export const { atomInstance: Atom_SendMessageFormat, useHook: useSendMessageFormat } = createAtomWithHook({ From 87cda49994eec2e482e51742f392baccf41100b5 Mon Sep 17 00:00:00 2001 From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com> Date: Tue, 3 Sep 2024 08:59:38 +0900 Subject: [PATCH 5/5] [Update] Config Page: Device Tab. To be selectable mic host and device. --- .../components/dropdown_menu/DropdownMenu.jsx | 3 ++- .../setting_box/device/Device.jsx | 17 ++++++++++++----- src-ui/logics/useConfig.js | 11 +++++++++++ src-ui/logics/useReceiveRoutes.js | 3 +++ 4 files changed, 28 insertions(+), 6 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 c91d2620..83f56506 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 @@ -37,7 +37,8 @@ export const DropdownMenu = (props) => { const getSelectedText = () => { if (props.state !== "hasData") return; - return (props.list[props.selected_id]) ? props.list[props.selected_id] : "Nothing selected"; + return props.selected_id; + // return (props.list[props.selected_id]) ? props.list[props.selected_id] : "Nothing selected"; }; 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 8babb5be..76d8ce06 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 @@ -9,6 +9,8 @@ import { useMicDeviceList, } from "@store"; +import { useConfig } from "@logics/useConfig"; + export const Device = () => { const { t } = useTranslation(); const { @@ -17,20 +19,25 @@ export const Device = () => { } = useSettingBox(); - const { currentMicHostList, updateMicHostList } = useMicHostList(); - const { currentSelectedMicHost, updateSelectedMicHost } = useSelectedMicHost(); + const { currentMicHostList } = useMicHostList(); + const { currentSelectedMicHost } = useSelectedMicHost(); const { currentMicDeviceList } = useMicDeviceList(); - const { currentSelectedMicDevice, updateSelectedMicDevice } = useSelectedMicDevice(); + const { currentSelectedMicDevice } = useSelectedMicDevice(); + + const { + setSelectedMicHost, + setSelectedMicDevice, + } = useConfig(); const selectFunction = (selected_data) => { switch (selected_data.dropdown_id) { case "mic_host": - + setSelectedMicHost(selected_data.selected_id); break; case "mic_device": - + setSelectedMicDevice(selected_data.selected_id); break; default: diff --git a/src-ui/logics/useConfig.js b/src-ui/logics/useConfig.js index a8bb611b..fc6d4ef5 100644 --- a/src-ui/logics/useConfig.js +++ b/src-ui/logics/useConfig.js @@ -32,6 +32,9 @@ export const useConfig = () => { updateSelectedMicHost: (payload) => { updateSelectedMicHost(payload.data); }, + setSelectedMicHost: (selected_mic_host) => { + asyncStdoutToPython("/controller/callback_set_mic_host", selected_mic_host); + }, getMicDeviceList: () => asyncStdoutToPython("/controller/list_mic_device"), updateMicDeviceList: (payload) => { @@ -41,6 +44,14 @@ export const useConfig = () => { updateSelectedMicDevice: (payload) => { updateSelectedMicDevice(payload.data); }, + setSelectedMicDevice: (selected_mic_device) => { + asyncStdoutToPython("/controller/callback_set_mic_device", selected_mic_device); + }, + + updateMicHostAndDevice: (payload) => { + updateSelectedMicHost(payload.data.host); + updateSelectedMicDevice(payload.data.device); + }, }; diff --git a/src-ui/logics/useReceiveRoutes.js b/src-ui/logics/useReceiveRoutes.js index cd3e6c6b..0e481ae3 100644 --- a/src-ui/logics/useReceiveRoutes.js +++ b/src-ui/logics/useReceiveRoutes.js @@ -21,6 +21,7 @@ export const useReceiveRoutes = () => { updateSelectedMicHost, updateMicDeviceList, updateSelectedMicDevice, + updateMicHostAndDevice, } = useConfig(); const routes = { @@ -36,6 +37,8 @@ export const useReceiveRoutes = () => { "/config/choice_mic_host": updateSelectedMicHost, "/controller/list_mic_device": updateMicDeviceList, "/config/choice_mic_device": updateSelectedMicDevice, + "/controller/callback_set_mic_host": updateMicHostAndDevice, + "/controller/callback_set_mic_device": updateSelectedMicDevice, "/controller/callback_messagebox_send": updateSentMessageLog, "/action/transcription_send_mic_message": addSentMessageLog,