preserve parent id when reloading editor plus fixes

app/components/SimpleEditor/elements/isolatedNote/IsolatedNoteHTMLConverter.js

@@ -4,5 +4,6 @@ export default {
 
   import: function (el, node, converter) {
     node.content = converter.annotatedText(el, [node.id, 'content'])
+    node.parentNoteId = el.attr('parent-id')
   }
 }

app/components/SimpleEditor/elements/track_change/TrackChangeComponent.js

@@ -33,16 +33,17 @@ class TrackChangeComponent extends AnnotationComponent {
       container.addClass('sc-accept-reject-container-hide')
     }
 
-    // .attr('status', status and .attr('roles', user.roles[0]) Only Exist because
+    // roles, status,username,user-id only exist because
     // on the second editor we do not have an exporter but everything is pushed to
     // the note-content property of the callout. So cause we use olny the importer
     // those attr did not exist
-
     let el = $$('track-change')
       .attr('data-id', id)
       .attr('title', user.username)
-      .attr('status', status)
       .attr('roles', user.roles[0])
+      .attr('status', status)
+      .attr('username', user.username)
+      .attr('user-id', user.id)
       .addClass(this.getClassNames())
       .append(this.props.children)
 

app/components/SimpleEditor/miniEditor/miniEditor.js

@@ -11,14 +11,12 @@ class MiniEditor extends ProseEditor {
 
   didMount () {
     this.context.notesProvider.config.miniEditorContext = this.getChildContext()
-    this.editorSession.onUpdate('document', this.setEditorSession, this)
+    this.editorSession.onUpdate('document', this.reComputeEntries, this)
     this.context.notesProvider.config.miniEditorSession = this.editorSession
     this.on('noteSelected', this.scrollTo, this)
   }
 
-  setEditorSession () {
-    this.context.notesProvider.config.miniEditorContext = this.getChildContext()
-    this.context.notesProvider.config.miniEditorSession = this.editorSession
+  reComputeEntries () {
     this.context.notesProvider.computeEntries()
   }
 

app/components/SimpleEditor/panes/Notes/NotesProvider.js

 import _ from 'lodash'
 
-import { TOCProvider } from 'substance'
+import { TOCProvider, Component } from 'substance'
 
 class NotesProvider extends TOCProvider {
   computeEntries () {
@@ -59,19 +59,29 @@ class NotesProvider extends TOCProvider {
   }
 
   sortNodesMini (nodes) {
-    let notes = _.clone(nodes)
     if (this.config.miniEditorSession === '') return
 
+    let notes = _.clone(nodes)
+    let rootEl = this.config.miniEditorContext.editor.el
+    let i = 0
     notes = _.map(notes, function (note) {
-      const element = document.querySelector('p[data-path="' + note.id + '.content"]')
-      const noteContent = '<isolated-note data-id="' + note.id + '" data-type="isolated-note">' + element.innerHTML + '</isolated-note>'
+      const element = Component.unwrap(rootEl.find('p[data-path="' + note.id + '.content"]'))
+      // removes a <br> insterted at the end by inline node
+      const text = element.innerHTML.slice(0, -4)
+      let noteContent = '<isolated-note data-id="' + note.id + '" parent-id="' + note.parentNoteId + '" data-type="isolated-note">' + text + '</isolated-note>'
+
+      // TODO For some reason the first character is not in the annotation so it is not getting saved. For that
+      // miniEditor has a reComputeEntries and in here we rerender Surface only the first time to get the character.
+      if (i === 0) this.config.miniEditorContext.surfaceManager.getSurface('mini').rerender()
+      i++
 
       return {
         id: note.id,
         content: noteContent,
         parentNoteId: note.parentNoteId
       }
-    })
+    }.bind(this))
+
     return notes
   }
 

app/components/SimpleEditor/panes/Notes/notes.scss

@@ -14,7 +14,6 @@ $light-blue: #e4f0ff;
   z-index: 0;
 
   .resize-area {
-      padding-top: 40px;
     background-color: red;
     cursor: row-resize;
     height: 5px;
@@ -27,6 +26,7 @@ $light-blue: #e4f0ff;
    .sc-isolated-node.sm-default-style.sm-co-selected {
      border: 4px solid $light-blue ;
      outline: none;
+     padding: 0 0 8px 5px;
    }
 
    .sc-isolated-node .sc-text-property::before {