Fix: すべてのノートに翻訳ボタンが表示される/本文がなくて投票だけあると翻訳が表示されなくなる (#579)

Co-authored-by: pen <pen@penginn.net>
yojo-art · Dec 21, 2024 · d35522e · d35522e
1 parent 81106eb
commit d35522e
Show file tree

Hide file tree

Showing 3 changed files with 62 additions and 17 deletions.
diff --git a/CHANGELOG_YOJO.md b/CHANGELOG_YOJO.md
@@ -1,3 +1,16 @@
+## 1.2.1
+Cherrypick 4.13.0
+Misskey 2024.10.1
+
+### Release Date
+
+### General
+
+### Client
+- Fix: すべてのノートに翻訳ボタンが表示される/本文がなくて投票だけあると翻訳が表示されなくなる [#579](https://github.com/yojo-art/cherrypick/pull/579)
+
+### Server
+
 ## 1.2.0
 Cherrypick 4.13.0
 Misskey 2024.10.1
@@ -20,7 +33,7 @@ Misskey 2024.10.1
 - Enhance: `/users/${id}`に`Accept: application/ld+json`ではないリクエストが来たとき`/@${username}`にリダイレクトするように [#554](https://github.com/yojo-art/cherrypick/pull/554)
 
 ## 1.1.0
-Cherrypick 4.11.1
+Cherrypick 4.11.1  
 Misskey 2024.8.0
 
 ### Release Date
@@ -121,7 +134,7 @@ docker環境でノートレコードが多数(数百万件)ある場合**一時
 
 
 ## 1.0.1
-Cherrypick 4.11.1
+Cherrypick 4.11.1  
 Misskey 2024.8.0
 
 ### Release Date
@@ -138,7 +151,7 @@ Misskey 2024.8.0
 
 
 ## 1.0.0
-Cherrypick 4.11.1
+Cherrypick 4.11.1  
 Misskey 2024.8.0
 
 ### Release Date

diff --git a/packages/frontend/src/components/MkNote.vue b/packages/frontend/src/components/MkNote.vue
@@ -93,15 +93,15 @@ SPDX-License-Identifier: AGPL-3.0-only
 						:enableEmojiMenuReaction="!!$i"
 						:enableAnimatedMfm="enableAnimatedMfm"
 					/>
-					<div v-if="defaultStore.state.showTranslateButtonInNote && (!defaultStore.state.useAutoTranslate || (!$i.policies.canUseAutoTranslate || (defaultStore.state.useAutoTranslate && (isLong || appearNote.cw != null || !showContent)))) && instance.translatorAvailable && $i && $i.policies.canUseTranslator && appearNote.text && isForeignLanguage" style="padding-top: 5px; color: var(--MI_THEME-accent);">
+					<div v-if="defaultStore.state.showTranslateButtonInNote && (!defaultStore.state.useAutoTranslate || (!$i.policies.canUseAutoTranslate || (defaultStore.state.useAutoTranslate && (isLong || appearNote.cw != null || !showContent)))) && instance.translatorAvailable && $i && $i.policies.canUseTranslator && (appearNote.text || appearNote.poll) && isForeignLanguage" style="padding-top: 5px; color: var(--MI_THEME-accent);">
 						<button v-if="!(translating || translation)" ref="translateButton" class="_button" @click.stop="translate()">{{ i18n.ts.translateNote }}</button>
 						<button v-else class="_button" @click.stop="translation = null">{{ i18n.ts.close }}</button>
 					</div>
 					<div v-if="translating || translation" :class="$style.translation">
 						<MkLoading v-if="translating" mini/>
 						<div v-else-if="translation">
 							<b>{{ i18n.tsx.translatedFrom({ x: translation.sourceLang }) }}:</b><hr style="margin: 10px 0;">
-							<Mfm
+							<Mfm v-if="appearNote.text"
 								:text="translation.text"
 								:author="appearNote.user"
 								:nyaize="defaultStore.state.disableNyaize || noNyaize ? false : 'respect'"
@@ -754,12 +754,19 @@ async function clip(): Promise<void> {
 	os.popupMenu(await getNoteClipMenu({ note: note.value, isDeleted, currentClip: currentClip?.value }), clipButton.value).then(focus);
 }
 
-const isForeignLanguage: boolean = appearNote.value.text != null && (() => {
+const isForeignLanguage: boolean = (appearNote.value.text != null || appearNote.value.poll != null) && (() => {
 	const targetLang = (miLocalStorage.getItem('lang') ?? navigator.language).slice(0, 2);
-	const postLang = detectLanguage(appearNote.value.text);
-	const choicesLang = appearNote.value.poll?.choices.map((choice) => choice.text).join(' ') ?? '';
-	const pollLang = detectLanguage(choicesLang);
-	return postLang !== '' && (postLang !== targetLang || pollLang !== targetLang);
+	if (appearNote.value.text) {
+		const postLang = detectLanguage(appearNote.value.text);
+		if (postLang !== '' && postLang !== targetLang) return true;
+	}
+	if (appearNote.value.poll) {
+		const foreignLang = appearNote.value.poll.choices
+			.map((choice) => detectLanguage(choice.text))
+			.filter((lang) => lang !== targetLang).length;
+		if (0 < foreignLang) return true;
+	}
+	return false;
 })();
 
 if (defaultStore.state.useAutoTranslate && instance.translatorAvailable && $i.policies.canUseTranslator && $i.policies.canUseAutoTranslate && !isLong && (appearNote.value.cw == null || showContent.value) && appearNote.value.text && isForeignLanguage) translate();
@@ -769,6 +776,15 @@ async function translate(): Promise<void> {
 	collapsed.value = false;
 	translating.value = true;
 
+	if (appearNote.value.text == null) {
+		translating.value = false;
+		translation.value = {
+			sourceLang: '',
+			text: '',
+		};
+		return;
+	}
+
 	vibrate(defaultStore.state.vibrateSystem ? 5 : []);
 
 	if (props.mock) {

diff --git a/packages/frontend/src/components/MkNoteDetailed.vue b/packages/frontend/src/components/MkNoteDetailed.vue
@@ -117,15 +117,15 @@ SPDX-License-Identifier: AGPL-3.0-only
 					:enableAnimatedMfm="enableAnimatedMfm"
 				/>
 				<a v-if="appearNote.renote != null" :class="$style.rn">RN:</a>
-				<div v-if="defaultStore.state.showTranslateButtonInNote && (!defaultStore.state.useAutoTranslate || (!$i.policies.canUseAutoTranslate || (defaultStore.state.useAutoTranslate && (appearNote.cw != null || !showContent)))) && instance.translatorAvailable && $i && $i.policies.canUseTranslator && appearNote.text && isForeignLanguage" style="padding-top: 5px; color: var(--MI_THEME-accent);">
+				<div v-if="defaultStore.state.showTranslateButtonInNote && (!defaultStore.state.useAutoTranslate || (!$i.policies.canUseAutoTranslate || (defaultStore.state.useAutoTranslate && (appearNote.cw != null || !showContent)))) && instance.translatorAvailable && $i && $i.policies.canUseTranslator && (appearNote.text || appearNote.poll) && isForeignLanguage" style="padding-top: 5px; color: var(--MI_THEME-accent);">
 					<button v-if="!(translating || translation)" ref="translateButton" class="_button" @click="translate()">{{ i18n.ts.translateNote }}</button>
 					<button v-else class="_button" @click="translation = null">{{ i18n.ts.close }}</button>
 				</div>
 				<div v-if="translating || translation" :class="$style.translation">
 					<MkLoading v-if="translating" mini/>
 					<div v-else-if="translation">
 						<b>{{ i18n.tsx.translatedFrom({ x: translation.sourceLang }) }}:</b><hr style="margin: 10px 0;">
-						<Mfm
+						<Mfm v-if="appearNote.text"
 							:text="translation.text"
 							:author="appearNote.user"
 							:nyaize="defaultStore.state.disableNyaize || noNyaize ? false : 'respect'"
@@ -683,12 +683,19 @@ function showMenu(): void {
 	os.popupMenu(menu, menuButton.value).then(focus).finally(cleanup);
 }
 
-const isForeignLanguage: boolean = appearNote.value.text != null && (() => {
+const isForeignLanguage: boolean = (appearNote.value.text != null || appearNote.value.poll != null) && (() => {
 	const targetLang = (miLocalStorage.getItem('lang') ?? navigator.language).slice(0, 2);
-	const postLang = detectLanguage(appearNote.value.text);
-	const choicesLang = appearNote.value.poll?.choices.map((choice) => choice.text).join(' ') ?? '';
-	const pollLang = detectLanguage(choicesLang);
-	return postLang !== '' && (postLang !== targetLang || pollLang !== targetLang);
+	if (appearNote.value.text) {
+		const postLang = detectLanguage(appearNote.value.text);
+		if (postLang !== '' && postLang !== targetLang) return true;
+	}
+	if (appearNote.value.poll) {
+		const foreignLang = appearNote.value.poll.choices
+			.map((choice) => detectLanguage(choice.text))
+			.filter((lang) => lang !== targetLang).length;
+		if (0 < foreignLang) return true;
+	}
+	return false;
 })();
 
 if (defaultStore.state.useAutoTranslate && instance.translatorAvailable && $i.policies.canUseTranslator && $i.policies.canUseAutoTranslate && (appearNote.value.cw == null || showContent.value) && appearNote.value.text && isForeignLanguage) translate();
@@ -699,6 +706,15 @@ async function translate(): Promise<void> {
 
 	vibrate(defaultStore.state.vibrateSystem ? 5 : []);
 
+	if (appearNote.value.text == null) {
+		translating.value = false;
+		translation.value = {
+			sourceLang: '',
+			text: '',
+		};
+		return;
+	}
+
 	const res = await misskeyApi('notes/translate', {
 		noteId: appearNote.value.id,
 		targetLang: miLocalStorage.getItem('lang') ?? navigator.language,