Folderの位置を変えることができる

lib/components/modal/Preference/FolderRow.js

@@ -2,7 +2,7 @@ import React, { PropTypes } from 'react'
 import linkState from 'boost/linkState'
 import FolderMark from 'boost/components/FolderMark'
 import store from 'boost/store'
-import { updateFolder, destroyFolder } from 'boost/actions'
+import { updateFolder, destroyFolder, replaceFolder } from 'boost/actions'
 
 const IDLE = 'IDLE'
 const EDIT = 'EDIT'
@@ -17,6 +17,20 @@ export default class FolderRow extends React.Component {
     }
   }
 
+  handleUpClick (e) {
+    let { index } = this.props
+    if (index > 0) {
+      store.dispatch(replaceFolder(index, index - 1))
+    }
+  }
+
+  handleDownClick (e) {
+    let { index, count } = this.props
+    if (index < count - 1) {
+      store.dispatch(replaceFolder(index, index + 1))
+    }
+  }
+
   handleCancelButtonClick (e) {
     this.setState({
       mode: IDLE
@@ -141,6 +155,10 @@ export default class FolderRow extends React.Component {
       default:
         return (
           <div className='FolderRow'>
+            <div className='sortBtns'>
+              <button onClick={e => this.handleUpClick(e)}><i className='fa fa-sort-up fa-fw'/></button>
+              <button onClick={e => this.handleDownClick(e)}><i className='fa fa-sort-down fa-fw'/></button>
+            </div>
             <div className='folderColor'><FolderMark color={folder.color}/></div>
             <div className='folderName'>{folder.name}</div>
             <div className='folderControl'>
@@ -155,6 +173,8 @@ export default class FolderRow extends React.Component {
 
 FolderRow.propTypes = {
   folder: PropTypes.shape(),
+  index: PropTypes.number,
+  count: PropTypes.number,
   setAlert: PropTypes.func
 }