--- a/client/src/components/Note.js	Fri Jun 23 10:16:49 2017 +0200
+++ b/client/src/components/Note.js	Fri Jun 23 11:16:34 2017 +0200
@@ -12,9 +12,10 @@
     edit: false
   }
 
-  toggleEditMode = () => {
+  enterEditMode = () => {
     const { edit } = this.state;
-    this.setState({ edit: !edit })
+    if (edit) return;
+    this.setState({ edit: true })
   }
 
   onClickDelete = (e) => {
@@ -24,19 +25,30 @@
     this.props.notesActions.deleteNote(this.props.note);
   }
 
+  onClickButton = (e) => {
+
+    const plain = this.refs.editor.asPlain();
+    const raw = this.refs.editor.asRaw();
+    const html = this.refs.editor.asHtml();
+    const categories = this.refs.editor.asCategories();
+
+    this.props.notesActions.updateNote(this.props.note, {
+      plain,
+      raw,
+      html,
+      categories
+    });
+
+    this.setState({ edit: false })
+  }
+
   renderNoteContent() {
     if (this.state.edit) {
       return (
         <div className="note-content">
           <SlateEditor ref="editor"
-            onChange={this.onEditorChange}
-            onEnterKeyDown={this.onAddNoteClick}
-            onButtonClick={this.onAddNoteClick}
-            onCheckboxChange={this.onCheckboxChange}
-            isChecked={this.props.autoSubmit}
-            isButtonDisabled={this.state.buttonDisabled}
-            withButtons={false}
-            note={this.props.note} />
+            onButtonClick={ this.onClickButton }
+            note={ this.props.note } />
         </div>
       )
     }
@@ -48,7 +60,7 @@
 
   render() {
     return (
-      <div id={"note-" + this.props.note._id} className="note" onClick={ this.toggleEditMode }>
+      <div id={"note-" + this.props.note._id} className="note" onClick={ this.enterEditMode }>
         <span className="start">{ formatTimestamp(this.props.note.startedAt) }</span>
         <span className="finish">{ formatTimestamp(this.props.note.finishedAt) }</span>
         { this.renderNoteContent() }