mobile: fix scroll into view on ios (#2017)

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

@@ -41,6 +41,11 @@ import Header from "./header";
 import StatusBar from "./statusbar";
 import Tags from "./tags";
 import Title from "./title";
+import { keepLastLineInView } from "@notesnook/editor/dist/extensions/keep-in-view/keep-in-view";
+
+function isIOSBrowser() {
+  return /(iphone|applewebkit)/g.test(navigator.userAgent.toLowerCase());
+}
 
 const Tiptap = ({
   editorTheme,
@@ -69,7 +74,15 @@ const Tiptap = ({
         global.editorController.contentChange(editor as Editor);
       },
       onSelectionUpdate: (props) => {
-        props.transaction.scrollIntoView();
+        if (props.transaction.docChanged) {
+          if (isIOSBrowser()) {
+            setTimeout(() => {
+              keepLastLineInView(props.editor, 80, 1);
+            }, 1);
+          } else {
+            props.transaction.scrollIntoView();
+          }
+        }
       },
       onOpenAttachmentPicker: (editor, type) => {
         global.editorController.openFilePicker(type);

packages/editor/src/extensions/keep-in-view/keep-in-view.ts

@@ -49,9 +49,11 @@ export const KeepInView = Extension.create({
   }
 });
 
-export function keepLastLineInView(editor: Editor) {
-  const THRESHOLD = 100;
-
+export function keepLastLineInView(
+  editor: Editor,
+  THRESHOLD = 100,
+  SCROLL_THRESHOLD = 100
+) {
   const node = editor.state.selection.$from;
   const { top } = posToDOMRect(editor.view, node.pos, node.pos + 1);
   const isBelowThreshold = window.innerHeight - top < THRESHOLD;
@@ -63,7 +65,7 @@ export function keepLastLineInView(editor: Editor) {
     if (domNode instanceof HTMLElement) {
       const container = findScrollContainer(domNode);
       if (container) {
-        container.scrollBy({ top: THRESHOLD, behavior: "smooth" });
+        container.scrollBy({ top: SCROLL_THRESHOLD, behavior: "smooth" });
       } else domNode.scrollIntoView({ behavior: "smooth", block: "center" });
     }
   }