diff --git a/.changeset/fix-loading-spinner-flicker.md b/.changeset/fix-loading-spinner-flicker.md new file mode 100644 index 000000000..95260b0e6 --- /dev/null +++ b/.changeset/fix-loading-spinner-flicker.md @@ -0,0 +1,5 @@ +--- +default: patch +--- + +Fixed the message loading spinner flickering instead of continuing during large pagination chunks. diff --git a/src/app/hooks/timeline/useTimelineSync.ts b/src/app/hooks/timeline/useTimelineSync.ts index c10b762b8..e6eb89163 100644 --- a/src/app/hooks/timeline/useTimelineSync.ts +++ b/src/app/hooks/timeline/useTimelineSync.ts @@ -186,18 +186,24 @@ const useTimelinePagination = ( // that countAfter/stillHasToken comparisons are meaningful. const freshLTimelines = timelineRef.current.linkedTimelines; const firstTimeline = freshLTimelines[0]; - if (!firstTimeline) return; + if (!firstTimeline) { + (backwards ? setBackwardStatus : setForwardStatus)('idle'); + return; + } recalibratePagination(freshLTimelines); - (backwards ? setBackwardStatus : setForwardStatus)('idle'); const countAfter = getTimelinesEventsCount(getLinkedTimelines(firstTimeline)); const fetched = countAfter - countBefore; + let willContinue = false; if (fetched > 0 && fetched < 5) { const checkTimeline = backwards ? freshLTimelines[0] : freshLTimelines[freshLTimelines.length - 1]; - if (!checkTimeline) return; + if (!checkTimeline) { + (backwards ? setBackwardStatus : setForwardStatus)('idle'); + return; + } const checkDirection = backwards ? Direction.Backward : Direction.Forward; const stillHasToken = typeof getLinkedTimelines(checkTimeline)[0]?.getPaginationToken(checkDirection) === @@ -207,12 +213,18 @@ const useTimelinePagination = ( // so the finally block below does NOT reset it after inner claims. fetchingRef.current[directionKey] = false; continuing = true; + willContinue = true; paginate(backwards); // At this point the inner paginate has synchronously set // fetchingRef.current[directionKey] = true before hitting its own // await. The finally below will skip the reset. } } + + // Stay in 'loading' across auto-continuation chunks so the spinner does not flicker. + if (!willContinue) { + (backwards ? setBackwardStatus : setForwardStatus)('idle'); + } } } finally { // Only release the lock if we did NOT hand it to a recursive continuation.