add undo/redo disabled/enable

packages/editor-mobile/package-lock.json

@@ -14304,7 +14304,7 @@
     },
     "node_modules/notesnook-editor": {
       "version": "0.0.1",
-      "resolved": "git+ssh://git@github.com/streetwriters/notesnook-editor.git#97094dba0bfdaaede6ab24e65079d6b305fe471c",
+      "resolved": "git+ssh://git@github.com/streetwriters/notesnook-editor.git#09d20523bff6e3bb1cc04327023cfe74c3828e00",
       "dependencies": {
         "@_ueberdosis/prosemirror-tables": "^1.1.3",
         "@mdi/js": "^6.9.96",
@@ -34152,8 +34152,8 @@
       }
     },
     "notesnook-editor": {
-      "version": "git+ssh://git@github.com/streetwriters/notesnook-editor.git#97094dba0bfdaaede6ab24e65079d6b305fe471c",
+      "version": "git+ssh://git@github.com/streetwriters/notesnook-editor.git#09d20523bff6e3bb1cc04327023cfe74c3828e00",
-      "from": "notesnook-editor@github:streetwriters/notesnook-editor#develop",
+      "from": "notesnook-editor@https://github.com/streetwriters/notesnook-editor.git#develop",
       "requires": {
         "@_ueberdosis/prosemirror-tables": "^1.1.3",
         "@mdi/js": "^6.9.96",

packages/editor-mobile/src/components/editor.tsx

@@ -87,7 +87,7 @@ const Tiptap = () => {
       post(EventTypes.pro);
     },
   });
-  const editor = useTiptap(
+  const _editor = useTiptap(
     {
       onUpdate: ({ editor }) => {
         global.editorController.contentChange(editor as Editor);
@@ -114,10 +114,17 @@ const Tiptap = () => {
     },
     [layout, initialProps.readonly, tick]
   );
-  const controller = useEditorController(editor, setTick);
+
+  const update = () => {
+    setTick((tick) => tick + 1);
+    setLayout(false);
+    setImmediate(() => setLayout(true));
+  };
+
+  const controller = useEditorController(_editor, update);
   const controllerRef = useRef(controller);
   globalThis.editorController = controller;
-  globalThis.editor = editor;
+  globalThis.editor = _editor;
 
   useEffect(() => {
     setInitialProps({ ...settings });
@@ -139,8 +146,8 @@ const Tiptap = () => {
         }}
       >
         <Header
-          hasRedo={false}
+          hasRedo={_editor?.can().redo() || false}
-          hasUndo={false}
+          hasUndo={_editor?.can().undo() || false}
           settings={settings}
           noHeader={initialProps.noHeader || false}
         />
@@ -164,7 +171,7 @@ const Tiptap = () => {
                 controller={controllerRef}
                 title={controller.title}
               />
-              <StatusBar container={containerRef} editor={editor} />
+              <StatusBar container={containerRef} editor={_editor} />
             </>
           )}
           <div
@@ -192,11 +199,11 @@ const Tiptap = () => {
           />
         </div>
 
-        {initialProps.noToolbar ? null : (
+        {initialProps.noToolbar || !layout ? null : (
           <Toolbar
             sx={{ pl: "10px", pt: "5px", minHeight: 45 }}
             theme={toolbarTheme}
-            editor={editor}
+            editor={_editor}
             location="bottom"
             tools={[...settings.tools]}
           />

packages/editor-mobile/src/components/header.tsx

@@ -115,7 +115,10 @@ export default React.memo(
                   alignItems: "center",
                 }}
               >
-                <ArrowULeftTopIcon size={28} color={"var(--nn_pri)"} />
+                <ArrowULeftTopIcon
+                  size={28}
+                  color={!hasUndo ? "var(--nn_nav)" : "var(--nn_pri)"}
+                />
               </Button>
 
               <Button
@@ -134,7 +137,10 @@ export default React.memo(
                   alignItems: "center",
                 }}
               >
-                <ArrowURightTopIcon size={28} color={"var(--nn_pri)"} />
+                <ArrowURightTopIcon
+                  size={28}
+                  color={!hasRedo ? "var(--nn_nav)" : "var(--nn_pri)"}
+                />
               </Button>
               {!settings.premium && (
                 <Button
@@ -221,9 +227,15 @@ export default React.memo(
       </div>
     );
   },
-  (prev, next) =>
+  (prev, next) => {
-    prev.noHeader !== next.noHeader ||
+    if (
-    prev.settings.premium !== next.settings.premium ||
+      prev.noHeader !== next.noHeader ||
-    prev.hasRedo !== next.hasRedo ||
+      prev.settings.premium !== next.settings.premium ||
-    prev.hasUndo !== next.hasUndo
+      prev.hasRedo !== next.hasRedo ||
+      prev.hasUndo !== next.hasUndo
+    )
+      return false;
+
+    return true;
+  }
 );

packages/editor-mobile/src/hooks/useEditorController.ts

@@ -6,7 +6,7 @@ import {
   useCallback,
   useEffect,
   useRef,
-  useState
+  useState,
 } from "react";
 import { useEditorThemeStore } from "../state/theme";
 import { EventTypes, isReactNative, post, timerFn } from "../utils";
@@ -47,13 +47,13 @@ export type EditorController = {
 
 export function useEditorController(
   editor: Editor | null,
-  update: Dispatch<SetStateAction<number>>
+  update: () => void
 ): EditorController {
   const [title, setTitle] = useState("");
   const htmlContentRef = useRef<string | null>(null);
   const timers = useRef<Timers>({
     selectionChange: null,
-    change: null
+    change: null,
   });
 
   const selectionChange = useCallback((editor: Editor) => {
@@ -119,7 +119,7 @@ export function useEditorController(
   );
 
   const onUpdate = () => {
-    update((tick) => tick + 1);
+    update();
   };
 
   const onMessage = useCallback(
@@ -132,7 +132,7 @@ export function useEditorController(
       switch (type) {
         case "native:html":
           htmlContentRef.current = value;
-          update((tick) => tick + 1);
+          update();
           break;
         case "native:theme":
           useEditorThemeStore.getState().setColors(message.value);
@@ -194,6 +194,6 @@ export function useEditorController(
     openFilePicker,
     downloadAttachment,
     content: htmlContentRef,
-    onUpdate: onUpdate
+    onUpdate: onUpdate,
   };
 }