From db73667324f750662b8e68c22c308a36018bdb03 Mon Sep 17 00:00:00 2001
From: Janne Mareike Koschinski <jannemk@element.io>
Date: Thu, 6 Oct 2022 02:19:05 +0200
Subject: [PATCH] initial working poc

---
 src/components/structures/ThreadPanel.tsx     |  1 +
 src/components/structures/ThreadView.tsx      | 30 ++-----------------
 .../context_menus/MessageContextMenu.tsx      |  4 ++-
 src/stores/widgets/StopGapWidgetDriver.ts     |  8 ++---
 src/utils/EventUtils.ts                       |  6 +++-
 5 files changed, 13 insertions(+), 36 deletions(-)

diff --git a/src/components/structures/ThreadPanel.tsx b/src/components/structures/ThreadPanel.tsx
index 245c604c0aff..7d7371e55693 100644
--- a/src/components/structures/ThreadPanel.tsx
+++ b/src/components/structures/ThreadPanel.tsx
@@ -230,6 +230,7 @@ const ThreadPanel: React.FC<IProps> = ({
 
     useEffect(() => {
         if (timelineSet && !Thread.hasServerSideSupport) {
+            timelineSet.resetLiveTimeline();
             timelinePanel.current.refreshTimeline();
         }
     }, [timelineSet, timelinePanel]);
diff --git a/src/components/structures/ThreadView.tsx b/src/components/structures/ThreadView.tsx
index 042b8b3b9246..5b9e28b7b598 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<IProps, IState> {
                 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,12 @@ export default class ThreadView extends React.Component<IProps, IState> {
         }
     };
 
-    private nextBatch: string;
-
     private onPaginationRequest = async (
         timelineWindow: TimelineWindow | null,
         direction = Direction.Backward,
         limit = 20,
     ): Promise<boolean> => {
-        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;
+        return timelineWindow.paginate(direction, limit);
     };
 
     private onFileDrop = (dataTransfer: DataTransfer) => {
diff --git a/src/components/views/context_menus/MessageContextMenu.tsx b/src/components/views/context_menus/MessageContextMenu.tsx
index b19ce20033b1..f6961b627eaa 100644
--- a/src/components/views/context_menus/MessageContextMenu.tsx
+++ b/src/components/views/context_menus/MessageContextMenu.tsx
@@ -384,9 +384,11 @@ export default class MessageContextMenu extends React.Component<IProps, IState>
         const me = cli.getUserId();
         const {
             mxEvent, rightClick, link, eventTileOps, reactions, collapseReplyChain,
-            getRelationsForEvent, permalinkCreator,
             ...other
         } = this.props;
+        delete other.getRelationsForEvent;
+        delete other.permalinkCreator;
+
         const eventStatus = mxEvent.status;
         const unsentReactionsCount = this.getUnsentReactions().length;
         const contentActionable = isContentActionable(mxEvent);
diff --git a/src/stores/widgets/StopGapWidgetDriver.ts b/src/stores/widgets/StopGapWidgetDriver.ts
index 9de442a4b9dc..e0d0c6a6c267 100644
--- a/src/stores/widgets/StopGapWidgetDriver.ts
+++ b/src/stores/widgets/StopGapWidgetDriver.ts
@@ -442,12 +442,8 @@ export class StopGapWidgetDriver extends WidgetDriver {
             eventId,
             relationType ?? null,
             eventType ?? null,
-            {
-                from,
-                to,
-                limit,
-                direction: dir,
-            });
+            { from, to, limit, dir },
+        );
 
         return {
             chunk: events.map(e => e.getEffectiveEvent()),
diff --git a/src/utils/EventUtils.ts b/src/utils/EventUtils.ts
index d8cf66e55736..5d2dcb2af36e 100644
--- a/src/utils/EventUtils.ts
+++ b/src/utils/EventUtils.ts
@@ -238,8 +238,12 @@ export async function fetchInitialEvent(
     ) {
         const threadId = initialEvent.threadRootId;
         const room = client.getRoom(roomId);
+        const mapper = client.getEventMapper();
+        const rootEvent = room.findEventById(threadId)
+            ?? mapper(await client.fetchRoomEvent(roomId, threadId));
         try {
-            room.createThread(threadId, room.findEventById(threadId), [initialEvent], true);
+            const thread = room.createThread(threadId, rootEvent, [initialEvent], true);
+            initialEvent.setThread(thread);
         } catch (e) {
             logger.warn("Could not find root event: " + threadId);
         }