diff --git a/src/components/views/messages/CallEvent.tsx b/src/components/views/messages/CallEvent.tsx index 64594d12d1..662e2b2c31 100644 --- a/src/components/views/messages/CallEvent.tsx +++ b/src/components/views/messages/CallEvent.tsx @@ -64,7 +64,7 @@ export default class CallEvent extends React.PureComponent { this.props.callEventGrouper.addListener(CallEventGrouperEvent.LengthChanged, this.onLengthChanged); this.resizeObserver = new ResizeObserver(this.resizeObserverCallback); - this.resizeObserver.observe(this.wrapperElement.current); + this.wrapperElement.current && this.resizeObserver.observe(this.wrapperElement.current); } componentWillUnmount() { @@ -258,7 +258,7 @@ export default class CallEvent extends React.PureComponent { ); } - render() { + public render(): JSX.Element { const event = this.props.mxEvent; const sender = event.sender ? event.sender.name : event.getSender(); const isVoice = this.props.callEventGrouper.isVoice; diff --git a/src/components/views/rooms/EventTile.tsx b/src/components/views/rooms/EventTile.tsx index 5529b1b6ce..d34dbb1605 100644 --- a/src/components/views/rooms/EventTile.tsx +++ b/src/components/views/rooms/EventTile.tsx @@ -24,6 +24,7 @@ import { RoomMember } from "matrix-js-sdk/src/models/room-member"; import { Thread, ThreadEvent } from 'matrix-js-sdk/src/models/thread'; import { logger } from "matrix-js-sdk/src/logger"; import { NotificationCountType, Room } from 'matrix-js-sdk/src/models/room'; +import { CallErrorCode } from "matrix-js-sdk/src/webrtc/call"; import { M_POLL_START } from "matrix-events-sdk"; import ReplyChain from "../elements/ReplyChain"; @@ -1097,10 +1098,21 @@ export default class EventTile extends React.Component { }); }; + /** + * In some cases we can't use shouldHideEvent() since whether or not we hide + * an event depends on other things that the event itself + * @returns {boolean} true if event should be hidden + */ + private shouldHideEvent(): boolean { + // If the call was replaced we don't render anything since we render the other call + if (this.props.callEventGrouper?.hangupReason === CallErrorCode.Replaced) return true; + + return false; + } + render() { const msgtype = this.props.mxEvent.getContent().msgtype; const eventType = this.props.mxEvent.getType() as EventType; - const eventDisplayInfo = getEventDisplayInfo(this.props.mxEvent); const { tileHandler, isBubbleMessage, @@ -1108,7 +1120,7 @@ export default class EventTile extends React.Component { isLeftAlignedBubbleMessage, noBubbleEvent, isSeeingThroughMessageHiddenForModeration, - } = eventDisplayInfo; + } = getEventDisplayInfo(this.props.mxEvent, this.shouldHideEvent()); const { isQuoteExpanded } = this.state; // This shouldn't happen: the caller should check we support this type diff --git a/src/utils/EventUtils.ts b/src/utils/EventUtils.ts index 97ad4e1040..118d0042de 100644 --- a/src/utils/EventUtils.ts +++ b/src/utils/EventUtils.ts @@ -177,7 +177,7 @@ export function getMessageModerationState(mxEvent: MatrixEvent): MessageModerati return MessageModerationState.HIDDEN_TO_CURRENT_USER; } -export function getEventDisplayInfo(mxEvent: MatrixEvent): { +export function getEventDisplayInfo(mxEvent: MatrixEvent, hideEvent?: boolean): { isInfoMessage: boolean; tileHandler: string; isBubbleMessage: boolean; @@ -245,7 +245,7 @@ export function getEventDisplayInfo(mxEvent: MatrixEvent): { // source tile when there's no regular tile for an event and also for // replace relations (which otherwise would display as a confusing // duplicate of the thing they are replacing). - if (SettingsStore.getValue("showHiddenEventsInTimeline") && !haveTileForEvent(mxEvent)) { + if ((hideEvent || !haveTileForEvent(mxEvent)) && SettingsStore.getValue("showHiddenEventsInTimeline")) { tileHandler = "messages.ViewSourceEvent"; isBubbleMessage = false; // Reuse info message avatar and sender profile styling