From fc5d75f8d4085c71d39890154b8fc6527736d84a Mon Sep 17 00:00:00 2001
From: Mar0xy <marie@kaifa.ch>
Date: Thu, 19 Oct 2023 22:23:27 +0200
Subject: [PATCH] fix: no translations on sub notes

Closes bug:  transfem-org/Sharkey#89
---
 packages/frontend/src/components/MkNoteSub.vue   |  4 ++--
 .../frontend/src/components/MkSubNoteContent.vue | 16 ++++++++++++++++
 2 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/packages/frontend/src/components/MkNoteSub.vue b/packages/frontend/src/components/MkNoteSub.vue
index 83c91e34ed..7cf5d1abfe 100644
--- a/packages/frontend/src/components/MkNoteSub.vue
+++ b/packages/frontend/src/components/MkNoteSub.vue
@@ -16,7 +16,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 					<MkCwButton v-model="showContent" :note="note"/>
 				</p>
 				<div v-show="note.cw == null || showContent">
-					<MkSubNoteContent :class="$style.text" :note="note"/>
+					<MkSubNoteContent :class="$style.text" :note="note" :translating="translating" :translation="translation"/>
 				</div>
 			</div>
 			<footer :class="$style.footer">
@@ -121,7 +121,7 @@ const props = withDefaults(defineProps<{
 
 const el = shallowRef<HTMLElement>();
 const muted = ref($i ? checkWordMute(props.note, $i, $i.mutedWords) : false);
-const translation = ref(null);
+const translation = ref<any>(null);
 const translating = ref(false);
 const isDeleted = ref(false);
 const renoted = ref(false);
diff --git a/packages/frontend/src/components/MkSubNoteContent.vue b/packages/frontend/src/components/MkSubNoteContent.vue
index 09a25e88ff..496ae3e457 100644
--- a/packages/frontend/src/components/MkSubNoteContent.vue
+++ b/packages/frontend/src/components/MkSubNoteContent.vue
@@ -10,6 +10,13 @@ SPDX-License-Identifier: AGPL-3.0-only
 		<span v-if="note.deletedAt" style="opacity: 0.5">({{ i18n.ts.deleted }})</span>
 		<MkA v-if="note.replyId" :class="$style.reply" :to="`/notes/${note.replyId}`" v-on:click.stop><i class="ph-arrow-bend-left-up ph-bold pg-lg"></i></MkA>
 		<Mfm v-if="note.text" :text="note.text" :author="note.user" :i="$i" :emojiUrls="note.emojis"/>
+		<div v-if="note.text && translating || note.text && translation" :class="$style.translation">
+			<MkLoading v-if="translating" mini/>
+			<div v-else>
+				<b>{{ i18n.t('translatedFrom', { x: translation.sourceLang }) }}: </b>
+				<Mfm :text="translation.text" :author="note.user" :i="$i" :emojiUrls="note.emojis"/>
+			</div>
+		</div>
 		<MkA v-if="note.renoteId" :class="$style.rp" :to="`/notes/${note.renoteId}`" v-on:click.stop>RN: ...</MkA>
 	</div>
 	<details v-if="note.files.length > 0" :open="!defaultStore.state.collapseFiles">
@@ -42,6 +49,8 @@ import { useRouter } from '@/router.js';
 
 const props = defineProps<{
 	note: Misskey.entities.Note;
+	translating?: boolean;
+	translation?: any;
 }>();
 
 const router = useRouter();
@@ -102,6 +111,13 @@ const collapsed = $ref(isLong);
 	color: var(--renote);
 }
 
+.translation {
+	border: solid 0.5px var(--divider);
+	border-radius: var(--radius);
+	padding: 12px;
+	margin-top: 8px;
+}
+
 .showLess {
 	width: 100%;
 	margin-top: 14px;