v15.1.1

Add a way to listen to LocalStorage error events from element-web
and matrix-react-sdk in the same manner.

Related: https://github.com/vector-im/element-web/issues/18423

CHANGELOG.md

@@ -1,3 +1,17 @@
+Changes in [15.1.1](https://github.com/matrix-org/matrix-js-sdk/releases/tag/v15.1.1) (2021-11-22)
+==================================================================================================
+
+## 🐛 Bug Fixes
+ * Fix edit history being broken after editing an unencrypted event with an encrypted event ([\#2013](https://github.com/matrix-org/matrix-js-sdk/pull/2013)). Fixes vector-im/element-web#19651 and vector-im/element-web#19651. Contributed by @aaronraimist.
+ * Make events pagination responses parse threads ([\#2011](https://github.com/matrix-org/matrix-js-sdk/pull/2011)). Fixes vector-im/element-web#19587 and vector-im/element-web#19587.
+
+Changes in [15.1.1-rc.1](https://github.com/matrix-org/matrix-js-sdk/releases/tag/v15.1.1-rc.1) (2021-11-17)
+============================================================================================================
+
+## 🐛 Bug Fixes
+ * Fix edit history being broken after editing an unencrypted event with an encrypted event ([\#2013](https://github.com/matrix-org/matrix-js-sdk/pull/2013)). Fixes vector-im/element-web#19651 and vector-im/element-web#19651. Contributed by @aaronraimist.
+ * Make events pagination responses parse threads ([\#2011](https://github.com/matrix-org/matrix-js-sdk/pull/2011)). Fixes vector-im/element-web#19587 and vector-im/element-web#19587.
+
 Changes in [15.1.0](https://github.com/matrix-org/matrix-js-sdk/releases/tag/v15.1.0) (2021-11-08)
 ==================================================================================================
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "matrix-js-sdk",
-  "version": "15.1.0",
+  "version": "15.1.1",
   "description": "Matrix Client-Server SDK for Javascript",
   "scripts": {
     "prepublishOnly": "yarn build",

src/client.ts

@@ -4578,7 +4578,12 @@ export class MatrixClient extends EventEmitter {
                     const stateEvents = res.state.map(this.getEventMapper());
                     room.currentState.setUnknownStateEvents(stateEvents);
                 }
-                room.addEventsToTimeline(matrixEvents, true, room.getLiveTimeline());
+
+                const [timelineEvents, threadedEvents] = this.partitionThreadedEvents(matrixEvents);
+
+                room.addEventsToTimeline(timelineEvents, true, room.getLiveTimeline());
+                this.processThreadEvents(room, threadedEvents);
+
                 room.oldState.paginationToken = res.end;
                 if (res.chunk.length === 0) {
                     room.oldState.paginationToken = null;
@@ -4684,7 +4689,11 @@ export class MatrixClient extends EventEmitter {
                 const stateEvents = res.state.map(this.getEventMapper());
                 timeline.getState(EventTimeline.BACKWARDS).setUnknownStateEvents(stateEvents);
             }
-            timelineSet.addEventsToTimeline(matrixEvents, true, timeline, res.start);
+
+            const [timelineEvents, threadedEvents] = this.partitionThreadedEvents(matrixEvents);
+
+            timelineSet.addEventsToTimeline(timelineEvents, true, timeline, res.start);
+            this.processThreadEvents(timelineSet.room, threadedEvents);
 
             // there is no guarantee that the event ended up in "timeline" (we
             // might have switched to a neighbouring timeline) - so check the
@@ -4817,8 +4826,11 @@ export class MatrixClient extends EventEmitter {
                     matrixEvents[i] = event;
                 }
 
-                eventTimeline.getTimelineSet()
-                    .addEventsToTimeline(matrixEvents, backwards, eventTimeline, token);
+                const [timelineEvents, threadedEvents] = this.partitionThreadedEvents(matrixEvents);
+
+                const timelineSet = eventTimeline.getTimelineSet();
+                timelineSet.addEventsToTimeline(timelineEvents, backwards, eventTimeline, token);
+                this.processThreadEvents(timelineSet.room, threadedEvents);
 
                 // if we've hit the end of the timeline, we need to stop trying to
                 // paginate. We need to keep the 'forwards' token though, to make sure
@@ -4851,8 +4863,12 @@ export class MatrixClient extends EventEmitter {
                 }
                 const token = res.end;
                 const matrixEvents = res.chunk.map(this.getEventMapper());
+
+                const [timelineEvents, threadedEvents] = this.partitionThreadedEvents(matrixEvents);
+
                 eventTimeline.getTimelineSet()
-                    .addEventsToTimeline(matrixEvents, backwards, eventTimeline, token);
+                    .addEventsToTimeline(timelineEvents, backwards, eventTimeline, token);
+                this.processThreadEvents(room, threadedEvents);
 
                 // if we've hit the end of the timeline, we need to stop trying to
                 // paginate. We need to keep the 'forwards' token though, to make sure
@@ -5999,7 +6015,9 @@ export class MatrixClient extends EventEmitter {
         if (fetchedEventType === EventType.RoomMessageEncrypted) {
             const allEvents = originalEvent ? events.concat(originalEvent) : events;
             await Promise.all(allEvents.map(e => {
-                return new Promise(resolve => e.once("Event.decrypted", resolve));
+                if (e.isEncrypted()) {
+                    return new Promise(resolve => e.once("Event.decrypted", resolve));
+                }
             }));
             events = events.filter(e => e.getType() === eventType);
         }
@@ -8551,6 +8569,60 @@ export class MatrixClient extends EventEmitter {
             prefix: "/_matrix/client/unstable/im.nheko.summary",
         });
     }
+
+    public partitionThreadedEvents(events: MatrixEvent[]): [MatrixEvent[], MatrixEvent[]] {
+        // Indices to the events array, for readibility
+        const ROOM = 0;
+        const THREAD = 1;
+        const threadRoots = new Set<string>();
+        if (this.supportsExperimentalThreads()) {
+            return events.reduce((memo, event: MatrixEvent) => {
+                const room = this.getRoom(event.getRoomId());
+                // An event should live in the thread timeline if
+                // - It's a reply in thread event
+                // - It's related to a reply in thread event
+                let shouldLiveInThreadTimeline = event.isThreadRelation;
+                if (shouldLiveInThreadTimeline) {
+                    threadRoots.add(event.relationEventId);
+                } else {
+                    const parentEventId = event.parentEventId;
+                    const parentEvent = room?.findEventById(parentEventId) || events.find((mxEv: MatrixEvent) => {
+                        return mxEv.getId() === parentEventId;
+                    });
+                    shouldLiveInThreadTimeline = parentEvent?.isThreadRelation;
+
+                    // Copy all the reactions and annotations to the root event
+                    // to the thread timeline. They will end up living in both
+                    // timelines at the same time
+                    const targetingThreadRoot = parentEvent?.isThreadRoot || threadRoots.has(event.relationEventId);
+                    if (targetingThreadRoot && !event.isThreadRelation && event.relationEventId) {
+                        memo[THREAD].push(event);
+                    }
+                }
+                const targetTimeline = shouldLiveInThreadTimeline ? THREAD : ROOM;
+                memo[targetTimeline].push(event);
+                return memo;
+            }, [[], []]);
+        } else {
+            // When `experimentalThreadSupport` is disabled
+            // treat all events as timelineEvents
+            return [
+                events,
+                [],
+            ];
+        }
+    }
+
+    /**
+     * @experimental
+     */
+    public processThreadEvents(room: Room, threadedEvents: MatrixEvent[]): void {
+        threadedEvents
+            .sort((a, b) => a.getTs() - b.getTs())
+            .forEach(event => {
+                room.addThreadedEvent(event);
+            });
+    }
 }
 
 /**

src/interactive-auth.ts

@@ -61,6 +61,7 @@ export enum AuthType {
     Sso = "m.login.sso",
     SsoUnstable = "org.matrix.login.sso",
     Dummy = "m.login.dummy",
+    RegistrationToken = "org.matrix.msc3231.login.registration_token",
 }
 
 export interface IAuthDict {
@@ -449,6 +450,7 @@ export class InteractiveAuth {
             } catch (e) {
                 this.attemptAuthDeferred.reject(e);
                 this.attemptAuthDeferred = null;
+                return;
             }
 
             if (

src/models/base-model.ts

@@ -0,0 +1,51 @@
+/*
+Copyright 2021 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import { EventEmitter } from "events";
+
+/**
+ * Typed Event Emitter class which can act as a Base Model for all our model
+ * and communication events.
+ * This makes it much easier for us to distinguish between events, as we now need
+ * to properly type this, so that our events are not stringly-based and prone
+ * to silly typos.
+ */
+export abstract class BaseModel<Events extends string> extends EventEmitter {
+    public on(event: Events, listener: (...args: any[]) => void): this {
+        super.on(event, listener);
+        return this;
+    }
+
+    public once(event: Events, listener: (...args: any[]) => void): this {
+        super.once(event, listener);
+        return this;
+    }
+
+    public off(event: Events, listener: (...args: any[]) => void): this {
+        super.off(event, listener);
+        return this;
+    }
+
+    public addListener(event: Events, listener: (...args: any[]) => void): this {
+        super.addListener(event, listener);
+        return this;
+    }
+
+    public removeListener(event: Events, listener: (...args: any[]) => void): this {
+        super.removeListener(event, listener);
+        return this;
+    }
+}

src/models/event.ts

@@ -438,14 +438,14 @@ export class MatrixEvent extends EventEmitter {
      * @experimental
      */
     public get isThreadRoot(): boolean {
+        // TODO, change the inner working of this getter for it to use the
+        // bundled relationship return on the event, view MSC3440
         const thread = this.getThread();
         return thread?.id === this.getId();
     }
 
     public get parentEventId(): string {
-        const relations = this.getWireContent()["m.relates_to"];
-        return relations?.["m.in_reply_to"]?.["event_id"]
-            || relations?.event_id;
+        return this.replyEventId || this.relationEventId;
     }
 
     public get replyEventId(): string {
@@ -453,6 +453,12 @@ export class MatrixEvent extends EventEmitter {
         return relations?.["m.in_reply_to"]?.["event_id"];
     }
 
+    public get relationEventId(): string {
+        return this.getWireContent()
+            ?.["m.relates_to"]
+            ?.event_id;
+    }
+
     /**
      * Get the previous event content JSON. This will only return something for
      * state events which exist in the timeline.

src/models/room.ts

@@ -1270,8 +1270,11 @@ export class Room extends EventEmitter {
         if (!event) {
             return null;
         }
+
         if (event.isThreadRelation) {
             return this.threads.get(event.threadRootId);
+        } else if (event.isThreadRoot) {
+            return this.threads.get(event.getId());
         } else {
             const parentEvent = this.findEventById(event.parentEventId);
             return this.findThreadForEvent(parentEvent);

src/models/thread.ts

@@ -14,12 +14,12 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import { EventEmitter } from "events";
 import { MatrixClient } from "../matrix";
 import { MatrixEvent } from "./event";
 import { EventTimeline } from "./event-timeline";
 import { EventTimelineSet } from './event-timeline-set';
 import { Room } from './room';
+import { BaseModel } from "./base-model";
 
 export enum ThreadEvent {
     New = "Thread.new",
@@ -30,7 +30,7 @@ export enum ThreadEvent {
 /**
  * @experimental
  */
-export class Thread extends EventEmitter {
+export class Thread extends BaseModel<ThreadEvent> {
     /**
      * A reference to the event ID at the top of the thread
      */
@@ -105,6 +105,15 @@ export class Thread extends EventEmitter {
         return this.timelineSet.findEventById(eventId);
     }
 
+    /**
+     * Return last reply to the thread
+     */
+    public get lastReply(): MatrixEvent {
+        const threadReplies = this.events
+            .filter(event => event.isThreadRelation);
+        return threadReplies[threadReplies.length - 1];
+    }
+
     /**
      * Determines thread's ready status
      */
@@ -174,29 +183,4 @@ export class Thread extends EventEmitter {
     public has(eventId: string): boolean {
         return this.timelineSet.findEventById(eventId) instanceof MatrixEvent;
     }
-
-    public on(event: ThreadEvent, listener: (...args: any[]) => void): this {
-        super.on(event, listener);
-        return this;
-    }
-
-    public once(event: ThreadEvent, listener: (...args: any[]) => void): this {
-        super.once(event, listener);
-        return this;
-    }
-
-    public off(event: ThreadEvent, listener: (...args: any[]) => void): this {
-        super.off(event, listener);
-        return this;
-    }
-
-    public addListener(event: ThreadEvent, listener: (...args: any[]) => void): this {
-        super.addListener(event, listener);
-        return this;
-    }
-
-    public removeListener(event: ThreadEvent, listener: (...args: any[]) => void): this {
-        super.removeListener(event, listener);
-        return this;
-    }
 }

src/store/local-storage-events-emitter.ts

@@ -0,0 +1,37 @@
+/*
+Copyright 2021 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import { BaseModel } from "../models/base-model";
+
+export enum LocalStorageErrors {
+    Global = 'Global',
+    SetItemError = 'setItem',
+    GetItemError = 'getItem',
+    RemoveItemError = 'removeItem',
+    ClearError = 'clear',
+    QuotaExceededError = 'QuotaExceededError'
+}
+
+/**
+ * Used in element-web as a temporary hack to handle all the localStorage errors on the highest level possible
+ * As of 15.11.2021 (DD/MM/YYYY) we're not properly handling local storage exceptions anywhere.
+ * This store, as an event emitter, is used to re-emit local storage exceptions so that we can handle them
+ * and show some kind of a "It's dead Jim" modal to the users, telling them that hey,
+ * maybe you should check out your disk, as it's probably dying and your session may die with it.
+ * See: https://github.com/vector-im/element-web/issues/18423
+ */
+class LocalStorageErrorsEventsEmitter extends BaseModel<LocalStorageErrors> {}
+export const localStorageErrorsEventsEmitter = new LocalStorageErrorsEventsEmitter();

src/sync.ts

@@ -285,7 +285,7 @@ export class SyncApi {
                 }
                 leaveObj.timeline = leaveObj.timeline || {};
                 const events = this.mapSyncEventsFormat(leaveObj.timeline, room);
-                const [timelineEvents, threadedEvents] = this.partitionThreadedEvents(events);
+                const [timelineEvents, threadedEvents] = this.client.partitionThreadedEvents(events);
 
                 const stateEvents = this.mapSyncEventsFormat(leaveObj.state, room);
 
@@ -307,39 +307,6 @@ export class SyncApi {
         });
     }
 
-    /**
-     * Split events between the ones that will end up in the main
-     * room timeline versus the one that need to be processed in a thread
-     * @experimental
-     */
-    public partitionThreadedEvents(events: MatrixEvent[]): [MatrixEvent[], MatrixEvent[]] {
-        if (this.opts.experimentalThreadSupport) {
-            return events.reduce((memo, event: MatrixEvent) => {
-                const room = this.client.getRoom(event.getRoomId());
-                // An event should live in the thread timeline if
-                // - It's a reply in thread event
-                // - It's related to a reply in thread event
-                let shouldLiveInThreadTimeline = event.isThreadRelation;
-                if (!shouldLiveInThreadTimeline) {
-                    const parentEventId = event.parentEventId;
-                    const parentEvent = room?.findEventById(parentEventId) || events.find((mxEv: MatrixEvent) => {
-                        return mxEv.getId() === parentEventId;
-                    });
-                    shouldLiveInThreadTimeline = parentEvent?.isThreadRelation;
-                }
-                memo[shouldLiveInThreadTimeline ? 1 : 0].push(event);
-                return memo;
-            }, [[], []]);
-        } else {
-            // When `experimentalThreadSupport` is disabled
-            // treat all events as timelineEvents
-            return [
-                events,
-                [],
-            ];
-        }
-    }
-
     /**
      * Peek into a room. This will result in the room in question being synced so it
      * is accessible via getRooms(). Live updates for the room will be provided.
@@ -1320,7 +1287,7 @@ export class SyncApi {
                 }
             }
 
-            const [timelineEvents, threadedEvents] = this.partitionThreadedEvents(events);
+            const [timelineEvents, threadedEvents] = this.client.partitionThreadedEvents(events);
 
             this.processRoomEvents(room, stateEvents, timelineEvents, syncEventData.fromCache);
             this.processThreadEvents(room, threadedEvents);
@@ -1388,7 +1355,7 @@ export class SyncApi {
             const events = this.mapSyncEventsFormat(leaveObj.timeline, room);
             const accountDataEvents = this.mapSyncEventsFormat(leaveObj.account_data);
 
-            const [timelineEvents, threadedEvents] = this.partitionThreadedEvents(events);
+            const [timelineEvents, threadedEvents] = this.client.partitionThreadedEvents(events);
 
             this.processRoomEvents(room, stateEvents, timelineEvents);
             this.processThreadEvents(room, threadedEvents);
@@ -1734,11 +1701,7 @@ export class SyncApi {
      * @experimental
      */
     private processThreadEvents(room: Room, threadedEvents: MatrixEvent[]): void {
-        threadedEvents
-            .sort((a, b) => a.getTs() - b.getTs())
-            .forEach(event => {
-                room.addThreadedEvent(event);
-            });
+        return this.client.processThreadEvents(room, threadedEvents);
     }
 
     // extractRelatedEvents(event: MatrixEvent, events: MatrixEvent[], relatedEvents: MatrixEvent[] = []): MatrixEvent[] {