mobile: ensure note is saved when change note

apps/mobile/app/screens/editor/tiptap/use-editor-events.ts

@@ -268,12 +268,28 @@ export const useEditorEvents = (
     (event: WebViewMessageEvent) => {
       const data = event.nativeEvent.data;
       const editorMessage = JSON.parse(data) as EditorMessage;
+
+      if (editorMessage.type === EventTypes.content) {
+        editor.saveContent({
+          type: editorMessage.type,
+          content: editorMessage.value as string,
+          forSessionId: editorMessage.sessionId
+        });
+      } else if (editorMessage.type === EventTypes.title) {
+        editor.saveContent({
+          type: editorMessage.type,
+          title: editorMessage.value as string,
+          forSessionId: editorMessage.sessionId
+        });
+      }
+
       if (
         editorMessage.sessionId !== editor.sessionId &&
         editorMessage.type !== EditorEvents.status
       ) {
         return;
       }
+
       switch (editorMessage.type) {
         case EventTypes.logger:
           logger.info("[WEBVIEW LOG]", editorMessage.value);
@@ -281,21 +297,8 @@ export const useEditorEvents = (
         case EventTypes.contentchange:
           editor.onContentChanged();
           break;
-        case EventTypes.content:
-          editor.saveContent({
-            type: editorMessage.type,
-            content: editorMessage.value as string
-          });
-          break;
         case EventTypes.selection:
           break;
-        case EventTypes.title:
-          editor.saveContent({
-            type: editorMessage.type,
-            title: editorMessage.value as string
-          });
-          break;
-
         case EventTypes.reminders:
           if (!editor.note.current) {
             ToastEvent.show({

apps/mobile/app/screens/editor/tiptap/use-editor.ts

@@ -77,6 +77,7 @@ export const useEditor = (
   const lastContentChangeTime = useRef<number>(0);
   const lock = useRef(false);
   const loadedImages = useRef<{ [name: string]: boolean }>({});
+  const lockedSessionId = useRef<string>();
 
   const postMessage = useCallback(
     async <T>(type: string, data: T) =>
@@ -243,6 +244,11 @@ export const useEditor = (
             state.current.currentlyEditing
           ) {
             setTimeout(() => {
+              if (
+                (currentNote.current?.id && currentNote.current?.id !== id) ||
+                !state.current.currentlyEditing
+              )
+                return;
               id && useEditorStore.getState().setCurrentlyEditingNote(id);
             });
           }
@@ -378,10 +384,11 @@ export const useEditor = (
         }
         lastContentChangeTime.current = item.dateEdited;
         const nextSessionId = makeSessionId(item as NoteType);
+        lockedSessionId.current = nextSessionId;
         sessionHistoryId.current = Date.now();
         setSessionId(nextSessionId);
+        commands.setSessionId(nextSessionId);
         sessionIdRef.current = nextSessionId;
-        await commands.setSessionId(nextSessionId);
         currentNote.current = item as NoteType;
         await commands.setStatus(timeConverter(item.dateEdited), "Saved");
         await postMessage(EditorEvents.title, item.title);
@@ -389,6 +396,11 @@ export const useEditor = (
         useEditorStore.getState().setReadonly(item.readonly);
         await commands.setTags(currentNote.current);
         commands.setSettings();
+        setTimeout(() => {
+          if (lockedSessionId.current === nextSessionId) {
+            lockedSessionId.current = undefined;
+          }
+        }, 300);
         overlay(false);
         loadImages();
       }
@@ -495,14 +507,16 @@ export const useEditor = (
     ({
       title,
       content,
-      type
+      type,
+      forSessionId
     }: {
       title?: string;
       content?: string;
       type: string;
+      forSessionId: string;
     }) => {
+      if (lock.current || lockedSessionId.current === forSessionId) return;
       lastContentChangeTime.current = Date.now();
-      if (lock.current) return;
       if (type === EditorEvents.content) {
         currentContent.current = {
           data: content,
@@ -511,16 +525,16 @@ export const useEditor = (
         };
       }
       const noteIdFromSessionId =
-        !sessionIdRef.current || sessionIdRef.current.startsWith("session")
+        !forSessionId || forSessionId.startsWith("session")
           ? null
-          : sessionIdRef.current.split("_")[0];
+          : forSessionId.split("_")[0];
 
-      const noteId = currentNote.current?.id || noteIdFromSessionId;
+      const noteId = noteIdFromSessionId || currentNote.current?.id;
       const params = {
         title,
         data: content,
         type: "tiptap",
-        sessionId,
+        sessionId: forSessionId,
         id: noteId,
         sessionHistoryId: sessionHistoryId.current
       };
@@ -530,7 +544,7 @@ export const useEditor = (
           if (
             currentNote.current &&
             !params.id &&
-            params.sessionId === sessionId
+            params.sessionId === forSessionId
           ) {
             params.id = currentNote.current?.id;
           }
@@ -543,7 +557,7 @@ export const useEditor = (
         150
       );
     },
-    [sessionId, withTimer, onChange, saveNote]
+    [withTimer, onChange, saveNote]
   );
 
   const restoreEditorState = useCallback(async () => {

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

@@ -83,6 +83,7 @@ export function useEditorController(update: () => void): EditorController {
   }, []);
 
   const contentChange = useCallback((editor: Editor) => {
+    const currentSessionId = globalThis.sessionId;
     post(EventTypes.contentchange);
     if (!editor) return;
     if (typeof timers.current.change === "number") {
@@ -90,7 +91,7 @@ export function useEditorController(update: () => void): EditorController {
     }
     timers.current.change = setTimeout(() => {
       htmlContentRef.current = editor.getHTML();
-      post(EventTypes.content, htmlContentRef.current);
+      post(EventTypes.content, htmlContentRef.current, currentSessionId);
     }, 300);
   }, []);