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

[Refactor] Change the function names.

Browse Source
This commit is contained in:
Sakamoto Shiina
2024-09-10 21:11:15 +09:00
parent b4d164e116
commit e1d8f59890
45 changed files with 230 additions and 191 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,7 +1,7 @@
import clsx from "clsx";
import styles from "./SidebarSection.module.scss";
import { useMainPageCompactModeStatus } from "@store";
import { useStore_IsMainPageCompactMode } from "@store";
import { Logo } from "./logo/Logo";
import { MainFunctionSwitch } from "./main_function_switch/MainFunctionSwitch";
@@ -9,16 +9,16 @@ import { LanguageSettings } from "./language_settings/LanguageSettings";
import { OpenSettings } from "./open_settings/OpenSettings";
export const SidebarSection = () => {
const { currentMainPageCompactModeStatus } = useMainPageCompactModeStatus();
const { currentIsMainPageCompactMode } = useStore_IsMainPageCompactMode();
const container_class_name = clsx(styles["container"], {
[styles["is_compact_mode"]]: currentMainPageCompactModeStatus
[styles["is_compact_mode"]]: currentIsMainPageCompactMode
});
return (
<div className={container_class_name}>
<Logo />
<MainFunctionSwitch />
{!currentMainPageCompactModeStatus && <LanguageSettings />}
{!currentIsMainPageCompactMode && <LanguageSettings />}
<OpenSettings />
</div>
);

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

@@ -6,10 +6,10 @@ import { PresetTabSelector } from "./preset_tab_selector/PresetTabSelector";
import { LanguageSelectorOpenButton } from "./language_selector_open_button/LanguageSelectorOpenButton";
import { LanguageSwapButton } from "./language_swap_button/LanguageSwapButton";
import { TranslatorSelectorOpenButton } from "./translator_selector_open_button/TranslatorSelectorOpenButton";
import { useIsOpenedTranslatorSelector } from "@store";
import { useStore_IsOpenedTranslatorSelector } from "@store";
export const LanguageSettings = () => {
const { updateIsOpenedTranslatorSelector} = useIsOpenedTranslatorSelector();
const { updateIsOpenedTranslatorSelector} = useStore_IsOpenedTranslatorSelector();
const closeTranslatorSelector = () => updateIsOpenedTranslatorSelector(false);
return (
@@ -24,12 +24,12 @@ export const LanguageSettings = () => {
import MicSvg from "@images/mic.svg?react";
import HeadphonesSvg from "@images/headphones.svg?react";
import { useIsOpenedLanguageSelector } from "@store";
import { useStore_IsOpenedLanguageSelector } from "@store";
import { useMainFunction } from "@logics/useMainFunction";
const PresetContainer = () => {
const { t } = useTranslation();
const { updateIsOpenedLanguageSelector, currentIsOpenedLanguageSelector } = useIsOpenedLanguageSelector();
const { updateIsOpenedLanguageSelector, currentIsOpenedLanguageSelector } = useStore_IsOpenedLanguageSelector();
const {
currentTranscriptionSendStatus,

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

@@ -12,16 +12,16 @@ export const PresetTabSelector = () => {
import clsx from "clsx";
import { useSelectedPresetTabStatus } from "@store";
import { useStore_SelectedPresetTabNumber } from "@store";
const Tab = (props) => {
const { updateSelectedPresetTabStatus, currentSelectedPresetTabStatus } = useSelectedPresetTabStatus();
const { updateSelectedPresetTabNumber, currentSelectedPresetTabNumber } = useStore_SelectedPresetTabNumber();
const onclickFunction = () => {
updateSelectedPresetTabStatus(props.preset_number);
updateSelectedPresetTabNumber(props.preset_number);
};
const class_names = clsx(styles["tab_container"], {
[styles["is_selected"]]: (currentSelectedPresetTabStatus === props.preset_number) ? true : false
[styles["is_selected"]]: (currentSelectedPresetTabNumber === props.preset_number) ? true : false
});
return (

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

@@ -2,17 +2,17 @@ import { useTranslation } from "react-i18next";
import styles from "./TranslatorSelectorOpenButton.module.scss";
import { TranslatorSelector } from "./translator_selector/TranslatorSelector";
import { useTranslatorListStatus, useSelectedTranslatorIdStatus, useIsOpenedTranslatorSelector } from "@store";
import { useStore_TranslatorList, useStore_SelectedTranslatorId, useStore_IsOpenedTranslatorSelector } from "@store";
export const TranslatorSelectorOpenButton = () => {
const { t } = useTranslation();
const { currentSelectedTranslatorIdStatus } = useSelectedTranslatorIdStatus();
const { currentTranslatorListStatus } = useTranslatorListStatus();
const currentTranslator = currentTranslatorListStatus.find(
translator_data => translator_data.translator_key === currentSelectedTranslatorIdStatus
const { currentSelectedTranslatorId } = useStore_SelectedTranslatorId();
const { currentTranslatorList } = useStore_TranslatorList();
const currentTranslator = currentTranslatorList.find(
translator_data => translator_data.translator_key === currentSelectedTranslatorId
);
const { currentIsOpenedTranslatorSelector, updateIsOpenedTranslatorSelector} = useIsOpenedTranslatorSelector();
const { currentIsOpenedTranslatorSelector, updateIsOpenedTranslatorSelector} = useStore_IsOpenedTranslatorSelector();
const openTranslatorSelector = () => updateIsOpenedTranslatorSelector(!currentIsOpenedTranslatorSelector);

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

@@ -1,10 +1,10 @@
import styles from "./TranslatorSelector.module.scss";
import { chunkArray } from "@utils/chunkArray";
import { useTranslatorListStatus, useSelectedTranslatorIdStatus, useIsOpenedTranslatorSelector } from "@store";
import { useStore_TranslatorList, useStore_SelectedTranslatorId, useStore_IsOpenedTranslatorSelector } from "@store";
export const TranslatorSelector = () => {
const { currentTranslatorListStatus } = useTranslatorListStatus();
const columns = chunkArray(currentTranslatorListStatus, 2);
const { currentTranslatorList } = useStore_TranslatorList();
const columns = chunkArray(currentTranslatorList, 2);
return (
<div className={styles.container}>
@@ -28,17 +28,17 @@ export const TranslatorSelector = () => {
import clsx from "clsx";
const TranslatorBox = (props) => {
const { currentSelectedTranslatorIdStatus, updateSelectedTranslatorIdStatus} = useSelectedTranslatorIdStatus();
const { updateIsOpenedTranslatorSelector} = useIsOpenedTranslatorSelector();
const { currentSelectedTranslatorId, updateSelectedTranslatorId} = useStore_SelectedTranslatorId();
const { updateIsOpenedTranslatorSelector} = useStore_IsOpenedTranslatorSelector();
const box_class_name = clsx(
styles.box,
{ [styles["is_selected"]]: (currentSelectedTranslatorIdStatus === props.translator_id) ? true : false },
{ [styles["is_selected"]]: (currentSelectedTranslatorId === props.translator_id) ? true : false },
{ [styles["is_available"]]: (props.is_available === true) ? true : false }
);
const selectTranslator = () => {
updateSelectedTranslatorIdStatus(props.translator_id);
updateSelectedTranslatorId(props.translator_id);
updateIsOpenedTranslatorSelector(false);
};
return (

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

@@ -11,11 +11,11 @@ export const Logo = () => {
import vrct_logo from "@images/vrct_logo_for_dark_mode.png";
import chato_img from "@images/chato_white.png";
import { useMainPageCompactModeStatus } from "@store";
import { useStore_IsMainPageCompactMode } from "@store";
export const LogoBox = () => {
const { currentMainPageCompactModeStatus } = useMainPageCompactModeStatus();
if (currentMainPageCompactModeStatus === true) {
const { currentIsMainPageCompactMode } = useStore_IsMainPageCompactMode();
if (currentIsMainPageCompactMode === 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

@@ -5,7 +5,7 @@ import TranslationSvg from "@images/translation.svg?react";
import MicSvg from "@images/mic.svg?react";
import HeadphonesSvg from "@images/headphones.svg?react";
import ForegroundSvg from "@images/foreground.svg?react";
import { useMainPageCompactModeStatus } from "@store";
import { useStore_IsMainPageCompactMode } from "@store";
import { useMainFunction } from "@logics/useMainFunction";
@@ -74,10 +74,10 @@ export const SwitchContainer = ({ switchLabel, switch_id, children, currentState
const [is_hovered, setIsHovered] = useState(false);
const [is_mouse_down, setIsMouseDown] = useState(false);
const { currentMainPageCompactModeStatus } = useMainPageCompactModeStatus();
const { currentIsMainPageCompactMode } = useStore_IsMainPageCompactMode();
const getClassNames = (baseClass) => clsx(baseClass, {
[styles.is_compact_mode]: currentMainPageCompactModeStatus,
[styles.is_compact_mode]: currentIsMainPageCompactMode,
[styles.is_active]: (currentState.data === true),
[styles.is_loading]: (currentState.state === "loading"),
[styles.is_hovered]: is_hovered,

4
src-ui/app/main_page/sidebar_section/open_settings/OpenSettings.jsx
View File

@@ -1,9 +1,9 @@
import styles from "./OpenSettings.module.scss";
import { useIsOpenedConfigPage } from "@store";
import { useStore_IsOpenedConfigPage } from "@store";
import ConfigurationSvg from "@images/configuration.svg?react";
export const OpenSettings = () => {
const { updateIsOpenedConfigPage } = useIsOpenedConfigPage();
const { updateIsOpenedConfigPage } = useStore_IsOpenedConfigPage();
const openConfigPage = () => {
updateIsOpenedConfigPage(true);