misty.cafe/mistykey
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions

extract common translation UI into SkNoteTranslation.vue

Browse source
This commit is contained in:
Hazelnoot 2025-05-18 14:51:22 -04:00
parent cbb0f5a964
commit c412f5d69a
7 changed files with 67 additions and 92 deletions
Download patch file Download diff file Expand all files Collapse all files

17
packages/frontend/src/components/SkNote.vue
View file

@ -88,14 +88,7 @@ SPDX-License-Identifier: AGPL-3.0-only
:isAnim="allowAnim"
:isBlock="true"
/>
<div v-if="translating || translation != null" :class="$style.translation">
<MkLoading v-if="translating" mini/>
<div v-else-if="translation && translation.text != null">
<b v-if="translation.sourceLang">{{ i18n.tsx.translatedFrom({ x: translation.sourceLang }) }}: </b>
<Mfm :text="translation.text" :isBlock="true" :author="appearNote.user" :nyaize="'respect'" :emojiUrls="appearNote.emojis" class="_selectable"/>
</div>
<div v-else>{{ i18n.ts.translationFailed }}</div>
</div>
<SkNoteTranslation :note="note" :translation="translation" :translating="translating"></SkNoteTranslation>
<MkButton v-if="!allowAnim && animated" :class="$style.playMFMButton" :small="true" @click="animatedMFM()" @click.stop><i class="ph-play ph-bold ph-lg "></i> {{ i18n.ts._animatedMFM.play }}</MkButton>
<MkButton v-else-if="!prefer.s.animatedMfm && allowAnim && animated" :class="$style.playMFMButton" :small="true" @click="animatedMFM()" @click.stop><i class="ph-stop ph-bold ph-lg "></i> {{ i18n.ts._animatedMFM.stop }}</MkButton>
</div>
@ -241,6 +234,7 @@ import { getPluginHandlers } from '@/plugin.js';
import { DI } from '@/di.js';
import { useRouter } from '@/router.js';
import SkMutedNote from '@/components/SkMutedNote.vue';
import SkNoteTranslation from '@/components/SkNoteTranslation.vue';
const props = withDefaults(defineProps<{
note: Misskey.entities.Note;
@ -1203,13 +1197,6 @@ function emitUpdReaction(emoji: string, delta: number) {
margin-right: 0.5em;
}
.translation {
border: solid 0.5px var(--MI_THEME-divider);
border-radius: var(--MI-radius);
padding: 12px;
margin-top: 8px;
}
.urlPreview {
margin-top: 8px;
}