From ef1809305c2d3286b81221644830023ceeba0e44 Mon Sep 17 00:00:00 2001 From: nathan-castlehow Date: Tue, 11 Jun 2019 18:20:24 +0800 Subject: [PATCH 1/9] feat(prettierOnMarkdown): Added Reference To Prettier --- package.json | 3 ++- yarn.lock | 5 +++++ 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index 0893e681..2634ac14 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "boost", "productName": "Boostnote", - "version": "0.11.17", + "version": "0.11.17", "main": "index.js", "description": "Boostnote", "license": "GPL-3.0", @@ -98,6 +98,7 @@ "mousetrap": "^1.6.2", "mousetrap-global-bind": "^1.1.0", "node-ipc": "^8.1.0", + "prettier": "^1.18.2", "prop-types": "^15.7.2", "query-string": "^6.5.0", "raphael": "^2.2.7", diff --git a/yarn.lock b/yarn.lock index 30640d17..c4af1e91 100644 --- a/yarn.lock +++ b/yarn.lock @@ -7482,6 +7482,11 @@ preserve@^0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/preserve/-/preserve-0.2.0.tgz#815ed1f6ebc65926f865b310c0713bcb3315ce4b" +prettier@^1.18.2: + version "1.18.2" + resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.18.2.tgz#6823e7c5900017b4bd3acf46fe9ac4b4d7bda9ea" + integrity sha512-OeHeMc0JhFE9idD4ZdtNibzY0+TPHSpSSb9h8FqtP+YnoZZ1sl8Vc9b1sasjfymH3SonAF4QcA2+mzHPhMvIiw== + pretty-bytes@^1.0.2: version "1.0.4" resolved "https://registry.yarnpkg.com/pretty-bytes/-/pretty-bytes-1.0.4.tgz#0a22e8210609ad35542f8c8d5d2159aff0751c84" From 25bdaf9f00a7a9584948e5ec19940588a411c21c Mon Sep 17 00:00:00 2001 From: nathan-castlehow Date: Tue, 11 Jun 2019 19:09:50 +0800 Subject: [PATCH 2/9] feat(prettierOnMarkdown): Added Reference to prettier in Code Editor and created config file --- browser/components/CodeEditor.js | 5 +++++ prettier.config | 6 ++++++ 2 files changed, 11 insertions(+) create mode 100644 prettier.config diff --git a/browser/components/CodeEditor.js b/browser/components/CodeEditor.js index 1abd15a9..c758ea07 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' +const prettier = require('prettier') CodeMirror.modeURL = '../node_modules/codemirror/mode/%N/%N.js' @@ -232,6 +233,10 @@ export default class CodeEditor extends React.Component { } return CodeMirror.Pass }, + 'Shift-Alt-F': cm => { + // console.log(prettier.format('foo ( );', { semi: false, parser: 'babel' })) + // console.log('Key Combo Pressed') + }, [translateHotkey(hotkey.pasteSmartly)]: cm => { this.handlePaste(cm, true) } diff --git a/prettier.config b/prettier.config new file mode 100644 index 00000000..8b8b7b99 --- /dev/null +++ b/prettier.config @@ -0,0 +1,6 @@ +{ + "trailingComma": "es5", + "tabWidth": 4, + "semi": false, + "singleQuote": true +} \ No newline at end of file From f0380ef733bd5eabab94168e27686e9709618d0f Mon Sep 17 00:00:00 2001 From: nathan-castlehow Date: Sat, 15 Jun 2019 16:23:51 +0800 Subject: [PATCH 3/9] feat(prettierOnMarkdown): Added support for prettyifing markdown as well as added hot key option. Partial Implementation of Prettier config in configuration screen. TODO Fix defaulting of prettier configuration --- browser/components/CodeEditor.js | 26 +++++++++++++---- browser/components/MarkdownEditor.js | 1 + browser/main/lib/ConfigManager.js | 1 + .../main/modals/PreferencesModal/HotkeyTab.js | 12 ++++++++ browser/main/modals/PreferencesModal/UiTab.js | 29 +++++++++++++++++-- 5 files changed, 62 insertions(+), 7 deletions(-) diff --git a/browser/components/CodeEditor.js b/browser/components/CodeEditor.js index c758ea07..d1354bb4 100644 --- a/browser/components/CodeEditor.js +++ b/browser/components/CodeEditor.js @@ -233,9 +233,23 @@ export default class CodeEditor extends React.Component { } return CodeMirror.Pass }, - 'Shift-Alt-F': cm => { - // console.log(prettier.format('foo ( );', { semi: false, parser: 'babel' })) - // console.log('Key Combo Pressed') + [translateHotkey(hotkey.prettifyMarkdown)]: cm => { + // Default / User configured prettier options + const currentConfig = JSON.parse(self.props.prettierConfig) + // 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) @@ -290,7 +304,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' @@ -1200,5 +1215,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 e956655c..a7154e68 100644 --- a/browser/components/MarkdownEditor.js +++ b/browser/components/MarkdownEditor.js @@ -321,6 +321,7 @@ class MarkdownEditor extends React.Component { switchPreview={config.editor.switchPreview} enableMarkdownLint={config.editor.enableMarkdownLint} customMarkdownLintConfig={config.editor.customMarkdownLintConfig} + prettierConfig={config.editor.prettierConfig} /> +
+
{i18n.__('Prettify Markdown')}
+
+ this.handleHotkeyChange(e)} + ref='prettifyMarkdown' + value={config.hotkey.prettifyMarkdown} + type='text' + /> +
+
- +
+
+ {i18n.__('Prettier Config')} +
+
+
+ this.handleUIChange(e)} + ref={e => (this.prettierConfigCM = e)} + value={config.editor.prettierConfig} + options={{ + lineNumbers: true, + mode: 'json', + theme: codemirrorTheme + }} /> +
+
+
From ed4a670f0aa57027fef70be3711ab0031b84d172 Mon Sep 17 00:00:00 2001 From: nathan-castlehow Date: Sun, 23 Jun 2019 13:54:17 +0800 Subject: [PATCH 7/9] feat(prettierOnMarkdown): Changed default hotkey value --- browser/main/lib/ConfigManager.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/browser/main/lib/ConfigManager.js b/browser/main/lib/ConfigManager.js index 9e4e4d13..f2d6d85a 100644 --- a/browser/main/lib/ConfigManager.js +++ b/browser/main/lib/ConfigManager.js @@ -31,7 +31,7 @@ export const DEFAULT_CONFIG = { toggleMode: OSX ? 'Command + Alt + M' : 'Ctrl + M', deleteNote: OSX ? 'Command + Shift + Backspace' : 'Ctrl + Shift + Backspace', pasteSmartly: OSX ? 'Command + Shift + V' : 'Ctrl + Shift + V', - prettifyMarkdown: 'Shift + Alt + F', + prettifyMarkdown: 'Shift + F', toggleMenuBar: 'Alt' }, ui: { From bde357f95200197b4bedcb44aac57136ca32569a Mon Sep 17 00:00:00 2001 From: nathan-castlehow Date: Wed, 3 Jul 2019 09:03:24 +0800 Subject: [PATCH 8/9] feat(prettierOnMarkdown): Changed Prettier require to use import --- browser/components/CodeEditor.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/browser/components/CodeEditor.js b/browser/components/CodeEditor.js index d1354bb4..ed24c671 100644 --- a/browser/components/CodeEditor.js +++ b/browser/components/CodeEditor.js @@ -28,7 +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' -const prettier = require('prettier') +import prettier from 'prettier' CodeMirror.modeURL = '../node_modules/codemirror/mode/%N/%N.js' From 1d59d89588a9b328b81d19714e7b410bc7cef8c8 Mon Sep 17 00:00:00 2001 From: nathan-castlehow Date: Wed, 3 Jul 2019 09:28:36 +0800 Subject: [PATCH 9/9] feat(prettierOnMarkdown): Forced prettier options to always have parser set to markdown when used. --- browser/components/CodeEditor.js | 8 ++++++-- browser/main/lib/ConfigManager.js | 3 +-- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/browser/components/CodeEditor.js b/browser/components/CodeEditor.js index ed24c671..8421b520 100644 --- a/browser/components/CodeEditor.js +++ b/browser/components/CodeEditor.js @@ -236,11 +236,15 @@ export default class CodeEditor extends React.Component { [translateHotkey(hotkey.prettifyMarkdown)]: cm => { // Default / User configured prettier options const currentConfig = JSON.parse(self.props.prettierConfig) - // Get current cursor position. + + // 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. + // Prettify contents of editor const formattedTextDetails = prettier.formatWithCursor(cm.doc.getValue(), currentConfig) const formattedText = formattedTextDetails.formatted diff --git a/browser/main/lib/ConfigManager.js b/browser/main/lib/ConfigManager.js index f2d6d85a..d4c73b4a 100644 --- a/browser/main/lib/ConfigManager.js +++ b/browser/main/lib/ConfigManager.js @@ -71,8 +71,7 @@ export const DEFAULT_CONFIG = { "trailingComma": "es5", "tabWidth": 4, "semi": false, - "singleQuote": true, - "parser":"markdown" + "singleQuote": true }` },