diff --git a/src/components/MarkdownEditor/MarkdownEditor.js b/src/components/MarkdownEditor/MarkdownEditor.js index fbbb9da85..780ba1b2b 100644 --- a/src/components/MarkdownEditor/MarkdownEditor.js +++ b/src/components/MarkdownEditor/MarkdownEditor.js @@ -17,9 +17,13 @@ import { client } from '../../utils/ApiClient'; @observer class MarkdownAtlas extends React.Component { static propTypes = { - text: React.PropTypes.string, - onChange: React.PropTypes.func, - replaceText: React.PropTypes.func, + text: React.PropTypes.string.isRequired, + onChange: React.PropTypes.func.isRequired, + replaceText: React.PropTypes.func.isRequired, + + // This is actually not used but it triggers + // re-render to help with CodeMirror focus issues + preview: React.PropTypes.bool.isRequired, } getEditorInstance = () => { diff --git a/src/scenes/DocumentEdit/DocumentEdit.js b/src/scenes/DocumentEdit/DocumentEdit.js index 51d862d66..507628461 100644 --- a/src/scenes/DocumentEdit/DocumentEdit.js +++ b/src/scenes/DocumentEdit/DocumentEdit.js @@ -43,9 +43,7 @@ class DocumentEdit extends Component { } onPreviewToggle = () => { - // Force re-render to fix issues with - // Codemirror cursor (gets out of sync) - state.togglePreview(this.forceUpdate()); + state.togglePreview(); } render() { @@ -94,6 +92,7 @@ class DocumentEdit extends Component { onChange={ state.updateText } text={ state.text } replaceText={ state.replaceText } + preview={ state.preview } /> { state.preview ? ( diff --git a/src/scenes/DocumentEdit/DocumentEdit.scss b/src/scenes/DocumentEdit/DocumentEdit.scss index 030f34a86..307a0ec92 100644 --- a/src/scenes/DocumentEdit/DocumentEdit.scss +++ b/src/scenes/DocumentEdit/DocumentEdit.scss @@ -27,6 +27,7 @@ .paneContent { flex: 1; justify-content: center; + height: 100%; } .fullWidth { diff --git a/src/scenes/DocumentEdit/DocumentEditState.js b/src/scenes/DocumentEdit/DocumentEditState.js index e1351d8ab..351872c4b 100644 --- a/src/scenes/DocumentEdit/DocumentEditState.js +++ b/src/scenes/DocumentEdit/DocumentEditState.js @@ -83,9 +83,8 @@ const documentEditState = new class DocumentEditState { this.text = this.text.replace(args.original, args.new); } - @action togglePreview = (callback) => { + @action togglePreview = () => { this.preview = !this.preview; - callback(); } constructor() {