Mutable

INIT_ALL, NOTE_MOVE, NOTE_UPDATE(create/update) done

browser/main/Detail/FolderSelect.js

@@ -184,12 +184,12 @@ class FolderSelect extends React.Component {
   }
 
   render () {
-    let { className, storages, value } = this.props
+    let { className, data, value } = this.props
     let splitted = value.split('-')
     let storageKey = splitted.shift()
     let folderKey = splitted.shift()
     let options = []
-    storages.forEach((storage, index) => {
+    data.storageMap.forEach((storage, index) => {
       storage.folders.forEach((folder) => {
         options.push({
           storage: storage,

browser/main/Detail/MarkdownNoteDetail.js

@@ -35,6 +35,7 @@ class MarkdownNoteDetail extends React.Component {
 
   componentWillReceiveProps (nextProps) {
     if (nextProps.note.key !== this.props.note.key && !this.isMovingNote) {
+      if (this.saveQueue != null) this.saveNow()
       this.setState({
         note: Object.assign({}, nextProps.note),
         isDeleting: false
@@ -45,6 +46,10 @@ class MarkdownNoteDetail extends React.Component {
     }
   }
 
+  componentWillUnmount () {
+    if (this.saveQueue != null) this.saveNow()
+  }
+
   findTitle (value) {
     let splitted = value.split('\n')
     let title = null
@@ -91,17 +96,25 @@ class MarkdownNoteDetail extends React.Component {
   save () {
     clearTimeout(this.saveQueue)
     this.saveQueue = setTimeout(() => {
-      let { note, dispatch } = this.props
-      dispatch({
-        type: 'UPDATE_NOTE',
-        note: this.state.note
-      })
-
-      dataApi
-        .updateNote(note.storage, note.folder, note.key, this.state.note)
+      this.saveNow()
     }, 1000)
   }
 
+  saveNow () {
+    let { note, dispatch } = this.props
+    clearTimeout(this.saveQueue)
+    this.saveQueue = null
+
+    dataApi
+      .updateNote(note.storage, note.key, this.state.note)
+      .then((note) => {
+        dispatch({
+          type: 'UPDATE_NOTE',
+          note: note
+        })
+      })
+  }
+
   handleFolderChange (e) {
     let { note } = this.state
     let value = this.refs.folder.value
@@ -110,7 +123,7 @@ class MarkdownNoteDetail extends React.Component {
     let newFolderKey = splitted.shift()
 
     dataApi
-      .moveNote(note.storage, note.folder, note.key, newStorageKey, newFolderKey)
+      .moveNote(note.storage, note.key, newStorageKey, newFolderKey)
       .then((newNote) => {
         this.setState({
           isMovingNote: true,
@@ -119,13 +132,13 @@ class MarkdownNoteDetail extends React.Component {
           let { dispatch, location } = this.props
           dispatch({
             type: 'MOVE_NOTE',
-            note: note,
-            newNote: newNote
+            originNote: note,
+            note: newNote
           })
           hashHistory.replace({
             pathname: location.pathname,
             query: {
-              key: newNote.uniqueKey
+              key: newNote.storage + '-' + newNote.key
             }
           })
           this.setState({
@@ -210,7 +223,7 @@ class MarkdownNoteDetail extends React.Component {
   }
 
   render () {
-    let { storages, config } = this.props
+    let { data, config } = this.props
     let { note } = this.state
 
     return (
@@ -243,7 +256,7 @@ class MarkdownNoteDetail extends React.Component {
                 <FolderSelect styleName='info-left-top-folderSelect'
                   value={this.state.note.storage + '-' + this.state.note.folder}
                   ref='folder'
-                  storages={storages}
+                  data={data}
                   onChange={(e) => this.handleFolderChange(e)}
                 />
               </div>

browser/main/Detail/SnippetNoteDetail.js

@@ -48,6 +48,7 @@ class SnippetNoteDetail extends React.Component {
 
   componentWillReceiveProps (nextProps) {
     if (nextProps.note.key !== this.props.note.key) {
+      if (this.saveQueue != null) this.saveNow()
       let nextNote = Object.assign({
         description: ''
       }, nextProps.note, {
@@ -67,6 +68,10 @@ class SnippetNoteDetail extends React.Component {
     }
   }
 
+  componentWillUnmount () {
+    if (this.saveQueue != null) this.saveNow()
+  }
+
   findTitle (value) {
     let splitted = value.split('\n')
     let title = null
@@ -113,17 +118,25 @@ class SnippetNoteDetail extends React.Component {
   save () {
     clearTimeout(this.saveQueue)
     this.saveQueue = setTimeout(() => {
-      let { note, dispatch } = this.props
-      dispatch({
-        type: 'UPDATE_NOTE',
-        note: this.state.note
-      })
-
-      dataApi
-        .updateNote(note.storage, note.folder, note.key, this.state.note)
+      this.saveNow()
     }, 1000)
   }
 
+  saveNow () {
+    let { note, dispatch } = this.props
+    clearTimeout(this.saveQueue)
+    this.saveQueue = null
+
+    dataApi
+      .updateNote(note.storage, note.key, this.state.note)
+      .then((note) => {
+        dispatch({
+          type: 'UPDATE_NOTE',
+          note: note
+        })
+      })
+  }
+
   handleFolderChange (e) {
     let { note } = this.state
     let value = this.refs.folder.value
@@ -132,7 +145,7 @@ class SnippetNoteDetail extends React.Component {
     let newFolderKey = splitted.shift()
 
     dataApi
-      .moveNote(note.storage, note.folder, note.key, newStorageKey, newFolderKey)
+      .moveNote(note.storage, note.key, newStorageKey, newFolderKey)
       .then((newNote) => {
         this.setState({
           isMovingNote: true,
@@ -141,13 +154,13 @@ class SnippetNoteDetail extends React.Component {
           let { dispatch, location } = this.props
           dispatch({
             type: 'MOVE_NOTE',
-            note: note,
-            newNote: newNote
+            originNote: note,
+            note: newNote
           })
           hashHistory.replace({
             pathname: location.pathname,
             query: {
-              key: newNote.uniqueKey
+              key: newNote.storage + '-' + newNote.key
             }
           })
           this.setState({
@@ -321,7 +334,7 @@ class SnippetNoteDetail extends React.Component {
   }
 
   render () {
-    let { storages, config } = this.props
+    let { data, config } = this.props
     let { note } = this.state
 
     let editorFontSize = parseInt(config.editor.fontSize, 10)
@@ -434,7 +447,7 @@ class SnippetNoteDetail extends React.Component {
                 <FolderSelect styleName='info-left-top-folderSelect'
                   value={this.state.note.storage + '-' + this.state.note.folder}
                   ref='folder'
-                  storages={storages}
+                  data={data}
                   onChange={(e) => this.handleFolderChange(e)}
                 />
               </div>

browser/main/Detail/index.js

@@ -31,19 +31,14 @@ class Detail extends React.Component {
   }
 
   render () {
-    let { location, notes, config } = this.props
+    let { location, data, config } = this.props
     let note = null
     if (location.query.key != null) {
       let splitted = location.query.key.split('-')
       let storageKey = splitted.shift()
-      let folderKey = splitted.shift()
       let noteKey = splitted.shift()
 
-      note = _.find(notes, {
-        storage: storageKey,
-        folder: folderKey,
-        key: noteKey
-      })
+      note = data.noteMap.get(storageKey + '-' + noteKey)
     }
 
     if (note == null) {
@@ -67,7 +62,7 @@ class Detail extends React.Component {
           ref='root'
           {..._.pick(this.props, [
             'dispatch',
-            'storages',
+            'data',
             'style',
             'ignorePreviewPointerEvents',
             'location'
@@ -83,7 +78,7 @@ class Detail extends React.Component {
         ref='root'
         {..._.pick(this.props, [
           'dispatch',
-          'storages',
+          'data',
           'style',
           'ignorePreviewPointerEvents',
           'location'
@@ -95,7 +90,6 @@ class Detail extends React.Component {
 
 Detail.propTypes = {
   dispatch: PropTypes.func,
-  storages: PropTypes.array,
   style: PropTypes.shape({
     left: PropTypes.number
   }),