Matrix/element-web-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-web.git synced 2024-11-17 14:05:04 +08:00
Code Issues Packages Projects Releases Wiki Activity

monitor associated send status for edit history events

Browse Source 
to update local echo if needed
This commit is contained in:
Bruno Windels 2019-07-05 16:04:34 +02:00
parent 2182248d7c
commit 0aa1252d01
1 changed files with 21 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/views/messages/EditHistoryMessage.js
View File

@ -38,9 +38,16 @@ export default class EditHistoryMessage extends React.PureComponent {
const {userId} = cli.credentials; const {userId} = cli.credentials;
const event = this.props.mxEvent; const event = this.props.mxEvent;
const room = cli.getRoom(event.getRoomId()); const room = cli.getRoom(event.getRoomId());
const canRedact = room.currentState.maySendRedactionForEvent(event, userId); if (event.localRedactionEvent()) {
this.state = {canRedact}; event.localRedactionEvent().on("status", this._onAssociatedStatusChanged);
} }
const canRedact = room.currentState.maySendRedactionForEvent(event, userId);
this.state = {canRedact, sendStatus: event.getAssociatedStatus()};
}
_onAssociatedStatusChanged = () => {
this.setState({sendStatus: this.props.mxEvent.getAssociatedStatus()});
};
_onRedactClick = async () => { _onRedactClick = async () => {
const event = this.props.mxEvent; const event = this.props.mxEvent;
@ -63,15 +70,24 @@ export default class EditHistoryMessage extends React.PureComponent {
this.pillifyLinks(); this.pillifyLinks();
} }
componentWillUnmount() {
const event = this.props.mxEvent;
if (event.localRedactionEvent()) {
event.localRedactionEvent().off("status", this._onAssociatedStatusChanged);
}
}
componentDidUpdate() { componentDidUpdate() {
this.pillifyLinks(); this.pillifyLinks();
} }
_renderActionBar() { _renderActionBar() {
const AccessibleButton = sdk.getComponent('elements.AccessibleButton'); const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
// hide the button when already redacted
if (this.props.mxEvent.isRedacted()) { if (this.props.mxEvent.isRedacted()) {
return null; return null;
} }
// disabled remove button when not allowed
return (<div className="mx_MessageActionBar"> return (<div className="mx_MessageActionBar">
<AccessibleButton onClick={this._onRedactClick} disabled={!this.state.canRedact}>{_t("Remove")}</AccessibleButton> <AccessibleButton onClick={this._onRedactClick} disabled={!this.state.canRedact}>{_t("Remove")}</AccessibleButton>
</div>); </div>);
@ -82,9 +98,8 @@ export default class EditHistoryMessage extends React.PureComponent {
const originalContent = mxEvent.getOriginalContent(); const originalContent = mxEvent.getOriginalContent();
const content = originalContent["m.new_content"] || originalContent; const content = originalContent["m.new_content"] || originalContent;
const contentElements = HtmlUtils.bodyToHtml(content); const contentElements = HtmlUtils.bodyToHtml(content);
const isRedacted = this.props.mxEvent.isRedacted();
let contentContainer; let contentContainer;
if (isRedacted) { if (mxEvent.isRedacted()) {
const UnknownBody = sdk.getComponent('messages.UnknownBody'); const UnknownBody = sdk.getComponent('messages.UnknownBody');
contentContainer = (<UnknownBody mxEvent={this.props.mxEvent} />); contentContainer = (<UnknownBody mxEvent={this.props.mxEvent} />);
} else if (mxEvent.getContent().msgtype === "m.emote") { } else if (mxEvent.getContent().msgtype === "m.emote") {
@ -97,13 +112,12 @@ export default class EditHistoryMessage extends React.PureComponent {
contentContainer = (<div className="mx_EventTile_content" ref="content">{contentElements}</div>); contentContainer = (<div className="mx_EventTile_content" ref="content">{contentElements}</div>);
} }
const timestamp = formatTime(new Date(mxEvent.getTs()), this.props.isTwelveHour); const timestamp = formatTime(new Date(mxEvent.getTs()), this.props.isTwelveHour);
const sendStatus = mxEvent.getAssociatedStatus(); const isSending = (['sending', 'queued', 'encrypting'].indexOf(this.state.sendStatus) !== -1);
const isSending = (['sending', 'queued', 'encrypting'].indexOf(sendStatus) !== -1);
const classes = classNames({ const classes = classNames({
"mx_EventTile": true, "mx_EventTile": true,
"mx_EventTile_redacted": isRedacted, "mx_EventTile_redacted": mxEvent.isRedacted(),
"mx_EventTile_sending": isSending, "mx_EventTile_sending": isSending,
"mx_EventTile_notSent": sendStatus === 'not_sent', "mx_EventTile_notSent": this.state.sendStatus === 'not_sent',
}); });
return <li className={classes}> return <li className={classes}>
<div className="mx_EventTile_line"> <div className="mx_EventTile_line">