Merge pull request #3310 from matrix-org/t3chguy/fix_reply_parent_redacted

Fix showing events which were replied to and then redacted

src/components/views/elements/ReplyThread.js

@@ -1,5 +1,6 @@
 /*
 Copyright 2017 New Vector Ltd
+Copyright 2019 Michael Telatynski <7t3chguy@gmail.com>
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
@@ -176,6 +177,9 @@ export default class ReplyThread extends React.Component {
     componentWillMount() {
         this.unmounted = false;
         this.room = this.context.matrixClient.getRoom(this.props.parentEv.getRoomId());
+        this.room.on("Room.redaction", this.onRoomRedaction);
+        // same event handler as Room.redaction as for both we just do forceUpdate
+        this.room.on("Room.redactionCancelled", this.onRoomRedaction);
         this.initialize();
     }
 
@@ -185,8 +189,21 @@ export default class ReplyThread extends React.Component {
 
     componentWillUnmount() {
         this.unmounted = true;
+        if (this.room) {
+            this.room.removeListener("Room.redaction", this.onRoomRedaction);
+            this.room.removeListener("Room.redactionCancelled", this.onRoomRedaction);
+        }
     }
 
+    onRoomRedaction = (ev, room) => {
+        if (this.unmounted) return;
+
+        // If one of the events we are rendering gets redacted, force a re-render
+        if (this.state.events.some(event => event.getId() === ev.getId())) {
+            this.forceUpdate();
+        }
+    };
+
     async initialize() {
         const {parentEv} = this.props;
         // at time of making this component we checked that props.parentEv has a parentEventId
@@ -298,11 +315,13 @@ export default class ReplyThread extends React.Component {
 
             return <blockquote className="mx_ReplyThread" key={ev.getId()}>
                 { dateSep }
-                <EventTile mxEvent={ev}
+                <EventTile
-                           tileShape="reply"
+                    mxEvent={ev}
-                           onHeightChanged={this.props.onHeightChanged}
+                    tileShape="reply"
-                           permalinkCreator={this.props.permalinkCreator}
+                    onHeightChanged={this.props.onHeightChanged}
-                           isTwelveHour={SettingsStore.getValue("showTwelveHourTimestamps")} />
+                    permalinkCreator={this.props.permalinkCreator}
+                    isRedacted={ev.isRedacted()}
+                    isTwelveHour={SettingsStore.getValue("showTwelveHourTimestamps")} />
             </blockquote>;
         });