From 1d0ea11eea1d068ffec6766fcd1a8d4077583728 Mon Sep 17 00:00:00 2001
From: Lhcfl <Lhcfl@outlook.com>
Date: Tue, 7 May 2024 23:23:19 +0800
Subject: [PATCH] fix: use note capture in MkNoteSimple

---
 .../client/src/components/MkNoteSimple.vue    | 38 ++++++++++++++++++-
 .../client/src/scripts/use-note-capture.ts    |  6 +--
 2 files changed, 39 insertions(+), 5 deletions(-)

diff --git a/packages/client/src/components/MkNoteSimple.vue b/packages/client/src/components/MkNoteSimple.vue
index 0560bd24ae..bf3ade8923 100644
--- a/packages/client/src/components/MkNoteSimple.vue
+++ b/packages/client/src/components/MkNoteSimple.vue
@@ -1,5 +1,10 @@
 <template>
-	<div v-size="{ min: [350, 500] }" class="yohlumlk">
+	<div
+		v-show="!deleted"
+		v-size="{ min: [350, 500] }"
+		class="yohlumlk"
+		ref="el"
+	>
 		<MkAvatar class="avatar" :user="note.user" />
 		<div class="main">
 			<XNoteHeader class="header" :note="note" :mini="true" />
@@ -14,11 +19,40 @@
 import type { entities } from "firefish-js";
 import XNoteHeader from "@/components/MkNoteHeader.vue";
 import MkSubNoteContent from "@/components/MkSubNoteContent.vue";
+import { computed, ref, watch } from "vue";
+import { deepClone } from "@/scripts/clone";
+import { useNoteCapture } from "@/scripts/use-note-capture";
+import { isDeleted } from "@/scripts/note";
 
-defineProps<{
+const props = defineProps<{
 	note: entities.Note;
 	pinned?: boolean;
 }>();
+
+const rootEl = ref<HTMLElement | null>(null);
+const note = ref(deepClone(props.note));
+const deleted = computed(() => isDeleted(note.value.id));
+let capture = useNoteCapture({
+	note,
+	rootEl,
+});
+
+function reload() {
+	note.value = deepClone(props.note);
+	capture.close();
+	capture = useNoteCapture({
+		note,
+		rootEl,
+	});
+}
+
+watch(
+	() => props.note.id,
+	(o, n) => {
+		if (o === n) return;
+		reload();
+	},
+);
 </script>
 
 <style lang="scss" scoped>
diff --git a/packages/client/src/scripts/use-note-capture.ts b/packages/client/src/scripts/use-note-capture.ts
index 443a6749d9..892eac144e 100644
--- a/packages/client/src/scripts/use-note-capture.ts
+++ b/packages/client/src/scripts/use-note-capture.ts
@@ -1,5 +1,5 @@
 import type { Ref } from "vue";
-import { onUnmounted } from "vue";
+import { onUnmounted, ref } from "vue";
 import { useStream } from "@/stream";
 import { isSignedIn, me } from "@/me";
 import * as os from "@/os";
@@ -33,7 +33,7 @@ function eachNote(id: NoteType["id"], cb: (note: Ref<NoteType>) => void) {
 export function useNoteCapture(props: {
 	rootEl: Ref<HTMLElement | null>;
 	note: Ref<NoteType>;
-	isDeletedRef: Ref<boolean>;
+	isDeletedRef?: Ref<boolean>;
 	onReplied?: (note: NoteType) => void;
 }) {
 	let closed = false;
@@ -42,7 +42,7 @@ export function useNoteCapture(props: {
 	addToNoteRefs(note);
 
 	function onDeleted() {
-		props.isDeletedRef.value = true;
+		if (props.isDeletedRef) props.isDeletedRef.value = true;
 		deletedNoteIds.set(note.value.id, true);
 
 		if (note.value.replyId) {