Stop propagation in ReactionViewer

This commit is contained in:
Ken Powers 2020-01-23 14:59:29 -05:00 committed by Scott Nonnenberg
parent 109c40e055
commit 1b975bec65

View file

@ -61,25 +61,26 @@ export const ReactionViewer = React.forwardRef<HTMLDivElement, Props>(
<header className="module-reaction-viewer__header"> <header className="module-reaction-viewer__header">
{emojis {emojis
.filter(e => Boolean(grouped[e])) .filter(e => Boolean(grouped[e]))
.map((e, index) => { .map((emoji, index) => {
const re = grouped[e]; const re = grouped[emoji];
const maybeFocusRef = index === 0 ? focusRef : undefined; const maybeFocusRef = index === 0 ? focusRef : undefined;
return ( return (
<button <button
key={e} key={emoji}
ref={maybeFocusRef} ref={maybeFocusRef}
className={classNames( className={classNames(
'module-reaction-viewer__header__button', 'module-reaction-viewer__header__button',
selected === e selected === emoji
? 'module-reaction-viewer__header__button--selected' ? 'module-reaction-viewer__header__button--selected'
: null : null
)} )}
onClick={() => { onClick={event => {
setSelected(e); event.stopPropagation();
setSelected(emoji);
}} }}
> >
<Emoji size={18} emoji={e} /> <Emoji size={18} emoji={emoji} />
<span className="module-reaction-viewer__header__button__count"> <span className="module-reaction-viewer__header__button__count">
{re.length} {re.length}
</span> </span>