--- a/client/src/components/Note.js	Thu Jun 29 17:11:56 2017 +0200
+++ b/client/src/components/Note.js	Thu Jun 29 17:26:35 2017 +0200
@@ -1,5 +1,6 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
+import { FormControl } from 'react-bootstrap';
 import { formatTimestamp } from '../utils';
 import SlateEditor from './SlateEditor';
 
@@ -18,12 +19,14 @@
     const raw = this.refs.editor.asRaw();
     const html = this.refs.editor.asHtml();
     const categories = this.refs.editor.asCategories();
+    const marginComment = this.marginComment.value;
 
     const data = {
       plain,
       raw,
       html,
-      categories
+      categories,
+      marginComment
     }
 
     this.props.onSave(this.props.note, data);
@@ -52,6 +55,27 @@
     )
   }
 
+  renderNoteMarginComment() {
+    if (this.props.isEditing) {
+      return (
+        <div className="note-margin-comment">
+          <FormControl
+            name="margin"
+            componentClass="textarea"
+            placeholder="Enter a margin comment for your note"
+            defaultValue={ this.props.note.marginComment }
+            inputRef={ ref => { this.marginComment = ref; } } />
+        </div>
+      )
+    }
+
+    return (
+      <div className="note-margin-comment">
+        <small className="text-muted">{ this.props.note.marginComment }</small>
+      </div>
+    )
+  }
+
   renderNoteRight() {
     if (this.props.isEditing) {
       return (
@@ -74,9 +98,7 @@
         <span className="start">{ formatTimestamp(this.props.note.startedAt) }</span>
         <span className="finish">{ formatTimestamp(this.props.note.finishedAt) }</span>
         { this.renderNoteContent() }
-        <div className="note-margin-comment">
-          <small className="text-muted">{ this.props.note.marginComment }</small>
-        </div>
+        { this.renderNoteMarginComment() }
         { this.renderNoteRight() }
       </div>
     );

--- a/client/src/reducers/notesReducer.js	Thu Jun 29 17:11:56 2017 +0200
+++ b/client/src/reducers/notesReducer.js	Thu Jun 29 17:26:35 2017 +0200
@@ -20,11 +20,10 @@
     case types.UPDATE_NOTE:
       const index = findNoteIndex(state, action.note.get('_id'));
       const note = findNote(state, action.note.get('_id'));
-      const newNote = note
-        .set('plain', action.data.plain)
-        .set('raw', action.data.raw)
-        .set('html', action.data.html)
-        .set('categories', action.data.categories);
+      let newNote = note;
+      Object.entries(action.data).forEach(([key, value]) => {
+        newNote = note.set(key, value)
+      });
       return state.set(index, newNote);
     case types.DELETE_SESSION:
       return state.filter((note) => action.session.get('_id') !== note.session)