Make line numbers in the editor optional

browser/components/CodeEditor.js

@@ -50,7 +50,7 @@ export default class CodeEditor extends React.Component {
     this.value = this.props.value
     this.editor = CodeMirror(this.refs.root, {
       value: this.props.value,
-      lineNumbers: true,
+      lineNumbers: this.props.lineNumber,
       lineWrapping: true,
       theme: this.props.theme,
       indentUnit: this.props.indentSize,
@@ -141,6 +141,10 @@ export default class CodeEditor extends React.Component {
       this.editor.setOption('indentWithTabs', this.props.indentType !== 'space')
     }
 
+    if (prevProps.lineNumber !== this.props.lineNumber) {
+      this.editor.setOption('lineNumbers', this.props.lineNumber)
+    }
+
     if (needRefresh) {
       this.editor.refresh()
     }

browser/components/MarkdownEditor.js

@@ -213,6 +213,8 @@ class MarkdownEditor extends React.Component {
     if (!(editorFontSize > 0 && editorFontSize < 101)) editorFontSize = 14
     let editorIndentSize = parseInt(config.editor.indentSize, 10)
     if (!(editorFontSize > 0 && editorFontSize < 132)) editorIndentSize = 4
+    let editorLineNumber = config.editor.lineNumber
+    if (editorLineNumber === undefined) editorLineNumber = true
 
     let previewStyle = {}
     if (this.props.ignorePreviewPointerEvents) previewStyle.pointerEvents = 'none'
@@ -242,6 +244,7 @@ class MarkdownEditor extends React.Component {
           fontSize={editorFontSize}
           indentType={config.editor.indentType}
           indentSize={editorIndentSize}
+          lineNumber={editorLineNumber}
           storageKey={storageKey}
           onChange={(e) => this.handleChange(e)}
           onBlur={(e) => this.handleBlur(e)}

browser/main/Detail/SnippetNoteDetail.js

@@ -530,6 +530,7 @@ class SnippetNoteDetail extends React.Component {
             fontSize={editorFontSize}
             indentType={config.editor.indentType}
             indentSize={editorIndentSize}
+            lineNumber
             keyMap={config.editor.keyMap}
             onChange={(e) => this.handleCodeChange(index)(e)}
             ref={'code-' + index}

browser/main/lib/ConfigManager.js

@@ -35,6 +35,7 @@ export const DEFAULT_CONFIG = {
     fontFamily: win ? 'Segoe UI' : 'Monaco, Consolas',
     indentType: 'space',
     indentSize: '2',
+    lineNumber: true,
     switchPreview: 'BLUR' // Available value: RIGHTCLICK, BLUR
   },
   preview: {

browser/main/modals/PreferencesModal/UiTab.js

@@ -46,6 +46,7 @@ class UiTab extends React.Component {
         fontFamily: this.refs.editorFontFamily.value,
         indentType: this.refs.editorIndentType.value,
         indentSize: this.refs.editorIndentSize.value,
+        lineNumber: this.refs.editorLineNumber.checked,
         switchPreview: this.refs.editorSwitchPreview.value,
         keyMap: this.refs.editorKeyMap.value
       },
@@ -222,6 +223,17 @@ class UiTab extends React.Component {
             </div>
           </div>
 
+          <div styleName='group-checkBoxSection'>
+            <label>
+              <input onChange={(e) => this.handleUIChange(e)}
+                checked={this.state.config.editor.lineNumber}
+                ref='editorLineNumber'
+                type='checkbox'
+              />&nbsp;
+              Show line numbers in the editor
+            </label>
+          </div>
+
           <div styleName='group-header2'>Preview</div>
           <div styleName='group-section'>
             <div styleName='group-section-label'>