till/managarten
1
0
Fork 0
mirror of https://github.com/Memo-2023/mana-monorepo.git synced 2026-05-14 19:21:10 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

fix(feedback): ReactionBar stoppt Click-Bubbling

Browse source 
Wer in Feed/Workbench eine Reaction setzt, landete bisher direkt im
Detail-View — der Button-Click ist zur Card-onclick durchgesickert.

Fix in der Quelle: ReactionBar.handleClick ruft jetzt e.stopPropagation()
bevor onToggle feuert. Damit funktioniert es überall, wo Reactions in
einer klickbaren Hülle sitzen (Feed-Cards, MyReactedView, Detail-Page,
zukünftige Surfaces).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Till JS 2026-04-28 17:25:22 +02:00
parent f851f15a47
commit c7094207da
1 changed files with 6 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

8
packages/feedback/src/ReactionBar.svelte
View file

@ -31,7 +31,11 @@
let pendingEmoji = $state<string | null>(null); let pendingEmoji = $state<string | null>(null);
async function handleClick(emoji: ReactionEmoji) { async function handleClick(e: MouseEvent, emoji: ReactionEmoji) {
// Reaction-bars sit inside clickable cards (feedback feed, /me/reacted,
// detail page). Without stopPropagation, every reaction-click also
// triggers the card's onClick — user reacts and lands in detail-view.
e.stopPropagation();
if (readOnly || !onToggle) return; if (readOnly || !onToggle) return;
pendingEmoji = emoji; pendingEmoji = emoji;
try { try {
@ -62,7 +66,7 @@
title={readOnly ? readOnlyTooltip : `${REACTION_LABELS[emoji]} (${count})`} title={readOnly ? readOnlyTooltip : `${REACTION_LABELS[emoji]} (${count})`}
aria-pressed={mine} aria-pressed={mine}
aria-label={`${REACTION_LABELS[emoji]}: ${count}`} aria-label={`${REACTION_LABELS[emoji]}: ${count}`}
onclick={() => handleClick(emoji)} onclick={(e) => handleClick(e, emoji)}
> >
<span class="emoji">{emoji}</span> <span class="emoji">{emoji}</span>
{#if count > 0}<span class="count">{count}</span>{/if} {#if count > 0}<span class="count">{count}</span>{/if}