message: Cache room member count on the messagePanel
diff: @@ -236,6 +236,8 @@ export default class MessagePanel extends React.Component<IProps, IState> {
  // A map of <callId, CallEventGrouper>
  private callEventGroupers = new Map<string, CallEventGrouper>();
  + private membersCount = 0;
  +
  constructor(props, context) {
  super(props, context);
  @@ -256,11 +258,14 @@ export default class MessagePanel extends React.Component<IProps, IState> {
  }
  componentDidMount() {
  + this.calculateRoomMembersCount();
  + this.props.room?.on("RoomState.members", this.calculateRoomMembersCount);
  this.isMounted = true;
  }
  componentWillUnmount() {
  this.isMounted = false;
  + this.props.room?.off("RoomState.members", this.calculateRoomMembersCount);
  SettingsStore.unwatchSetting(this.showTypingNotificationsWatcherRef);
  }
  @@ -274,6 +279,10 @@ export default class MessagePanel extends React.Component<IProps, IState> {
  }
  }
  + private calculateRoomMembersCount = (): void => {
  + this.membersCount = this.props.room?.getMembers().length || 0;
  + };
  +
  private onShowTypingNotificationsChange = (): void => {
  this.setState({
  showTypingNotifications: SettingsStore.getValue("showTypingNotifications"),
  @@ -711,9 +720,6 @@ export default class MessagePanel extends React.Component<IProps, IState> {
  isLastSuccessful = isLastSuccessful && mxEv.getSender() === MatrixClientPeg.get().getUserId();
  const callEventGrouper = this.callEventGroupers.get(mxEv.getContent().call_id);
  -
  - const isDirectMessage = this.props.room?.getMembersCount() <= 2;
  -
  // use txnId as key if available so that we don't remount during sending
  ret.push(
  <TileErrorBoundary key={mxEv.getTxnId() || eventId} mxEvent={mxEv}>
  @@ -745,7 +751,7 @@ export default class MessagePanel extends React.Component<IProps, IState> {
  enableFlair={this.props.enableFlair}
  showReadReceipts={this.props.showReadReceipts}
  callEventGrouper={callEventGrouper}
  - hideSender={isDirectMessage && this.props.layout === Layout.Bubble}
  + hideSender={this.membersCount <= 2 && this.props.layout === Layout.Bubble}
  />
  </TileErrorBoundary>,
  );
  