From 786b150ea75111b5f6102c256d5cfa42cb83d1fb Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Wed, 31 Aug 2022 00:24:33 +0900
Subject: refactor(client): align filename to component name

---
 .../client/src/components/MkReactionsViewer.vue    | 36 ++++++++++++++++++++++
 1 file changed, 36 insertions(+)
 create mode 100644 packages/client/src/components/MkReactionsViewer.vue

(limited to 'packages/client/src/components/MkReactionsViewer.vue')

diff --git a/packages/client/src/components/MkReactionsViewer.vue b/packages/client/src/components/MkReactionsViewer.vue
new file mode 100644
index 0000000000..a88311efa1
--- /dev/null
+++ b/packages/client/src/components/MkReactionsViewer.vue
@@ -0,0 +1,36 @@
+<template>
+<div class="tdflqwzn" :class="{ isMe }">
+	<XReaction v-for="(count, reaction) in note.reactions" :key="reaction" :reaction="reaction" :count="count" :is-initial="initialReactions.has(reaction)" :note="note"/>
+</div>
+</template>
+
+<script lang="ts" setup>
+import { computed } from 'vue';
+import * as misskey from 'misskey-js';
+import { $i } from '@/account';
+import XReaction from '@/components/MkReactionsViewer.reaction.vue';
+
+const props = defineProps<{
+	note: misskey.entities.Note;
+}>();
+
+const initialReactions = new Set(Object.keys(props.note.reactions));
+
+const isMe = computed(() => $i && $i.id === props.note.userId);
+</script>
+
+<style lang="scss" scoped>
+.tdflqwzn {
+	margin: 4px -2px 0 -2px;
+
+	&:empty {
+		display: none;
+	}
+
+	&.isMe {
+		> span {
+			cursor: default !important;
+		}
+	}
+}
+</style>
-- 
cgit v1.2.3-freya