diff --git a/editors/demo/src/Editoria/Editoria.js b/editors/demo/src/Editoria/Editoria.js
index 404d183cccf7cfae280210442e74477989c7ce42..c6f7cde7b4f55120ce741cee08d68c53a3335a8c 100644
--- a/editors/demo/src/Editoria/Editoria.js
+++ b/editors/demo/src/Editoria/Editoria.js
@@ -50,14 +50,14 @@ const Editoria = () => {
   }
   const editorRef = useRef();
 
-  // useEffect(() => {
-  //   console.log('sss');
-  //   // const configObj = config(yjsProvider, ydoc, 'christos')
-  //   setTimeout(() => {
-  //     setFirst(false);
-  //   }, 5000);
-  //   // configObj.services = [...configObj.services, new TablesService()]
-  // }, [isFirst]);
+  useEffect(() => {
+    console.log('sss');
+    // const configObj = config(yjsProvider, ydoc, 'christos')
+    setTimeout(() => {
+      setFirst(false);
+    }, 5000);
+    // configObj.services = [...configObj.services, new TablesService()]
+  }, [isFirst]);
 
   if (!isFirst) {
     // configObj.services = [...configObj.services, new TablesService()]
@@ -72,7 +72,7 @@ const Editoria = () => {
         onClick={() => {
           console.log(myConfig);
           // myConfig.PmPlugins = [];
-          // myConfig.services = [...myConfig.services, new TablesService()];
+          myConfig.services = [...myConfig.services, new TablesService()];
           myConfig.name = 'Ffdfd';
           setMyConfig({ ...myConfig });
         }}
diff --git a/wax-prosemirror-core/src/components/Button.js b/wax-prosemirror-core/src/components/Button.js
index 15e2d57005b30f96b0fcf1481e082f461d25bf98..5a35a8deb7c1dfba8466a6a3077a7fc4ad54a931 100644
--- a/wax-prosemirror-core/src/components/Button.js
+++ b/wax-prosemirror-core/src/components/Button.js
@@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next';
 import { WaxContext } from '../WaxContext';
 import MenuButton from './ui/MenuButton';
 
-const Button = ({ item }) => {
+const Button = ({ view = {}, item }) => {
   const { t, i18n } = useTranslation();
   const { active, icon, label, run, select, title } = item;
   const context = useContext(WaxContext);
@@ -19,39 +19,41 @@ const Button = ({ item }) => {
     return editable;
   });
 
+  const { state } = view;
+
+  const handleMouseDown = e => {
+    e.preventDefault();
+    run(activeView.state, activeView.dispatch, activeView, context);
+  };
+
   const isActive = !!(
-    active(context.options.currentState, activeViewId) &&
-    select(context.options.currentState, activeViewId, activeView)
+    active(activeView.state, activeViewId) &&
+    select(state, activeViewId, activeView)
   );
 
   let isDisabled = !select(
-    context.options.currentState,
+    context.activeView.state,
     context.activeViewId,
     context.activeView,
   );
   if (!isEditable) isDisabled = true;
-
-  const onMouseDown = e => {
-    e.preventDefault();
-    run(context.options.currentState, activeView.dispatch, activeView, context);
-  };
-
-  const MenuButtonComponent = useMemo(() => {
-    return (
+  const MenuButtonComponent = useMemo(
+    () => (
       <MenuButton
         active={isActive || false}
         disabled={isDisabled}
         iconName={icon}
         label={label}
-        onMouseDown={onMouseDown}
+        onMouseDown={e => handleMouseDown(e)}
         title={
           !isEmpty(i18n) && i18n.exists(`Wax.Annotations.${title}`)
             ? t(`Wax.Annotations.${title}`)
             : title
         }
       />
-    );
-  }, [isActive, isDisabled, activeViewId, t(`Wax.Annotations.${title}`)]);
+    ),
+    [isActive, isDisabled, activeViewId, t(`Wax.Annotations.${title}`)],
+  );
 
   return MenuButtonComponent;
 };
diff --git a/wax-prosemirror-core/src/components/ToolGroupComponent.js b/wax-prosemirror-core/src/components/ToolGroupComponent.js
index ebbeaecb2c912a07122072224de09e6d5327890c..d673aceaf1ff9472ff267b65bdc7db17215c04b7 100644
--- a/wax-prosemirror-core/src/components/ToolGroupComponent.js
+++ b/wax-prosemirror-core/src/components/ToolGroupComponent.js
@@ -19,14 +19,14 @@ const DropWrapper = styled(Wrapper)`
   padding: 4px;
 `;
 
-const ToolGroupComponent = ({ state, tools, name }) => {
+const ToolGroupComponent = ({ view, tools, name }) => {
   const toolsShown = [];
   const rest = [];
-  console.log('hahahahaha');
+
   tools.forEach(tool => {
     tool.isIntoMoreSection() && tool.isDisplayed()
-      ? rest.push(tool.renderTool(state))
-      : toolsShown.push(tool.renderTool(state));
+      ? rest.push(tool.renderTool(view))
+      : toolsShown.push(tool.renderTool(view));
   });
 
   const MemorizedToolGroupComponent = useMemo(
diff --git a/wax-prosemirror-core/src/components/ToolGroups.js b/wax-prosemirror-core/src/components/ToolGroups.js
index ccb2278ab6b3d674df3c3c8a5e764defd41a48ab..e097668166458487a93e130a805d2ee9c92d4863 100644
--- a/wax-prosemirror-core/src/components/ToolGroups.js
+++ b/wax-prosemirror-core/src/components/ToolGroups.js
@@ -3,18 +3,13 @@ import React from 'react';
 import { v4 as uuidv4 } from 'uuid';
 import ToolGroupComponent from './ToolGroupComponent';
 
-const ToolGroups = ({ toolGroups, state }) => {
-  console.log(state, 'tool groups ');
+const ToolGroups = ({ toolGroups, view }) => {
   return toolGroups.map(toolGroup => {
     if (toolGroup._toolGroups.length > 0) {
-      return <ToolGroups toolGroups={toolGroup._toolGroups} state={state} />;
+      return <ToolGroups toolGroups={toolGroup._toolGroups} view={view} />;
     }
     return (
-      <ToolGroupComponent
-        key={uuidv4()}
-        tools={toolGroup._tools}
-        state={state}
-      />
+      <ToolGroupComponent key={uuidv4()} tools={toolGroup._tools} view={view} />
     );
   });
 };
diff --git a/wax-prosemirror-core/src/config/defaultServices/MenuService/Menu.js b/wax-prosemirror-core/src/config/defaultServices/MenuService/Menu.js
index 17a584161cd31ef9e2fed6026f4ed01b1227c40d..7987cce2927288efeb42b743bfa2a59bb17a0615 100644
--- a/wax-prosemirror-core/src/config/defaultServices/MenuService/Menu.js
+++ b/wax-prosemirror-core/src/config/defaultServices/MenuService/Menu.js
@@ -36,17 +36,11 @@ class Menu {
 
   render() {
     return () => {
-      const context = useContext(WaxContext);
-      const Bar = useMemo(
-        () => (
-          // eslint-disable-next-line react/no-this-in-sfc
-          <MenuWrapper
-            items={this.toolGroups}
-            state={context.options.currentState}
-          />
-        ),
-        [],
-      );
+      const { activeView } = useContext(WaxContext);
+      const Bar = useMemo(() => (
+        // eslint-disable-next-line react/no-this-in-sfc
+        <MenuWrapper items={this.toolGroups} view={activeView || {}} />
+      ));
       return <>{Bar}</>;
     };
   }
diff --git a/wax-prosemirror-core/src/config/defaultServices/MenuService/MenuWrapper.js b/wax-prosemirror-core/src/config/defaultServices/MenuService/MenuWrapper.js
index 5c139a297fc788af469203f6348ba928243c5283..4a77932c3d544e05809355fe07609ce840520704 100644
--- a/wax-prosemirror-core/src/config/defaultServices/MenuService/MenuWrapper.js
+++ b/wax-prosemirror-core/src/config/defaultServices/MenuService/MenuWrapper.js
@@ -4,8 +4,8 @@
 import React from 'react';
 import { map } from 'lodash';
 
-const MainMenuBar = ({ items = [], state }) => {
-  return <>{map(items, item => item.renderTools(state))}</>;
+const MainMenuBar = ({ items = [], view }) => {
+  return <>{map(items, item => item.renderTools(view))}</>;
 };
 
 export default MainMenuBar;
diff --git a/wax-prosemirror-core/src/utilities/lib/ToolGroup.js b/wax-prosemirror-core/src/utilities/lib/ToolGroup.js
index fa96542ca88db50464c727b0166ea7f3fd968199..0e50d3fb417e4364ed5a50a8fb0b6e4bf3062da9 100644
--- a/wax-prosemirror-core/src/utilities/lib/ToolGroup.js
+++ b/wax-prosemirror-core/src/utilities/lib/ToolGroup.js
@@ -59,12 +59,12 @@ class ToolGroup {
     this._tools = tools;
   }
 
-  renderTools(state) {
-    if (isEmpty(state)) return null;
+  renderTools(view) {
+    if (isEmpty(view)) return null;
 
     const { name } = this.constructor;
     if (this._toolGroups > 0) {
-      return <ToolGroups state={state} toolGroups={this._toolGroups} />;
+      return <ToolGroups toolGroups={this._toolGroups} view={view} />;
     }
 
     const MemorizedToolGroupComponent = useMemo(
@@ -72,9 +72,9 @@ class ToolGroup {
         <ToolGroupComponent
           key={uuidv4()}
           name={name}
-          state={state}
           title={this.title}
           tools={this._tools}
+          view={view}
         />
       ),
       [],
diff --git a/wax-prosemirror-core/src/utilities/lib/Tools.js b/wax-prosemirror-core/src/utilities/lib/Tools.js
index 01544d23e29a1e660305f6509cae739d9f20cd1a..0d3490a3b6c2879a6c8bd76c93b0596ff9b68fa4 100644
--- a/wax-prosemirror-core/src/utilities/lib/Tools.js
+++ b/wax-prosemirror-core/src/utilities/lib/Tools.js
@@ -51,10 +51,11 @@ class Tools {
     };
   }
 
-  renderTool(state) {
-    if (isEmpty(state)) return null;
+  renderTool(view) {
+    if (isEmpty(view)) return null;
+
     return this._isDisplayed ? (
-      <Button item={this.toJSON()} key={uuidv4()} state={state} />
+      <Button item={this.toJSON()} key={uuidv4()} view={view} />
     ) : null;
   }
 
diff --git a/wax-prosemirror-services/src/BaseService/RedoService/Redo.js b/wax-prosemirror-services/src/BaseService/RedoService/Redo.js
index 3ed277a4736980ddb053da779041232c1b7d2806..2c5b311394f849b16bc23d611434d36e641037b7 100644
--- a/wax-prosemirror-services/src/BaseService/RedoService/Redo.js
+++ b/wax-prosemirror-services/src/BaseService/RedoService/Redo.js
@@ -25,10 +25,10 @@ export default class Redo extends Tools {
     return redo(state);
   }
 
-  renderTool(state) {
-    if (isEmpty(state)) return null;
+  renderTool(view) {
+    if (isEmpty(view)) return null;
     return this.isDisplayed() ? (
-      <UndoRedoButton item={this.toJSON()} key="Redo" state={state} />
+      <UndoRedoButton item={this.toJSON()} key="Redo" view={view} />
     ) : null;
   }
 }
diff --git a/wax-prosemirror-services/src/BaseService/UndoService/Undo.js b/wax-prosemirror-services/src/BaseService/UndoService/Undo.js
index 585daac7204d047b0fe00d7c7462858ae2e571ff..4d2207ff7c49b8a7470ce6731bf1dfe927d496bf 100644
--- a/wax-prosemirror-services/src/BaseService/UndoService/Undo.js
+++ b/wax-prosemirror-services/src/BaseService/UndoService/Undo.js
@@ -25,10 +25,10 @@ export default class Undo extends Tools {
     return undo(state);
   }
 
-  renderTool(state) {
-    if (isEmpty(state)) return null;
+  renderTool(view) {
+    if (isEmpty(view)) return null;
     return this.isDisplayed() ? (
-      <UndoRedoButton item={this.toJSON()} key="Undo" state={state} />
+      <UndoRedoButton item={this.toJSON()} key="Undo" view={view} />
     ) : null;
   }
 }
diff --git a/wax-prosemirror-services/src/BaseService/components/UndoRedoButton.js b/wax-prosemirror-services/src/BaseService/components/UndoRedoButton.js
index 3000759b237567f878acb565325501149cd0b459..6c390008ddb74e05afa3ac02905eb1c6cff36cbf 100644
--- a/wax-prosemirror-services/src/BaseService/components/UndoRedoButton.js
+++ b/wax-prosemirror-services/src/BaseService/components/UndoRedoButton.js
@@ -4,35 +4,33 @@ import { isEmpty } from 'lodash';
 import { useTranslation } from 'react-i18next';
 import { WaxContext, MenuButton } from 'wax-prosemirror-core';
 
-const UndoRedoButton = ({ item }) => {
+const UndoRedoButton = ({ view = {}, item }) => {
   const { t, i18n } = useTranslation();
   const { active, icon, label, run, select, title } = item;
-  const context = useContext(WaxContext);
+
   const {
     pmViews: { main },
     activeViewId,
     activeView,
-  } = context;
+  } = useContext(WaxContext);
 
   const isEditable = main.props.editable(editable => {
     return editable;
   });
 
-  const handleMouseDown = e => {
+  const { state } = view;
+
+  const handleMouseDown = (e, editorState, editorDispatch) => {
     e.preventDefault();
-    run(context.options.currentState, activeView.dispatch);
+    run(editorState, editorDispatch);
   };
 
   const isActive = !!(
-    active(context.options.currentState, activeViewId) &&
-    select(context.options.currentState, activeViewId, activeView)
+    active(activeView.state, activeViewId) &&
+    select(state, activeViewId, activeView)
   );
 
-  let isDisabled = !select(
-    context.options.currentState,
-    activeViewId,
-    activeView,
-  );
+  let isDisabled = !select(state, activeViewId, activeView);
   if (!isEditable) isDisabled = true;
 
   const UndoRedoButtonComponent = useMemo(
@@ -42,7 +40,7 @@ const UndoRedoButton = ({ item }) => {
         disabled={isDisabled}
         iconName={icon}
         label={label}
-        onMouseDown={e => handleMouseDown(e)}
+        onMouseDown={e => handleMouseDown(e, main.state, main.dispatch)}
         title={
           !isEmpty(i18n) && i18n.exists(`Wax.Base.${title}`)
             ? t(`Wax.Base.${title}`)
diff --git a/wax-prosemirror-services/src/InlineAnnotations/AnnotationToolGroupService/Annotations.js b/wax-prosemirror-services/src/InlineAnnotations/AnnotationToolGroupService/Annotations.js
index 236786a8291670554add0555ce328c8fe82d5092..9c21d3fa32af8f62cc3d1eb830be53a1fce7a6b7 100644
--- a/wax-prosemirror-services/src/InlineAnnotations/AnnotationToolGroupService/Annotations.js
+++ b/wax-prosemirror-services/src/InlineAnnotations/AnnotationToolGroupService/Annotations.js
@@ -32,8 +32,8 @@ class Annotations extends ToolGroup {
     ];
   }
 
-  renderTools(state) {
-    if (isEmpty(state)) return null;
+  renderTools(view) {
+    if (isEmpty(view)) return null;
 
     const { name } = this.constructor;
 
@@ -41,13 +41,13 @@ class Annotations extends ToolGroup {
       () => (
         <ToolGroupComponent
           key={uuidv4()}
-          state={state}
-          tools={this._tools}
-          title={this.title}
           name={name}
+          title={this.title}
+          tools={this._tools}
+          view={view}
         />
       ),
-      [state],
+      [view],
     );
 
     return MemorizedToolGroupComponent;