fix lint errors

.eslintrc.js

@@ -44,7 +44,7 @@ module.exports = {
       2,
       {
         "SwitchCase": 1,
-        "ignoredNodes": ['JSXElement *', 'JSXElement'],
+        "ignoredNodes": ['JSXElement *', 'JSXElement', "JSXAttribute", "JSXSpreadAttribute"],
         "FunctionDeclaration": {"body": 1, "parameters": 2},
         "FunctionExpression": {"body": 1, "parameters": 2},
         "MemberExpression": "off"
@@ -72,11 +72,8 @@ module.exports = {
       "error",
       "single"
     ],
-    "react/jsx-indent-props": [
-      "error",
-      2
-    ],
-    "react/no-string-refs": 'off',
+    "react/jsx-uses-vars": 1,
+    "react/no-string-refs": "off",
     "semi": [
       "error",
       "always",

resource/js/components/PageEditor/OptionsSelector.js

@@ -4,14 +4,10 @@ import PropTypes from 'prop-types';
 import FormGroup from 'react-bootstrap/es/FormGroup';
 import FormControl from 'react-bootstrap/es/FormControl';
 import ControlLabel from 'react-bootstrap/es/ControlLabel';
-import Button from 'react-bootstrap/es/Button';
 
 import Dropdown from 'react-bootstrap/es/Dropdown';
 import MenuItem from 'react-bootstrap/es/MenuItem';
 
-import OverlayTrigger  from 'react-bootstrap/es/OverlayTrigger';
-import Tooltip from 'react-bootstrap/es/Tooltip';
-
 export default class OptionsSelector extends React.Component {
 
   constructor(props) {
@@ -25,7 +21,7 @@ export default class OptionsSelector extends React.Component {
       previewOptions: this.props.previewOptions || new PreviewOptions(),
       isCddMenuOpened: false,
       isMathJaxEnabled,
-    }
+    };
 
     this.availableThemes = [
       'eclipse', 'elegant', 'neo', 'mdn-like', 'material', 'dracula', 'monokai', 'twilight'
@@ -35,7 +31,7 @@ export default class OptionsSelector extends React.Component {
       vim: 'Vim',
       emacs: 'Emacs',
       sublime: 'Sublime Text',
-    }
+    };
 
     this.onChangeTheme = this.onChangeTheme.bind(this);
     this.onChangeKeymapMode = this.onChangeKeymapMode.bind(this);
@@ -135,7 +131,7 @@ export default class OptionsSelector extends React.Component {
 
         </FormControl>
       </FormGroup>
-    )
+    );
   }
 
   renderKeymapModeSelector() {
@@ -163,7 +159,7 @@ export default class OptionsSelector extends React.Component {
 
         </FormControl>
       </FormGroup>
-    )
+    );
   }
 
   renderConfigurationDropdown() {
@@ -186,15 +182,15 @@ export default class OptionsSelector extends React.Component {
         </Dropdown>
 
       </FormGroup>
-    )
+    );
   }
 
   renderActiveLineMenuItem() {
     const isActive = this.state.editorOptions.styleActiveLine;
 
-    const iconClasses = ['text-info']
+    const iconClasses = ['text-info'];
     if (isActive) {
-      iconClasses.push('ti-check')
+      iconClasses.push('ti-check');
     }
     const iconClassName = iconClasses.join(' ');
 
@@ -204,7 +200,7 @@ export default class OptionsSelector extends React.Component {
         <span className="menuitem-label">Show active line</span>
         <span className="icon-container"><i className={iconClassName}></i></span>
       </MenuItem>
-    )
+    );
   }
 
   renderRealtimeMathJaxMenuItem() {
@@ -215,9 +211,9 @@ export default class OptionsSelector extends React.Component {
     const isEnabled = this.state.isMathJaxEnabled;
     const isActive = isEnabled && this.state.previewOptions.renderMathJaxInRealtime;
 
-    const iconClasses = ['text-info']
+    const iconClasses = ['text-info'];
     if (isActive) {
-      iconClasses.push('ti-check')
+      iconClasses.push('ti-check');
     }
     const iconClassName = iconClasses.join(' ');
 
@@ -227,7 +223,7 @@ export default class OptionsSelector extends React.Component {
         <span className="menuitem-label">MathJax Rendering</span>
         <i className={iconClassName}></i>
       </MenuItem>
-    )
+    );
   }
 
   render() {
@@ -235,7 +231,7 @@ export default class OptionsSelector extends React.Component {
       <span className="m-l-5">{this.renderThemeSelector()}</span>
       <span className="m-l-5">{this.renderKeymapModeSelector()}</span>
       <span className="m-l-5">{this.renderConfigurationDropdown()}</span>
-    </span>
+    </span>;
   }
 }
 

