reset caretline returning to View

apps/app/src/client/components/PageEditor/PageEditor.tsx

@@ -24,7 +24,7 @@ import { uploadAttachments } from '~/client/services/upload-attachments';
 import { toastError, toastSuccess, toastWarning } from '~/client/util/toastr';
 import { useShouldExpandContent } from '~/services/layout/use-should-expand-content';
 import {
-  useSaveNextCaretLine,
+  useReservedNextCaretLine,
   useDefaultIndentSize, useCurrentUser,
   useCurrentPathname, useIsEnabledAttachTitleHeader,
   useIsEditable, useIsIndentSizeForced,
@@ -110,7 +110,7 @@ export const PageEditor = React.memo((props: Props): JSX.Element => {
   const { data: user } = useCurrentUser();
   const { onEditorsUpdated } = useEditingUsers();
   const onConflict = useConflictResolver();
-  const { data: nextCaretLine, mutate: mutateNextCaretLine } = useSaveNextCaretLine();
+  const { data: reservedNextCaretLine, mutate: mutateReservedNextCaretLine } = useReservedNextCaretLine();
 
   const { data: rendererOptions } = usePreviewOptions();
 
@@ -300,20 +300,25 @@ export const PageEditor = React.memo((props: Props): JSX.Element => {
     }
   }, [initialValue, isIndentSizeForced, mutateCurrentIndentSize]);
 
-  // set handler to set caret line
+
+  // set caret line if the edit button next to Header is clicked.
   useEffect(() => {
     if (codeMirrorEditor?.setCaretLine == null) {
       return;
     }
     if (editorMode === EditorMode.Editor) {
-      codeMirrorEditor.setCaretLine(nextCaretLine ?? 0, true);
+      codeMirrorEditor.setCaretLine(reservedNextCaretLine ?? 0, true);
     }
 
-    return () => {
-      mutateNextCaretLine(0);
-    };
+  }, [codeMirrorEditor, editorMode, reservedNextCaretLine]);
+
+  // reset caret line if returning to the View.
+  useEffect(() => {
+    if (editorMode === EditorMode.View) {
+      mutateReservedNextCaretLine(0);
+    }
+  }, [editorMode, mutateReservedNextCaretLine]);
 
-  }, [codeMirrorEditor, editorMode, nextCaretLine, mutateNextCaretLine]);
 
   // TODO: Check the reproduction conditions that made this code necessary and confirm reproduction
   // // when transitioning to a different page, if the initialValue is the same,

apps/app/src/client/components/ReactMarkdownComponents/Header.tsx

@@ -27,7 +27,7 @@ declare global {
 
 function setCaretLine(line?: number): void {
   if (line != null) {
-    globalEmitter.emit('saveNextCaretLine', line);
+    globalEmitter.emit('reservedNextCaretLine', line);
   }
 }
 

apps/app/src/stores-universal/context.tsx

@@ -261,7 +261,7 @@ export const useIsEditable = (): SWRResponse<boolean, Error> => {
 };
 
 
-export const useSaveNextCaretLine = (initialData?: number): SWRResponse<number> => {
+export const useReservedNextCaretLine = (initialData?: number): SWRResponse<number> => {
 
   const swrResponse = useSWRStatic('saveNextCaretLine', initialData, { fallbackData: 0 });
   const { mutate } = swrResponse;
@@ -271,10 +271,10 @@ export const useSaveNextCaretLine = (initialData?: number): SWRResponse<number>
       mutate(lineNumber);
     };
 
-    globalEmitter.on('saveNextCaretLine', handler);
+    globalEmitter.on('reservedNextCaretLine', handler);
 
     return function cleanup() {
-      globalEmitter.removeListener('saveNextCaretLine', handler);
+      globalEmitter.removeListener('reservedNextCaretLine', handler);
     };
   }, [mutate]);