(fix) reactionViewer mock

packages/frontend/src/components/MkNote.vue

@@ -84,7 +84,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 				</div>
 				<MkA v-if="appearNote.channel && !inChannel" :class="$style.channel" :to="`/channels/${appearNote.channel.id}`"><i class="ti ti-device-tv"></i> {{ appearNote.channel.name }}</MkA>
 			</div>
-			<MkReactionsViewer :note="appearNote" :maxNumber="16">
+			<MkReactionsViewer :note="appearNote" :maxNumber="16" :mock="mock">
 				<template #more>
 					<div :class="$style.reactionOmitted">{{ i18n.ts.more }}</div>
 				</template>

packages/frontend/src/components/MkReactionsViewer.reaction.vue

@@ -34,6 +34,7 @@ const props = defineProps<{
 	count: number;
 	isInitial: boolean;
 	note: Misskey.entities.Note;
+	mock?: boolean;
 }>();
 
 const buttonEl = shallowRef<HTMLElement>();
@@ -51,7 +52,7 @@ async function toggleReaction() {
 			type: 'warning',
 			text: oldReaction !== props.reaction ? i18n.ts.changeReactionConfirm : i18n.ts.cancelReactionConfirm,
 		});
-		if (confirm.canceled) return;
+		if (confirm.canceled || props.mock) return;
 
 		os.api('notes/reactions/delete', {
 			noteId: props.note.id,
@@ -92,24 +93,26 @@ onMounted(() => {
 	if (!props.isInitial) anime();
 });
 
-useTooltip(buttonEl, async (showing) => {
+if (!props.mock) {
-	const reactions = await os.apiGet('notes/reactions', {
+	useTooltip(buttonEl, async (showing) => {
-		noteId: props.note.id,
+		const reactions = await os.apiGet('notes/reactions', {
-		type: props.reaction,
+			noteId: props.note.id,
-		limit: 11,
+			type: props.reaction,
-		_cacheKey_: props.count,
+			limit: 11,
-	});
+			_cacheKey_: props.count,
+		});
 
-	const users = reactions.map(x => x.user);
+		const users = reactions.map(x => x.user);
 
-	os.popup(XDetails, {
+		os.popup(XDetails, {
-		showing,
+			showing,
-		reaction: props.reaction,
+			reaction: props.reaction,
-		users,
+			users,
-		count: props.count,
+			count: props.count,
-		targetElement: buttonEl.value,
+			targetElement: buttonEl.value,
-	}, {}, 'closed');
+		}, {}, 'closed');
-}, 100);
+	}, 100);
+}
 </script>
 
 <style lang="scss" module>

packages/frontend/src/components/MkReactionsViewer.vue

@@ -12,7 +12,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	:moveClass="defaultStore.state.animation ? $style.transition_x_move : ''"
 	tag="div" :class="$style.root"
 >
-	<XReaction v-for="[reaction, count] in reactions" :key="reaction" :reaction="reaction" :count="count" :isInitial="initialReactions.has(reaction)" :note="note"/>
+	<XReaction v-for="[reaction, count] in reactions" :key="reaction" :reaction="reaction" :count="count" :isInitial="initialReactions.has(reaction)" :note="note" :mock="mock"/>
 	<slot v-if="hasMoreReactions" name="more"/>
 </TransitionGroup>
 </template>
@@ -26,8 +26,10 @@ import { defaultStore } from '@/store.js';
 const props = withDefaults(defineProps<{
 	note: Misskey.entities.Note;
 	maxNumber?: number;
+	mock?: boolean;
 }>(), {
 	maxNumber: Infinity,
+	mock: false,
 });
 
 const initialReactions = new Set(Object.keys(props.note.reactions));