resource/js/components/PageEditor/ScrollSyncHelper.js

@@ -37,18 +37,19 @@ class ScrollSyncHelper {
 	 *
 	 * @returns {{ previous: CodeLineElement, next?: CodeLineElement }}
 	 */
-	getElementsForSourceLine(element, targetLine) {
-		const lines = this.getCodeLineElements(element);
-		let previous = lines[0] || null;
-		for (const entry of lines) {
-			if (entry.line === targetLine) {
-				return { previous: entry, next: null };
-			} else if (entry.line > targetLine) {
-				return { previous, next: entry };
-			}
-			previous = entry;
-		}
-		return { previous };
+  getElementsForSourceLine(element, targetLine) {
+    const lines = this.getCodeLineElements(element);
+    let previous = lines[0] || null;
+    for (const entry of lines) {
+      if (entry.line === targetLine) {
+        return { previous: entry, next: null };
+      }
+      else if (entry.line > targetLine) {
+        return { previous, next: entry };
+      }
+      previous = entry;
+    }
+    return { previous };
   }
 
   /**
@@ -59,51 +60,52 @@ class ScrollSyncHelper {
    *
 	 * @returns {{ previous: CodeLineElement, next?: CodeLineElement }}
 	 */
-	getLineElementsAtPageOffset(parentElement, offset) {
-		const lines = this.getCodeLineElements(parentElement);
+  getLineElementsAtPageOffset(parentElement, offset) {
+    const lines = this.getCodeLineElements(parentElement);
 
     const position = offset - parentElement.scrollTop + this.getParentElementOffset(parentElement);
 
-		let lo = -1;
-		let hi = lines.length - 1;
-		while (lo + 1 < hi) {
-			const mid = Math.floor((lo + hi) / 2);
+    let lo = -1;
+    let hi = lines.length - 1;
+    while (lo + 1 < hi) {
+      const mid = Math.floor((lo + hi) / 2);
       const bounds = lines[mid].element.getBoundingClientRect();
-			if (bounds.top + bounds.height >= position) {
-				hi = mid;
-			} else {
-				lo = mid;
-			}
+      if (bounds.top + bounds.height >= position) {
+        hi = mid;
+      }
+      else {
+        lo = mid;
+      }
     }
 
-		const hiElement = lines[hi];
-		if (hi >= 1 && hiElement.element.getBoundingClientRect().top > position) {
-			const loElement = lines[lo];
-			const bounds = loElement.element.getBoundingClientRect();
+    const hiElement = lines[hi];
+    if (hi >= 1 && hiElement.element.getBoundingClientRect().top > position) {
+      const loElement = lines[lo];
+      const bounds = loElement.element.getBoundingClientRect();
       let previous = { element: loElement.element, line: loElement.line };
       if (bounds.height > 0) {
         previous.line += (position - bounds.top) / (bounds.height);
       }
       const next = { element: hiElement.element, line: hiElement.line, fractional: 0 };
-			return { previous, next };
-		}
+      return { previous, next };
+    }
 
-		const bounds = hiElement.element.getBoundingClientRect();
+    const bounds = hiElement.element.getBoundingClientRect();
     const previous = { element: hiElement.element, line: hiElement.line + (position - bounds.top) / (bounds.height) };
-		return { previous };
+    return { previous };
   }
 
   getEditorLineNumberForPageOffset(parentElement, offset) {
     const { previous, next } = this.getLineElementsAtPageOffset(parentElement, offset);
-		if (previous) {
-			if (next) {
+    if (previous) {
+      if (next) {
         const betweenProgress = (offset - parentElement.scrollTop - previous.element.getBoundingClientRect().top) / (next.element.getBoundingClientRect().top - previous.element.getBoundingClientRect().top);
-				return previous.line + betweenProgress * (next.line - previous.line);
-			} else {
-				return previous.line;
-			}
-		}
-		return null;
+        return previous.line + betweenProgress * (next.line - previous.line);
+      } else {
+        return previous.line;
+      }
+    }
+    return null;
   }
 
   /**
@@ -116,7 +118,7 @@ class ScrollSyncHelper {
     const style = window.getComputedStyle(parentElement, null);
     const paddingTop = +(style.paddingTop.replace('px', ''));
 
-		return offsetY + paddingTop;
+    return offsetY + paddingTop;
   }
 
   /**
@@ -125,23 +127,24 @@ class ScrollSyncHelper {
    * @param {Element} previewElement
 	 * @param {number} line
 	 */
-	scrollPreview(previewElement, line) {
-		const { previous, next } = this.getElementsForSourceLine(previewElement, line);
-		if (previous) {
-			let scrollTo = 0;
-			if (next) {
-				// Between two elements. Go to percentage offset between them.
-				const betweenProgress = (line - previous.line) / (next.line - previous.line);
-				const elementOffset = next.element.getBoundingClientRect().top - previous.element.getBoundingClientRect().top;
-				scrollTo = previous.element.getBoundingClientRect().top + betweenProgress * elementOffset;
-			} else {
-				scrollTo = previous.element.getBoundingClientRect().top;
+  scrollPreview(previewElement, line) {
+    const { previous, next } = this.getElementsForSourceLine(previewElement, line);
+    if (previous) {
+      let scrollTo = 0;
+      if (next) {
+        // Between two elements. Go to percentage offset between them.
+        const betweenProgress = (line - previous.line) / (next.line - previous.line);
+        const elementOffset = next.element.getBoundingClientRect().top - previous.element.getBoundingClientRect().top;
+        scrollTo = previous.element.getBoundingClientRect().top + betweenProgress * elementOffset;
+      }
+      else {
+        scrollTo = previous.element.getBoundingClientRect().top;
       }
 
       scrollTo -= this.getParentElementOffset(previewElement);
 
       previewElement.scroll(0, previewElement.scrollTop + scrollTo);
-		}
+    }
   }
 
   /**
@@ -151,8 +154,8 @@ class ScrollSyncHelper {
 	 * @param {number} line
 	 */
   scrollPreviewToRevealOverflowing(previewElement, line) {
-		const { previous, next } = this.getElementsForSourceLine(previewElement, line);
-		if (previous) {
+    const { previous, next } = this.getElementsForSourceLine(previewElement, line);
+    if (previous) {
       const parentElementOffset = this.getParentElementOffset(previewElement);
       const prevElmTop = previous.element.getBoundingClientRect().top - parentElementOffset;
       const prevElmBottom = previous.element.getBoundingClientRect().bottom - parentElementOffset;
@@ -172,7 +175,7 @@ class ScrollSyncHelper {
       }
 
       previewElement.scroll(0, scrollTo);
-		}
+    }
   }
 
   /**

resource/js/components/ReactUtils.js

@@ -15,7 +15,7 @@ export default class ReactUtils {
    */
   static nl2br(text) {
     var regex = /(\n)/g
-    return text.split(regex).map(function (line) {
+    return text.split(regex).map(function(line) {
       if (line.match(regex)) {
         return React.createElement('br', {key: Math.random().toString(10).substr(2, 10)})
       }

resource/js/components/SearchPage/DeletePageListModal.js

@@ -5,14 +5,12 @@ import Button from 'react-bootstrap/es/Button';
 import Modal from 'react-bootstrap/es/Modal';
 import Checkbox from 'react-bootstrap/es/Checkbox';
 
-import ReactUtils from '../ReactUtils';
-
 export default class DeletePageListModal extends React.Component {
 
   /*
    * the threshold for omitting body
    */
-  static get OMIT_BODY_THRES() { return 400 };
+  static get OMIT_BODY_THRES() { return 400 }
 
   constructor(props) {
     super(props);
@@ -23,7 +21,7 @@ export default class DeletePageListModal extends React.Component {
 
   render() {
     if (this.props.pages === undefined || this.props.pages.length == 0) {
-      return <div></div>
+      return <div></div>;
     }
 
     const listView = this.props.pages.map((page) => {

resource/js/components/SearchPage/SearchForm.js

@@ -54,6 +54,7 @@ export default class SearchForm extends React.Component {
 }
 
 SearchForm.propTypes = {
+  keyword: PropTypes.string,
   onSearchFormChanged: PropTypes.func.isRequired,
 };
 SearchForm.defaultProps = {

resource/js/components/SearchPage/SearchResult.js

@@ -10,12 +10,12 @@ export default class SearchResult extends React.Component {
   constructor(props) {
     super(props);
     this.state = {
-      deletionMode : false,
-      selectedPages : new Set(),
+      deletionMode: false,
+      selectedPages: new Set(),
       isDeleteCompletely: undefined,
       isDeleteConfirmModalShown: false,
       errorMessageForDeleting: undefined,
-    }
+    };
     this.toggleDeleteCompletely = this.toggleDeleteCompletely.bind(this);
     this.deleteSelectedPages = this.deleteSelectedPages.bind(this);
     this.closeDeleteConfirmModal = this.closeDeleteConfirmModal.bind(this);
@@ -45,7 +45,8 @@ export default class SearchResult extends React.Component {
   toggleCheckbox(page) {
     if (this.state.selectedPages.has(page)) {
       this.state.selectedPages.delete(page);
-    } else {
+    }
+    else {
       this.state.selectedPages.add(page);
     }
     this.setState({isDeleteConfirmModalShown: false});
@@ -194,7 +195,7 @@ export default class SearchResult extends React.Component {
         <button type="button" className="btn btn-rounded btn-danger btn-xs" onClick={() => this.showDeleteConfirmModal()} disabled={this.state.selectedPages.size == 0}>
           <i className="icon-trash"/> Delete
         </button>
-      </div>
+      </div>;
       allSelectCheck =
       <div>
         <label>
@@ -204,7 +205,7 @@ export default class SearchResult extends React.Component {
             checked={this.isAllSelected()} />
             &nbsp;Check All
         </label>
-      </div>
+      </div>;
     }
     else {
       deletionModeButtons =
@@ -212,11 +213,11 @@ export default class SearchResult extends React.Component {
         <button type="button" className="btn btn-default btn-rounded btn-xs" onClick={() => this.handleDeletionModeChange()}>
           <i className="ti-check-box"/> DeletionMode
         </button>
-      </div>
+      </div>;
     }
 
     const listView = this.props.pages.map((page) => {
-      const pageId = "#" + page._id;
+      const pageId = '#' + page._id;
       return (
         <Page page={page}
           linkTo={pageId}
@@ -289,10 +290,12 @@ export default class SearchResult extends React.Component {
 
 SearchResult.propTypes = {
   crowi: PropTypes.object.isRequired,
+  crowiRenderer: PropTypes.object,
   tree: PropTypes.string.isRequired,
   pages: PropTypes.array.isRequired,
   searchingKeyword: PropTypes.string.isRequired,
   searchResultMeta: PropTypes.object.isRequired,
+  searchError: PropTypes.object
 };
 SearchResult.defaultProps = {
   tree: '',

resource/js/components/SearchPage/SearchResultList.js

@@ -14,8 +14,6 @@ export default class SearchResultList extends React.Component {
   }
 
   render() {
-    var isEnabledLineBreaks = $('#content-main').data('linebreaks-enabled');
-
     const resultList = this.props.pages.map((page) => {
       const pageBody = page.revision.body;
       return (

resource/js/util/interceptor/detach-code-blocks.js

@@ -108,7 +108,7 @@ export class RestoreCodeBlockInterceptor extends BasicInterceptor {
 
       // replace it with content by using getter function so that the doller sign does not work
       // see: https://github.com/weseek/crowi-plus/issues/285
-      context.markdown = context.markdown.replace(dcbContext.substituteContent, () => { return dcbContext.content; });
+      context.markdown = context.markdown.replace(dcbContext.substituteContent, () => { return dcbContext.content });
     });
 
     // resolve