imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'develop' into gsouquet/compact-composer-18533

Browse source
This commit is contained in:
Germain Souquet 2021-09-02 08:31:29 +01:00
commit e416952c90
61 changed files with 1009 additions and 367 deletions
Download patch file Download diff file Expand all files Collapse all files

24
src/components/views/rooms/MessageComposer.tsx
View file

@ -192,7 +192,9 @@ interface IProps {
resizeNotifier: ResizeNotifier;
permalinkCreator: RoomPermalinkCreator;
replyToEvent?: MatrixEvent;
showReplyPreview?: boolean;
e2eStatus?: E2EStatus;
compact?: boolean;
}
interface IState {
@ -214,6 +216,11 @@ export default class MessageComposer extends React.Component<IProps, IState> {
private voiceRecordingButton: VoiceRecordComposerTile;
private ref: React.RefObject<HTMLDivElement> = createRef();
static defaultProps = {
showReplyPreview: true,
compact: false,
};
constructor(props) {
super(props);
VoiceRecordingStore.instance.on(UPDATE_EVENT, this.onVoiceStoreUpdate);
@ -471,7 +478,7 @@ export default class MessageComposer extends React.Component<IProps, IState> {
render() {
const controls = [
this.state.me ? <ComposerAvatar key="controls_avatar" me={this.state.me} /> : null,
this.state.me && !this.props.compact ? <ComposerAvatar key="controls_avatar" me={this.state.me} /> : null,
this.props.e2eStatus ?
<E2EIcon key="e2eIcon" status={this.props.e2eStatus} className="mx_MessageComposer_e2eIcon" /> :
null,
@ -541,8 +548,7 @@ export default class MessageComposer extends React.Component<IProps, IState> {
yOffset={-50}
/>;
}
controls.push(
controls.push(
<Stickerpicker
room={this.props.room}
showStickers={this.state.showStickers}
@ -552,11 +558,19 @@ export default class MessageComposer extends React.Component<IProps, IState> {
const showSendButton = !this.state.isComposerEmpty || this.state.haveRecording;
const classes = classNames({
"mx_MessageComposer": true,
"mx_GroupLayout": true,
"mx_MessageComposer--compact": this.props.compact,
});
return (
<div className="mx_MessageComposer mx_GroupLayout" ref={this.ref}>
<div className={classes}>
{ recordingTooltip }
<div className="mx_MessageComposer_wrapper">
<ReplyPreview permalinkCreator={this.props.permalinkCreator} />
{ this.props.showReplyPreview && (
<ReplyPreview permalinkCreator={this.props.permalinkCreator} />
) }
<div className="mx_MessageComposer_row">
{ controls }
{ this.renderButtons(menuPosition) }