convert md<->rt if the stored editorState was in a different state

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
matrix-org · Jul 11, 2018 · d277099 · d277099
1 parent abbb69d
commit d277099
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 30 deletions.
diff --git a/src/components/views/rooms/MessageComposerInput.js b/src/components/views/rooms/MessageComposerInput.js
@@ -143,27 +143,6 @@ export default class MessageComposerInput extends React.Component {
 
         Analytics.setRichtextMode(isRichTextEnabled);
 
-        this.state = {
-            // whether we're in rich text or markdown mode
-            isRichTextEnabled,
-
-            // the currently displayed editor state (note: this is always what is modified on input)
-            editorState: this.createEditorState(
-                isRichTextEnabled,
-                MessageComposerStore.getEditorState(this.props.room.roomId),
-            ),
-
-            // the original editor state, before we started tabbing through completions
-            originalEditorState: null,
-
-            // the virtual state "above" the history stack, the message currently being composed that
-            // we want to persist whilst browsing history
-            currentlyComposedEditorState: null,
-
-            // whether there were any completions
-            someCompletions: null,
-        };
-
         this.client = MatrixClientPeg.get();
 
         // track whether we should be trying to show autocomplete suggestions on the current editor
@@ -296,19 +275,47 @@ export default class MessageComposerInput extends React.Component {
                 }
             ]
         });
+
+        const savedState = MessageComposerStore.getEditorState(this.props.room.roomId);
+        this.state = {
+            // whether we're in rich text or markdown mode
+            isRichTextEnabled,
+
+            // the currently displayed editor state (note: this is always what is modified on input)
+            editorState: this.createEditorState(
+                isRichTextEnabled,
+                savedState.editor_state,
+                savedState.rich_text,
+            ),
+
+            // the original editor state, before we started tabbing through completions
+            originalEditorState: null,
+
+            // the virtual state "above" the history stack, the message currently being composed that
+            // we want to persist whilst browsing history
+            currentlyComposedEditorState: null,
+
+            // whether there were any completions
+            someCompletions: null,
+        };
     }
 
     /*
      * "Does the right thing" to create an Editor value, based on:
      * - whether we've got rich text mode enabled
      * - contentState was passed in
+     * - whether the contentState that was passed in was rich text
      */
-    createEditorState(richText: boolean, // eslint-disable-line no-unused-vars
-                      editorState: ?Value): Value {
+    createEditorState(wantRichText: boolean, editorState: ?Value, wasRichText: ?boolean): Value {
         if (editorState instanceof Value) {
+            if (wantRichText && !wasRichText) {
+                return this.mdToRichEditorState(editorState);
+            }
+            if (wasRichText && !wantRichText) {
+                return this.richToMdEditorState(editorState);
+            }
             return editorState;
-        }
-        else {
+        } else {
             // ...or create a new one.
             return Plain.deserialize('', { defaultBlock: DEFAULT_NODE });
         }
@@ -350,10 +357,13 @@ export default class MessageComposerInput extends React.Component {
                 }
                 break;
             case 'quote': {
-                const html = HtmlUtils.bodyToHtml(payload.event.getContent(), null, {
-                    returnString: true,
-                    emojiOne: false,
-                });
+                // const html = HtmlUtils.bodyToHtml(payload.event.getContent(), null, {
+                //     returnString: true,
+                //     emojiOne: false,
+                // });
+                const content = payload.event.getContent();
+                const html = content.format === "org.matrix.custom.html" && content['formatted_body']
+                    ? content['formatted_body'] : content['body'];
                 const fragment = this.html.deserialize(html);
                 // FIXME: do we want to put in a permalink to the original quote here?
                 // If so, what should be the format, and how do we differentiate it from replies?
@@ -569,6 +579,7 @@ export default class MessageComposerInput extends React.Component {
         dis.dispatch({
             action: 'editor_state',
             room_id: this.props.room.roomId,
+            rich_text: this.state.isRichTextEnabled,
             editor_state: editorState,
         });
 

diff --git a/src/stores/MessageComposerStore.js b/src/stores/MessageComposerStore.js
@@ -54,7 +54,10 @@ class MessageComposerStore extends Store {
 
     _editorState(payload) {
         const editorStateMap = this._state.editorStateMap;
-        editorStateMap[payload.room_id] = payload.editor_state;
+        editorStateMap[payload.room_id] = {
+            editor_state: payload.editor_state,
+            rich_text: payload.rich_text,
+        };
         localStorage.setItem('editor_state', JSON.stringify(editorStateMap));
         this._setState({
             editorStateMap: editorStateMap,