PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Tighten controls code in MessageComposer

Browse source 
Make the user avatar a separate function component, make the logic for
laying out components a little more concise

Signed-off-by: YaoiFangirl420 <48789208+YaoiFangirl420@users.noreply.github.com>
This commit is contained in:
YaoiFangirl420 2019-04-06 20:44:22 -07:00
parent d08fbb4872
commit 6aa9f068b3
1 changed files with 15 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
src/components/views/rooms/MessageComposer.js
View file

@ -42,6 +42,17 @@ const formatButtonList = [
_td("numbered-list"), _td("numbered-list"),
]; ];
function Avatar(props) {
const MemberStatusMessageAvatar = sdk.getComponent('avatars.MemberStatusMessageAvatar');
return <div className="mx_MessageComposer_avatar">
<MemberStatusMessageAvatar member={props.me} width={24} height={24} />
</div>;
}
Avatar.propTypes = {
me: PropTypes.object.isRequired,
}
function CallButton(props) { function CallButton(props) {
const AccessibleButton = sdk.getComponent('elements.AccessibleButton'); const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
const onVoiceCallClick = (ev) => { const onVoiceCallClick = (ev) => {
@ -280,26 +291,12 @@ export default class MessageComposer extends React.Component {
render() { render() {
const uploadInputStyle = {display: 'none'}; const uploadInputStyle = {display: 'none'};
const MemberStatusMessageAvatar = sdk.getComponent('avatars.MemberStatusMessageAvatar');
const MessageComposerInput = sdk.getComponent("rooms.MessageComposerInput"); const MessageComposerInput = sdk.getComponent("rooms.MessageComposerInput");
const controls = []; const controls = [
this.state.me ? <Avatar key="controls_avatar" me={this.state.me} /> : null,
if (this.state.me) { this.props.e2eStatus ? <E2EIcon key="e2eIcon" status={this.props.e2eStatus} className="mx_MessageComposer_e2eIcon" /> : null,
controls.push( ];
<div key="controls_avatar" className="mx_MessageComposer_avatar">
<MemberStatusMessageAvatar member={this.state.me} width={24} height={24} />
</div>,
);
}
if (this.props.e2eStatus) {
controls.push(<E2EIcon
status={this.props.e2eStatus}
key="e2eIcon"
className="mx_MessageComposer_e2eIcon" />
);
}
let callButton; let callButton;
let videoCallButton; let videoCallButton;