Make InfoButton component stateless

browser/main/Detail/InfoButton.js

@@ -2,29 +2,15 @@ import React, { PropTypes } from 'react'
 import CSSModules from 'browser/lib/CSSModules'
 import styles from './InfoButton.styl'
 
-class InfoButton extends React.Component {
-  constructor (props) {
-    super(props)
-
-    this.handleInfoButtonClick = this.handleInfoButtonClick.bind(this)
-  }
-
-  handleInfoButtonClick (e) {
-    e.preventDefault()
-    const infoPanel= document.querySelector('.infoPanel')
-    infoPanel.style.display = display === 'none' ? 'inline' : 'none'
-  }
-
-  render () {
-    return (
-      <button styleName='control-infoButton'
-        onClick={(e) => this.handleInfoButtonClick(e)}
-      >
-        <i className='fa fa-info-circle infoButton' styleName='info-button' />
-      </button>
-    )
-  }
-}
+const InfoButton = ({
+  onClick
+}) => (
+  <button styleName='control-infoButton'
+    onClick={(e) => onClick(e)}
+  >
+    <i className='fa fa-info-circle infoButton' styleName='info-button' />
+  </button>
+)
 
 InfoButton.propTypes = {
 }

browser/main/Detail/MarkdownNoteDetail.js

@@ -232,6 +232,11 @@ class MarkdownNoteDetail extends React.Component {
     this.focus()
   }
 
+  handleInfoButtonClick (e) {
+    const infoPanel= document.querySelector('.infoPanel')
+    infoPanel.style.display = display === 'none' ? 'inline' : 'none'
+  }
+
   render () {
     let { data, config, location } = this.props
     let { note } = this.state
@@ -303,7 +308,9 @@ class MarkdownNoteDetail extends React.Component {
             >
               <i className='fa fa-arrows-alt' styleName='fullScreen-button' />
             </button>
-            <InfoButton />
+            <InfoButton
+              onClick={this.handleInfoButtonClick()}
+            />
             <InfoPanel
               storageName={currentOption.storage.name}
               folderName={currentOption.folder.name}