diff --git a/wax-prosemirror-components/package.json b/wax-prosemirror-components/package.json
index 572574f9c0c61b60f38262f3a6d3b98cd4f12335..8b10922d4ff80a58e78cdb721efdc8b92518131c 100644
--- a/wax-prosemirror-components/package.json
+++ b/wax-prosemirror-components/package.json
@@ -15,8 +15,6 @@
     "@fortawesome/react-fontawesome": "^0.0.17",
     "lodash": "^4.17.4",
     "prop-types": "^15.7.2",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-dropdown": "^1.6.2",
     "react-transition-group": "^4.3.0",
     "styled-components": "^4.2.0",
@@ -25,5 +23,9 @@
     "prosemirror-state": "^1.3.2",
     "wax-prosemirror-core": "^0.0.10",
     "wax-prosemirror-utilities": "^0.0.10"
+  },
+  "peerDependencies": {
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1"
   }
 }
diff --git a/wax-prosemirror-components/src/components/comments/Comment.js b/wax-prosemirror-components/src/components/comments/Comment.js
index b8e257ea25c5784dc5069c7fb6c34aa69b474d61..27d74073ab0e0f8442842c773d9c56383436813c 100644
--- a/wax-prosemirror-components/src/components/comments/Comment.js
+++ b/wax-prosemirror-components/src/components/comments/Comment.js
@@ -22,7 +22,7 @@ export default ({ comment, activeView, user }) => {
 
   const handleKeyDown = event => {
     if (event.key === 'Enter' || event.which === 13) {
-      saveComment();
+      saveComment(event);
     }
   };
 
@@ -74,7 +74,7 @@ export default ({ comment, activeView, user }) => {
   };
 
   const resolveComment = event => {
-    event.stopPropagation();
+    if (event) event.stopPropagation();
     let maxPos = comment.pos;
     let minPos = comment.pos;
 
diff --git a/wax-prosemirror-components/src/components/comments/CommentBox.js b/wax-prosemirror-components/src/components/comments/CommentBox.js
index 9cb81a741efcb90cb37c870c1c6d759f5474b362..bd4b9eaaf672ee5e3b41d789315a2d590f18f986 100644
--- a/wax-prosemirror-components/src/components/comments/CommentBox.js
+++ b/wax-prosemirror-components/src/components/comments/CommentBox.js
@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useContext } from 'react';
 import { TextSelection } from 'prosemirror-state';
-import { last } from 'lodash';
+import { last, maxBy } from 'lodash';
 
 import { Transition } from 'react-transition-group';
 import styled from 'styled-components';
@@ -59,18 +59,19 @@ export default ({ comment, top, dataBox }) => {
 
   const setCommentActive = () => {
     const viewId = comment.attrs.viewid;
-    let maxPos = comment.pos;
-    const allCommentsWithSameId = DocumentHelpers.findAllMarksWithSameId(view[viewId].state, comment);
 
-    allCommentsWithSameId.forEach(singleComment => {
-      const markPosition = DocumentHelpers.findMarkPosition(view[viewId], singleComment.pos, 'comment');
-      if (markPosition.to > maxPos) maxPos = markPosition.to;
-    });
+    if (active) {
+      view[viewId].focus();
+      return false;
+    }
+
+    const allCommentsWithSameId = DocumentHelpers.findAllMarksWithSameId(view[viewId].state, comment);
 
-    if (!active && allCommentsWithSameId.length > 1) maxPos += last(allCommentsWithSameId).node.nodeSize;
+    const maxPos = maxBy(allCommentsWithSameId, 'pos');
+    maxPos.pos += last(allCommentsWithSameId).node.nodeSize;
 
     view[viewId].dispatch(
-      view[viewId].state.tr.setSelection(new TextSelection(view[viewId].state.tr.doc.resolve(maxPos, maxPos))),
+      view[viewId].state.tr.setSelection(new TextSelection(view[viewId].state.tr.doc.resolve(maxPos.pos, maxPos.pos))),
     );
 
     view[viewId].focus();
diff --git a/wax-prosemirror-core/package.json b/wax-prosemirror-core/package.json
index b2b7bc316211d8affee6162d3983da7a85a72faa..e385b5a4f02142ed1c4702a229f8d589dcd569fa 100644
--- a/wax-prosemirror-core/package.json
+++ b/wax-prosemirror-core/package.json
@@ -25,8 +25,6 @@
     "prosemirror-state": "^1.3.2",
     "prosemirror-transform": "^1.2.3",
     "prosemirror-view": "^1.13.11",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "reflect-metadata": "^0.1.13",
     "styled-components": "^4.2.0",
     "uuid": "^7.0.3",
@@ -36,5 +34,9 @@
   "devDependencies": {
     "mocha": "^3.4.2",
     "prosemirror-test-builder": "^1.0.1"
+  },
+  "peerDependencies": {
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1"
   }
 }
diff --git a/wax-prosemirror-core/src/config/defaultConfig.js b/wax-prosemirror-core/src/config/defaultConfig.js
index eaa95d45ef647bff2b2887fe3cae23fb418259f8..c7f9a3726116ee557093a296e8b58213931cd71c 100644
--- a/wax-prosemirror-core/src/config/defaultConfig.js
+++ b/wax-prosemirror-core/src/config/defaultConfig.js
@@ -3,8 +3,9 @@ import {
   MenuService,
   RulesService,
   ShortCutsService,
-  LayoutService
-} from "wax-prosemirror-services";
+  LayoutService,
+  OverlayService,
+} from 'wax-prosemirror-services';
 
 export default {
   services: [
@@ -12,6 +13,7 @@ export default {
     new RulesService(),
     new ShortCutsService(),
     new LayoutService(),
-    new MenuService()
-  ]
+    new MenuService(),
+    new OverlayService(),
+  ],
 };
diff --git a/wax-prosemirror-layouts/package.json b/wax-prosemirror-layouts/package.json
index e05777436af2751059341b7e485b33f0494afb9f..4c91865226686ea656f4e85aba427ef665317a0f 100644
--- a/wax-prosemirror-layouts/package.json
+++ b/wax-prosemirror-layouts/package.json
@@ -10,8 +10,6 @@
     "build": "BABEL_ENV=production rollup -c"
   },
   "dependencies": {
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "react-panelgroup": "^1.0.10",
     "styled-components": "^4.2.0",
     "wax-prosemirror-core": "^0.0.10",
@@ -19,5 +17,9 @@
     "wax-prosemirror-themes": "^0.0.10",
     "wax-prosemirror-services": "^0.0.10",
     "wax-prosemirror-utilities": "^0.0.10"
+  },
+  "peerDependencies": {
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1"
   }
 }
