Support read markers on invisible events

src/js/events/hidden.js

@@ -0,0 +1,18 @@
+const {UngroupableEvent} = require("./event")
+
+class HiddenEvent extends UngroupableEvent {
+	constructor(data) {
+		super(data)
+		this.class("c-hidden-event")
+		this.clearChildren()
+	}
+
+	static canRender(eventData) {
+		return ["m.reaction", "m.call.candidates"].includes(eventData.type)
+	}
+
+	render() {
+	}
+}
+
+module.exports = [HiddenEvent]

src/js/events/render-event.js

@@ -4,6 +4,7 @@ const encryptedEvent = require("./encrypted")
 const membershipEvent = require("./membership")
 const unknownEvent = require("./unknown")
 const callEvent = require("./call")
+const hiddenEvent = require("./hidden")
 
 const events = [
 	...imageEvent,
@@ -11,10 +12,10 @@ const events = [
 	...encryptedEvent,
 	...membershipEvent,
 	...callEvent,
+	...hiddenEvent,
 	...unknownEvent,
 ]
 
-
 function renderEvent(eventData) {
 	const constructor = events.find(e => e.canRender(eventData))
 	return new constructor(eventData)

src/js/timeline.js

@@ -262,10 +262,6 @@ class Timeline extends Subscribable {
 				// update existing event
 				this.map.get(id).update(eventData)
 			} else {
-				// skip displaying events that we don't know how to
-				if (["m.reaction", "m.call.candidates"].includes(eventData.type)) {
-					continue
-				}
 				// skip redacted events
 				if (eventData.unsigned && eventData.unsigned.redacted_by) {
 					continue
@@ -321,12 +317,11 @@ class Timeline extends Subscribable {
 	}
 
 	moveReadReceipt(user, eventID) {
-		if (!this.map.has(eventID)) return // ignore receipts we don't have events for
 		// check for a previous event to move from
 		const prev = this.userReads.get(user)
 		if (prev.exists()) {
 			const prevID = prev.value()
-			if (this.map.has(prevID)) {
+			if (this.map.has(prevID) && this.map.has(eventID)) {
 				// ensure new message came later
 				if (this.map.get(eventID).data.origin_server_ts < this.map.get(prevID).data.origin_server_ts) return
 				this.map.get(prevID).readBy.delete(user)