every_holiday/VRCT
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[Refactor] Change state management structures. Async atom to be manage manually.

Browse Source
This commit is contained in:
Sakamoto Shiina
2024-09-23 03:44:33 +09:00
parent 586aaf0091
commit 0616092eff
49 changed files with 295 additions and 190 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src-ui/app/App.jsx
View File

@@ -124,7 +124,7 @@ const ConfigPageCloseTrigger = () => {
} = useVolume();
useEffect(() => {
if (currentIsOpenedConfigPage === false) {
if (currentIsOpenedConfigPage.data === false) {
if (currentMicThresholdCheckStatus.data === true) volumeCheckStop_Mic();
if (currentSpeakerThresholdCheckStatus.data === true) volumeCheckStop_Speaker();
}

2
src-ui/app/config_page/ConfigPage.jsx
View File

@@ -21,7 +21,7 @@ export const ConfigPage = () => {
</div>
<p className={styles.software_version}>
{
t("config_page.version", {version: currentSoftwareVersion})
t("config_page.version", {version: currentSoftwareVersion.data})
}
</p>
</div>

2
src-ui/app/config_page/setting_section/setting_box/SettingBox.jsx
View File

@@ -7,7 +7,7 @@ import { Appearance } from "./appearance/Appearance";
export const SettingBox = () => {
const { currentSelectedConfigTabId } = useStore_SelectedConfigTabId();
switch (currentSelectedConfigTabId) {
switch (currentSelectedConfigTabId.data) {
case "device":
return <Device />;
// case "others":

2
src-ui/app/config_page/setting_section/setting_box/about_vrct/AboutVrct.jsx
View File

@@ -74,7 +74,7 @@ export const AboutVrct = () => {
<img src={special_thanks_section_title} className={clsx(styles.section_title, styles.special_thanks)} />
<img src={special_thanks_members} className={styles.special_thanks_members_img} />
{
currentUiLanguage === "ja"
currentUiLanguage.data === "ja"
? <img src={special_thanks_message_ja} className={styles.special_thanks_message_img} />
: <img src={special_thanks_message_en} className={styles.special_thanks_message_img} />
}

4
src-ui/app/config_page/setting_section/setting_box/about_vrct/poster_showcase_contents/poster_showcase_worlds_contents/PosterShowcaseWorldsContents.jsx
View File

@@ -19,7 +19,7 @@ export const PosterShowcaseWorldsContents = () => {
}));
const chunked_poster_showcase_world_images = chunkArray(poster_showcase_world_images, 8);
const target_poster_showcase_world_images = chunked_poster_showcase_world_images[currentPosterShowcaseWorldPageIndex];
const target_poster_showcase_world_images = chunked_poster_showcase_world_images[currentPosterShowcaseWorldPageIndex.data];
return (
@@ -70,7 +70,7 @@ const PosterShowcaseWorldsPagination = ({ page_length }) => {
};
const getClassNames = (index, baseClass) => clsx(baseClass, {
[styles.is_active]: (currentPosterShowcaseWorldPageIndex === index),
[styles.is_active]: (currentPosterShowcaseWorldPageIndex.data === index),
});
return (

6
src-ui/app/config_page/setting_section/setting_box/about_vrct/poster_showcase_contents/posters_contents/PostersContents.jsx
View File

@@ -34,11 +34,11 @@ export const PostersContents = () => {
const updateIndex = (delta) => {
const newIndex = (currentVrctPosterIndex + delta + poster_images.length) % poster_images.length;
const newIndex = (currentVrctPosterIndex.data + delta + poster_images.length) % poster_images.length;
updateVrctPosterIndex(newIndex);
};
const current_poster = poster_images[currentVrctPosterIndex];
const current_poster = poster_images[currentVrctPosterIndex.data];
const current_poster_authors_img_ja = (current_poster.poster_type === "poster") ? poster_images_authors_ja : poster_images_authors_m_ja;
const current_poster_authors_img_en = (current_poster.poster_type === "poster") ? poster_images_authors_en : poster_images_authors_m_en;
@@ -60,7 +60,7 @@ export const PostersContents = () => {
</button>
</div>
{
currentUiLanguage === "ja"
currentUiLanguage.data === "ja"
? <img src={current_poster_authors_img_ja} className={styles.poster_authors_img} />
: <img src={current_poster_authors_img_en} className={styles.poster_authors_img} />
}

2
src-ui/app/config_page/setting_section/setting_box/appearance/Appearance.jsx
View File

@@ -101,7 +101,7 @@ const UiLanguageContainer = () => {
}
</div>
<div className={styles.ui_language_selector_container}>
{currentUiLanguage.state === "loading" && <span className={styles.loader}></span>}
{currentUiLanguage.state === "pending" && <span className={styles.loader}></span>}
{Object.entries(SELECTABLE_UI_LANGUAGES_DICT).map(([key, value]) => (
<label key={key} className={clsx(styles.radio_button_wrapper, { [styles.is_selected]: currentUiLanguage.data === key } )}>
<input

2
src-ui/app/config_page/setting_section/setting_box/components/checkbox/Checkbox.jsx
View File

@@ -4,7 +4,7 @@ export const Checkbox = (props) => {
return (
<div className={styles.checkbox_container}>
<label className={styles.checkbox_wrapper} htmlFor={props.checkbox_id}>
{(props.state === "loading")
{(props.state === "pending")
? <span className={styles.loader}></span>
: <input
type="checkbox"

16
src-ui/app/config_page/setting_section/setting_box/components/dropdown_menu/DropdownMenu.jsx
View File

@@ -7,7 +7,7 @@ export const DropdownMenu = (props) => {
const { updateIsOpenedDropdownMenu, currentIsOpenedDropdownMenu } = useStore_IsOpenedDropdownMenu();
const toggleDropdownMenu = () => {
if (currentIsOpenedDropdownMenu === props.dropdown_id) {
if (currentIsOpenedDropdownMenu.data === props.dropdown_id) {
updateIsOpenedDropdownMenu("");
} else {
if (props.openListFunction !== undefined) props.openListFunction();
@@ -24,21 +24,21 @@ export const DropdownMenu = (props) => {
};
const dropdown_content_wrapper_class_name = clsx(styles["dropdown_content_wrapper"], {
[styles.is_opened]: (currentIsOpenedDropdownMenu === props.dropdown_id) ? true : false,
[styles.is_opened]: (currentIsOpenedDropdownMenu.data === props.dropdown_id) ? true : false,
[styles.is_disabled]: props.is_disabled,
});
const dropdown_toggle_button_class_name = clsx(styles["dropdown_toggle_button"], {
[styles.is_loading]: (props.state === "loading") ? true : false,
[styles.is_loading]: (props.state === "pending") ? true : false,
[styles.is_disabled]: props.is_disabled,
});
const arrow_class_names = clsx(styles["arrow_left_svg"], {
[styles.is_opened]: (currentIsOpenedDropdownMenu === props.dropdown_id) ? true : false
[styles.is_opened]: (currentIsOpenedDropdownMenu.data === props.dropdown_id) ? true : false
});
const getSelectedText = () => {
if (props.state !== "hasData") return;
if (props.state !== "ok") return;
return props.selected_id;
};
const list = (props.list === undefined) ? {} : props.list;
@@ -46,18 +46,18 @@ export const DropdownMenu = (props) => {
return (
<div className={styles.container}>
<div className={dropdown_toggle_button_class_name} onClick={toggleDropdownMenu} style={props.style}>
{(props.state === "loading")
{(props.state === "pending")
? <p className={styles.dropdown_selected_text}>Loading...</p>
: <p className={styles.dropdown_selected_text}>{getSelectedText()}</p>
}
{(props.state === "loading")
{(props.state === "pending")
? <span className={styles.loader}></span>
: <ArrowLeftSvg className={arrow_class_names} />
}
</div>
<div className={dropdown_content_wrapper_class_name}>
<div className={styles.dropdown_content}>
{(props.state === "hasData")
{(props.state === "ok")
? Object.entries(list).map(([key, value]) => {
return (
<div key={key} className={styles.value_button} onClick={() => selectValue(key)}>

2
src-ui/app/config_page/setting_section/setting_box/components/message_format/MessageFormat.jsx
View File

@@ -56,7 +56,7 @@ const ExampleComponent = ({ id, current_format }) => {
let format = current_format;
if (["send_with_t", "received_with_t"].includes(id)) {
const translationLocale = currentUiLanguage === "en" ? "ja" : "en";
const translationLocale = currentUiLanguage.data === "en" ? "ja" : "en";
const translatedLangMessage = t("config_page.send_message_format.example_text", { lng: translationLocale });
return format.is_message_first

2
src-ui/app/config_page/setting_section/setting_box/components/radio_button/RadioButton.jsx
View File

@@ -7,7 +7,7 @@ export const RadioButton = (props) => {
<label key={option.radio_button_id} className={styles.radio_button_wrapper}>
{props.checked_variable.data === option.radio_button_id
? <>
{ props.checked_variable.state === "loading" && <span className={styles.loader}></span> }
{ props.checked_variable.state === "pending" && <span className={styles.loader}></span> }
<input
type="radio"
name="radio"

2
src-ui/app/config_page/setting_section/setting_box/components/switchbox/Switchbox.jsx
View File

@@ -6,7 +6,7 @@ export const Switchbox = (props) => {
const [is_hovered, setIsHovered] = useState(false);
const [is_mouse_down, setIsMouseDown] = useState(false);
const is_loading = (props.variable.state === "loading");
const is_loading = (props.variable.state === "pending");
const getClassNames = (base_class) => clsx(base_class, {
[styles.is_active]: (props.variable.data === true),

12
src-ui/app/config_page/setting_section/setting_box/components/threshold_component/ThresholdComponent.jsx
View File

@@ -22,7 +22,7 @@ const MicComponent = (props) => {
setMicThreshold,
currentEnableAutomaticMicThreshold,
} = useMicThreshold();
const [ui_threshold, setUiThreshold] = useState(currentMicThreshold);
const [ui_threshold, setUiThreshold] = useState(currentMicThreshold.data);
const {
volumeCheckStart_Mic,
volumeCheckStop_Mic,
@@ -34,9 +34,9 @@ const MicComponent = (props) => {
if (currentEnableAutomaticMicThreshold.data === true) {
setUiThreshold("Auto");
} else {
setUiThreshold(currentMicThreshold);
setUiThreshold(currentMicThreshold.data);
}
}, [currentMicThreshold, currentEnableAutomaticMicThreshold]);
}, [currentMicThreshold.data, currentEnableAutomaticMicThreshold]);
const setUiThresholdFunction = (payload_ui_threshold) => {
setUiThreshold(payload_ui_threshold);
@@ -80,7 +80,7 @@ const SpeakerComponent = (props) => {
setSpeakerThreshold,
currentEnableAutomaticSpeakerThreshold,
} = useSpeakerThreshold();
const [ui_threshold, setUiThreshold] = useState(currentSpeakerThreshold);
const [ui_threshold, setUiThreshold] = useState(currentSpeakerThreshold.data);
const {
volumeCheckStart_Speaker,
volumeCheckStop_Speaker,
@@ -91,9 +91,9 @@ const SpeakerComponent = (props) => {
if (currentEnableAutomaticSpeakerThreshold.data === true) {
setUiThreshold("Auto");
} else {
setUiThreshold(currentSpeakerThreshold);
setUiThreshold(currentSpeakerThreshold.data);
}
}, [currentSpeakerThreshold, currentEnableAutomaticSpeakerThreshold]);
}, [currentSpeakerThreshold.data, currentEnableAutomaticSpeakerThreshold]);
const setUiThresholdFunction = (payload_ui_threshold) => {
setUiThreshold(payload_ui_threshold);

2
src-ui/app/config_page/setting_section/setting_box/components/threshold_component/volume_check_button/VolumeCheckButton.jsx
View File

@@ -5,7 +5,7 @@ import clsx from "clsx";
export const VolumeCheckButton = React.memo((props) => {
const getClassNames = (baseClass) => clsx(baseClass, {
[styles.is_active]: (props.isChecking?.data === true),
[styles.is_loading]: (props.isChecking.state === "loading"),
[styles.is_loading]: (props.isChecking.state === "pending"),
});
const toggleFunction = () => {

14
src-ui/app/config_page/setting_section/setting_box/components/word_filter/WordFilter.jsx
View File

@@ -15,7 +15,7 @@ export const WordFilter = () => {
if (input_value === undefined) return;
const input_value_array = input_value.split(",");
let updated_list = [...currentWordFilterList];
let updated_list = [...currentWordFilterList.data];
for (let each_input_value of input_value_array) {
each_input_value = each_input_value.trim();
@@ -57,10 +57,10 @@ export const WordFilter = () => {
return (
<div className={styles.container}>
{ currentIsOpenedWordFilterList &&
{ currentIsOpenedWordFilterList.data &&
<div className={styles.list_section_wrapper}>
{
currentWordFilterList.map((item, index) => {
currentWordFilterList.data.map((item, index) => {
return <WordFilterItem value={item.value} key={index} is_redoable={item.is_redoable} deleteAction={deleteAction} redoAction={redoAction}/>;
})
}
@@ -117,15 +117,15 @@ export const WordFilterListToggleComponent = (props) => {
const svg_class_names = clsx(styles["arrow_left_svg"], {
[styles.to_down]: !currentIsOpenedWordFilterList,
[styles.to_up]: currentIsOpenedWordFilterList
[styles.to_down]: !currentIsOpenedWordFilterList.data,
[styles.to_up]: currentIsOpenedWordFilterList.data
});
const OnclickFunction = () => {
updateIsOpenedWordFilterList(!currentIsOpenedWordFilterList);
updateIsOpenedWordFilterList(!currentIsOpenedWordFilterList.data);
};
const word_filter_list_length = currentWordFilterList.filter(item => item.is_redoable === false).length;
const word_filter_list_length = currentWordFilterList.data.filter(item => item.is_redoable === false).length;
return (

5
src-ui/app/config_page/setting_section/setting_box/device/Device.jsx
View File

@@ -35,11 +35,12 @@ const Mic_Container = () => {
const { onMouseLeaveFunction } = useOnMouseLeaveDropdownMenu();
const { currentEnableAutomaticMicThreshold, toggleEnableAutomaticMicThreshold } = useMicThreshold();
const selectFunction_host = (selected_data) => {
setSelectedMicHost(selected_data.selected_id);
};
const is_disabled_selector = currentEnableAutoMicSelect.data === true || currentEnableAutoMicSelect.data === "loading";
const is_disabled_selector = currentEnableAutoMicSelect.data === true || currentEnableAutoMicSelect.data === "pending";
const { currentSelectedMicDevice, setSelectedMicDevice } = useSelectedMicDevice();
const { currentMicDeviceList, getMicDeviceList } = useMicDeviceList();
@@ -143,7 +144,7 @@ const Speaker_Container = () => {
setSelectedSpeakerDevice(selected_data.selected_id);
};
const is_disabled_selector = currentEnableAutoSpeakerSelect.data === true || currentEnableAutoSpeakerSelect.data === "loading";
const is_disabled_selector = currentEnableAutoSpeakerSelect.data === true || currentEnableAutoSpeakerSelect.data === "pending";
const getLabels = () => {
if (currentEnableAutomaticSpeakerThreshold.data === true) {

4
src-ui/app/config_page/sidebar_section/SidebarSection.jsx
View File

@@ -32,10 +32,10 @@ const Tab = (props) => {
};
const tab_container_class_names = clsx(styles["tab_container"], {
[styles["is_selected"]]: (currentSelectedConfigTabId === props.tab_id) ? true : false
[styles["is_selected"]]: (currentSelectedConfigTabId.data === props.tab_id) ? true : false
});
const switch_indicator_class_names = clsx(styles["switch_indicator"], {
[styles["is_selected"]]: (currentSelectedConfigTabId === props.tab_id) ? true : false
[styles["is_selected"]]: (currentSelectedConfigTabId.data === props.tab_id) ? true : false
});
return (

4
src-ui/app/config_page/topbar/Topbar.jsx
View File

@@ -16,8 +16,8 @@ export const Topbar = () => {
return (
<div className={clsx(styles.container, {
[styles.show_config]: currentIsOpenedConfigPage,
[styles.show_main]: !currentIsOpenedConfigPage
[styles.show_config]: currentIsOpenedConfigPage.data,
[styles.show_main]: !currentIsOpenedConfigPage.data
})}>
<div className={styles.wrapper} onClick={() => closeConfigPage()}>
<div className={styles.go_back_button}>

2
src-ui/app/config_page/topbar/section_title_box/SectionTitleBox.jsx
View File

@@ -7,7 +7,7 @@ export const SectionTitleBox = () => {
const { currentSelectedConfigTabId } = useStore_SelectedConfigTabId();
return (
<div className={styles.container}>
<p className={styles.title}>{t(`config_page.side_menu_labels.${currentSelectedConfigTabId}`)}</p>
<p className={styles.title}>{t(`config_page.side_menu_labels.${currentSelectedConfigTabId.data}`)}</p>
</div>
);
};

4
src-ui/app/main_page/MainPage.jsx
View File

@@ -9,8 +9,8 @@ export const MainPage = () => {
return (
<div className={clsx(styles.page, styles.main_page, {
[styles.show_config]: currentIsOpenedConfigPage,
[styles.show_main]: !currentIsOpenedConfigPage
[styles.show_config]: currentIsOpenedConfigPage.data,
[styles.show_main]: !currentIsOpenedConfigPage.data
})}>
<div className={styles.container}>
<SidebarSection />

4
src-ui/app/main_page/main_section/MainSection.jsx
View File

@@ -28,10 +28,10 @@ const HandleLanguageSelector = () => {
setSelectedTargetLanguages,
} = useLanguageSettings();
if (currentIsOpenedLanguageSelector.your_language === true) {
if (currentIsOpenedLanguageSelector.data.your_language === true) {
const onclickFunction_YourLanguage = (payload) => setSelectedYourLanguages(payload);
return <LanguageSelector id="your_language" onClickFunction={onclickFunction_YourLanguage}/>;
} else if (currentIsOpenedLanguageSelector.target_language === true) {
} else if (currentIsOpenedLanguageSelector.data.target_language === true) {
const onclickFunction_TargetLanguage = (payload) => setSelectedTargetLanguages(payload);
return <LanguageSelector id="target_language" onClickFunction={onclickFunction_TargetLanguage}/>;
} else {

2
src-ui/app/main_page/main_section/language_selector/LanguageSelector.jsx
View File

@@ -27,7 +27,7 @@ export const LanguageSelector = ({ id, onClickFunction }) => {
}, {});
};
const groupedLanguages = groupLanguagesByFirstLetter(currentSelectableLanguageList);
const groupedLanguages = groupLanguagesByFirstLetter(currentSelectableLanguageList.data);
return (
<div className={styles.container}>

10
src-ui/app/main_page/main_section/message_container/log_box/LogBox.jsx
View File

@@ -1,20 +1,22 @@
import { useEffect, useLayoutEffect, useRef, useState } from "react";
import styles from "./LogBox.module.scss";
import { useStore_MessageLogs, store } from "@store";
import { store } from "@store";
import { MessageContainer } from "./message_container/MessageContainer";
import { scrollToBottom } from "@utils/scrollToBottom";
import { useMessage } from "@logics_common/useMessage";
export const LogBox = () => {
const { currentMessageLogs } = useStore_MessageLogs();
const { currentMessageLogs } = useMessage();
const log_container_ref = useRef(null);
const [is_scrolling, setIsScrolling] = useState(false);
useLayoutEffect(() => {
store.log_box_ref = log_container_ref;
if (!is_scrolling) {
scrollToBottom(store.log_box_ref, true);
}
}, [currentMessageLogs]);
}, [currentMessageLogs.data]);
useEffect(() => {
const handleScroll = () => {
@@ -39,7 +41,7 @@ export const LogBox = () => {
return (
<div id="log_container" className={styles.container} ref={log_container_ref}>
{currentMessageLogs.map(message_data => (
{currentMessageLogs.data.map(message_data => (
<MessageContainer key={message_data.id} {...message_data} />
))}
</div>

4
src-ui/app/main_page/main_section/top_bar/sidebar_compact_mode_button/SidebarCompactModeButton.jsx
View File

@@ -8,11 +8,11 @@ export const SidebarCompactModeButton = () => {
const { updateIsMainPageCompactMode, currentIsMainPageCompactMode } = useStore_IsMainPageCompactMode();
const toggleCompactMode = () => {
updateIsMainPageCompactMode(!currentIsMainPageCompactMode);
updateIsMainPageCompactMode(!currentIsMainPageCompactMode.data);
};
const class_names = clsx(styles["arrow_left_svg"], {
[styles["reverse"]]: currentIsMainPageCompactMode
[styles["reverse"]]: currentIsMainPageCompactMode.data
});
return (

6
src-ui/app/main_page/sidebar_section/SidebarSection.jsx
View File

@@ -11,12 +11,12 @@ import { OpenSettings } from "./open_settings/OpenSettings";
export const SidebarSection = () => {
const { currentIsMainPageCompactMode } = useStore_IsMainPageCompactMode();
const container_class_name = clsx(styles.container, {
[styles.is_compact_mode]: currentIsMainPageCompactMode
[styles.is_compact_mode]: currentIsMainPageCompactMode.data
});
const { currentIsOpenedLanguageSelector } = useStore_IsOpenedLanguageSelector();
const scroll_container_class_names = clsx(styles.scroll_container, {
[styles.is_opened]: (currentIsOpenedLanguageSelector.your_language === true || currentIsOpenedLanguageSelector.target_language === true)
[styles.is_opened]: (currentIsOpenedLanguageSelector.data.your_language === true || currentIsOpenedLanguageSelector.data.target_language === true)
});
return (
@@ -24,7 +24,7 @@ export const SidebarSection = () => {
<Logo />
<div className={scroll_container_class_names}>
<MainFunctionSwitch />
{!currentIsMainPageCompactMode && <LanguageSettings />}
{!currentIsMainPageCompactMode.data && <LanguageSettings />}
</div>
<OpenSettings />
</div>

8
src-ui/app/main_page/sidebar_section/language_settings/LanguageSettings.jsx
View File

@@ -62,8 +62,8 @@ const PresetContainer = () => {
const yourLanguageSettings = {
title: t("main_page.your_language"),
is_opened: currentIsOpenedLanguageSelector.your_language,
onClickFunction: () => toggleSelector("your_language", currentIsOpenedLanguageSelector.your_language, updateIsOpenedLanguageSelector),
is_opened: currentIsOpenedLanguageSelector.data.your_language,
onClickFunction: () => toggleSelector("your_language", currentIsOpenedLanguageSelector.data.your_language, updateIsOpenedLanguageSelector),
TurnedOnSvgComponent: <MicSvg />,
is_turned_on: currentTranscriptionSendStatus.data,
variable: your_language_data?.primary,
@@ -71,8 +71,8 @@ const PresetContainer = () => {
const targetLanguageSettings = {
title: t("main_page.target_language"),
is_opened: currentIsOpenedLanguageSelector.target_language,
onClickFunction: () => toggleSelector("target_language", currentIsOpenedLanguageSelector.target_language, updateIsOpenedLanguageSelector),
is_opened: currentIsOpenedLanguageSelector.data.target_language,
onClickFunction: () => toggleSelector("target_language", currentIsOpenedLanguageSelector.data.target_language, updateIsOpenedLanguageSelector),
TurnedOnSvgComponent: <HeadphonesSvg />,
is_turned_on: currentTranscriptionReceiveStatus.data,
variable: target_language_data?.primary,

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

@@ -14,11 +14,10 @@ export const TranslatorSelectorOpenButton = () => {
currentSelectedTranslationEngines,
} = useLanguageSettings();
// console.log(currentTranslationEngines, currentSelectedTranslationEngines);
const selected_translator_name = (currentTranslationEngines.state === "loading")
const selected_translator_name = (currentTranslationEngines.state === "pending")
? "Loading..."
: currentTranslationEngines.data.find(
translator_data => translator_data.translator_id === currentSelectedTranslationEngines[currentSelectedPresetTabNumber.data]
translator_data => translator_data.translator_id === currentSelectedTranslationEngines.data[currentSelectedPresetTabNumber.data]
)?.translator_name;
@@ -26,7 +25,7 @@ export const TranslatorSelectorOpenButton = () => {
const openTranslatorSelector = () => {
getTranslationEngines();
updateIsOpenedTranslatorSelector(!currentIsOpenedTranslatorSelector);
updateIsOpenedTranslatorSelector(!currentIsOpenedTranslatorSelector.data);
};
return (
@@ -35,7 +34,7 @@ export const TranslatorSelectorOpenButton = () => {
<p className={styles.label}>{t("main_page.translator")}: </p>
<p className={styles.label}>{selected_translator_name}</p>
</div>
{currentIsOpenedTranslatorSelector &&
{currentIsOpenedTranslatorSelector.data &&
<TranslatorSelector
selected_translator_id={currentSelectedTranslationEngines}
translation_engines={currentTranslationEngines}

2
src-ui/app/main_page/sidebar_section/logo/Logo.jsx
View File

@@ -15,7 +15,7 @@ import { useStore_IsMainPageCompactMode } from "@store";
export const LogoBox = () => {
const { currentIsMainPageCompactMode } = useStore_IsMainPageCompactMode();
if (currentIsMainPageCompactMode === true) {
if (currentIsMainPageCompactMode.data === true) {
return <img src={chato_img} className={styles.logo_chato} alt="VRCT logo chato" />;
} else {
return <img src={vrct_logo} className={styles.logo} alt="VRCT logo" />;

6
src-ui/app/main_page/sidebar_section/main_function_switch/MainFunctionSwitch.jsx
View File

@@ -77,9 +77,9 @@ export const SwitchContainer = ({ switchLabel, switch_id, children, currentState
const { currentIsMainPageCompactMode } = useStore_IsMainPageCompactMode();
const getClassNames = (baseClass) => clsx(baseClass, {
[styles.is_compact_mode]: currentIsMainPageCompactMode,
[styles.is_compact_mode]: currentIsMainPageCompactMode.data,
[styles.is_active]: (currentState.data === true),
[styles.is_loading]: (currentState.state === "loading"),
[styles.is_loading]: (currentState.state === "pending"),
[styles.is_hovered]: is_hovered,
[styles.is_mouse_down]: is_mouse_down,
});
@@ -108,7 +108,7 @@ export const SwitchContainer = ({ switchLabel, switch_id, children, currentState
</div>
<div className={getClassNames(styles.switch_indicator)}></div>
{(currentState.state === "loading")
{(currentState.state === "pending")
? <span className={styles.loader}></span>
: null
}

4
src-ui/logics/common/useMessage.js
View File

@@ -71,8 +71,8 @@ const generateMessageObject = (data, category) => {
};
const updateItemById = (id, translated_data) => (prev_items) => {
return prev_items.map(item => {
const updateItemById = (id, translated_data) => (current_items) => {
return current_items.data.map(item => {
if (item.id === id) {
item.status = "ok";
item.messages.translated = translated_data;

21
src-ui/logics/common/useVolume.js
View File

@@ -11,17 +11,24 @@ export const useVolume = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { updateMicVolume } = useStore_MicVolume();
const { updateSpeakerVolume } = useStore_SpeakerVolume();
const { currentMicThresholdCheckStatus, updateMicThresholdCheckStatus } = useStore_MicThresholdCheckStatus();
const { currentSpeakerThresholdCheckStatus, updateSpeakerThresholdCheckStatus } = useStore_SpeakerThresholdCheckStatus();
const {
currentMicThresholdCheckStatus,
updateMicThresholdCheckStatus,
pendingMicThresholdCheckStatus,
} = useStore_MicThresholdCheckStatus();
const {
currentSpeakerThresholdCheckStatus,
updateSpeakerThresholdCheckStatus,
pendingSpeakerThresholdCheckStatus,
} = useStore_SpeakerThresholdCheckStatus();
const asyncPending = () => new Promise(() => {});
return {
volumeCheckStart_Mic: () => {
updateMicThresholdCheckStatus(asyncPending);
pendingMicThresholdCheckStatus();
asyncStdoutToPython("/set/enable_check_mic_threshold");
},
volumeCheckStop_Mic: () => {
updateMicThresholdCheckStatus(asyncPending);
pendingMicThresholdCheckStatus();
asyncStdoutToPython("/set/disable_check_mic_threshold");
},
updateVolumeVariable_Mic: (payload) => {
@@ -35,11 +42,11 @@ export const useVolume = () => {
volumeCheckStart_Speaker: () => {
updateSpeakerVolume("0");
updateSpeakerThresholdCheckStatus(asyncPending);
pendingSpeakerThresholdCheckStatus();
asyncStdoutToPython("/set/enable_check_speaker_threshold");
},
volumeCheckStop_Speaker: () => {
updateSpeakerThresholdCheckStatus(asyncPending);
pendingSpeakerThresholdCheckStatus();
asyncStdoutToPython("/set/disable_check_speaker_threshold");
},
updateVolumeVariable_Speaker: (payload) => {

6
src-ui/logics/configs/useEnableAutoClearMessageBox.js
View File

@@ -3,15 +3,15 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useEnableAutoClearMessageBox = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentEnableAutoClearMessageBox, updateEnableAutoClearMessageBox } = useStore_EnableAutoClearMessageBox();
const { currentEnableAutoClearMessageBox, updateEnableAutoClearMessageBox, pendingEnableAutoClearMessageBox } = useStore_EnableAutoClearMessageBox();
const getEnableAutoClearMessageBox = () => {
updateEnableAutoClearMessageBox(() => new Promise(() => {}));
pendingEnableAutoClearMessageBox();
asyncStdoutToPython("/get/auto_clear_message_box");
};
const toggleEnableAutoClearMessageBox = () => {
updateEnableAutoClearMessageBox(() => new Promise(() => {}));
pendingEnableAutoClearMessageBox();
if (currentEnableAutoClearMessageBox.data) {
asyncStdoutToPython("/set/disable_auto_clear_message_box");
} else {

6
src-ui/logics/configs/useEnableAutoMicSelect.js
View File

@@ -3,15 +3,15 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useEnableAutoMicSelect = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentEnableAutoMicSelect, updateEnableAutoMicSelect } = useStore_EnableAutoMicSelect();
const { currentEnableAutoMicSelect, updateEnableAutoMicSelect, pendingEnableAutoMicSelect } = useStore_EnableAutoMicSelect();
const getEnableAutoMicSelect = () => {
updateEnableAutoMicSelect(() => new Promise(() => {}));
pendingEnableAutoMicSelect();
asyncStdoutToPython("/get/auto_mic_select");
};
const toggleEnableAutoMicSelect = () => {
updateEnableAutoMicSelect(() => new Promise(() => {}));
pendingEnableAutoMicSelect();
if (currentEnableAutoMicSelect.data) {
asyncStdoutToPython("/set/disable_auto_mic_select");
} else {

6
src-ui/logics/configs/useEnableAutoSpeakerSelect.js
View File

@@ -3,15 +3,15 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useEnableAutoSpeakerSelect = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentEnableAutoSpeakerSelect, updateEnableAutoSpeakerSelect } = useStore_EnableAutoSpeakerSelect();
const { currentEnableAutoSpeakerSelect, updateEnableAutoSpeakerSelect, pendingEnableAutoSpeakerSelect } = useStore_EnableAutoSpeakerSelect();
const getEnableAutoSpeakerSelect = () => {
updateEnableAutoSpeakerSelect(() => new Promise(() => {}));
pendingEnableAutoSpeakerSelect();
asyncStdoutToPython("/get/auto_speaker_select");
};
const toggleEnableAutoSpeakerSelect = () => {
updateEnableAutoSpeakerSelect(() => new Promise(() => {}));
pendingEnableAutoSpeakerSelect();
if (currentEnableAutoSpeakerSelect.data) {
asyncStdoutToPython("/set/disable_auto_speaker_select");
} else {

4
src-ui/logics/configs/useMicDeviceList.js
View File

@@ -3,10 +3,10 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useMicDeviceList = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentMicDeviceList, updateMicDeviceList } = useStore_MicDeviceList();
const { currentMicDeviceList, updateMicDeviceList, pendingMicDeviceList } = useStore_MicDeviceList();
const getMicDeviceList = () => {
updateMicDeviceList(() => new Promise(() => {}));
pendingMicDeviceList();
asyncStdoutToPython("/get/list_mic_device");
};

4
src-ui/logics/configs/useMicHostList.js
View File

@@ -3,10 +3,10 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useMicHostList = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentMicHostList, updateMicHostList } = useStore_MicHostList();
const { currentMicHostList, updateMicHostList, pendingMicHostList } = useStore_MicHostList();
const getMicHostList = () => {
updateMicHostList(() => new Promise(() => {}));
pendingMicHostList();
asyncStdoutToPython("/get/list_mic_host");
};

6
src-ui/logics/configs/useMicThreshold.js
View File

@@ -4,7 +4,7 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useMicThreshold = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { updateMicThreshold, currentMicThreshold } = useStore_MicThreshold();
const { updateEnableAutomaticMicThreshold, currentEnableAutomaticMicThreshold } = useStore_EnableAutomaticMicThreshold();
const { updateEnableAutomaticMicThreshold, currentEnableAutomaticMicThreshold, pendingEnableAutomaticMicThreshold } = useStore_EnableAutomaticMicThreshold();
const getMicThreshold = () => {
asyncStdoutToPython("/get/mic_energy_threshold");
@@ -15,12 +15,12 @@ export const useMicThreshold = () => {
};
const getEnableAutomaticMicThreshold = () => {
updateEnableAutomaticMicThreshold(() => new Promise(() => {}));
pendingEnableAutomaticMicThreshold();
asyncStdoutToPython("/get/mic_dynamic_energy_threshold");
};
const toggleEnableAutomaticMicThreshold = () => {
updateEnableAutomaticMicThreshold(() => new Promise(() => {}));
pendingEnableAutomaticMicThreshold();
if (currentEnableAutomaticMicThreshold.data) {
asyncStdoutToPython("/set/disable_mic_dynamic_energy_threshold");
} else {

6
src-ui/logics/configs/useSelectedMicDevice.js
View File

@@ -3,15 +3,15 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useSelectedMicDevice = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentSelectedMicDevice, updateSelectedMicDevice } = useStore_SelectedMicDevice();
const { currentSelectedMicDevice, updateSelectedMicDevice, pendingSelectedMicDevice } = useStore_SelectedMicDevice();
const getSelectedMicDevice = () => {
updateSelectedMicDevice(() => new Promise(() => {}));
pendingSelectedMicDevice();
asyncStdoutToPython("/get/selected_mic_device");
};
const setSelectedMicDevice = (selected_mic_device) => {
updateSelectedMicDevice(() => new Promise(() => {}));
pendingSelectedMicDevice();
asyncStdoutToPython("/set/selected_mic_device", selected_mic_device);
};

6
src-ui/logics/configs/useSelectedMicHost.js
View File

@@ -3,15 +3,15 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useSelectedMicHost = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentSelectedMicHost, updateSelectedMicHost } = useStore_SelectedMicHost();
const { currentSelectedMicHost, updateSelectedMicHost, pendingSelectedMicHost } = useStore_SelectedMicHost();
const getSelectedMicHost = () => {
updateSelectedMicHost(() => new Promise(() => {}));
pendingSelectedMicHost();
asyncStdoutToPython("/get/selected_mic_host");
};
const setSelectedMicHost = (selected_mic_host) => {
updateSelectedMicHost(() => new Promise(() => {}));
pendingSelectedMicHost();
asyncStdoutToPython("/set/selected_mic_host", selected_mic_host);
};

6
src-ui/logics/configs/useSelectedSpeakerDevice.js
View File

@@ -3,15 +3,15 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useSelectedSpeakerDevice = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentSelectedSpeakerDevice, updateSelectedSpeakerDevice } = useStore_SelectedSpeakerDevice();
const { currentSelectedSpeakerDevice, updateSelectedSpeakerDevice, pendingSelectedSpeakerDevice } = useStore_SelectedSpeakerDevice();
const getSelectedSpeakerDevice = () => {
updateSelectedSpeakerDevice(() => new Promise(() => {}));
pendingSelectedSpeakerDevice();
asyncStdoutToPython("/get/selected_speaker_device");
};
const setSelectedSpeakerDevice = (selected_speaker_device) => {
updateSelectedSpeakerDevice(() => new Promise(() => {}));
pendingSelectedSpeakerDevice();
asyncStdoutToPython("/set/selected_speaker_device", selected_speaker_device);
};

6
src-ui/logics/configs/useSendMessageButtonType.js
View File

@@ -3,15 +3,15 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useSendMessageButtonType = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentSendMessageButtonType, updateSendMessageButtonType } = useStore_SendMessageButtonType();
const { currentSendMessageButtonType, updateSendMessageButtonType, pendingSendMessageButtonType } = useStore_SendMessageButtonType();
const getSendMessageButtonType = () => {
updateSendMessageButtonType(() => new Promise(() => {}));
pendingSendMessageButtonType();
asyncStdoutToPython("/get/send_message_button_type");
};
const setSendMessageButtonType = (selected_type) => {
updateSendMessageButtonType(() => new Promise(() => {}));
pendingSendMessageButtonType();
asyncStdoutToPython("/set/send_message_button_type", selected_type);
};

4
src-ui/logics/configs/useSoftwareVersion.js
View File

@@ -3,10 +3,10 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useSoftwareVersion = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentSoftwareVersion, updateSoftwareVersion } = useStore_SoftwareVersion();
const { currentSoftwareVersion, updateSoftwareVersion, pendingSoftwareVersion } = useStore_SoftwareVersion();
const getSoftwareVersion = () => {
updateSoftwareVersion(() => new Promise(() => {}));
pendingSoftwareVersion();
asyncStdoutToPython("/get/version");
};

4
src-ui/logics/configs/useSpeakerDeviceList.js
View File

@@ -3,10 +3,10 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useSpeakerDeviceList = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentSpeakerDeviceList, updateSpeakerDeviceList } = useStore_SpeakerDeviceList();
const { currentSpeakerDeviceList, updateSpeakerDeviceList, pendingSpeakerDeviceList } = useStore_SpeakerDeviceList();
const getSpeakerDeviceList = () => {
updateSpeakerDeviceList(() => new Promise(() => {}));
pendingSpeakerDeviceList();
asyncStdoutToPython("/get/list_speaker_device");
};

6
src-ui/logics/configs/useSpeakerThreshold.js
View File

@@ -4,7 +4,7 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useSpeakerThreshold = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { updateSpeakerThreshold, currentSpeakerThreshold } = useStore_SpeakerThreshold();
const { updateEnableAutomaticSpeakerThreshold, currentEnableAutomaticSpeakerThreshold } = useStore_EnableAutomaticSpeakerThreshold();
const { updateEnableAutomaticSpeakerThreshold, currentEnableAutomaticSpeakerThreshold, pendingEnableAutomaticSpeakerThreshold } = useStore_EnableAutomaticSpeakerThreshold();
const getSpeakerThreshold = () => {
asyncStdoutToPython("/get/speaker_energy_threshold");
@@ -15,12 +15,12 @@ export const useSpeakerThreshold = () => {
};
const getEnableAutomaticSpeakerThreshold = () => {
updateEnableAutomaticSpeakerThreshold(() => new Promise(() => {}));
pendingEnableAutomaticSpeakerThreshold();
asyncStdoutToPython("/get/speaker_dynamic_energy_threshold");
};
const toggleEnableAutomaticSpeakerThreshold = () => {
updateEnableAutomaticSpeakerThreshold(() => new Promise(() => {}));
pendingEnableAutomaticSpeakerThreshold();
if (currentEnableAutomaticSpeakerThreshold.data) {
asyncStdoutToPython("/set/disable_speaker_dynamic_energy_threshold");
} else {

6
src-ui/logics/configs/useUiLanguage.js
View File

@@ -3,15 +3,15 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useUiLanguage = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentUiLanguage, updateUiLanguage } = useStore_UiLanguage();
const { currentUiLanguage, updateUiLanguage, pendingUiLanguage } = useStore_UiLanguage();
const getUiLanguage = () => {
updateUiLanguage(() => new Promise(() => {}));
pendingUiLanguage();
asyncStdoutToPython("/get/ui_language");
};
const setUiLanguage = (selected_ui_language) => {
updateUiLanguage(() => new Promise(() => {}));
pendingUiLanguage();
asyncStdoutToPython("/set/ui_language", selected_ui_language);
};

60
src-ui/logics/main/useLanguageSettings.js
View File

@@ -3,37 +3,61 @@ import { useStdoutToPython } from "@logics/useStdoutToPython";
export const useLanguageSettings = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const { currentEnableMultiTranslation, updateEnableMultiTranslation } = useStore_EnableMultiTranslation();
const { currentSelectedYourLanguages, updateSelectedYourLanguages } = useStore_SelectedYourLanguages();
const { currentSelectedTargetLanguages, updateSelectedTargetLanguages } = useStore_SelectedTargetLanguages();
const { currentSelectedPresetTabNumber, updateSelectedPresetTabNumber } = useStore_SelectedPresetTabNumber();
const { currentTranslationEngines, updateTranslationEngines } = useStore_TranslationEngines();
const { currentSelectedTranslationEngines, updateSelectedTranslationEngines } = useStore_SelectedTranslationEngines();
const {
currentEnableMultiTranslation,
updateEnableMultiTranslation,
pendingEnableMultiTranslation,
} = useStore_EnableMultiTranslation();
const {
currentSelectedYourLanguages,
updateSelectedYourLanguages,
pendingSelectedYourLanguages,
} = useStore_SelectedYourLanguages();
const {
currentSelectedTargetLanguages,
updateSelectedTargetLanguages,
pendingSelectedTargetLanguages,
} = useStore_SelectedTargetLanguages();
const {
currentSelectedPresetTabNumber,
updateSelectedPresetTabNumber,
pendingSelectedPresetTabNumber,
} = useStore_SelectedPresetTabNumber();
const {
currentTranslationEngines,
updateTranslationEngines,
pendingTranslationEngines,
} = useStore_TranslationEngines();
const {
currentSelectedTranslationEngines,
updateSelectedTranslationEngines,
pendingSelectedTranslationEngines,
} = useStore_SelectedTranslationEngines();
const getEnableMultiTranslation = () => {
updateEnableMultiTranslation(() => new Promise(() => {}));
pendingEnableMultiTranslation();
asyncStdoutToPython("/get/multi_language_translation");
};
const getSelectedPresetTabNumber = () => {
updateSelectedPresetTabNumber(() => new Promise(() => {}));
pendingSelectedPresetTabNumber();
asyncStdoutToPython("/get/selected_tab_no");
};
const setSelectedPresetTabNumber = (preset_number) => {
updateSelectedPresetTabNumber(() => new Promise(() => {}));
pendingSelectedPresetTabNumber();
asyncStdoutToPython("/set/selected_tab_no", preset_number);
};
const getSelectedYourLanguages = () => {
updateSelectedYourLanguages(() => new Promise(() => {}));
pendingSelectedPresetTabNumber();
asyncStdoutToPython("/get/selected_your_languages");
};
const setSelectedYourLanguages = (selected_language_data) => {
// updateSelectedYourLanguages(() => new Promise(() => {}));
pendingSelectedYourLanguages();
const send_obj = {
...currentSelectedYourLanguages.data,
[currentSelectedPresetTabNumber.data]: {
@@ -48,12 +72,12 @@ export const useLanguageSettings = () => {
const getSelectedTargetLanguages = () => {
updateSelectedTargetLanguages(() => new Promise(() => {}));
pendingSelectedTargetLanguages();
asyncStdoutToPython("/get/selected_target_languages");
};
const setSelectedTargetLanguages = (selected_language_data) => {
// updateSelectedTargetLanguages(() => new Promise(() => {}));
pendingSelectedTargetLanguages();
let send_obj = currentSelectedTargetLanguages.data;
send_obj[currentSelectedPresetTabNumber.data].primary.language = selected_language_data.language,
@@ -64,21 +88,19 @@ export const useLanguageSettings = () => {
const getTranslationEngines = () => {
updateTranslationEngines(() => new Promise(() => {}));
pendingTranslationEngines();
asyncStdoutToPython("/get/list_translation_engines");
};
const getSelectedTranslationEngines = () => {
updateSelectedTranslationEngines(() => new Promise(() => {}));
pendingSelectedTranslationEngines();
asyncStdoutToPython("/get/selected_translator_engines");
};
const setSelectedTranslationEngines = (selected_translator) => {
// updateSelectedTranslationEngines(() => new Promise(() => {}));
let send_obj = currentSelectedTranslationEngines;
pendingSelectedTranslationEngines();
let send_obj = currentSelectedTranslationEngines.data;
send_obj[currentSelectedPresetTabNumber.data] = selected_translator;
asyncStdoutToPython("/set/selected_translator_engines", send_obj);
};

13
src-ui/logics/main/useMainFunction.js
View File

@@ -13,17 +13,17 @@ export const useMainFunction = () => {
const {
currentTranslationStatus,
updateTranslationStatus,
asyncUpdateTranslationStatus,
pendingTranslationStatus,
} = useStore_TranslationStatus();
const {
currentTranscriptionSendStatus,
updateTranscriptionSendStatus,
asyncUpdateTranscriptionSendStatus,
pendingTranscriptionSendStatus,
} = useStore_TranscriptionSendStatus();
const {
currentTranscriptionReceiveStatus,
updateTranscriptionReceiveStatus,
asyncUpdateTranscriptionReceiveStatus,
pendingTranscriptionReceiveStatus,
} = useStore_TranscriptionReceiveStatus();
const {
currentForegroundStatus,
@@ -32,9 +32,8 @@ export const useMainFunction = () => {
const { asyncStdoutToPython } = useStdoutToPython();
const asyncPending = () => new Promise(() => {});
const toggleTranslation = () => {
asyncUpdateTranslationStatus(asyncPending);
pendingTranslationStatus();
if (currentTranslationStatus.data) {
asyncStdoutToPython("/set/disable_translation");
} else {
@@ -43,7 +42,7 @@ export const useMainFunction = () => {
};
const toggleTranscriptionSend = () => {
asyncUpdateTranscriptionSendStatus(asyncPending);
pendingTranscriptionSendStatus();
if (currentTranscriptionSendStatus.data) {
asyncStdoutToPython("/set/disable_transcription_send");
} else {
@@ -52,7 +51,7 @@ export const useMainFunction = () => {
};
const toggleTranscriptionReceive = () => {
asyncUpdateTranscriptionReceiveStatus(asyncPending);
pendingTranscriptionReceiveStatus();
if (currentTranscriptionReceiveStatus.data) {
asyncStdoutToPython("/set/disable_transcription_receive");
} else {

159
src-ui/store.js
View File

@@ -17,8 +17,11 @@ export const store = {
};
const generatePropertyNames = (base_ame) => ({
error: `error${base_ame}`,
pending: `pending${base_ame}`,
current: `current${base_ame}`,
update: `update${base_ame}`,
updatePart: `updatePart${base_ame}`,
async_update: `asyncUpdate${base_ame}`,
add: `add${base_ame}`,
async_add: `asyncAdd${base_ame}`,
@@ -94,64 +97,136 @@ const createAsyncAtomWithHook = (initialValue, base_ame) => {
return { atomInstance, useHook };
};
export const { atomInstance: Atom_SoftwareVersion, useHook: useStore_SoftwareVersion } = createAtomWithHook("-", "SoftwareVersion");
export const { atomInstance: Atom_TranslationStatus, useHook: useStore_TranslationStatus } = createAsyncAtomWithHook(false, "TranslationStatus");
export const { atomInstance: Atom_TranscriptionSendStatus, useHook: useStore_TranscriptionSendStatus } = createAsyncAtomWithHook(false, "TranscriptionSendStatus");
export const { atomInstance: Atom_TranscriptionReceiveStatus, useHook: useStore_TranscriptionReceiveStatus } = createAsyncAtomWithHook(false, "TranscriptionReceiveStatus");
export const { atomInstance: Atom_ForegroundStatus, useHook: useStore_ForegroundStatus } = createAsyncAtomWithHook(false, "ForegroundStatus");
const createAtomWithHook_WIP = (initialValue, base_ame, options) => {
const property_names = generatePropertyNames(base_ame);
const atomInstance = atom({
state: (options?.is_state_ok) ? "ok" : "pending",
data: initialValue,
});
export const { atomInstance: Atom_MessageLogs, useHook: useStore_MessageLogs } = createAtomWithHook(generateTestData(20), "MessageLogs");
export const { atomInstance: Atom_IsMainPageCompactMode, useHook: useStore_IsMainPageCompactMode } = createAtomWithHook(false, "IsMainPageCompactMode");
const useHook = () => {
const currentAtom = useAtomValue(atomInstance);
const setAtom = useSetAtom(atomInstance);
export const { atomInstance: Atom_IsOpenedLanguageSelector, useHook: useStore_IsOpenedLanguageSelector } = createAtomWithHook(
const pendingAtom = () => {
setAtom((old_value) => {
let new_value = {
state: "pending",
data: old_value.data,
};
return new_value;
});
};
const updateAtom = (payload) => {
setAtom((currentValue) => {
if (typeof payload === "function") {
const updated_data = payload(currentValue);
return {
state: "ok",
data: updated_data,
};
} else {
return {
state: "ok",
data: payload,
};
}
});
};
const errorAtom = () => {
setAtom((old_value) => {
let new_value = {
state: "error",
data: old_value.data,
};
return new_value;
});
};
const addAtom = (value) => {
setAtom((old_value) => {
return {
state: "ok",
data: [...old_value.data, value],
};
});
};
return {
[property_names.error]: errorAtom,
[property_names.pending]: pendingAtom,
[property_names.current]: currentAtom,
[property_names.update]: updateAtom,
[property_names.add]: addAtom,
};
};
return { atomInstance, useHook };
};
export const { atomInstance: Atom_SoftwareVersion, useHook: useStore_SoftwareVersion } = createAtomWithHook_WIP("-", "SoftwareVersion");
export const { atomInstance: Atom_TranslationStatus, useHook: useStore_TranslationStatus } = createAtomWithHook_WIP(false, "TranslationStatus", {is_state_ok: true});
export const { atomInstance: Atom_TranscriptionSendStatus, useHook: useStore_TranscriptionSendStatus } = createAtomWithHook_WIP(false, "TranscriptionSendStatus", {is_state_ok: true});
export const { atomInstance: Atom_TranscriptionReceiveStatus, useHook: useStore_TranscriptionReceiveStatus } = createAtomWithHook_WIP(false, "TranscriptionReceiveStatus", {is_state_ok: true});
export const { atomInstance: Atom_ForegroundStatus, useHook: useStore_ForegroundStatus } = createAtomWithHook_WIP(false, "ForegroundStatus", {is_state_ok: true});
export const { atomInstance: Atom_MessageLogs, useHook: useStore_MessageLogs } = createAtomWithHook_WIP(generateTestData(20), "MessageLogs");
export const { atomInstance: Atom_IsMainPageCompactMode, useHook: useStore_IsMainPageCompactMode } = createAtomWithHook_WIP(false, "IsMainPageCompactMode");
export const { atomInstance: Atom_IsOpenedLanguageSelector, useHook: useStore_IsOpenedLanguageSelector } = createAtomWithHook_WIP(
{ your_language: false, target_language: false },
"IsOpenedLanguageSelector"
);
export const { atomInstance: Atom_SelectableLanguageList, useHook: useStore_SelectableLanguageList } = createAtomWithHook([], "SelectableLanguageList");
export const { atomInstance: Atom_SelectableLanguageList, useHook: useStore_SelectableLanguageList } = createAtomWithHook_WIP([], "SelectableLanguageList");
export const { atomInstance: Atom_SelectedPresetTabNumber, useHook: useStore_SelectedPresetTabNumber } = createAsyncAtomWithHook("", "SelectedPresetTabNumber");
export const { atomInstance: Atom_EnableMultiTranslation, useHook: useStore_EnableMultiTranslation } = createAsyncAtomWithHook(false, "EnableMultiTranslation");
export const { atomInstance: Atom_SelectedYourLanguages, useHook: useStore_SelectedYourLanguages } = createAsyncAtomWithHook({}, "SelectedYourLanguages");
export const { atomInstance: Atom_SelectedTargetLanguages, useHook: useStore_SelectedTargetLanguages } = createAsyncAtomWithHook({}, "SelectedTargetLanguages");
export const { atomInstance: Atom_SelectedPresetTabNumber, useHook: useStore_SelectedPresetTabNumber } = createAtomWithHook_WIP("", "SelectedPresetTabNumber");
export const { atomInstance: Atom_EnableMultiTranslation, useHook: useStore_EnableMultiTranslation } = createAtomWithHook_WIP(false, "EnableMultiTranslation");
export const { atomInstance: Atom_SelectedYourLanguages, useHook: useStore_SelectedYourLanguages } = createAtomWithHook_WIP({}, "SelectedYourLanguages");
export const { atomInstance: Atom_SelectedTargetLanguages, useHook: useStore_SelectedTargetLanguages } = createAtomWithHook_WIP({}, "SelectedTargetLanguages");
export const { atomInstance: Atom_TranslationEngines, useHook: useStore_TranslationEngines } = createAsyncAtomWithHook(translator_status, "TranslationEngines");
export const { atomInstance: Atom_SelectedTranslationEngines, useHook: useStore_SelectedTranslationEngines } = createAtomWithHook({}, "SelectedTranslationEngines");
export const { atomInstance: Atom_TranslationEngines, useHook: useStore_TranslationEngines } = createAtomWithHook_WIP(translator_status, "TranslationEngines");
export const { atomInstance: Atom_SelectedTranslationEngines, useHook: useStore_SelectedTranslationEngines } = createAtomWithHook_WIP({}, "SelectedTranslationEngines");
export const { atomInstance: Atom_IsOpenedConfigPage, useHook: useStore_IsOpenedConfigPage } = createAtomWithHook(false, "IsOpenedConfigPage");
export const { atomInstance: Atom_SelectedConfigTabId, useHook: useStore_SelectedConfigTabId } = createAtomWithHook("device", "SelectedConfigTabId");
export const { atomInstance: Atom_IsOpenedDropdownMenu, useHook: useStore_IsOpenedDropdownMenu } = createAtomWithHook("", "IsOpenedDropdownMenu");
export const { atomInstance: Atom_IsOpenedConfigPage, useHook: useStore_IsOpenedConfigPage } = createAtomWithHook_WIP(false, "IsOpenedConfigPage");
export const { atomInstance: Atom_SelectedConfigTabId, useHook: useStore_SelectedConfigTabId } = createAtomWithHook_WIP("device", "SelectedConfigTabId");
export const { atomInstance: Atom_IsOpenedDropdownMenu, useHook: useStore_IsOpenedDropdownMenu } = createAtomWithHook_WIP("", "IsOpenedDropdownMenu");
// Config Page
export const { atomInstance: Atom_EnableAutoMicSelect, useHook: useStore_EnableAutoMicSelect } = createAsyncAtomWithHook(true, "EnableAutoMicSelect");
export const { atomInstance: Atom_EnableAutoSpeakerSelect, useHook: useStore_EnableAutoSpeakerSelect } = createAsyncAtomWithHook(true, "EnableAutoSpeakerSelect");
export const { atomInstance: Atom_EnableAutoMicSelect, useHook: useStore_EnableAutoMicSelect } = createAtomWithHook_WIP(true, "EnableAutoMicSelect");
export const { atomInstance: Atom_EnableAutoSpeakerSelect, useHook: useStore_EnableAutoSpeakerSelect } = createAtomWithHook_WIP(true, "EnableAutoSpeakerSelect");
export const { atomInstance: Atom_MicHostList, useHook: useStore_MicHostList } = createAsyncAtomWithHook({}, "MicHostList");
export const { atomInstance: Atom_SelectedMicHost, useHook: useStore_SelectedMicHost } = createAsyncAtomWithHook("Nothing Selected", "SelectedMicHost");
export const { atomInstance: Atom_MicDeviceList, useHook: useStore_MicDeviceList } = createAsyncAtomWithHook({}, "MicDeviceList");
export const { atomInstance: Atom_SelectedMicDevice, useHook: useStore_SelectedMicDevice } = createAsyncAtomWithHook("Nothing Selected", "SelectedMicDevice");
export const { atomInstance: Atom_MicHostList, useHook: useStore_MicHostList } = createAtomWithHook_WIP({}, "MicHostList");
export const { atomInstance: Atom_SelectedMicHost, useHook: useStore_SelectedMicHost } = createAtomWithHook_WIP("Nothing Selected", "SelectedMicHost");
export const { atomInstance: Atom_MicDeviceList, useHook: useStore_MicDeviceList } = createAtomWithHook_WIP({}, "MicDeviceList");
export const { atomInstance: Atom_SelectedMicDevice, useHook: useStore_SelectedMicDevice } = createAtomWithHook_WIP("Nothing Selected", "SelectedMicDevice");
export const { atomInstance: Atom_SpeakerDeviceList, useHook: useStore_SpeakerDeviceList } = createAsyncAtomWithHook({}, "SpeakerDeviceList");
export const { atomInstance: Atom_SelectedSpeakerDevice, useHook: useStore_SelectedSpeakerDevice } = createAsyncAtomWithHook("Nothing Selected", "SelectedSpeakerDevice");
export const { atomInstance: Atom_SpeakerDeviceList, useHook: useStore_SpeakerDeviceList } = createAtomWithHook_WIP({}, "SpeakerDeviceList");
export const { atomInstance: Atom_SelectedSpeakerDevice, useHook: useStore_SelectedSpeakerDevice } = createAtomWithHook_WIP("Nothing Selected", "SelectedSpeakerDevice");
export const { atomInstance: Atom_MicVolume, useHook: useStore_MicVolume } = createAsyncAtomWithHook(0, "MicVolume");
export const { atomInstance: Atom_SpeakerVolume, useHook: useStore_SpeakerVolume } = createAsyncAtomWithHook(0, "SpeakerVolume");
export const { atomInstance: Atom_MicVolume, useHook: useStore_MicVolume } = createAtomWithHook_WIP(0, "MicVolume");
export const { atomInstance: Atom_SpeakerVolume, useHook: useStore_SpeakerVolume } = createAtomWithHook_WIP(0, "SpeakerVolume");
export const { atomInstance: Atom_MicThresholdCheckStatus, useHook: useStore_MicThresholdCheckStatus } = createAsyncAtomWithHook(false, "MicThresholdCheckStatus");
export const { atomInstance: Atom_SpeakerThresholdCheckStatus, useHook: useStore_SpeakerThresholdCheckStatus } = createAsyncAtomWithHook(false, "SpeakerThresholdCheckStatus");
export const { atomInstance: Atom_MicThresholdCheckStatus, useHook: useStore_MicThresholdCheckStatus } = createAtomWithHook_WIP(false, "MicThresholdCheckStatus", {is_state_ok: true});
export const { atomInstance: Atom_SpeakerThresholdCheckStatus, useHook: useStore_SpeakerThresholdCheckStatus } = createAtomWithHook_WIP(false, "SpeakerThresholdCheckStatus", {is_state_ok: true});
export const { atomInstance: Atom_MicThreshold, useHook: useStore_MicThreshold } = createAtomWithHook(0, "MicThreshold");
export const { atomInstance: Atom_SpeakerThreshold, useHook: useStore_SpeakerThreshold } = createAtomWithHook(0, "SpeakerThreshold");
export const { atomInstance: Atom_MicThreshold, useHook: useStore_MicThreshold } = createAtomWithHook_WIP(0, "MicThreshold");
export const { atomInstance: Atom_SpeakerThreshold, useHook: useStore_SpeakerThreshold } = createAtomWithHook_WIP(0, "SpeakerThreshold");
export const { atomInstance: Atom_EnableAutomaticMicThreshold, useHook: useStore_EnableAutomaticMicThreshold } = createAsyncAtomWithHook(false, "EnableAutomaticMicThreshold");
export const { atomInstance: Atom_EnableAutomaticSpeakerThreshold, useHook: useStore_EnableAutomaticSpeakerThreshold } = createAsyncAtomWithHook(false, "EnableAutomaticSpeakerThreshold");
export const { atomInstance: Atom_EnableAutomaticMicThreshold, useHook: useStore_EnableAutomaticMicThreshold } = createAtomWithHook_WIP(false, "EnableAutomaticMicThreshold");
export const { atomInstance: Atom_EnableAutomaticSpeakerThreshold, useHook: useStore_EnableAutomaticSpeakerThreshold } = createAtomWithHook_WIP(false, "EnableAutomaticSpeakerThreshold");
// Appearance
export const { atomInstance: Atom_UiLanguage, useHook: useStore_UiLanguage } = createAsyncAtomWithHook("en", "UiLanguage");
export const { atomInstance: Atom_UiLanguage, useHook: useStore_UiLanguage } = createAtomWithHook_WIP("en", "UiLanguage");
@@ -181,16 +256,16 @@ export const { atomInstance: Atom_ReceivedMessageFormatWithT, useHook: useStore_
is_message_first: true,
}, "ReceivedMessageFormatWithT");
export const { atomInstance: Atom_IsOpenedWordFilterList, useHook: useStore_IsOpenedWordFilterList } = createAtomWithHook(false, "IsOpenedWordFilterList");
export const { atomInstance: Atom_WordFilterList, useHook: useStore_WordFilterList } = createAtomWithHook(word_filter_list, "WordFilterList");
export const { atomInstance: Atom_IsOpenedWordFilterList, useHook: useStore_IsOpenedWordFilterList } = createAtomWithHook_WIP(false, "IsOpenedWordFilterList");
export const { atomInstance: Atom_WordFilterList, useHook: useStore_WordFilterList } = createAtomWithHook_WIP(word_filter_list, "WordFilterList");
// Others
export const { atomInstance: Atom_EnableAutoClearMessageBox, useHook: useStore_EnableAutoClearMessageBox } = createAsyncAtomWithHook(true, "EnableAutoClearMessageBox");
export const { atomInstance: Atom_SendMessageButtonType, useHook: useStore_SendMessageButtonType } = createAsyncAtomWithHook("show", "SendMessageButtonType");
export const { atomInstance: Atom_EnableAutoClearMessageBox, useHook: useStore_EnableAutoClearMessageBox } = createAtomWithHook_WIP(true, "EnableAutoClearMessageBox");
export const { atomInstance: Atom_SendMessageButtonType, useHook: useStore_SendMessageButtonType } = createAtomWithHook_WIP("show", "SendMessageButtonType");
export const { atomInstance: Atom_IsOpenedTranslatorSelector, useHook: useStore_IsOpenedTranslatorSelector } = createAtomWithHook(false, "IsOpenedTranslatorSelector");
export const { atomInstance: Atom_IsOpenedTranslatorSelector, useHook: useStore_IsOpenedTranslatorSelector } = createAtomWithHook_WIP(false, "IsOpenedTranslatorSelector");
export const { atomInstance: Atom_VrctPosterIndex, useHook: useStore_VrctPosterIndex } = createAtomWithHook(0, "VrctPosterIndex");
export const { atomInstance: Atom_PosterShowcaseWorldPageIndex, useHook: useStore_PosterShowcaseWorldPageIndex } = createAtomWithHook(0, "PosterShowcaseWorldPageIndex");
export const { atomInstance: Atom_VrctPosterIndex, useHook: useStore_VrctPosterIndex } = createAtomWithHook_WIP(0, "VrctPosterIndex");
export const { atomInstance: Atom_PosterShowcaseWorldPageIndex, useHook: useStore_PosterShowcaseWorldPageIndex } = createAtomWithHook_WIP(0, "PosterShowcaseWorldPageIndex");