change folder

browser/main/Detail/FolderSelect.js

@@ -166,20 +166,20 @@ class FolderSelect extends React.Component {
     }
   }
 
-  handleOptionClick (folderKey) {
+  handleOptionClick (storageKey, folderKey) {
     return (e) => {
       e.stopPropagation()
       this.setState({
         status: 'FOCUS'
       }, () => {
-        this.setValue(folderKey)
+        this.setValue(storageKey + '-' + folderKey)
         this.refs.root.focus()
       })
     }
   }
 
-  setValue (folderKey) {
-    this.value = folderKey
+  setValue (value) {
+    this.value = value
     this.props.onChange()
   }
 
@@ -208,7 +208,7 @@ class FolderSelect extends React.Component {
               : 'search-optionList-item'
             }
             key={option.storage.key + '-' + option.folder.key}
-            onClick={(e) => this.handleOptionClick(option.folder.key)(e)}
+            onClick={(e) => this.handleOptionClick(option.storage.key, option.folder.key)(e)}
           >
             <span styleName='search-optionList-item-name'
               style={{borderColor: option.folder.color}}

browser/main/Detail/MarkdownNoteDetail.js

@@ -7,6 +7,7 @@ import TagSelect from './TagSelect'
 import FolderSelect from './FolderSelect'
 import Commander from 'browser/main/lib/Commander'
 import dataApi from 'browser/main/lib/dataApi'
+import { hashHistory } from 'react-router'
 
 const electron = require('electron')
 const { remote } = electron
@@ -20,9 +21,9 @@ class MarkdownNoteDetail extends React.Component {
     this.state = {
       note: Object.assign({
         title: '',
-        content: ''
-      }, props.note),
-      isDispatchQueued: false
+        content: '',
+        isMovingNote: false
+      }, props.note)
     }
     this.dispatchTimer = null
   }
@@ -43,14 +44,9 @@ class MarkdownNoteDetail extends React.Component {
   }
 
   componentWillReceiveProps (nextProps) {
-    if (nextProps.note.key !== this.props.note.key) {
-      if (this.state.isDispatchQueued) {
-        this.cancelDispatchQueue()
-        this.dispatch()
-      }
+    if (nextProps.note.key !== this.props.note.key && !this.isMovingNote) {
       this.setState({
-        note: Object.assign({}, nextProps.note),
-        isDispatchQueued: false
+        note: Object.assign({}, nextProps.note)
       }, () => {
         this.refs.content.reload()
         this.refs.tags.reset()
@@ -114,7 +110,36 @@ class MarkdownNoteDetail extends React.Component {
   }
 
   handleFolderChange (e) {
+    let { note } = this.state
+    let value = this.refs.folder.value
+    let splitted = value.split('-')
+    let newStorageKey = splitted.shift()
+    let newFolderKey = splitted.shift()
 
+    dataApi
+      .moveNote(note.storage, note.folder, note.key, newStorageKey, newFolderKey)
+      .then((newNote) => {
+        this.setState({
+          isMovingNote: true,
+          note: Object.assign({}, newNote)
+        }, () => {
+          let { dispatch, location } = this.props
+          dispatch({
+            type: 'MOVE_NOTE',
+            note: note,
+            newNote: newNote
+          })
+          hashHistory.replace({
+            pathname: location.pathname,
+            query: {
+              key: newNote.uniqueKey
+            }
+          })
+          this.setState({
+            isMovingNote: false
+          })
+        })
+      })
   }
 
   handleStarButtonClick (e) {

browser/main/Detail/SnippetNoteDetail.js

@@ -8,6 +8,7 @@ import FolderSelect from './FolderSelect'
 import Commander from 'browser/main/lib/Commander'
 import dataApi from 'browser/main/lib/dataApi'
 import modes from 'browser/lib/modes'
+import { hashHistory } from 'react-router'
 
 const electron = require('electron')
 const { remote } = electron
@@ -118,7 +119,36 @@ class SnippetNoteDetail extends React.Component {
   }
 
   handleFolderChange (e) {
+    let { note } = this.state
+    let value = this.refs.folder.value
+    let splitted = value.split('-')
+    let newStorageKey = splitted.shift()
+    let newFolderKey = splitted.shift()
 
+    dataApi
+      .moveNote(note.storage, note.folder, note.key, newStorageKey, newFolderKey)
+      .then((newNote) => {
+        this.setState({
+          isMovingNote: true,
+          note: Object.assign({}, newNote)
+        }, () => {
+          let { dispatch, location } = this.props
+          dispatch({
+            type: 'MOVE_NOTE',
+            note: note,
+            newNote: newNote
+          })
+          hashHistory.replace({
+            pathname: location.pathname,
+            query: {
+              key: newNote.uniqueKey
+            }
+          })
+          this.setState({
+            isMovingNote: false
+          })
+        })
+      })
   }
 
   handleStarButtonClick (e) {

browser/main/Detail/index.js

@@ -4,6 +4,7 @@ import styles from './Detail.styl'
 import _ from 'lodash'
 import MarkdownNoteDetail from './MarkdownNoteDetail'
 import SnippetNoteDetail from './SnippetNoteDetail'
+import dataApi from 'browser/main/lib/dataApi'
 
 const electron = require('electron')
 
@@ -51,7 +52,8 @@ class Detail extends React.Component {
             'dispatch',
             'storages',
             'style',
-            'ignorePreviewPointerEvents'
+            'ignorePreviewPointerEvents',
+            'location'
           ])}
         />
       )
@@ -65,7 +67,8 @@ class Detail extends React.Component {
           'dispatch',
           'storages',
           'style',
-          'ignorePreviewPointerEvents'
+          'ignorePreviewPointerEvents',
+          'location'
         ])}
       />
     )