From ad7db1e939fe0ad6072a7ce9489a75b698454702 Mon Sep 17 00:00:00 2001
From: infinite-persistence <inf.persistence@gmail.com>
Date: Fri, 16 Jul 2021 00:13:01 +0800
Subject: [PATCH] Reactions: wait for previous fetch to complete before
 fetching again.

This was causing duplicate IDs to be fetched over and over again when scrolling quickly.
---
 ui/component/commentsList/index.js | 2 ++
 ui/component/commentsList/view.jsx | 5 ++++-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/ui/component/commentsList/index.js b/ui/component/commentsList/index.js
index 7433f6990..72a5b2916 100644
--- a/ui/component/commentsList/index.js
+++ b/ui/component/commentsList/index.js
@@ -4,6 +4,7 @@ import {
   makeSelectTopLevelCommentsForUri,
   makeSelectTopLevelTotalPagesForUri,
   selectIsFetchingComments,
+  selectIsFetchingReacts,
   makeSelectTotalCommentsCountForUri,
   selectOthersReactsById,
   makeSelectCommentsDisabledForUri,
@@ -24,6 +25,7 @@ const select = (state, props) => {
     totalComments: makeSelectTotalCommentsCountForUri(props.uri)(state),
     claimIsMine: makeSelectClaimIsMine(props.uri)(state),
     isFetchingComments: selectIsFetchingComments(state),
+    isFetchingReacts: selectIsFetchingReacts(state),
     commentingEnabled: IS_WEB ? Boolean(selectUserVerifiedEmail(state)) : true,
     commentsDisabledBySettings: makeSelectCommentsDisabledForUri(props.uri)(state),
     fetchingChannels: selectFetchingMyChannels(state),
diff --git a/ui/component/commentsList/view.jsx b/ui/component/commentsList/view.jsx
index cd3d1e6b4..e3380cad7 100644
--- a/ui/component/commentsList/view.jsx
+++ b/ui/component/commentsList/view.jsx
@@ -37,6 +37,7 @@ type Props = {
   claimIsMine: boolean,
   myChannels: ?Array<ChannelClaim>,
   isFetchingComments: boolean,
+  isFetchingReacts: boolean,
   linkedCommentId?: string,
   totalComments: number,
   fetchingChannels: boolean,
@@ -59,6 +60,7 @@ function CommentList(props: Props) {
     claimIsMine,
     myChannels,
     isFetchingComments,
+    isFetchingReacts,
     linkedCommentId,
     totalComments,
     fetchingChannels,
@@ -122,7 +124,7 @@ function CommentList(props: Props) {
 
   // Fetch reacts
   useEffect(() => {
-    if (totalFetchedComments > 0 && ENABLE_COMMENT_REACTIONS && !fetchingChannels) {
+    if (totalFetchedComments > 0 && ENABLE_COMMENT_REACTIONS && !fetchingChannels && !isFetchingReacts) {
       let idsForReactionFetch;
 
       if (!othersReactsById || !myReactsByCommentId) {
@@ -151,6 +153,7 @@ function CommentList(props: Props) {
     uri,
     activeChannelId,
     fetchingChannels,
+    isFetchingReacts,
   ]);
 
   // Scroll to linked-comment