diff --git a/locales/en.yml b/locales/en.yml
index 8726c0b3..85d51180 100644
--- a/locales/en.yml
+++ b/locales/en.yml
@@ -19,6 +19,10 @@ main_page:
translator: Translator
translator_ctranslate2: Internal (Default)
+ translator_selector:
+ is_selected_same_language: |-
+ Since the same language is selected for both '{{your_language}}' and '{{target_language}}', only '{{translator_ctranslate2}}' is available.
+
message_log:
all: All
sent: Sent
diff --git a/locales/ja.yml b/locales/ja.yml
index 9e9da6ef..c8fe0069 100644
--- a/locales/ja.yml
+++ b/locales/ja.yml
@@ -19,6 +19,10 @@ main_page:
translator: 翻訳エンジン
translator_ctranslate2: オフライン翻訳 (Default)
+ translator_selector:
+ is_selected_same_language: |-
+ 「{{your_language}}」と「{{target_language}}」に同じ言語が選択がされているため、「{{translator_ctranslate2}}」のみが使用できます。
+
message_log:
all: 全て
sent: 送信
diff --git a/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/TranslatorSelectorOpenButton.jsx b/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/TranslatorSelectorOpenButton.jsx
index 3c830f13..e6b68cd4 100644
--- a/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/TranslatorSelectorOpenButton.jsx
+++ b/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/TranslatorSelectorOpenButton.jsx
@@ -4,10 +4,13 @@ import styles from "./TranslatorSelectorOpenButton.module.scss";
import { TranslatorSelector } from "./translator_selector/TranslatorSelector";
import { useStore_IsOpenedTranslatorSelector } from "@store";
import { useLanguageSettings } from "@logics_main";
+import WarningSvg from "@images/warning.svg?react";
export const TranslatorSelectorOpenButton = () => {
const { t } = useTranslation();
const {
+ currentSelectedYourLanguages,
+ currentSelectedTargetLanguages,
currentSelectedPresetTabNumber,
currentTranslationEngines,
currentSelectedTranslationEngines,
@@ -21,6 +24,35 @@ export const TranslatorSelectorOpenButton = () => {
const selected_engine_id = currentSelectedTranslationEngines.data[currentSelectedPresetTabNumber.data];
+ const checkIsSelectedSameLanguage = () => {
+ const your_language_data = currentSelectedYourLanguages.data[currentSelectedPresetTabNumber.data];
+ const target_language_data = currentSelectedTargetLanguages.data[currentSelectedPresetTabNumber.data];
+
+ const yourLanguage = your_language_data["1"];
+ const yourLanguageName = yourLanguage.language;
+ const yourCountry = yourLanguage.country;
+
+ let is_selected_same_language = false;
+
+ for (const key in target_language_data) {
+ const targetLanguage = target_language_data[key];
+
+ if (targetLanguage.enable) {
+ const targetLanguageName = targetLanguage.language;
+ const targetCountry = targetLanguage.country;
+
+ if (yourLanguageName === targetLanguageName && yourCountry === targetCountry) {
+ is_selected_same_language = true;
+ break;
+ }
+ }
+ }
+
+ return is_selected_same_language;
+ };
+
+ const is_selected_same_language = checkIsSelectedSameLanguage();
+
const getSelectedLabel = () => {
const selected_engine = translation_engines.find(
@@ -44,11 +76,16 @@ export const TranslatorSelectorOpenButton = () => {
{t("main_page.translator")}:
{selected_label}
+ {is_selected_same_language
+ ?
+ : null
+ }
{currentIsOpenedTranslatorSelector.data &&
}
diff --git a/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/TranslatorSelectorOpenButton.module.scss b/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/TranslatorSelectorOpenButton.module.scss
index fcc32d96..463a9c29 100644
--- a/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/TranslatorSelectorOpenButton.module.scss
+++ b/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/TranslatorSelectorOpenButton.module.scss
@@ -4,6 +4,7 @@
}
.translator_selector_button {
+ position: relative;
width: auto;
display: flex;
justify-content: center;
@@ -25,4 +26,11 @@
font-size: 1.2rem;
color: var(--dark_basic_text_color);
white-space: nowrap;
+}
+
+.warning_svg {
+ margin-left: 0.2rem;
+ padding-bottom: 0.2rem;
+ width: 1.8rem;
+ color: #cb944f;
}
\ No newline at end of file
diff --git a/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/translator_selector/TranslatorSelector.jsx b/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/translator_selector/TranslatorSelector.jsx
index fe39877e..45a45fad 100644
--- a/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/translator_selector/TranslatorSelector.jsx
+++ b/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/translator_selector/TranslatorSelector.jsx
@@ -1,29 +1,44 @@
import clsx from "clsx";
import styles from "./TranslatorSelector.module.scss";
-import { chunkArray } from "@utils";
+import { useTranslation } from "react-i18next";
+import { chunkArray } from "@utils";
import { useStore_IsOpenedTranslatorSelector } from "@store";
import { useLanguageSettings } from "@logics_main";
-export const TranslatorSelector = ({selected_id, translation_engines}) => {
+export const TranslatorSelector = ({selected_id, translation_engines, is_selected_same_language}) => { const { t } = useTranslation();
const columns = chunkArray(translation_engines, 2);
return (
-
- {columns.map((column, column_index) => (
-
- {column.map(({ id, label, is_available }) => (
-
- ))}
+
+
+ {columns.map((column, column_index) => (
+
+ {column.map(({ id, label, is_available }) => (
+
+ ))}
+
+ ))}
+
+ {is_selected_same_language ?
+
+
+ {t("main_page.translator_selector.is_selected_same_language", {
+ your_language: t("main_page.your_language"),
+ target_language: t("main_page.target_language"),
+ translator_ctranslate2: t("main_page.translator_ctranslate2"),
+ })}
+
- ))}
+ : null
+ }
);
diff --git a/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/translator_selector/TranslatorSelector.module.scss b/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/translator_selector/TranslatorSelector.module.scss
index 09262137..84aea69e 100644
--- a/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/translator_selector/TranslatorSelector.module.scss
+++ b/src-ui/app/main_page/sidebar_section/language_settings/translator_selector_open_button/translator_selector/TranslatorSelector.module.scss
@@ -3,7 +3,6 @@
bottom: 100%;
width: 100%;
height: 26rem;
- padding: 1rem;
background-color: (#000000dd);
// background-color: (var(--dark_875_color) + 80);
backdrop-filter: blur(0.1rem);
@@ -12,7 +11,16 @@
align-items: center;
}
+.relative_container {
+ position: relative;
+ width: 100%;
+ height: 100%;
+}
+
.wrapper {
+ // padding: 1rem;
+ width: 100%;
+ height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
@@ -60,4 +68,24 @@ $box_size: 6.8rem;
.translator_name {
font-size: 1.4rem;
+}
+
+.is_selected_same_language_wrapper {
+ position: absolute;
+ bottom: 0;
+ width: 100%;
+ height: 100%;
+ background-color: (#22222233);
+ display: flex;
+ justify-content: center;
+ align-items: start;
+ pointer-events: none;
+ padding: 4rem 1rem;
+}
+
+.is_selected_same_language_text {
+ font-size: 1.4rem;
+ text-align: center;
+ text-wrap: balance;
+ color: var(--dark_basic_text_color);
}
\ No newline at end of file
diff --git a/src-ui/assets/warning.svg b/src-ui/assets/warning.svg
new file mode 100644
index 00000000..72221ecf
--- /dev/null
+++ b/src-ui/assets/warning.svg
@@ -0,0 +1 @@
+
\ No newline at end of file