diff --git a/src/components/structures/MessagePanel.tsx b/src/components/structures/MessagePanel.tsx index 5cbbdf747eb..7112f1318ed 100644 --- a/src/components/structures/MessagePanel.tsx +++ b/src/components/structures/MessagePanel.tsx @@ -186,6 +186,7 @@ interface IProps { interface IState { ghostReadMarkers: string[]; showTypingNotifications: boolean; + hideSender: boolean; } interface IReadReceiptForUser { @@ -254,8 +255,6 @@ export default class MessagePanel extends React.Component { // A map of private callEventGroupers = new Map(); - private membersCount = 0; - constructor(props, context) { super(props, context); @@ -264,6 +263,7 @@ export default class MessagePanel extends React.Component { // display 'ghost' read markers that are animating away ghostReadMarkers: [], showTypingNotifications: SettingsStore.getValue("showTypingNotifications"), + hideSender: this.shouldHideSender(), }; // Cache hidden events setting on mount since Settings is expensive to @@ -306,8 +306,14 @@ export default class MessagePanel extends React.Component { } } + private shouldHideSender(): boolean { + return this.props.room?.getInvitedAndJoinedMemberCount() <= 2 && this.props.layout === Layout.Bubble; + } + private calculateRoomMembersCount = (): void => { - this.membersCount = this.props.room?.getMembers().length || 0; + this.setState({ + hideSender: this.shouldHideSender(), + }); }; private onShowTypingNotificationsChange = (): void => { @@ -794,7 +800,7 @@ export default class MessagePanel extends React.Component { enableFlair={this.props.enableFlair} showReadReceipts={this.props.showReadReceipts} callEventGrouper={callEventGrouper} - hideSender={this.membersCount <= 2 && this.props.layout === Layout.Bubble} + hideSender={this.state.hideSender} timelineRenderingType={this.context.timelineRenderingType} /> ,