From ca5bd55129029b8cfec4f4890bc0f61a7bd30cb6 Mon Sep 17 00:00:00 2001
From: Pavel Prichodko <14926950+prichodko@users.noreply.github.com>
Date: Tue, 14 Jun 2022 18:59:36 +0200
Subject: [PATCH] enforce the order of reactions

---
 .../src/components/reaction-popover/index.tsx             | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/status-react/src/components/reaction-popover/index.tsx b/packages/status-react/src/components/reaction-popover/index.tsx
index c7c71da3..ed71b140 100644
--- a/packages/status-react/src/components/reaction-popover/index.tsx
+++ b/packages/status-react/src/components/reaction-popover/index.tsx
@@ -48,13 +48,13 @@ export const ReactionPopover = (props: Props) => {
       {children}
       <Popover side="top" align="center" sideOffset={6}>
         <Flex gap={1} css={{ padding: 8 }}>
-          {Object.entries(reactions).map(([reaction, value]) => {
-            const emoji = emojis[reaction as Reaction]
+          {Object.entries(emojis).map(([type, emoji]) => {
+            const reaction = reactions[type]
             return (
               <Button
-                key={reaction}
+                key={type}
                 onClick={() => onClick(reaction as Reaction)}
-                active={value.me}
+                active={reaction.me}
                 aria-label={`React with ${emoji.symbol}`}
               >
                 <Image width={30} src={emoji.url} alt={emoji.symbol} />