From defcda519e8eddb7d259db0d6ea3a6991fff7f93 Mon Sep 17 00:00:00 2001
From: infiinte-persistence <inf.persistence@gmail.com>
Date: Tue, 23 Jun 2020 23:22:30 +0800
Subject: [PATCH] Inf-scroll: Remove history of whether we've serviced the
 bottom.

## Fixes:
4351: "Infinite load won't work if the same sort option clicked"

Test case:
1. Click Following
2. Click New
3. Scroll down to load at least 1 extra page.
4. Go up and click New again.

## The Issue:
`scrollBottomCbMap[page]` in this case did not reset since the `id` remained the same.

## The Fix:
I don't know how else to notify the effect to run. Perhaps "when `page=1`" is one criteria, but I found that removing `scrollBottomCbMap` can also fix it.

I don't know what scenario that `scrollBottomCbMap` was originally meant to handle, so will need to depend of reviewer to confirm I did not break something else. This fix assumes that recent inf-scroll fixes and debouncing would have addressed the "weird stuff happening with fast scrolling" problem mentioned in the comments.
---
 ui/component/claimList/view.jsx | 15 +++------------
 1 file changed, 3 insertions(+), 12 deletions(-)

diff --git a/ui/component/claimList/view.jsx b/ui/component/claimList/view.jsx
index 06e9bc18a..b6d945dc3 100644
--- a/ui/component/claimList/view.jsx
+++ b/ui/component/claimList/view.jsx
@@ -1,7 +1,7 @@
 // @flow
 import { MAIN_WRAPPER_CLASS } from 'component/app/view';
 import type { Node } from 'react';
-import React, { useEffect, useState } from 'react';
+import React, { useEffect } from 'react';
 import classnames from 'classnames';
 import ClaimPreview from 'component/claimPreview';
 import Spinner from 'component/spinner';
@@ -50,7 +50,6 @@ export default function ClaimList(props: Props) {
     onScrollBottom,
     pageSize,
     page,
-    id,
     showHiddenByUser,
     showUnresolvedClaims,
     renderProperties,
@@ -60,7 +59,6 @@ export default function ClaimList(props: Props) {
     timedOutMessage,
     isCardBody = false,
   } = props;
-  const [scrollBottomCbMap, setScrollBottomCbMap] = useState({});
   const [currentSort, setCurrentSort] = usePersistedState(persistedStorageKey, SORT_NEW);
   const timedOut = uris === null;
   const urisLength = (uris && uris.length) || 0;
@@ -70,13 +68,9 @@ export default function ClaimList(props: Props) {
     setCurrentSort(currentSort === SORT_NEW ? SORT_OLD : SORT_NEW);
   }
 
-  useEffect(() => {
-    setScrollBottomCbMap({});
-  }, [id, setScrollBottomCbMap]);
-
   useEffect(() => {
     const handleScroll = debounce(e => {
-      if (page && pageSize && onScrollBottom && !scrollBottomCbMap[page]) {
+      if (page && pageSize && onScrollBottom) {
         const mainElWrapper = document.querySelector(`.${MAIN_WRAPPER_CLASS}`);
 
         if (mainElWrapper && !loading && urisLength >= pageSize) {
@@ -84,9 +78,6 @@ export default function ClaimList(props: Props) {
 
           if (contentWrapperAtBottomOfPage) {
             onScrollBottom();
-
-            // Save that we've fetched this page to avoid weird stuff happening with fast scrolling
-            setScrollBottomCbMap({ ...scrollBottomCbMap, [page]: true });
           }
         }
       }
@@ -96,7 +87,7 @@ export default function ClaimList(props: Props) {
       window.addEventListener('scroll', handleScroll);
       return () => window.removeEventListener('scroll', handleScroll);
     }
-  }, [loading, onScrollBottom, urisLength, pageSize, page, setScrollBottomCbMap]);
+  }, [loading, onScrollBottom, urisLength, pageSize, page]);
 
   return (
     <section