diff --git a/browser/components/CodeEditor.js b/browser/components/CodeEditor.js
index 743d4feb..4126e580 100644
--- a/browser/components/CodeEditor.js
+++ b/browser/components/CodeEditor.js
@@ -28,6 +28,7 @@ import {generateInEditor, tocExistsInEditor} from 'browser/lib/markdown-toc-gene
import markdownlint from 'markdownlint'
import Jsonlint from 'jsonlint-mod'
import { DEFAULT_CONFIG } from '../main/lib/ConfigManager'
+import prettier from 'prettier'
CodeMirror.modeURL = '../node_modules/codemirror/mode/%N/%N.js'
@@ -216,6 +217,28 @@ export default class CodeEditor extends React.Component {
}
return CodeMirror.Pass
},
+ [translateHotkey(hotkey.prettifyMarkdown)]: cm => {
+ // Default / User configured prettier options
+ const currentConfig = JSON.parse(self.props.prettierConfig)
+
+ // Parser type will always need to be markdown so we override the option before use
+ currentConfig.parser = 'markdown'
+
+ // Get current cursor position
+ const cursorPos = cm.getCursor()
+ currentConfig.cursorOffset = cm.doc.indexFromPos(cursorPos)
+
+ // Prettify contents of editor
+ const formattedTextDetails = prettier.formatWithCursor(cm.doc.getValue(), currentConfig)
+
+ const formattedText = formattedTextDetails.formatted
+ const formattedCursorPos = formattedTextDetails.cursorOffset
+ cm.doc.setValue(formattedText)
+
+ // Reset Cursor position to be at the same markdown as was before prettifying
+ const newCursorPos = cm.doc.posFromIndex(formattedCursorPos)
+ cm.doc.setCursor(newCursorPos)
+ },
[translateHotkey(hotkey.pasteSmartly)]: cm => {
this.handlePaste(cm, true)
}
@@ -269,7 +292,8 @@ export default class CodeEditor extends React.Component {
explode: this.props.explodingPairs,
override: true
},
- extraKeys: this.defaultKeyMap
+ extraKeys: this.defaultKeyMap,
+ prettierConfig: this.props.prettierConfig
})
document.querySelector('.CodeMirror-lint-markers').style.display = enableMarkdownLint ? 'inline-block' : 'none'
@@ -1194,5 +1218,6 @@ CodeEditor.defaultProps = {
autoDetect: false,
spellCheck: false,
enableMarkdownLint: DEFAULT_CONFIG.editor.enableMarkdownLint,
- customMarkdownLintConfig: DEFAULT_CONFIG.editor.customMarkdownLintConfig
+ customMarkdownLintConfig: DEFAULT_CONFIG.editor.customMarkdownLintConfig,
+ prettierConfig: DEFAULT_CONFIG.editor.prettierConfig
}
diff --git a/browser/components/MarkdownEditor.js b/browser/components/MarkdownEditor.js
index ef238166..c38aa99b 100644
--- a/browser/components/MarkdownEditor.js
+++ b/browser/components/MarkdownEditor.js
@@ -323,6 +323,7 @@ class MarkdownEditor extends React.Component {
switchPreview={config.editor.switchPreview}
enableMarkdownLint={config.editor.enableMarkdownLint}
customMarkdownLintConfig={config.editor.customMarkdownLintConfig}
+ prettierConfig={config.editor.prettierConfig}
/>