ensure that CommentForm processes editorOptions for CodeMirrorEditor

resource/js/app.js

@@ -175,7 +175,7 @@ if (writeCommentElem) {
     }
   };
   ReactDOM.render(
-    <CommentForm crowi={crowi} pageId={pageId} revisionId={pageRevisionId} onPostComplete={postCompleteHandler} crowiRenderer={crowiRenderer} editorOptions={editorOptions}/>,
+    <CommentForm crowi={crowi} crowiRenderer={crowiRenderer} pageId={pageId} revisionId={pageRevisionId} onPostComplete={postCompleteHandler} editorOptions={editorOptions}/>,
     writeCommentElem);
 }
 

resource/js/components/PageComment/CommentForm.js

@@ -191,6 +191,7 @@ export default class CommentForm extends React.Component {
     const commentPreview = this.state.isMarkdown ? this.getCommentHtml(): ReactUtils.nl2br(comment);
     const emojiStrategy = this.props.crowi.getEmojiStrategy();
 
+    const editorOptions = Object.assign(this.props.editorOptions || {}, { lineNumbers: false });
     return (
       <div>
         <form className="form page-comment-form" id="page-comment-form" onSubmit={this.postComment}>
@@ -209,7 +210,7 @@ export default class CommentForm extends React.Component {
                       </textarea> */}
                        <Editor ref="editor"
                        value={this.state.comment}
-                       editorOptions={this.state.editorOptions}
+                       editorOptions={editorOptions}
                        isMobile={this.props.crowi.isMobile}
                        isUploadable={this.state.isUploadable}
                        isUploadableFile={this.state.isUploadableFile}
@@ -257,8 +258,9 @@ export default class CommentForm extends React.Component {
 
 CommentForm.propTypes = {
   crowi: PropTypes.object.isRequired,
+  crowiRenderer:  PropTypes.object.isRequired,
   onPostComplete: PropTypes.func,
   pageId: PropTypes.string,
   revisionId: PropTypes.string,
-  crowiRenderer:  PropTypes.object.isRequired,
+  editorOptions: PropTypes.object,
 };

resource/js/components/PageEditor/CodeMirrorEditor.js

@@ -360,8 +360,12 @@ export default class CodeMirrorEditor extends AbstractEditor {
   }
 
   render() {
-    const theme = this.props.editorOptions.theme || 'elegant';
-    const styleActiveLine = this.props.editorOptions.styleActiveLine || undefined;
+    const defaultEditorOptions = {
+      theme: 'elegant',
+      lineNumbers: true,
+    };
+    const editorOptions = Object.assign(defaultEditorOptions, this.props.editorOptions || {});
+
     return <React.Fragment>
       <ReactCodeMirror
         ref="cm"
@@ -374,9 +378,9 @@ export default class CodeMirrorEditor extends AbstractEditor {
         value={this.state.value}
         options={{
           mode: 'gfm',
-          theme: theme,
-          styleActiveLine: styleActiveLine,
-          lineNumbers: true,
+          theme: editorOptions.theme,
+          styleActiveLine: editorOptions.styleActiveLine,
+          lineNumbers: editorOptions.lineNumbers,
           tabSize: 4,
           indentUnit: 4,
           lineWrapping: true,
@@ -385,8 +389,8 @@ export default class CodeMirrorEditor extends AbstractEditor {
           matchBrackets: true,
           matchTags: {bothTags: true},
           // folding
-          foldGutter: true,
-          gutters: ['CodeMirror-linenumbers', 'CodeMirror-foldgutter'],
+          foldGutter: (editorOptions.lineNumbers ? true : false),
+          gutters: (editorOptions.lineNumbers ? ['CodeMirror-linenumbers', 'CodeMirror-foldgutter'] : []),
           // match-highlighter, matchesonscrollbar, annotatescrollbar options
           highlightSelectionMatches: {annotateScrollbar: true},
           // markdown mode options