diff options
Diffstat (limited to 'FrontEnd/src/app/views/timeline-common')
| -rw-r--r-- | FrontEnd/src/app/views/timeline-common/TimelinePagedPostListView.tsx | 35 | 
1 files changed, 26 insertions, 9 deletions
| diff --git a/FrontEnd/src/app/views/timeline-common/TimelinePagedPostListView.tsx b/FrontEnd/src/app/views/timeline-common/TimelinePagedPostListView.tsx index b44a8ef6..ee52f4c0 100644 --- a/FrontEnd/src/app/views/timeline-common/TimelinePagedPostListView.tsx +++ b/FrontEnd/src/app/views/timeline-common/TimelinePagedPostListView.tsx @@ -1,8 +1,11 @@  import React from "react"; +import { fromEvent } from "rxjs"; +import { filter, throttleTime } from "rxjs/operators";  import { HttpTimelinePostInfo } from "@/http/timeline";  import TimelinePostListView from "./TimelinePostListView"; +import { setRecordDisabled } from "@/utilities/useReverseScrollPositionRemember";  export interface TimelinePagedPostListViewProps {    className?: string; @@ -24,18 +27,32 @@ const TimelinePagedPostListView: React.FC<TimelinePagedPostListViewProps> = (        : posts.slice(-lastViewCount);    }, [posts, lastViewCount]); +  const scrollTopHandler = React.useRef<() => void>(); +    React.useEffect(() => { -    if (lastViewCount < posts.length) { -      const listener = (): void => { -        if (window.scrollY === 0 && lastViewCount < posts.length) { -          setLastViewCount(lastViewCount + 10); -        } -      }; -      window.addEventListener("scroll", listener); -      return () => window.removeEventListener("scroll", listener); -    } +    scrollTopHandler.current = () => { +      if (lastViewCount < posts.length) { +        setRecordDisabled(true); +        setLastViewCount(lastViewCount + 10); +        setTimeout(() => { +          setRecordDisabled(false); +        }, 500); +      } +    };    }, [lastViewCount, posts]); +  React.useEffect(() => { +    const subscription = fromEvent(window, "scroll") +      .pipe( +        filter(() => window.scrollY === 0), +        throttleTime(800) +      ) +      .subscribe(() => { +        scrollTopHandler.current?.(); +      }); +    return () => subscription.unsubscribe(); +  }, []); +    return (      <TimelinePostListView        className={className} | 
