mirror of
https://github.com/element-hq/element-web
synced 2024-11-26 19:26:04 +03:00
send the actual m.replace event from composer content
This commit is contained in:
parent
34dbe5f314
commit
759a4a54ef
2 changed files with 28 additions and 20 deletions
|
@ -47,16 +47,13 @@ limitations under the License.
|
||||||
|
|
||||||
.buttons {
|
.buttons {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: row;
|
||||||
align-items: end;
|
justify-content: end;
|
||||||
padding: 5px 0;
|
padding: 5px 0;
|
||||||
|
|
||||||
.mx_AccessibleButton {
|
.mx_AccessibleButton {
|
||||||
background-color: $button-bg-color;
|
margin-left: 5px;
|
||||||
border-radius: 4px;
|
|
||||||
padding: 5px 40px;
|
padding: 5px 40px;
|
||||||
color: $button-fg-color;
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -21,11 +21,12 @@ import dis from '../../../dispatcher';
|
||||||
import EditorModel from '../../../editor/model';
|
import EditorModel from '../../../editor/model';
|
||||||
import {setCaretPosition} from '../../../editor/caret';
|
import {setCaretPosition} from '../../../editor/caret';
|
||||||
import {getCaretOffsetAndText} from '../../../editor/dom';
|
import {getCaretOffsetAndText} from '../../../editor/dom';
|
||||||
|
import {htmlSerialize, textSerialize, requiresHtml} from '../../../editor/serialize';
|
||||||
import parseEvent from '../../../editor/parse-event';
|
import parseEvent from '../../../editor/parse-event';
|
||||||
import Autocomplete from '../rooms/Autocomplete';
|
import Autocomplete from '../rooms/Autocomplete';
|
||||||
// import AutocompleteModel from '../../../editor/autocomplete';
|
// import AutocompleteModel from '../../../editor/autocomplete';
|
||||||
import {PartCreator} from '../../../editor/parts';
|
import {PartCreator} from '../../../editor/parts';
|
||||||
import {renderModel, rerenderModel} from '../../../editor/render';
|
import {renderModel} from '../../../editor/render';
|
||||||
import {MatrixEvent, MatrixClient} from 'matrix-js-sdk';
|
import {MatrixEvent, MatrixClient} from 'matrix-js-sdk';
|
||||||
|
|
||||||
export default class MessageEditor extends React.Component {
|
export default class MessageEditor extends React.Component {
|
||||||
|
@ -109,6 +110,26 @@ export default class MessageEditor extends React.Component {
|
||||||
dis.dispatch({action: "edit_event", event: null});
|
dis.dispatch({action: "edit_event", event: null});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
_onSaveClicked = () => {
|
||||||
|
const content = {
|
||||||
|
"msgtype": "m.text",
|
||||||
|
"body": textSerialize(this.model),
|
||||||
|
"m.relates_to": {
|
||||||
|
"rel_type": "m.replace",
|
||||||
|
"event_id": this.props.event.getId(),
|
||||||
|
},
|
||||||
|
};
|
||||||
|
if (requiresHtml(this.model)) {
|
||||||
|
content.format = "org.matrix.custom.html";
|
||||||
|
content.formatted_body = htmlSerialize(this.model);
|
||||||
|
}
|
||||||
|
|
||||||
|
const roomId = this.props.event.getRoomId();
|
||||||
|
this.context.matrixClient.sendMessage(roomId, content);
|
||||||
|
|
||||||
|
dis.dispatch({action: "edit_event", event: null});
|
||||||
|
}
|
||||||
|
|
||||||
_collectEditorRef = (ref) => {
|
_collectEditorRef = (ref) => {
|
||||||
this._editorRef = ref;
|
this._editorRef = ref;
|
||||||
}
|
}
|
||||||
|
@ -130,15 +151,6 @@ export default class MessageEditor extends React.Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
// const parts = this.state.parts.map((p, i) => {
|
|
||||||
// const key = `${i}-${p.type}`;
|
|
||||||
// switch (p.type) {
|
|
||||||
// case "plain": return p.text;
|
|
||||||
// case "room-pill": return (<span key={key} className="room-pill">{p.text}</span>);
|
|
||||||
// case "user-pill": return (<span key={key} className="user-pill">{p.text}</span>);
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
// const modelOutput = JSON.stringify(this.state.parts, undefined, 2);
|
|
||||||
let autoComplete;
|
let autoComplete;
|
||||||
if (this.state.autoComplete) {
|
if (this.state.autoComplete) {
|
||||||
const query = this.state.query;
|
const query = this.state.query;
|
||||||
|
@ -161,14 +173,13 @@ export default class MessageEditor extends React.Component {
|
||||||
className="editor"
|
className="editor"
|
||||||
contentEditable="true"
|
contentEditable="true"
|
||||||
tabIndex="1"
|
tabIndex="1"
|
||||||
// suppressContentEditableWarning={true}
|
|
||||||
onInput={this._onInput}
|
onInput={this._onInput}
|
||||||
onKeyDown={this._onKeyDown}
|
onKeyDown={this._onKeyDown}
|
||||||
ref={this._collectEditorRef}
|
ref={this._collectEditorRef}
|
||||||
>
|
></div>
|
||||||
</div>
|
|
||||||
<div className="buttons">
|
<div className="buttons">
|
||||||
<AccessibleButton onClick={this._onCancelClicked}>{_t("Cancel")}</AccessibleButton>
|
<AccessibleButton kind="secondary" onClick={this._onCancelClicked}>{_t("Cancel")}</AccessibleButton>
|
||||||
|
<AccessibleButton kind="primary" onClick={this._onSaveClicked}>{_t("Save")}</AccessibleButton>
|
||||||
</div>
|
</div>
|
||||||
<code className="model"></code>
|
<code className="model"></code>
|
||||||
</div>;
|
</div>;
|
||||||
|
|
Loading…
Reference in a new issue