[Refactor] (Huge Refactoring 2)
Consolidated all logic into category-specific files. Renamed useTranslation from react-i18next to useI18n to avoid a name conflict with our own function.
This commit is contained in:
@@ -1,4 +1,4 @@
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useI18n } from "@useI18n";
|
||||
import styles from "./MainSection.module.scss";
|
||||
|
||||
import { TopBar } from "./top_bar/TopBar";
|
||||
@@ -37,7 +37,7 @@ export const MainSection = () => {
|
||||
|
||||
|
||||
const HandleLanguageSelector = () => {
|
||||
const { t } = useTranslation();
|
||||
const { t } = useI18n();
|
||||
const { currentIsOpenedLanguageSelector, updateIsOpenedLanguageSelector } = useStore_IsOpenedLanguageSelector();
|
||||
const {
|
||||
currentSelectedPresetTabNumber,
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useI18n } from "@useI18n";
|
||||
|
||||
import { useLanguageSettings } from "@logics_main";
|
||||
import styles from "./LanguageSelector.module.scss";
|
||||
|
||||
import { LanguageSelectorTopBar } from "./language_selector_top_bar/LanguageSelectorTopBar";
|
||||
export const LanguageSelector = ({ title, onClickFunction }) => {
|
||||
const { t } = useTranslation();
|
||||
const { t } = useI18n();
|
||||
const { currentSelectableLanguageList } = useLanguageSettings();
|
||||
|
||||
const groupLanguagesByFirstLetter = (languages) => {
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useI18n } from "@useI18n";
|
||||
import styles from "./LanguageSelectorTopBar.module.scss";
|
||||
import { useStore_IsOpenedLanguageSelector } from "@store";
|
||||
|
||||
export const LanguageSelectorTopBar = (props) => {
|
||||
const { t } = useTranslation();
|
||||
const { t } = useI18n();
|
||||
const { updateIsOpenedLanguageSelector } = useStore_IsOpenedLanguageSelector();
|
||||
const closeLanguageSelector = () => {
|
||||
updateIsOpenedLanguageSelector({
|
||||
|
||||
@@ -27,9 +27,9 @@ export const LogBox = () => {
|
||||
);
|
||||
};
|
||||
|
||||
import { useMessageLogUiScaling } from "@logics_configs";
|
||||
import { useAppearance } from "@logics_configs";
|
||||
const MessageLogUiSizeController = () => {
|
||||
const { currentMessageLogUiScaling } = useMessageLogUiScaling();
|
||||
const { currentMessageLogUiScaling } = useAppearance();
|
||||
const font_size = currentMessageLogUiScaling.data / 100;
|
||||
|
||||
useEffect(() => {
|
||||
|
||||
@@ -1,18 +1,18 @@
|
||||
import { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useI18n } from "@useI18n";
|
||||
import clsx from "clsx";
|
||||
import styles from "./MessageContainer.module.scss";
|
||||
import { MessageSubMenuContainer } from "./message_sub_menu_container/MessageSubMenuContainer";
|
||||
import { useMessage } from "@logics_common";
|
||||
import { useShowResendButton } from "@logics_configs";
|
||||
import { useAppearance } from "@logics_configs";
|
||||
|
||||
export const MessageContainer = ({ messages, status, category, created_at }) => {
|
||||
const { t } = useTranslation();
|
||||
const { t } = useI18n();
|
||||
const {
|
||||
sendMessage,
|
||||
updateMessageInputValue,
|
||||
} = useMessage();
|
||||
const { currentShowResendButton } = useShowResendButton();
|
||||
const { currentShowResendButton } = useAppearance();
|
||||
const [is_hovered, setIsHovered] = useState(false);
|
||||
const [is_locked, setIsLocked] = useState(false);
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import React, { useState, useRef } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useI18n } from "@useI18n";
|
||||
import Tooltip, { tooltipClasses } from '@mui/material/Tooltip';
|
||||
import styles from "./MessageSubMenuContainer.module.scss";
|
||||
import SendMessageSvg from "@images/send_message.svg?react";
|
||||
@@ -68,6 +68,6 @@ export const MessageSubMenuContainer = (props) => {
|
||||
};
|
||||
|
||||
const Title_p = () => {
|
||||
const { t } = useTranslation();
|
||||
const { t } = useI18n();
|
||||
return <p className={styles.tooltip_title}>{t("main_page.message_log.resend_button_on_hover_desc")}</p>;
|
||||
};
|
||||
|
||||
@@ -2,7 +2,7 @@ import { useState, useEffect, useLayoutEffect, useRef } from "react";
|
||||
import styles from "./MessageInputBox.module.scss";
|
||||
import SendMessageSvg from "@images/send_message.svg?react";
|
||||
import { useMessage } from "@logics_common";
|
||||
import { useSendMessageButtonType, useEnableAutoClearMessageInputBox } from "@logics_configs";
|
||||
import { useAppearance, useOthers } from "@logics_configs";
|
||||
import { useMessageLogScroll } from "@logics_main";
|
||||
import { store } from "@store";
|
||||
|
||||
@@ -18,8 +18,8 @@ export const MessageInputBox = () => {
|
||||
stopTyping,
|
||||
} = useMessage();
|
||||
|
||||
const { currentEnableAutoClearMessageInputBox } = useEnableAutoClearMessageInputBox();
|
||||
const { currentSendMessageButtonType } = useSendMessageButtonType();
|
||||
const { currentEnableAutoClearMessageInputBox } = useOthers();
|
||||
const { currentSendMessageButtonType } = useAppearance();
|
||||
|
||||
const { scrollToBottom } = useMessageLogScroll();
|
||||
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
import { useState } from "react";
|
||||
import styles from "./MessageLogSettingsContainer.module.scss";
|
||||
import clsx from "clsx";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useI18n } from "@useI18n";
|
||||
|
||||
import { MessageLogUiScalingContainer } from "@setting_box";
|
||||
import ConfigSvg from "@images/configuration.svg?react";
|
||||
|
||||
export const MessageLogSettingsContainer = (props) => {
|
||||
const { t } = useTranslation();
|
||||
const { t } = useI18n();
|
||||
const [is_opened, setIsOpened] = useState(false);
|
||||
const [is_hovered, setIsHovered] = useState(false);
|
||||
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useI18n } from "@useI18n";
|
||||
import styles from "./RightSideComponents.module.scss";
|
||||
import RefreshSvg from "@images/refresh.svg?react";
|
||||
import HelpSvg from "@images/help.svg?react";
|
||||
|
||||
import { useStore_OpenedQuickSetting } from "@store";
|
||||
import { useSoftwareVersion } from "@logics_common";
|
||||
import { useIsEnabledOverlaySmallLog, useIsEnabledOverlayLargeLog, useEnableVrcMicMuteSync } from "@logics_configs";
|
||||
import { useVr, useOthers } from "@logics_configs";
|
||||
import { OpenQuickSettingButton } from "./_buttons/OpenQuickSettingButton";
|
||||
|
||||
export const RightSideComponents = () => {
|
||||
@@ -30,10 +30,12 @@ export const RightSideComponents = () => {
|
||||
};
|
||||
|
||||
const OpenOverlayQuickSetting = () => {
|
||||
// const { t } = useTranslation();
|
||||
// const { t } = useI18n();
|
||||
const { updateOpenedQuickSetting } = useStore_OpenedQuickSetting();
|
||||
const { currentIsEnabledOverlaySmallLog } = useIsEnabledOverlaySmallLog();
|
||||
const { currentIsEnabledOverlayLargeLog } = useIsEnabledOverlayLargeLog();
|
||||
const {
|
||||
currentIsEnabledOverlaySmallLog,
|
||||
currentIsEnabledOverlayLargeLog,
|
||||
} = useVr();
|
||||
|
||||
const onClickFunction = () => {
|
||||
updateOpenedQuickSetting("overlay");
|
||||
@@ -50,7 +52,7 @@ const OpenOverlayQuickSetting = () => {
|
||||
);
|
||||
};
|
||||
const PluginsQuickSetting = () => {
|
||||
const { t } = useTranslation();
|
||||
const { t } = useI18n();
|
||||
const { updateOpenedQuickSetting } = useStore_OpenedQuickSetting();
|
||||
|
||||
const onClickFunction = () => {
|
||||
@@ -66,9 +68,9 @@ const PluginsQuickSetting = () => {
|
||||
};
|
||||
|
||||
const OpenVrcMicMuteSyncQuickSetting = () => {
|
||||
const { t } = useTranslation();
|
||||
const { t } = useI18n();
|
||||
const { updateOpenedQuickSetting } = useStore_OpenedQuickSetting();
|
||||
const { currentEnableVrcMicMuteSync } = useEnableVrcMicMuteSync();
|
||||
const { currentEnableVrcMicMuteSync } = useOthers();
|
||||
|
||||
const onClickFunction = () => {
|
||||
updateOpenedQuickSetting("vrc_mic_mute_sync");
|
||||
@@ -85,7 +87,7 @@ const OpenVrcMicMuteSyncQuickSetting = () => {
|
||||
|
||||
const SoftwareUpdateAvailableButton = () => {
|
||||
const { currentLatestSoftwareVersionInfo } = useSoftwareVersion();
|
||||
const { t } = useTranslation();
|
||||
const { t } = useI18n();
|
||||
if (currentLatestSoftwareVersionInfo.data.is_update_available === false) return null;
|
||||
|
||||
const { updateOpenedQuickSetting } = useStore_OpenedQuickSetting();
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useI18n } from "@useI18n";
|
||||
import clsx from "clsx";
|
||||
import styles from "./OpenQuickSettingButton.module.scss";
|
||||
|
||||
export const OpenQuickSettingButton = (props) => {
|
||||
const { t } = useTranslation();
|
||||
const { t } = useI18n();
|
||||
const variable = (typeof props.variable === "boolean") ? props.variable : null;
|
||||
return (
|
||||
<div className={styles.container}>
|
||||
|
||||
Reference in New Issue
Block a user