only show the popover when the information is ready

Expensify · Jun 11, 2024 · 6d719bb · 6d719bb
1 parent 7e8985f
commit 6d719bb
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/src/hooks/useBasePopoverReactionList/index.ts b/src/hooks/useBasePopoverReactionList/index.ts
@@ -22,6 +22,7 @@ export default function useBasePopoverReactionList({emojiName, emojiReactions, a
                 emojiCodes: [],
                 hasUserReacted: false,
                 users: [],
+                isReady: false,
             };
         }
 
@@ -34,6 +35,7 @@ export default function useBasePopoverReactionList({emojiName, emojiReactions, a
             reactionCount,
             hasUserReacted,
             users,
+            isReady: true,
         };
     }
 

diff --git a/src/pages/home/report/ReactionList/PopoverReactionList/BasePopoverReactionList.tsx b/src/pages/home/report/ReactionList/PopoverReactionList/BasePopoverReactionList.tsx
@@ -21,13 +21,12 @@ function BasePopoverReactionList(props: BasePopoverReactionListPropsWithLocalWit
         preferredLocale,
     });
     // Get the reaction information
-    const {emojiCodes, reactionCount, hasUserReacted, users} = getReactionInformation();
-
+    const {emojiCodes, reactionCount, hasUserReacted, users, isReady} = getReactionInformation();
     useImperativeHandle(ref, () => ({hideReactionList, showReactionList}));
 
     return (
         <PopoverWithMeasuredContent
-            isVisible={isPopoverVisible && !!reportActionID && !!emojiName}
+            isVisible={isPopoverVisible && isReady}
             onClose={hideReactionList}
             anchorPosition={popoverAnchorPosition}
             animationIn="fadeIn"