diff --git a/src/components/structures/ThreadView.tsx b/src/components/structures/ThreadView.tsx index 042b8b3b924..381876c5ea5 100644 --- a/src/components/structures/ThreadView.tsx +++ b/src/components/structures/ThreadView.tsx @@ -20,7 +20,6 @@ import { Room } from 'matrix-js-sdk/src/models/room'; import { IEventRelation, MatrixEvent } from 'matrix-js-sdk/src/models/event'; import { TimelineWindow } from 'matrix-js-sdk/src/timeline-window'; import { Direction } from 'matrix-js-sdk/src/models/event-timeline'; -import { IRelationsRequestOpts } from 'matrix-js-sdk/src/@types/requests'; import { logger } from 'matrix-js-sdk/src/logger'; import classNames from 'classnames'; @@ -195,9 +194,7 @@ export default class ThreadView extends React.Component { thread, }, async () => { thread.emit(ThreadEvent.ViewThread); - await thread.fetchInitialEvents(); - this.nextBatch = thread.liveTimeline.getPaginationToken(Direction.Backward); - this.timelinePanel.current?.refreshTimeline(); + this.timelinePanel.current?.refreshTimeline(this.props.initialEvent?.getId()); }); } }; @@ -242,35 +239,13 @@ export default class ThreadView extends React.Component { } }; - private nextBatch: string; - private onPaginationRequest = async ( timelineWindow: TimelineWindow | null, direction = Direction.Backward, limit = 20, ): Promise => { - if (!Thread.hasServerSideSupport) { - timelineWindow.extend(direction, limit); - return true; - } - - const opts: IRelationsRequestOpts = { - limit, - }; - - if (this.nextBatch) { - opts.from = this.nextBatch; - } - - const { nextBatch } = await this.state.thread.fetchEvents(opts); - - this.nextBatch = nextBatch; - - // Advances the marker on the TimelineWindow to define the correct - // window of events to display on screen - timelineWindow.extend(direction, limit); - - return !!nextBatch; + timelineWindow.paginate(direction, limit); + return true; }; private onFileDrop = (dataTransfer: DataTransfer) => { diff --git a/src/components/structures/TimelinePanel.tsx b/src/components/structures/TimelinePanel.tsx index b14016d0be8..3299313a2b5 100644 --- a/src/components/structures/TimelinePanel.tsx +++ b/src/components/structures/TimelinePanel.tsx @@ -1408,8 +1408,13 @@ class TimelinePanel extends React.Component { // quite slow. So we detect that situation and shortcut straight to // calling _reloadEvents and updating the state. - const timeline = this.props.timelineSet.getTimelineForEvent(eventId); - if (timeline) { + let timeline: EventTimeline | null = null; + if (eventId) { + timeline = this.props.timelineSet.getTimelineForEvent(eventId); + } else { + timeline = this.props.timelineSet.getLiveTimeline(); + } + if (timeline && timeline.getEvents().length) { // This is a hot-path optimization by skipping a promise tick // by repeating a no-op sync branch in TimelineSet.getTimelineForEvent & MatrixClient.getEventTimeline this.timelineWindow.load(eventId, INITIAL_SIZE); // in this branch this method will happen in sync time @@ -1442,8 +1447,8 @@ class TimelinePanel extends React.Component { } // Force refresh the timeline before threads support pending events - public refreshTimeline(): void { - this.loadTimeline(); + public refreshTimeline(eventId?: string): void { + this.loadTimeline(eventId, undefined, undefined, false); this.reloadEvents(); } diff --git a/src/components/views/rooms/ThreadSummary.tsx b/src/components/views/rooms/ThreadSummary.tsx index c14a4cc9e14..c9e7b300181 100644 --- a/src/components/views/rooms/ThreadSummary.tsx +++ b/src/components/views/rooms/ThreadSummary.tsx @@ -94,7 +94,7 @@ export const ThreadMessagePreview = ({ thread, showDisplayname = false }: IPrevi await cli.decryptEventIfNeeded(lastReply); return MessagePreviewStore.instance.generatePreviewForEvent(lastReply); }, [lastReply, content]); - if (!preview) return null; + if (!preview || !lastReply) return null; return <>