aboutsummaryrefslogtreecommitdiff
path: root/FrontEnd/src/app/views
diff options
context:
space:
mode:
Diffstat (limited to 'FrontEnd/src/app/views')
-rw-r--r--FrontEnd/src/app/views/timeline-common/TimelinePagedPostListView.tsx35
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}