fix: Enhance logic of signalr.

2 files changed, 14 insertions, 12 deletions

diff --git a/FrontEnd/src/app/views/timeline-common/Timeline.tsx b/FrontEnd/src/app/views/timeline-common/Timeline.tsx
index 32d0bdd5..8bdf4d3b 100644
--- a/FrontEnd/src/app/views/timeline-common/Timeline.tsx
+++ b/FrontEnd/src/app/views/timeline-common/Timeline.tsx
@@ -7,6 +7,8 @@ import {
 } from "@/http/common";
 import { getHttpTimelineClient, HttpTimelinePostInfo } from "@/http/timeline";
 
+import { getTimelinePostUpdate$ } from "@/services/timeline";
+
 import TimelinePagedPostListView from "./TimelinePagedPostListView";
 import TimelineTop from "./TimelineTop";
 import TimelineLoading from "./TimelineLoading";
@@ -34,6 +36,18 @@ const Timeline: React.FC<TimelineProps> = (props) => {
   }, [timelineName]);
 
   React.useEffect(() => {
+    if (timelineName != null && state === "loaded") {
+      const timelinePostUpdate$ = getTimelinePostUpdate$(timelineName);
+      const subscription = timelinePostUpdate$.subscribe(() => {
+        onReload();
+      });
+      return () => {
+        subscription.unsubscribe();
+      };
+    }
+  }, [timelineName, state, onReload]);
+
+  React.useEffect(() => {
     if (timelineName != null) {
       let subscribe = true;
 
diff --git a/FrontEnd/src/app/views/timeline-common/TimelinePageTemplate.tsx b/FrontEnd/src/app/views/timeline-common/TimelinePageTemplate.tsx
index 4c0cc8e3..81a3c179 100644
--- a/FrontEnd/src/app/views/timeline-common/TimelinePageTemplate.tsx
+++ b/FrontEnd/src/app/views/timeline-common/TimelinePageTemplate.tsx
@@ -12,7 +12,6 @@ import TimelinePostEdit from "./TimelinePostEdit";
 
 import useReverseScrollPositionRemember from "@/utilities/useReverseScrollPositionRemember";
 import { generatePalette, setPalette } from "@/palette";
-import { getTimelinePostUpdate as getTimelinePostUpdate$ } from "@/services/timeline";
 
 export interface TimelinePageCardProps {
   timeline: HttpTimelineInfo;
@@ -92,17 +91,6 @@ const TimelinePageTemplate: React.FC<TimelinePageTemplateProps> = (props) => {
     setTimelineReloadKey((old) => old + 1);
   };
 
-  React.useEffect(() => {
-    const timelinePostUpdate$ = getTimelinePostUpdate$(timelineName);
-    const subscription = timelinePostUpdate$.subscribe(() => {
-      setTimelineReloadKey((old) => old + 1);
-    });
-
-    return () => {
-      subscription.unsubscribe();
-    };
-  }, [timelineName]);
-
   const onPostEditHeightChange = React.useCallback((height: number): void => {
     setBottomSpaceHeight(height);
     if (height === 0) {