[Update] Main Page. Add Language swap button functionally.

This commit is contained in:
Sakamoto Shiina
2024-09-23 09:26:58 +09:00
parent 80b57612bc
commit 7dbf324e31
3 changed files with 16 additions and 0 deletions

View File

@@ -5,10 +5,12 @@ import { useTranslation } from "react-i18next";
import styles from "./LanguageSwapButton.module.scss";
import NarrowArrowDownSvg from "@images/narrow_arrow_down.svg?react";
import { useLanguageSettings } from "@logics_main/useLanguageSettings";
export const LanguageSwapButton = () => {
const [isHovered, setIsHovered] = useState(false);
const { t } = useTranslation();
const { runLanguageSwap } = useLanguageSettings();
const label = isHovered
? t("main_page.swap_button_label")
@@ -27,6 +29,7 @@ export const LanguageSwapButton = () => {
className={styles.swap_button_wrapper}
onMouseEnter={handleMouseEnter}
onMouseLeave={handleMouseLeave}
onClick={runLanguageSwap}
>
<NarrowArrowDownSvg className={clsx(styles.narrow_arrow_down_svg, styles.reverse)} />
<p className={labelClassName}>{label}</p>

View File

@@ -104,6 +104,12 @@ export const useLanguageSettings = () => {
asyncStdoutToPython("/set/selected_translator_engines", send_obj);
};
const runLanguageSwap = () => {
pendingSelectedYourLanguages();
pendingSelectedTargetLanguages();
asyncStdoutToPython("/run/swap_your_language_and_target_language");
};
return {
currentSelectedPresetTabNumber,
@@ -134,5 +140,7 @@ export const useLanguageSettings = () => {
getSelectedTranslationEngines,
updateSelectedTranslationEngines,
setSelectedTranslationEngines,
runLanguageSwap,
};
};

View File

@@ -97,6 +97,11 @@ export const useReceiveRoutes = () => {
"/get/selected_translator_engines": updateSelectedTranslationEngines,
"/set/selected_translator_engines": updateSelectedTranslationEngines,
"/run/swap_your_language_and_target_language": (payload) => {
updateSelectedYourLanguages(payload.your);
updateSelectedTargetLanguages(payload.target);
},
// Language Selector
"/get/list_languages": updateSelectableLanguageList,