From 37e60e4fc46e1e4b4446b18d34e678fd901a3516 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Thu, 23 Aug 2018 00:02:20 +0200 Subject: [PATCH] wait for members loading to finish to show the avatar in the composer --- src/components/views/rooms/MessageComposer.js | 30 +++++++++++++++---- 1 file changed, 24 insertions(+), 6 deletions(-) diff --git a/src/components/views/rooms/MessageComposer.js b/src/components/views/rooms/MessageComposer.js index a7e02d16ae..eccdfe17af 100644 --- a/src/components/views/rooms/MessageComposer.js +++ b/src/components/views/rooms/MessageComposer.js @@ -71,6 +71,23 @@ export default class MessageComposer extends React.Component { // XXX: fragile as all hell - fixme somehow, perhaps with a dedicated Room.encryption event or something. MatrixClientPeg.get().on("event", this.onEvent); this._roomStoreToken = RoomViewStore.addListener(this._onRoomViewStoreUpdate); + this._waitForOwnMember(); + } + + _waitForOwnMember() { + // if we have the member already, do that + const me = this.props.room.getMember(MatrixClientPeg.get().getUserId()); + if (me) { + this.setState({me}); + return; + } + // Otherwise, wait for member loading to finish and then update the member for the avatar. + // The members should already be loading, and loadMembersIfNeeded + // will return the promise for the existing operation + this.props.room.loadMembersIfNeeded().then(() => { + const me = this.props.room.getMember(MatrixClientPeg.get().getUserId()); + this.setState({me}); + }); } componentWillUnmount() { @@ -208,7 +225,6 @@ export default class MessageComposer extends React.Component { } render() { - const me = this.props.room.getMember(MatrixClientPeg.get().credentials.userId); const uploadInputStyle = {display: 'none'}; const MemberAvatar = sdk.getComponent('avatars.MemberAvatar'); const TintableSvg = sdk.getComponent("elements.TintableSvg"); @@ -216,11 +232,13 @@ export default class MessageComposer extends React.Component { const controls = []; - controls.push( -
- -
, - ); + if (this.state.me) { + controls.push( +
+ +
, + ); + } let e2eImg, e2eTitle, e2eClass; const roomIsEncrypted = MatrixClientPeg.get().isRoomEncrypted(this.props.room.roomId);