tweak merge reactions

packages/frontend/src/components/MkReactionsViewer.vue

@@ -25,26 +25,28 @@ import { defaultStore } from '@/store.js';
 import { customEmojisMap } from '@/custom-emojis.js';
 
 const localEmojiSet = new Set(Array.from(customEmojisMap.keys()));
-const emojiCache = new Map<string, boolean>();
+const emojiCache = new Map<string, { hasNative: boolean; base: string }>();
 
-function hasLocalEmoji(reaction: string): boolean {
+function getReactionInfo(reaction: string) {
-  if (emojiCache.has(reaction)) return emojiCache.get(reaction)!;
+  if (emojiCache.has(reaction)) {
-  
+    return emojiCache.get(reaction)!;
-  let result: boolean;
-  if (!reaction.includes(':')) {
-    result = true;
-  } else {
-    const emojiName = reaction.split('@')[0].split(':')[1];
-    result = localEmojiSet.has(emojiName);
   }
-  
-  emojiCache.set(reaction, result);
-  return result;
-}
 
-function getBaseReaction(reaction: string): string {
+  let hasNative: boolean;
-  if (!reaction.includes(':')) return reaction;
+  let base: string;
-  return `:${reaction.split('@')[0].split(':')[1]}:`;
+
+  if (!reaction.includes(':')) {
+    hasNative = true;
+    base = reaction;
+  } else {
+    const baseName = reaction.split('@')[0].split(':')[1];
+    hasNative = localEmojiSet.has(baseName);
+    base = hasNative ? `:${baseName}:` : reaction;
+  }
+
+  const info = { hasNative, base };
+  emojiCache.set(reaction, info);
+  return info;
 }
 
 const props = withDefaults(defineProps<{
@@ -67,22 +69,15 @@ const hasMoreReactions = ref(false);
 
 const mergedReactions = computed(() => {
   const reactionMap = new Map();
-  
+
   reactions.value.forEach(([reaction, count]) => {
-    if (!hasLocalEmoji(reaction)) {
+    const info = getReactionInfo(reaction);
-      if (reactionMap.has(reaction)) {
+    const key = info.base;
-        reactionMap.set(reaction, reactionMap.get(reaction) + count);
+
-      } else {
+    if (reactionMap.has(key)) {
-        reactionMap.set(reaction, count);
+      reactionMap.set(key, reactionMap.get(key) + count);
-      }
-      return;
-    }
-    
-    const baseReaction = getBaseReaction(reaction);
-    if (reactionMap.has(baseReaction)) {
-      reactionMap.set(baseReaction, reactionMap.get(baseReaction) + count);
     } else {
-      reactionMap.set(baseReaction, count);
+      reactionMap.set(key, count);
     }
   });
 
@@ -95,7 +90,7 @@ if (props.note.myReaction && !Object.keys(reactions.value).includes(props.note.m
 
 onBeforeMount(() => {
   Object.keys(props.note.reactions).forEach(reaction => {
-    hasLocalEmoji(reaction);
+    getReactionInfo(reaction);
   });
 });