EditMessageComposer: disable Save button until a change has been made

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2019-09-09 18:12:52 +01:00
parent 81ea230a35
commit e3643bf17a

View file

@ -112,6 +112,10 @@ export default class EditMessageComposer extends React.Component {
super(props, context);
this.model = null;
this._editorRef = null;
this.state = {
changed: false,
};
}
_setEditorRef = ref => {
@ -176,16 +180,16 @@ export default class EditMessageComposer extends React.Component {
const editedEvent = this.props.editState.getEvent();
const editContent = createEditContent(this.model, editedEvent);
const newContent = editContent["m.new_content"];
if (!this._isModifiedOrSameAsOld(newContent)) {
return;
if (this._isModifiedOrSameAsOld(newContent)) {
const roomId = editedEvent.getRoomId();
this._cancelPreviousPendingEdit();
this.context.matrixClient.sendMessage(roomId, editContent);
}
const roomId = editedEvent.getRoomId();
this._cancelPreviousPendingEdit();
this.context.matrixClient.sendMessage(roomId, editContent);
dis.dispatch({action: "edit_event", event: null});
dis.dispatch({action: 'focus_composer'});
}
};
_cancelPreviousPendingEdit() {
const originalEvent = this.props.editState.getEvent();
@ -240,6 +244,16 @@ export default class EditMessageComposer extends React.Component {
return caretPosition;
}
_onChange = () => {
if (this.state.changed || !this._editorRef || !this._editorRef.isModified()) {
return;
}
this.setState({
changed: true,
});
};
render() {
const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
return (<div className={classNames("mx_EditMessageComposer", this.props.className)} onKeyDown={this._onKeyDown}>
@ -249,10 +263,13 @@ export default class EditMessageComposer extends React.Component {
room={this._getRoom()}
initialCaret={this.props.editState.getCaret()}
label={_t("Edit message")}
onChange={this._onChange}
/>
<div className="mx_EditMessageComposer_buttons">
<AccessibleButton kind="secondary" onClick={this._cancelEdit}>{_t("Cancel")}</AccessibleButton>
<AccessibleButton kind="primary" onClick={this._sendEdit}>{_t("Save")}</AccessibleButton>
<AccessibleButton kind="primary" onClick={this._sendEdit} disabled={!this.state.changed}>
{_t("Save")}
</AccessibleButton>
</div>
</div>);
}