yume/paricafe
1
0
Fork 0
mirror of https://github.com/paricafe/misskey.git synced 2025-03-23 11:39:25 -05:00
Code Issues Projects Releases Packages Wiki Activity

frontend: fix merge reactions

Browse source
This commit is contained in:
FLY_MC 2025-03-12 05:49:01 +08:00
parent 24a0d3cd6f
commit 70f1e03443
2 changed files with 50 additions and 19 deletions

8
packages/frontend/src/components/MkReactionsViewer.reaction.vue
View file

@ -8,7 +8,7 @@ SPDX-License-Identifier: AGPL-3.0-only
ref="buttonEl"
v-ripple="canToggle"
class="_button"
:class="[$style.root, { [$style.reacted]: note.myReaction == reaction, [$style.canToggle]: canToggle, [$style.small]: prefer.s.reactionsDisplaySize === 'small', [$style.large]: prefer.s.reactionsDisplaySize === 'large' }]"
:class="[$style.root, { [$style.reacted]: isReacted, [$style.canToggle]: canToggle, [$style.small]: prefer.s.reactionsDisplaySize === 'small', [$style.large]: prefer.s.reactionsDisplaySize === 'large' }]"
@click="toggleReaction()"
@contextmenu.prevent.stop="menu"
>
@ -59,6 +59,12 @@ const canToggle = computed(() => {
});
const canGetInfo = computed(() => !props.reaction.match(/@\w/) && props.reaction.includes(':'));
const isReacted = computed(() => {
if (!props.note.myReaction) return false;
return normalizeReaction(props.note.myReaction) === normalizeReaction(props.reaction);
});
async function toggleReaction() {
if (!canToggle.value) return;

61
packages/frontend/src/components/MkReactionsViewer.vue
View file

@ -70,37 +70,62 @@ function onMockToggleReaction(emoji: string, count: number) {
watch([() => props.note.reactions, () => props.maxNumber], ([newSource, maxNumber]) => {
initialReactions.value = new Set(Object.keys(newSource));
const normalizedCounts = new Map<string, number>();
const normalizedOriginals = new Map<string, string>();
for (const [reaction, count] of Object.entries(newSource)) {
const normalized = normalizeReaction(reaction);
const currentCount = normalizedCounts.get(normalized) || 0;
normalizedCounts.set(normalized, currentCount + count);
if (!normalizedOriginals.has(normalized) || !reaction.includes('@')) {
normalizedOriginals.set(normalized, reaction);
}
}
let newReactions: [string, number][] = [];
hasMoreReactions.value = Object.keys(newSource).length > maxNumber;
for (let i = 0; i < reactions.value.length; i++) {
const reaction = reactions.value[i][0];
if (reaction in newSource && newSource[reaction] !== 0) {
reactions.value[i][1] = newSource[reaction];
newReactions.push(reactions.value[i]);
const [reaction] = reactions.value[i];
const normalized = normalizeReaction(reaction);
if (normalizedCounts.has(normalized) && normalizedCounts.get(normalized)! > 0) {
newReactions.push([
normalizedOriginals.get(normalized)!,
normalizedCounts.get(normalized)!,
]);
normalizedCounts.delete(normalized);
}
}
const newReactionsNames = newReactions.map(([x]) => x);
newReactions = [
...newReactions,
...Object.entries(newSource)
.sort(([, a], [, b]) => b - a)
.filter(([y], i) => i < maxNumber && !newReactionsNames.includes(y)),
];
const remainingEntries = Array.from(normalizedCounts.entries())
.filter(([, count]) => count > 0)
.sort(([, a], [, b]) => b - a);
newReactions = newReactions.slice(0, props.maxNumber);
for (const [normalized, count] of remainingEntries) {
if (newReactions.length < maxNumber) {
newReactions.push([normalizedOriginals.get(normalized)!, count]);
}
}
if (props.note.myReaction && !newReactions.map(([x]) => x).includes(props.note.myReaction)) {
hasMoreReactions.value = Object.keys(newSource).length > maxNumber;
if (props.note.myReaction) {
const normalizedMyReaction = normalizeReaction(props.note.myReaction);
const alreadyIncluded = newReactions.some(([x]) => normalizeReaction(x) === normalizedMyReaction);
const alreadyIncluded = newReactions.some(([x]) =>
normalizeReaction(x) === normalizedMyReaction,
);
if (!alreadyIncluded) {
newReactions.push([props.note.myReaction, newSource[props.note.myReaction]]);
if (!alreadyIncluded && newSource[props.note.myReaction]) {
newReactions.push([
props.note.myReaction,
newSource[props.note.myReaction],
]);
}
}
reactions.value = newReactions;
reactions.value = newReactions.slice(0, props.maxNumber);
}, { immediate: true, deep: true });
</script>