From 30de46cf2cab64b6d507f35e45ed6dd7811fe65b Mon Sep 17 00:00:00 2001
From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com>
Date: Thu, 31 Oct 2024 16:50:21 +0900
Subject: [PATCH] [Update] Quick Settings: Apply localization.

---
 .../top_bar/right_side_components/RightSideComponents.jsx   | 5 ++++-
 .../_buttons/OpenQuickSettingButton.jsx                     | 6 ++++--
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/src-ui/app/main_page/main_section/top_bar/right_side_components/RightSideComponents.jsx b/src-ui/app/main_page/main_section/top_bar/right_side_components/RightSideComponents.jsx
index 3afbb24a..c16cd4f1 100644
--- a/src-ui/app/main_page/main_section/top_bar/right_side_components/RightSideComponents.jsx
+++ b/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}
         />
diff --git a/src-ui/app/main_page/main_section/top_bar/right_side_components/_buttons/OpenQuickSettingButton.jsx b/src-ui/app/main_page/main_section/top_bar/right_side_components/_buttons/OpenQuickSettingButton.jsx
index c3151df3..d23eae2c 100644
--- a/src-ui/app/main_page/main_section/top_bar/right_side_components/_buttons/OpenQuickSettingButton.jsx
+++ b/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>