From b366b0b3d845b5e4d0cc43933d398874dc55c751 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Wed, 21 Aug 2019 17:42:09 +0200 Subject: [PATCH] store composer state when typing in new composer this doesn't use the MessageComposerStore on purpose so that both the new and old composer don't overwrite each others state, as the format is different. --- .../views/rooms/BasicMessageComposer.js | 5 ++++ .../views/rooms/SendMessageComposer.js | 30 ++++++++++++++++++- 2 files changed, 34 insertions(+), 1 deletion(-) diff --git a/src/components/views/rooms/BasicMessageComposer.js b/src/components/views/rooms/BasicMessageComposer.js index 19111f1f45..e4179d9c3b 100644 --- a/src/components/views/rooms/BasicMessageComposer.js +++ b/src/components/views/rooms/BasicMessageComposer.js @@ -52,6 +52,7 @@ function selectionEquals(a: Selection, b: Selection): boolean { export default class BasicMessageEditor extends React.Component { static propTypes = { + onChange: PropTypes.func, model: PropTypes.instanceOf(EditorModel).isRequired, room: PropTypes.instanceOf(Room).isRequired, placeholder: PropTypes.string, @@ -91,6 +92,10 @@ export default class BasicMessageEditor extends React.Component { this.setState({autoComplete: this.props.model.autoComplete}); this.historyManager.tryPush(this.props.model, caret, inputType, diff); TypingStore.sharedInstance().setSelfTyping(this.props.room.roomId, !this.props.model.isEmpty); + + if (this.props.onChange) { + this.props.onChange(); + } } _onInput = (event) => { diff --git a/src/components/views/rooms/SendMessageComposer.js b/src/components/views/rooms/SendMessageComposer.js index 4137de54c5..7d831dad4a 100644 --- a/src/components/views/rooms/SendMessageComposer.js +++ b/src/components/views/rooms/SendMessageComposer.js @@ -223,6 +223,7 @@ export default class SendMessageComposer extends React.Component { this.model.reset([]); this._editorRef.clearUndoHistory(); this._editorRef.focus(); + this._clearStoredEditorState(); } componentWillUnmount() { @@ -231,11 +232,37 @@ export default class SendMessageComposer extends React.Component { componentWillMount() { const partCreator = new CommandPartCreator(this.props.room, this.context.matrixClient); - this.model = new EditorModel([], partCreator); + const parts = this._restoreStoredEditorState(partCreator) || []; + this.model = new EditorModel(parts, partCreator); this.dispatcherRef = dis.register(this.onAction); this.sendHistoryManager = new SendHistoryManager(this.props.room.roomId, 'mx_slate_composer_history_'); } + get _editorStateKey() { + return `cider_editor_state_${this.props.room.roomId}`; + } + + _clearStoredEditorState() { + localStorage.removeItem(this._editorStateKey); + } + + _restoreStoredEditorState(partCreator) { + const json = localStorage.getItem(this._editorStateKey); + if (json) { + const serializedParts = JSON.parse(json); + const parts = serializedParts.map(p => partCreator.deserializePart(p)); + return parts; + } + } + + _saveStoredEditorState = () => { + if (this.model.isEmpty) { + this._clearStoredEditorState(); + } else { + localStorage.setItem(this._editorStateKey, JSON.stringify(this.model.serializeParts())); + } + } + onAction = (payload) => { switch (payload.action) { case 'reply_to_event': @@ -284,6 +311,7 @@ export default class SendMessageComposer extends React.Component { room={this.props.room} label={this.props.placeholder} placeholder={this.props.placeholder} + onChange={this._saveStoredEditorState} /> );