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

26
packages/frontend/src/components/MkSubNoteContent.vue
View file

@ -12,14 +12,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<Mfm v-if="note.text" :text="note.text" :isBlock="true" :author="note.user" :nyaize="'respect'" :isAnim="allowAnim" :emojiUrls="note.emojis"/>
<MkButton v-if="!allowAnim && animated && !hideFiles" :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 && !hideFiles" :class="$style.playMFMButton" :small="true" @click="animatedMFM()" @click.stop><i class="ph-stop ph-bold ph-lg "></i> {{ i18n.ts._animatedMFM.stop }}</MkButton>
<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="note.user" :nyaize="'respect'" :emojiUrls="note.emojis" class="_selectable"/>
</div>
<div v-else>{{ i18n.ts.translationFailed }}</div>
</div>
<SkNoteTranslation :note="note" :translation="translation" :translating="translating"></SkNoteTranslation>
<MkA v-if="note.renoteId" :class="$style.rp" :to="`/notes/${note.renoteId}`" @click.stop>RN: ...</MkA>
</div>
<details v-if="note.files && note.files.length > 0" :open="!prefer.s.collapseFiles && !hideFiles">
@ -52,14 +45,20 @@ import * as os from '@/os.js';
import { checkAnimationFromMfm } from '@/utility/check-animated-mfm.js';
import { useRouter } from '@/router';
import { prefer } from '@/preferences.js';
import SkNoteTranslation from '@/components/SkNoteTranslation.vue';
const props = defineProps<{
const props = withDefaults(defineProps<{
note: Misskey.entities.Note;
translating?: boolean;
translation?: Misskey.entities.NotesTranslateResponse | false | null;
hideFiles?: boolean;
expandAllCws?: boolean;
}>();
}>(), {
translating: false,
translation: null,
hideFiles: false,
expandAllCws: false,
});
const router = useRouter();
@ -141,13 +140,6 @@ watch(() => props.expandAllCws, (expandAllCws) => {
color: var(--MI_THEME-renote);
}
.translation {
border: solid 0.5px var(--MI_THEME-divider);
border-radius: var(--MI-radius);
padding: 12px;
margin-top: 8px;
}
.showLess {
width: 100%;
margin-top: 14px;