[Update] Quick Settings: Apply localization.

src-ui/app/main_page/main_section/top_bar/right_side_components/RightSideComponents.jsx

@@ -1,3 +1,4 @@
+import { useTranslation } from "react-i18next";
 import styles from "./RightSideComponents.module.scss";
 import HelpSvg from "@images/help.svg?react";
 
@@ -23,6 +24,7 @@ export const RightSideComponents = () => {
 };
 
 const OpenOverlayQuickSetting = () => {
+    // const { t } = useTranslation();
     const { updateOpenedQuickSetting } = useStore_OpenedQuickSetting();
     const { currentIsEnabledOverlaySmallLog } = useIsEnabledOverlaySmallLog();
 
@@ -40,6 +42,7 @@ const OpenOverlayQuickSetting = () => {
 };
 
 const OpenVrcMicMuteSyncQuickSetting = () => {
+    const { t } = useTranslation();
     const { updateOpenedQuickSetting } = useStore_OpenedQuickSetting();
     const { currentEnableVrcMicMuteSync } = useEnableVrcMicMuteSync();
 
@@ -49,7 +52,7 @@ const OpenVrcMicMuteSyncQuickSetting = () => {
 
     return (
         <OpenQuickSettingButton
-            label="VRC mic mute sync"
+            label={t("config_page.vrc_mic_mute_sync.label")}
             variable={currentEnableVrcMicMuteSync.data}
             onClickFunction={onClickFunction}
         />

src-ui/app/main_page/main_section/top_bar/right_side_components/_buttons/OpenQuickSettingButton.jsx

@@ -1,14 +1,16 @@
+import { useTranslation } from "react-i18next";
 import clsx from "clsx";
 import styles from "./OpenQuickSettingButton.module.scss";
 
 export const OpenQuickSettingButton = (props) => {
+    const { t } = useTranslation();
     return (
         <div className={styles.container}>
             <div className={styles.button_wrapper} onClick={props.onClickFunction}>
                 <p className={styles.button_label}>{props.label}</p>
                 {props.variable === true
-                    ? <p className={clsx(styles.button_indicator_label, styles.enabled)}>Enabled</p>
-                    : <p className={clsx(styles.button_indicator_label, styles.disabled)}>Disabled</p>
+                    ? <p className={clsx(styles.button_indicator_label, styles.enabled)}>{t("main_page.state_text_enabled")}</p>
+                    : <p className={clsx(styles.button_indicator_label, styles.disabled)}>{t("main_page.state_text_disabled")}</p>
                 }
             </div>
         </div>