add translate button in MkNoteDetailed

This commit is contained in:
fly_mc 2024-10-17 23:57:29 +08:00
parent 246a5c5d48
commit 1ec351696c
2 changed files with 28 additions and 1 deletions

View file

@ -81,7 +81,7 @@ SPDX-License-Identifier: AGPL-3.0-only
:enableEmojiMenuReaction="true"
/>
<div v-if="$i.policies.canUseTranslator && appearNote.text && isForeignLanguage" style="padding-top: 5px; color: var(--MI_THEME-accent);">
<button v-if="!(translating || translation)" ref="translateButton" class="_button" @click.stop="translate()">{{ i18n.ts.translate }}</button>
<button v-if="!(translating || translation)" ref="translateButton" class="_button" @click.stop="translate()"><i class="ti ti-language-hiragana"></i>{{ i18n.ts.translate }}</button>
<button v-else class="_button" @click.stop="translation= null">{{ i18n.ts.close }}</button>
</div>
<div v-if="translating || translation" :class="$style.translation">

View file

@ -92,6 +92,10 @@ SPDX-License-Identifier: AGPL-3.0-only
:enableEmojiMenuReaction="true"
/>
<a v-if="appearNote.renote != null" :class="$style.rn">RN:</a>
<div v-if="$i.policies.canUseTranslator && appearNote.text && isForeignLanguage" style="padding-top: 5px; color: var(--MI_THEME-accent);">
<button v-if="!(translating || translation)" ref="translateButton" class="_button" @click.stop="translate()"><i class="ti ti-language-hiragana"></i>{{ i18n.ts.translate }}</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">
@ -273,6 +277,8 @@ import MkButton from '@/components/MkButton.vue';
import { isEnabledUrlPreview } from '@/instance.js';
import { getAppearNote } from '@/scripts/get-appear-note.js';
import { type Keymap } from '@/scripts/hotkey.js';
import { miLocalStorage } from '@/local-storage.js';
import detectLanguage from '@/scripts/detect-language.js';
const props = withDefaults(defineProps<{
note: Misskey.entities.Note;
@ -591,6 +597,27 @@ async function clip(): Promise<void> {
os.popupMenu(await getNoteClipMenu({ note: note.value, isDeleted }), clipButton.value).then(focus);
}
const isForeignLanguage: boolean = appearNote.value.text != null && (() => {
const targetLang = (miLocalStorage.getItem('lang') ?? navigator.language).slice(0, 2);
const postLang = detectLanguage(appearNote.value.text);
return postLang !== '' && postLang !== targetLang;
})();
async function translate(): Promise<void> {
if (translation.value != null) return;
collapsed.value = false;
translating.value = true;
if (props.mock) {
return;
}
const res = await misskeyApi('notes/translate', {
noteId: appearNote.value.id,
targetLang: miLocalStorage.getItem('lang') ?? navigator.language,
});
translating.value = false;
translation.value = res;
}
function showRenoteMenu(): void {
if (!isMyRenote) return;
pleaseLogin(undefined, pleaseLoginContext.value);