diff --git a/wax-prosemirror-plugins/src/trackChanges/FindSelectedChanges.js b/wax-prosemirror-plugins/src/trackChanges/FindSelectedChanges.js
index d923260ec75b1e4bbfc0a36799f85c7e95f6d58b..fbeb2339d4f1ca81f528b37c6327d96a43823d5c 100644
--- a/wax-prosemirror-plugins/src/trackChanges/FindSelectedChanges.js
+++ b/wax-prosemirror-plugins/src/trackChanges/FindSelectedChanges.js
@@ -1,11 +1,11 @@
-import { getFromToMark } from "./helpers";
+import { getFromToMark } from './helpers';
 
 const findSelectedChanges = state => {
   const selection = state.selection,
     selectedChanges = {
       insertion: false,
       deletion: false,
-      formatChange: false
+      formatChange: false,
     };
   let insertionPos = false,
     deletionPos = false,
@@ -21,17 +21,15 @@ const findSelectedChanges = state => {
     const resolvedPos = state.doc.resolve(selection.from),
       marks = resolvedPos.marks();
     if (marks) {
-      insertionMark = marks.find(
-        mark => mark.type.name === "insertion" && !mark.attrs.approved
-      );
+      insertionMark = marks.find(mark => mark.type.name === 'insertion' && !mark.attrs.approved);
       if (insertionMark) {
         insertionPos = selection.from;
       }
-      deletionMark = marks.find(mark => mark.type.name === "deletion");
+      deletionMark = marks.find(mark => mark.type.name === 'deletion');
       if (deletionMark) {
         deletionPos = selection.from;
       }
-      formatChangeMark = marks.find(mark => mark.type.name === "format_change");
+      formatChangeMark = marks.find(mark => mark.type.name === 'format_change');
       if (formatChangeMark) {
         formatChangePos = selection.from;
       }
@@ -43,10 +41,8 @@ const findSelectedChanges = state => {
       }
       if (!insertionMark) {
         insertionMark = node.attrs.track
-          ? node.attrs.track.find(trackAttr => trackAttr.type === "insertion")
-          : node.marks.find(
-              mark => mark.type.name === "insertion" && !mark.attrs.approved
-            );
+          ? node.attrs.track.find(trackAttr => trackAttr.type === 'insertion')
+          : node.marks.find(mark => mark.type.name === 'insertion' && !mark.attrs.approved);
         if (insertionMark) {
           insertionPos = pos;
           if (!node.isInline) {
@@ -56,8 +52,8 @@ const findSelectedChanges = state => {
       }
       if (!deletionMark) {
         deletionMark = node.attrs.track
-          ? node.attrs.track.find(trackAttr => trackAttr.type === "deletion")
-          : node.marks.find(mark => mark.type.name === "deletion");
+          ? node.attrs.track.find(trackAttr => trackAttr.type === 'deletion')
+          : node.marks.find(mark => mark.type.name === 'deletion');
         if (deletionMark) {
           deletionPos = pos;
           if (!node.isInline) {
@@ -66,9 +62,7 @@ const findSelectedChanges = state => {
         }
       }
       if (!formatChangeMark) {
-        formatChangeMark = node.marks.find(
-          mark => mark.type.name === "format_change"
-        );
+        formatChangeMark = node.marks.find(mark => mark.type.name === 'format_change');
         if (formatChangeMark) {
           formatChangePos = pos;
           if (!node.isInline) {
diff --git a/wax-prosemirror-plugins/src/trackChanges/TrackChangePlugin.js b/wax-prosemirror-plugins/src/trackChanges/TrackChangePlugin.js
index c6de7f5167ef5cb81bbbebf51de9fa7275a54ce9..1190757191de86921ced747c943696e3875c7d2e 100644
--- a/wax-prosemirror-plugins/src/trackChanges/TrackChangePlugin.js
+++ b/wax-prosemirror-plugins/src/trackChanges/TrackChangePlugin.js
@@ -1,10 +1,10 @@
-import { Plugin, PluginKey } from "prosemirror-state";
-import { Decoration, DecorationSet } from "prosemirror-view";
+import { Plugin, PluginKey } from 'prosemirror-state';
+import { Decoration, DecorationSet } from 'prosemirror-view';
 
-import { findSelectedChanges } from "./FindSelectedChanges";
-import { deactivateAllSelectedChanges } from "./helpers";
+import { findSelectedChanges } from './FindSelectedChanges';
+import { deactivateAllSelectedChanges } from './helpers';
 
-export const key = new PluginKey("track");
+export const key = new PluginKey('track');
 export const selectedInsertionSpec = {};
 export const selectedDeletionSpec = {};
 export const selectedChangeFormatSpec = {};
@@ -15,7 +15,7 @@ export default options => {
     key,
     state: {
       init(config, state) {
-        const userIds = ["33"];
+        const userIds = ['33'];
         state.doc.descendants(node => {
           if (node.attrs.track) {
             node.attrs.track.forEach(track => {
@@ -26,9 +26,7 @@ export default options => {
           } else {
             node.marks.forEach(mark => {
               if (
-                ["deletion", "insertion", "format_change"].includes(
-                  mark.type.name
-                ) &&
+                ['deletion', 'insertion', 'format_change'].includes(mark.type.name) &&
                 !userIds.includes(mark.attrs.user) &&
                 mark.attrs.user !== 0
               ) {
@@ -39,7 +37,7 @@ export default options => {
         });
 
         return {
-          decos: DecorationSet.empty
+          decos: DecorationSet.empty,
         };
       },
       apply(tr, prev, oldState, state) {
@@ -53,23 +51,19 @@ export default options => {
         let { decos } = this.getState(oldState);
 
         if (tr.selectionSet) {
-          const { insertion, deletion, formatChange } = findSelectedChanges(
-            state
-          );
+          const { insertion, deletion, formatChange } = findSelectedChanges(state);
           decos = DecorationSet.empty;
-          const decoType = tr.selection.node
-            ? Decoration.node
-            : Decoration.inline;
+          const decoType = tr.selection.node ? Decoration.node : Decoration.inline;
           if (insertion) {
             decos = decos.add(tr.doc, [
               decoType(
                 insertion.from,
                 insertion.to,
                 {
-                  class: "selected-insertion"
+                  class: 'selected-insertion',
                 },
-                selectedInsertionSpec
-              )
+                selectedInsertionSpec,
+              ),
             ]);
           }
           if (deletion) {
@@ -78,10 +72,10 @@ export default options => {
                 deletion.from,
                 deletion.to,
                 {
-                  class: "selected-deletion"
+                  class: 'selected-deletion',
                 },
-                selectedDeletionSpec
-              )
+                selectedDeletionSpec,
+              ),
             ]);
           }
           if (formatChange) {
@@ -90,19 +84,19 @@ export default options => {
                 formatChange.from,
                 formatChange.to,
                 {
-                  class: "selected-format-change"
+                  class: 'selected-format-change',
                 },
-                selectedChangeFormatSpec
-              )
+                selectedChangeFormatSpec,
+              ),
             ]);
           }
         } else {
           decos = decos.map(tr.mapping, tr.doc);
         }
         return {
-          decos
+          decos,
         };
-      }
+      },
     },
     props: {
       decorations(state) {
@@ -112,8 +106,8 @@ export default options => {
       handleDOMEvents: {
         focus: (view, _event) => {
           view.dispatch(deactivateAllSelectedChanges(view.state.tr));
-        }
-      }
-    }
+        },
+      },
+    },
   });
 };
diff --git a/wax-prosemirror-schema/src/nodes/footNoteNode.js b/wax-prosemirror-schema/src/nodes/footNoteNode.js
index a83987c177ce1a008ff878985b61bf64f10a1478..e2a950ee6e0520557808562ffcc9ae45639af44b 100644
--- a/wax-prosemirror-schema/src/nodes/footNoteNode.js
+++ b/wax-prosemirror-schema/src/nodes/footNoteNode.js
@@ -1,25 +1,25 @@
 //TODO Write the node in WaxSchema
 const footnote = {
-  group: "inline",
-  content: "inline*",
+  group: 'inline',
+  content: 'inline*',
   inline: true,
-  atom: true,
+  // atom: true,
   attrs: {
-    id: { default: "" }
+    id: { default: '' },
   },
   toDOM: node => {
-    return ["footnote", node.attrs, 0];
+    return ['footnote', node.attrs, 0];
   },
   parseDOM: [
     {
-      tag: "footnote",
+      tag: 'footnote',
       getAttrs(dom) {
         return {
-          id: dom.getAttribute("id")
+          id: dom.getAttribute('id'),
         };
-      }
-    }
-  ]
+      },
+    },
+  ],
 };
 
 export default footnote;
diff --git a/wax-prosemirror-services/index.js b/wax-prosemirror-services/index.js
index 515a0d252cfaea56b85c9858a811cd606879367d..74c1a7f630de1e8635f1aa6fcee4e29227f14b12 100644
--- a/wax-prosemirror-services/index.js
+++ b/wax-prosemirror-services/index.js
@@ -1,72 +1,38 @@
-export {
-  default as componentPlugin
-} from "./src/LayoutService/components/componentPlugin";
-export { default as LayoutService } from "./src/LayoutService/LayoutService";
-export { default as MenuService } from "./src/MenuService/MenuService";
-export { default as LinkService } from "./src/LinkService/LinkService";
-export {
-  default as PlaceholderService
-} from "./src/PlaceholderService/PlaceholderService";
-export { default as ImageService } from "./src/ImageService/ImageService";
-export { default as RulesService } from "./src/RulesService/RulesService";
-export { default as SchemaService } from "./src/SchemaService/SchemaService";
+export { default as componentPlugin } from './src/LayoutService/components/componentPlugin';
+export { default as LayoutService } from './src/LayoutService/LayoutService';
+export { default as MenuService } from './src/MenuService/MenuService';
+export { default as LinkService } from './src/LinkService/LinkService';
+export { default as PlaceholderService } from './src/PlaceholderService/PlaceholderService';
+export { default as OverlayService } from './src/OverlayService/OverlayService';
+export { default as ImageService } from './src/ImageService/ImageService';
+export { default as RulesService } from './src/RulesService/RulesService';
+export { default as SchemaService } from './src/SchemaService/SchemaService';
 
-export {
-  default as ShortCutsService
-} from "./src/ShortCutsService/ShortCutsService";
+export { default as ShortCutsService } from './src/ShortCutsService/ShortCutsService';
 
-export { default as OverlayService } from "./src/OverlayService/OverlayService";
-export { default as Tool } from "./src/lib/Tools";
-export {
-  default as TrackChangeService
-} from "./src/TrackChangeService/TrackChangeService";
+export { default as Tool } from './src/lib/Tools';
+export { default as TrackChangeService } from './src/TrackChangeService/TrackChangeService';
 
-export {
-  default as trackedTransaction
-} from "./src/TrackChangeService/track-changes/trackedTransaction";
+export { default as trackedTransaction } from './src/TrackChangeService/track-changes/trackedTransaction';
 /*
 All Elements services
 */
-export { default as BaseService } from "./src/BaseService/BaseService";
-export {
-  default as InlineAnnotationsService
-} from "./src/InlineAnnotations/InlineAnnotationsService";
-export { default as ListsService } from "./src/ListsService/ListsService";
-export { default as TablesService } from "./src/TablesService/TablesService";
-export {
-  default as TextBlockLevelService
-} from "./src/TextBlockLevel/TextBlockLevelService";
-export {
-  default as DisplayBlockLevelService
-} from "./src/DisplayBlockLevel/DisplayBlockLevelService";
-export { default as NoteService } from "./src/NoteService/NoteService";
-export {
-  default as CommentsService
-} from "./src/CommentsService/CommentsService";
+export { default as BaseService } from './src/BaseService/BaseService';
+export { default as InlineAnnotationsService } from './src/InlineAnnotations/InlineAnnotationsService';
+export { default as ListsService } from './src/ListsService/ListsService';
+export { default as TablesService } from './src/TablesService/TablesService';
+export { default as TextBlockLevelService } from './src/TextBlockLevel/TextBlockLevelService';
+export { default as DisplayBlockLevelService } from './src/DisplayBlockLevel/DisplayBlockLevelService';
+export { default as NoteService } from './src/NoteService/NoteService';
+export { default as CommentsService } from './src/CommentsService/CommentsService';
 /*
 ToolGroups
 */
-export {
-  default as BaseToolGroupService
-} from "./src/WaxToolGroups/BaseToolGroupService/BaseToolGroupService";
-export {
-  default as AnnotationToolGroupService
-} from "./src/WaxToolGroups/AnnotationToolGroupService/AnnotationToolGroupService";
-export {
-  default as ListToolGroupService
-} from "./src/WaxToolGroups/ListToolGroupService/ListToolGroupService";
-export {
-  default as ImageToolGroupService
-} from "./src/WaxToolGroups/ImageToolGroupService/ImageToolGroupService";
-export {
-  default as TableToolGroupService
-} from "./src/WaxToolGroups/TableToolGroupService/TableToolGroupService";
-export {
-  default as DisplayToolGroupService
-} from "./src/WaxToolGroups/DisplayToolGroupService/DisplayToolGroupService";
-export {
-  default as TextToolGroupService
-} from "./src/WaxToolGroups/TextToolGroupService/TextToolGroupService";
-export {
-  default as NoteToolGroupService
-} from "./src/WaxToolGroups/NoteToolGroupService/NoteToolGroupService";
+export { default as BaseToolGroupService } from './src/WaxToolGroups/BaseToolGroupService/BaseToolGroupService';
+export { default as AnnotationToolGroupService } from './src/WaxToolGroups/AnnotationToolGroupService/AnnotationToolGroupService';
+export { default as ListToolGroupService } from './src/WaxToolGroups/ListToolGroupService/ListToolGroupService';
+export { default as ImageToolGroupService } from './src/WaxToolGroups/ImageToolGroupService/ImageToolGroupService';
+export { default as TableToolGroupService } from './src/WaxToolGroups/TableToolGroupService/TableToolGroupService';
+export { default as DisplayToolGroupService } from './src/WaxToolGroups/DisplayToolGroupService/DisplayToolGroupService';
+export { default as TextToolGroupService } from './src/WaxToolGroups/TextToolGroupService/TextToolGroupService';
+export { default as NoteToolGroupService } from './src/WaxToolGroups/NoteToolGroupService/NoteToolGroupService';
diff --git a/wax-prosemirror-services/package.json b/wax-prosemirror-services/package.json
index 135a2e09d230378861855425b2a4a472f71780a7..0d36c0e527eb8e904c3a254ddeca548c6c2dba00 100644
--- a/wax-prosemirror-services/package.json
+++ b/wax-prosemirror-services/package.json
@@ -12,11 +12,13 @@
   "dependencies": {
     "inversify": "^5.0.1",
     "inversify-inject-decorators": "^3.1.0",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
     "styled-components": "^4.2.0",
     "wax-prosemirror-components": "^0.0.10",
     "wax-prosemirror-core": "^0.0.10",
     "wax-prosemirror-layouts": "^0.0.10"
+  },
+  "peerDependencies": {
+    "react": "^16.13.1",
+    "react-dom": "^16.13.1"
   }
 }
diff --git a/wax-prosemirror-services/src/LinkService/LinkService.js b/wax-prosemirror-services/src/LinkService/LinkService.js
index b6563d6125fedb6cfd41783a35502f04ac1438fe..921bfb774119da470bd9a2fe380e75ddc1afa959 100644
--- a/wax-prosemirror-services/src/LinkService/LinkService.js
+++ b/wax-prosemirror-services/src/LinkService/LinkService.js
@@ -1,35 +1,35 @@
-import Service from "../Service";
-import { LinkComponent } from "wax-prosemirror-components";
-import { linkMark } from "wax-prosemirror-schema";
-import LinkTool from "./LinkTool";
-import { OverlayService } from "../..";
+import Service from '../Service';
+import { LinkComponent } from 'wax-prosemirror-components';
+import { linkMark } from 'wax-prosemirror-schema';
+import LinkTool from './LinkTool';
+// import { OverlayService } from '../..';
 
 export default class LinkService extends Service {
-  name = "LinkService";
+  name = 'LinkService';
 
   boot() {
-    const createOverlay = this.container.get("CreateOverlay");
+    const createOverlay = this.container.get('CreateOverlay');
     createOverlay(
       LinkComponent,
       {},
       {
-        markType: "link",
+        markType: 'link',
         followCursor: false,
-        selection: false
-      }
+        selection: false,
+      },
     );
   }
 
   register() {
-    this.container.bind("Link").to(LinkTool);
-    const createMark = this.container.get("CreateMark");
+    this.container.bind('Link').to(LinkTool);
+    const createMark = this.container.get('CreateMark');
     createMark(
       {
-        link: linkMark
+        link: linkMark,
       },
-      { toWaxSchema: true }
+      { toWaxSchema: true },
     );
   }
 
-  dependencies = [new OverlayService()];
+  // dependencies = [new OverlayService()];
 }
diff --git a/wax-prosemirror-services/src/NoteService/Editor.js b/wax-prosemirror-services/src/NoteService/Editor.js
index 87d36a6628e4127b322f3f9334027eee53fd090e..509aea5a96854879f7d322e5e9ca5388c0723cea 100644
--- a/wax-prosemirror-services/src/NoteService/Editor.js
+++ b/wax-prosemirror-services/src/NoteService/Editor.js
@@ -1,16 +1,16 @@
-import React, { useEffect, useRef, useContext } from "react";
-import { EditorView } from "prosemirror-view";
-import { EditorState } from "prosemirror-state";
-import { StepMap } from "prosemirror-transform";
-import { baseKeymap } from "prosemirror-commands";
-import { keymap } from "prosemirror-keymap";
-import { undo, redo } from "prosemirror-history";
-import { WaxContext } from "wax-prosemirror-core";
-import { Commands } from "wax-prosemirror-utilities";
-import { NoteEditorContainer } from "wax-prosemirror-components";
-import { DocumentHelpers } from "wax-prosemirror-utilities";
-import { filter } from "lodash";
-import transformPasted from "./helpers/TransformPasted";
+import React, { useEffect, useRef, useContext } from 'react';
+import { EditorView } from 'prosemirror-view';
+import { EditorState } from 'prosemirror-state';
+import { StepMap } from 'prosemirror-transform';
+import { baseKeymap } from 'prosemirror-commands';
+import { keymap } from 'prosemirror-keymap';
+import { undo, redo } from 'prosemirror-history';
+import { WaxContext } from 'wax-prosemirror-core';
+import { Commands } from 'wax-prosemirror-utilities';
+import { NoteEditorContainer } from 'wax-prosemirror-components';
+import { DocumentHelpers } from 'wax-prosemirror-utilities';
+import { filter } from 'lodash';
+import transformPasted from './helpers/TransformPasted';
 
 export default ({ node, view }) => {
   const editorRef = useRef();
@@ -22,21 +22,17 @@ export default ({ node, view }) => {
       {
         state: EditorState.create({
           doc: node,
-          plugins: [keymap(createKeyBindings()), ...context.app.getPlugins()]
+          plugins: [keymap(createKeyBindings()), ...context.app.getPlugins()],
         }),
         // This is the magic part
         dispatchTransaction: tr => {
           let { state, transactions } = noteView.state.applyTransaction(tr);
           noteView.updateState(state);
 
-          const allNotes = DocumentHelpers.findChildrenByType(
-            view.state.doc,
-            view.state.schema.nodes.footnote,
-            true
-          );
+          const allNotes = DocumentHelpers.findChildrenByType(view.state.doc, view.state.schema.nodes.footnote, true);
 
           const noteFound = filter(allNotes, {
-            node: { attrs: { id: noteId } }
+            node: { attrs: { id: noteId } },
           });
 
           //Set everytime the active view into context
@@ -44,17 +40,15 @@ export default ({ node, view }) => {
             context.updateView({}, noteId);
           }, 20);
 
-          if (!tr.getMeta("fromOutside")) {
+          if (!tr.getMeta('fromOutside')) {
             let outerTr = view.state.tr,
               offsetMap = StepMap.offset(noteFound[0].pos + 1);
             for (let i = 0; i < transactions.length; i++) {
               let steps = transactions[i].steps;
-              for (let j = 0; j < steps.length; j++)
-                outerTr.step(steps[j].map(offsetMap));
+              for (let j = 0; j < steps.length; j++) outerTr.step(steps[j].map(offsetMap));
             }
 
-            if (outerTr.docChanged)
-              view.dispatch(outerTr.setMeta("outsideView", "notes"));
+            if (outerTr.docChanged) view.dispatch(outerTr.setMeta('outsideView', 'notes'));
           }
         },
         handleDOMEvents: {
@@ -65,20 +59,20 @@ export default ({ node, view }) => {
             // footnote is node-selected (and thus DOM-selected) when
             // the parent editor is focused.
             if (noteView.hasFocus()) noteView.focus();
-          }
+          },
         },
         transformPasted: slice => {
           return transformPasted(slice, noteView);
-        }
-      }
+        },
+      },
     );
 
     //Set Each note into Wax's Context
     context.updateView(
       {
-        [noteId]: noteView
+        [noteId]: noteView,
       },
-      noteId
+      noteId,
     );
     if (context.view[noteId]) {
       context.view[noteId].focus();
@@ -95,12 +89,9 @@ export default ({ node, view }) => {
 
   const getKeys = () => {
     return {
-      "Mod-z": () => undo(view.state, view.dispatch),
-      "Mod-y": () => redo(view.state, view.dispatch),
-      "Mod-u": () =>
-        Commands.markActive(noteView.state.config.schema.marks.underline)(
-          noteView.state
-        )
+      'Mod-z': () => undo(view.state, view.dispatch),
+      'Mod-y': () => redo(view.state, view.dispatch),
+      'Mod-u': () => Commands.markActive(noteView.state.config.schema.marks.underline)(noteView.state),
     };
   };
 
@@ -115,9 +106,7 @@ export default ({ node, view }) => {
         endB += overlap;
       }
       context.view[noteId].dispatch(
-        state.tr
-          .replace(start, endB, node.slice(start, endA))
-          .setMeta("fromOutside", true)
+        state.tr.replace(start, endB, node.slice(start, endA)).setMeta('fromOutside', true),
       );
     }
   }
diff --git a/wax-prosemirror-utilities/src/document/DocumentHelpers.js b/wax-prosemirror-utilities/src/document/DocumentHelpers.js
index ef355be3d26f8d5f998617be6a10434db349c98c..3e2caffbbde97bf6c1d23bbaf723837b6d78b507 100644
--- a/wax-prosemirror-utilities/src/document/DocumentHelpers.js
+++ b/wax-prosemirror-utilities/src/document/DocumentHelpers.js
@@ -96,7 +96,6 @@ const findAllMarksWithSameId = (state, mark) => {
   return allMarksWithSameId;
 };
 
-// TODO Also find fragmented marks
 const findMarkPosition = (activeView, initialPos, markType) => {
   const $pos = activeView.state.tr.doc.resolve(initialPos);
   const { parent } = $pos;