support redactions in edit history dialog

This commit is contained in:
Bruno Windels 2019-07-04 15:39:36 +02:00
parent 375976575b
commit 8468f7cdc3
3 changed files with 135 additions and 5 deletions

View file

@ -22,6 +22,9 @@ import {MatrixEvent} from 'matrix-js-sdk';
import {pillifyLinks} from '../../../utils/pillify';
import { _t } from '../../../languageHandler';
import sdk from '../../../index';
import MatrixClientPeg from '../../../MatrixClientPeg';
import Modal from '../../../Modal';
import classNames from 'classnames';
export default class EditHistoryMessage extends React.PureComponent {
static propTypes = {
@ -29,19 +32,46 @@ export default class EditHistoryMessage extends React.PureComponent {
mxEvent: PropTypes.instanceOf(MatrixEvent).isRequired,
};
constructor(props) {
super(props);
const cli = MatrixClientPeg.get();
const {userId} = cli.credentials;
const event = this.props.mxEvent;
const room = cli.getRoom(event.getRoomId());
const canRedact = room.currentState.maySendRedactionForEvent(event, userId);
this.state = {canRedact};
}
_onRedactClick = async () => {
const event = this.props.mxEvent;
const cli = MatrixClientPeg.get();
const ConfirmAndWaitRedactDialog = sdk.getComponent("dialogs.ConfirmAndWaitRedactDialog");
Modal.createTrackedDialog('Confirm Redact Dialog from edit history', '', ConfirmAndWaitRedactDialog, {
redact: () => cli.redactEvent(event.getRoomId(), event.getId()),
}, 'mx_Dialog_confirmredact');
};
pillifyLinks() {
// not present for redacted events
if (this.refs.content) {
pillifyLinks(this.refs.content.children, this.props.mxEvent);
}
}
componentDidMount() {
pillifyLinks(this.refs.content.children, this.props.mxEvent);
this.pillifyLinks();
}
componentDidUpdate() {
pillifyLinks(this.refs.content.children, this.props.mxEvent);
this.pillifyLinks();
}
_renderActionBar() {
const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
if (this.props.mxEvent.isRedacted()) {
return null;
}
return (<div className="mx_MessageActionBar">
<AccessibleButton onClick={this._onRedactClick} disabled={!this.state.canRedact}>{_t("Remove")}</AccessibleButton>
</div>);
@ -52,8 +82,12 @@ export default class EditHistoryMessage extends React.PureComponent {
const originalContent = mxEvent.getOriginalContent();
const content = originalContent["m.new_content"] || originalContent;
const contentElements = HtmlUtils.bodyToHtml(content);
const isRedacted = this.props.mxEvent.isRedacted();
let contentContainer;
if (mxEvent.getContent().msgtype === "m.emote") {
if (isRedacted) {
const UnknownBody = sdk.getComponent('messages.UnknownBody');
contentContainer = (<UnknownBody mxEvent={this.props.mxEvent} />);
} else if (mxEvent.getContent().msgtype === "m.emote") {
const name = mxEvent.sender ? mxEvent.sender.name : mxEvent.getSender();
contentContainer = (<div className="mx_EventTile_content" ref="content">*&nbsp;
<span className="mx_MEmoteBody_sender">{ name }</span>
@ -63,7 +97,15 @@ export default class EditHistoryMessage extends React.PureComponent {
contentContainer = (<div className="mx_EventTile_content" ref="content">{contentElements}</div>);
}
const timestamp = formatTime(new Date(mxEvent.getTs()), this.props.isTwelveHour);
return <li className="mx_EventTile">
const sendStatus = mxEvent.getAssociatedStatus();
const isSending = (['sending', 'queued', 'encrypting'].indexOf(sendStatus) !== -1);
const classes = classNames({
"mx_EventTile": true,
"mx_EventTile_redacted": isRedacted,
"mx_EventTile_sending": isSending,
"mx_EventTile_notSent": sendStatus === 'not_sent',
});
return <li className={classes}>
<div className="mx_EventTile_line">
<span className="mx_MessageTimestamp">{timestamp}</span>
{ contentContainer }