Ensure we do not add relations to the wrong timeline

spec/integ/matrix-client-event-timeline.spec.ts

@@ -1142,7 +1142,7 @@ describe("MatrixClient event timelines", function () {
 
         const prom = emitPromise(room, ThreadEvent.Update);
         // Assume we're seeing the reply while loading backlog
-        room.addLiveEvents([THREAD_REPLY2]);
+        await room.addLiveEvents([THREAD_REPLY2]);
         httpBackend
             .when(
                 "GET",
@@ -1156,7 +1156,7 @@ describe("MatrixClient event timelines", function () {
             });
         await flushHttp(prom);
         // but while loading the metadata, a new reply has arrived
-        room.addLiveEvents([THREAD_REPLY3]);
+        await room.addLiveEvents([THREAD_REPLY3]);
         const thread = room.getThread(THREAD_ROOT_UPDATED.event_id!)!;
         // then the events should still be all in the right order
         expect(thread.events.map((it) => it.getId())).toEqual([
@@ -1248,7 +1248,7 @@ describe("MatrixClient event timelines", function () {
 
         const prom = emitPromise(room, ThreadEvent.Update);
         // Assume we're seeing the reply while loading backlog
-        room.addLiveEvents([THREAD_REPLY2]);
+        await room.addLiveEvents([THREAD_REPLY2]);
         httpBackend
             .when(
                 "GET",
@@ -1267,7 +1267,7 @@ describe("MatrixClient event timelines", function () {
             });
         await flushHttp(prom);
         // but while loading the metadata, a new reply has arrived
-        room.addLiveEvents([THREAD_REPLY3]);
+        await room.addLiveEvents([THREAD_REPLY3]);
         const thread = room.getThread(THREAD_ROOT_UPDATED.event_id!)!;
         // then the events should still be all in the right order
         expect(thread.events.map((it) => it.getId())).toEqual([
@@ -1572,7 +1572,7 @@ describe("MatrixClient event timelines", function () {
                 respondToEvent(THREAD_ROOT_UPDATED);
                 respondToEvent(THREAD_ROOT_UPDATED);
                 respondToEvent(THREAD2_ROOT);
-                room.addLiveEvents([THREAD_REPLY2]);
+                await room.addLiveEvents([THREAD_REPLY2]);
                 await httpBackend.flushAllExpected();
                 await prom;
                 expect(thread.length).toBe(2);

spec/integ/matrix-client-unread-notifications.spec.ts

@@ -89,7 +89,7 @@ describe("MatrixClient syncing", () => {
 
         const thread = mkThread({ room, client: client!, authorId: selfUserId, participantUserIds: [selfUserId] });
         const threadReply = thread.events.at(-1)!;
-        room.addLiveEvents([thread.rootEvent]);
+        await room.addLiveEvents([thread.rootEvent]);
 
         // Initialize read receipt datastructure before testing the reaction
         room.addReceiptToStructure(thread.rootEvent.getId()!, ReceiptType.Read, selfUserId, { ts: 1 }, false);

spec/unit/models/thread.spec.ts

@@ -697,7 +697,7 @@ async function createThread(client: MatrixClient, user: string, roomId: string):
 
     // Ensure the root is in the room timeline
     root.setThreadId(root.getId());
-    room.addLiveEvents([root]);
+    await room.addLiveEvents([root]);
 
     // Create the thread and wait for it to be initialised
     const thread = room.createThread(root.getId()!, root, [], false);

src/client.ts

@@ -5573,11 +5573,13 @@ export class MatrixClient extends TypedEventEmitter<EmittedEvents, ClientEventHa
                         room.currentState.setUnknownStateEvents(stateEvents);
                     }
 
-                    const [timelineEvents, threadedEvents] = room.partitionThreadedEvents(matrixEvents);
+                    const [timelineEvents, threadedEvents, unknownRelations] =
+                        room.partitionThreadedEvents(matrixEvents);
 
                     this.processAggregatedTimelineEvents(room, timelineEvents);
                     room.addEventsToTimeline(timelineEvents, true, room.getLiveTimeline());
                     this.processThreadEvents(room, threadedEvents, true);
+                    unknownRelations.forEach((event) => room.relations.aggregateChildEvent(event));
 
                     room.oldState.paginationToken = res.end ?? null;
                     if (res.chunk.length === 0) {
@@ -5686,11 +5688,12 @@ export class MatrixClient extends TypedEventEmitter<EmittedEvents, ClientEventHa
             timeline.getState(EventTimeline.FORWARDS)!.paginationToken = res.end;
         }
 
-        const [timelineEvents, threadedEvents] = timelineSet.room.partitionThreadedEvents(events);
+        const [timelineEvents, threadedEvents, unknownRelations] = timelineSet.room.partitionThreadedEvents(events);
         timelineSet.addEventsToTimeline(timelineEvents, true, timeline, res.start);
         // The target event is not in a thread but process the contextual events, so we can show any threads around it.
         this.processThreadEvents(timelineSet.room, threadedEvents, true);
         this.processAggregatedTimelineEvents(timelineSet.room, timelineEvents);
+        unknownRelations.forEach((event) => timelineSet.relations.aggregateChildEvent(event));
 
         // There is no guarantee that the event ended up in "timeline" (we might have switched to a neighbouring
         // timeline) - so check the room's index again. On the other hand, there's no guarantee the event ended up
@@ -6230,14 +6233,15 @@ export class MatrixClient extends TypedEventEmitter<EmittedEvents, ClientEventHa
                     const matrixEvents = res.chunk.filter(noUnsafeEventProps).map(this.getEventMapper());
 
                     const timelineSet = eventTimeline.getTimelineSet();
-                    const [timelineEvents] = room.partitionThreadedEvents(matrixEvents);
+                    const [timelineEvents, , unknownRelations] = room.partitionThreadedEvents(matrixEvents);
                     timelineSet.addEventsToTimeline(timelineEvents, backwards, eventTimeline, token);
                     this.processAggregatedTimelineEvents(room, timelineEvents);
                     this.processThreadRoots(
                         room,
                         timelineEvents.filter((it) => it.getServerAggregatedRelation(THREAD_RELATION_TYPE.name)),
                         false,
                     );
+                    unknownRelations.forEach((event) => room.relations.aggregateChildEvent(event));
 
                     const atEnd = res.end === undefined || res.end === res.start;
 

src/models/event.ts

@@ -63,6 +63,7 @@ export interface IUnsigned {
     "transaction_id"?: string;
     "invite_room_state"?: StrippedState[];
     "m.relations"?: Record<RelationType | string, any>; // No common pattern for aggregated relations
+    "io.element.relation_thread_id"?: string;
 }
 
 export interface IThreadBundledRelationship {

src/models/room.ts

@@ -75,6 +75,8 @@ import { isPollEvent, Poll, PollEvent } from "./poll";
 export const KNOWN_SAFE_ROOM_VERSION = "9";
 const SAFE_ROOM_VERSIONS = ["1", "2", "3", "4", "5", "6", "7", "8", "9"];
 
+const UNSIGNED_THREAD_ID_FIELD = "io.element.relation_thread_id";
+
 interface IOpts {
     /**
      * Controls where pending messages appear in a room's timeline.
@@ -2132,6 +2134,13 @@ export class Room extends ReadReceipt<RoomEmittedEvents, RoomEventHandlerMap> {
             return this.eventShouldLiveIn(parentEvent, events, roots);
         }
 
+        if (!event.isRelation()) {
+            return {
+                shouldLiveInRoom: true,
+                shouldLiveInThread: false,
+            };
+        }
+
         // Edge case where we know the event is a relation but don't have the parentEvent
         if (roots?.has(event.relationEventId!)) {
             return {
@@ -2141,9 +2150,19 @@ export class Room extends ReadReceipt<RoomEmittedEvents, RoomEventHandlerMap> {
             };
         }
 
-        // We've exhausted all scenarios, can safely assume that this event should live in the room timeline only
+        const unsigned = event.getUnsigned();
+        if (typeof unsigned[UNSIGNED_THREAD_ID_FIELD] === "string") {
+            return {
+                shouldLiveInRoom: false,
+                shouldLiveInThread: true,
+                threadId: unsigned[UNSIGNED_THREAD_ID_FIELD],
+            };
+        }
+
+        // We've exhausted all scenarios,
+        // we cannot assume that it lives in the main timeline as this may be a relation for an unknown thread
         return {
-            shouldLiveInRoom: true,
+            shouldLiveInRoom: false,
             shouldLiveInThread: false,
         };
     }
@@ -2700,16 +2719,20 @@ export class Room extends ReadReceipt<RoomEmittedEvents, RoomEventHandlerMap> {
      * @param addLiveEventOptions - addLiveEvent options
      * @throws If `duplicateStrategy` is not falsey, 'replace' or 'ignore'.
      */
-    public addLiveEvents(events: MatrixEvent[], addLiveEventOptions?: IAddLiveEventOptions): void;
+    public async addLiveEvents(events: MatrixEvent[], addLiveEventOptions?: IAddLiveEventOptions): Promise<void>;
     /**
      * @deprecated In favor of the overload with `IAddLiveEventOptions`
      */
-    public addLiveEvents(events: MatrixEvent[], duplicateStrategy?: DuplicateStrategy, fromCache?: boolean): void;
-    public addLiveEvents(
+    public async addLiveEvents(
+        events: MatrixEvent[],
+        duplicateStrategy?: DuplicateStrategy,
+        fromCache?: boolean,
+    ): Promise<void>;
+    public async addLiveEvents(
         events: MatrixEvent[],
         duplicateStrategyOrOpts?: DuplicateStrategy | IAddLiveEventOptions,
         fromCache = false,
-    ): void {
+    ): Promise<void> {
         let duplicateStrategy: DuplicateStrategy | undefined = duplicateStrategyOrOpts as DuplicateStrategy;
         let timelineWasEmpty: boolean | undefined = false;
         if (typeof duplicateStrategyOrOpts === "object") {
@@ -2760,6 +2783,9 @@ export class Room extends ReadReceipt<RoomEmittedEvents, RoomEventHandlerMap> {
             timelineWasEmpty,
         };
 
+        // List of extra events to check for being parents of any relations encountered
+        const neighbouringEvents = [...events];
+
         for (const event of events) {
             // TODO: We should have a filter to say "only add state event types X Y Z to the timeline".
             this.processLiveEvent(event);
@@ -2773,19 +2799,44 @@ export class Room extends ReadReceipt<RoomEmittedEvents, RoomEventHandlerMap> {
                 }
             }
 
-            const { shouldLiveInRoom, shouldLiveInThread, threadId } = this.eventShouldLiveIn(
+            let { shouldLiveInRoom, shouldLiveInThread, threadId } = this.eventShouldLiveIn(
                 event,
-                events,
+                neighbouringEvents,
                 threadRoots,
             );
 
+            if (!shouldLiveInThread && !shouldLiveInRoom && event.isRelation()) {
+                try {
+                    const parentEvent = new MatrixEvent(
+                        await this.client.fetchRoomEvent(this.roomId, event.relationEventId!),
+                    );
+                    neighbouringEvents.push(parentEvent);
+                    if (parentEvent.threadRootId) {
+                        threadRoots.add(parentEvent.threadRootId);
+                        const unsigned = event.getUnsigned();
+                        unsigned[UNSIGNED_THREAD_ID_FIELD] = parentEvent.threadRootId;
+                        event.setUnsigned(unsigned);
+                    }
+
+                    ({ shouldLiveInRoom, shouldLiveInThread, threadId } = this.eventShouldLiveIn(
+                        event,
+                        neighbouringEvents,
+                        threadRoots,
+                    ));
+                } catch (e) {
+                    logger.error("Failed to load parent event of unhandled relation", e);
+                }
+            }
+
             if (shouldLiveInThread && !eventsByThread[threadId ?? ""]) {
                 eventsByThread[threadId ?? ""] = [];
             }
             eventsByThread[threadId ?? ""]?.push(event);
 
             if (shouldLiveInRoom) {
                 this.addLiveEvent(event, options);
+            } else if (!shouldLiveInThread && event.isRelation()) {
+                this.relations.aggregateChildEvent(event);
             }
         }
 
@@ -2796,13 +2847,14 @@ export class Room extends ReadReceipt<RoomEmittedEvents, RoomEventHandlerMap> {
 
     public partitionThreadedEvents(
         events: MatrixEvent[],
-    ): [timelineEvents: MatrixEvent[], threadedEvents: MatrixEvent[]] {
+    ): [timelineEvents: MatrixEvent[], threadedEvents: MatrixEvent[], unknownRelations: MatrixEvent[]] {
         // Indices to the events array, for readability
         const ROOM = 0;
         const THREAD = 1;
+        const UNKNOWN_RELATION = 2;
         if (this.client.supportsThreads()) {
             const threadRoots = this.findThreadRoots(events);
-            return events.reduce(
+            return events.reduce<[MatrixEvent[], MatrixEvent[], MatrixEvent[]]>(
                 (memo, event: MatrixEvent) => {
                     const { shouldLiveInRoom, shouldLiveInThread, threadId } = this.eventShouldLiveIn(
                         event,
@@ -2819,13 +2871,17 @@ export class Room extends ReadReceipt<RoomEmittedEvents, RoomEventHandlerMap> {
                         memo[THREAD].push(event);
                     }
 
+                    if (!shouldLiveInThread && !shouldLiveInRoom) {
+                        memo[UNKNOWN_RELATION].push(event);
+                    }
+
                     return memo;
                 },
-                [[] as MatrixEvent[], [] as MatrixEvent[]],
+                [[], [], []],
             );
         } else {
             // When `experimentalThreadSupport` is disabled treat all events as timelineEvents
-            return [events as MatrixEvent[], [] as MatrixEvent[]];
+            return [events as MatrixEvent[], [] as MatrixEvent[], [] as MatrixEvent[]];
         }
     }
 
@@ -2838,6 +2894,10 @@ export class Room extends ReadReceipt<RoomEmittedEvents, RoomEventHandlerMap> {
             if (event.isRelation(THREAD_RELATION_TYPE.name)) {
                 threadRoots.add(event.relationEventId ?? "");
             }
+            const unsigned = event.getUnsigned();
+            if (typeof unsigned[UNSIGNED_THREAD_ID_FIELD] === "string") {
+                threadRoots.add(unsigned[UNSIGNED_THREAD_ID_FIELD]);
+            }
         }
         return threadRoots;
     }

src/sliding-sync-sdk.ts

@@ -628,7 +628,7 @@ export class SlidingSyncSdk {
 
         if (roomData.invite_state) {
             const inviteStateEvents = mapEvents(this.client, room.roomId, roomData.invite_state);
-            this.injectRoomEvents(room, inviteStateEvents);
+            await this.injectRoomEvents(room, inviteStateEvents);
             if (roomData.initial) {
                 room.recalculate();
                 this.client.store.storeRoom(room);
@@ -700,7 +700,7 @@ export class SlidingSyncSdk {
             }
         } */
 
-        this.injectRoomEvents(room, stateEvents, timelineEvents, roomData.num_live);
+        await this.injectRoomEvents(room, stateEvents, timelineEvents, roomData.num_live);
 
         // we deliberately don't add ephemeral events to the timeline
         room.addEphemeralEvents(ephemeralEvents);
@@ -747,12 +747,12 @@ export class SlidingSyncSdk {
      * @param numLive - the number of events in timelineEventList which just happened,
      * supplied from the server.
      */
-    public injectRoomEvents(
+    public async injectRoomEvents(
         room: Room,
         stateEventList: MatrixEvent[],
         timelineEventList?: MatrixEvent[],
         numLive?: number,
-    ): void {
+    ): Promise<void> {
         timelineEventList = timelineEventList || [];
         stateEventList = stateEventList || [];
         numLive = numLive || 0;
@@ -811,11 +811,11 @@ export class SlidingSyncSdk {
         // if the timeline has any state events in it.
         // This also needs to be done before running push rules on the events as they need
         // to be decorated with sender etc.
-        room.addLiveEvents(timelineEventList, {
+        await room.addLiveEvents(timelineEventList, {
             fromCache: true,
         });
         if (liveTimelineEvents.length > 0) {
-            room.addLiveEvents(liveTimelineEvents, {
+            await room.addLiveEvents(liveTimelineEvents, {
                 fromCache: false,
             });
         }

src/sync.ts

@@ -501,7 +501,7 @@ export class SyncApi {
                 },
             )
             .then(
-                (res) => {
+                async (res) => {
                     if (this._peekRoom !== peekRoom) {
                         debuglog("Stopped peeking in room %s", peekRoom.roomId);
                         return;
@@ -541,7 +541,7 @@ export class SyncApi {
                         })
                         .map(this.client.getEventMapper());
 
-                    peekRoom.addLiveEvents(events);
+                    await peekRoom.addLiveEvents(events);
                     this.peekPoll(peekRoom, res.end);
                 },
                 (err) => {
@@ -1773,7 +1773,7 @@ export class SyncApi {
         // if the timeline has any state events in it.
         // This also needs to be done before running push rules on the events as they need
         // to be decorated with sender etc.
-        room.addLiveEvents(timelineEventList || [], {
+        await room.addLiveEvents(timelineEventList || [], {
             fromCache,
             timelineWasEmpty,
         });