reload editor if it seems to be not loaded

apps/mobile/src/views/Editor/Functions.js

@@ -18,7 +18,7 @@ import {sideMenuRef, tabBarRef} from '../../utils/Refs';
 import {normalize} from '../../utils/SizeUtils';
 import {sleep, timeConverter} from '../../utils/TimeUtils';
 
-export const EditorWebView = createRef();
+export let EditorWebView = createRef();
 
 export const params = 'platform=' + Platform.OS;
 export const sourceUri =
@@ -33,6 +33,7 @@ export const injectedJS = ` setTimeout(() => {
 },100);   
       `;
 
+let webviewOK = true;      
 let noteEdited = false;
 let note = null;
 let id = null;
@@ -97,6 +98,18 @@ export const INJECTED_JAVASCRIPT = (premium) =>
       },100)
    })();`;
 
+export const CHECK_STATUS = (premium) =>
+   `(function() {
+       setTimeout(() => {
+        let msg = JSON.stringify({
+          data: true,
+          type: 'running',
+        });
+        window.ReactNativeWebView.postMessage(msg)
+
+       },100)
+})();`;   
+
 export function getNote() {
   return note;
 }
@@ -153,6 +166,9 @@ function clearNote() {
 
 let currentEditingTimer = null;
 
+
+let webviewTimer = null;
+
 export const loadNote = async (item) => {
   editing.currentlyEditing = true;
   post('blur');
@@ -187,8 +203,26 @@ export const loadNote = async (item) => {
     }
     updateEvent({type: Actions.CURRENT_EDITING_NOTE, id: item.id});
   }
+  checkStatus();
 };
 
+const checkStatus = () => {
+  webviewOK = false
+  EditorWebView.current?.injectJavaScript(CHECK_STATUS());
+  clearTimeout(webviewTimer)
+  console.log('webview ok',webviewOK);
+  webviewTimer = setTimeout(() => {
+    if (!webviewOK) {
+      webviewInit = false;
+      EditorWebView = createRef();
+      console.log("webview failed to load")
+      eSendEvent("webviewreset")
+    } else {
+      console.log("webview is running",webviewOK)
+    }
+  },3000)
+}
+
 export function setIntentNote(item) {
   id = null;
   intent = true;
@@ -243,6 +277,9 @@ export const _onMessage = async (evt) => {
       webviewInit = true;
       loadNoteInEditor();
       break;
+    case 'running':
+      webviewOK = false;
+    break;  
     case 'focus':
       editing.focusType = message.value;
       break;

apps/mobile/src/views/Editor/index.js

@@ -1,11 +1,17 @@
-import React from 'react';
-import { Platform, TextInput } from 'react-native';
+import React, {useEffect, useState} from 'react';
+import {Platform, TextInput} from 'react-native';
 import WebView from 'react-native-webview';
-import { notesnook } from '../../../e2e/test.ids';
-import { Loading } from '../../components/Loading';
-import { useTracked } from '../../provider';
-import { ToastEvent } from '../../services/EventManager';
-import { getCurrentColors } from '../../utils/Colors';
+import {notesnook} from '../../../e2e/test.ids';
+import {Loading} from '../../components/Loading';
+import {useTracked} from '../../provider';
+import {
+  eSendEvent,
+  eSubscribeEvent,
+  eUnSubscribeEvent,
+  ToastEvent,
+} from '../../services/EventManager';
+import {getCurrentColors} from '../../utils/Colors';
+import {sleep} from '../../utils/TimeUtils';
 import EditorHeader from './EditorHeader';
 import {
   EditorWebView,
@@ -14,7 +20,7 @@ import {
   sourceUri,
   textInput,
   _onMessage,
-  _onShouldStartLoadWithRequest
+  _onShouldStartLoadWithRequest,
 } from './Functions';
 
 const source =
@@ -37,13 +43,34 @@ const Editor = React.memo(
   () => {
     const [state] = useTracked();
     const {premiumUser, loading} = state;
+    const [resetting, setResetting] = useState(false);
 
     const onLoad = async () => {
       await onWebViewLoad(premiumUser, getCurrentColors());
     };
 
-    return loading ? (
-      <Loading tagline="Loading Editor" height="100%" />
+    const onResetRequested = async () => {
+      console.log('resetting now');
+      setResetting(true);
+      await sleep(3000);
+      ToastEvent.show('Editor has recovered from crash.', 'success');
+      setResetting(false);
+    };
+
+    useEffect(() => {
+      if (!loading) {
+        eSubscribeEvent('webviewreset', onResetRequested);
+      }
+      return () => {
+        eUnSubscribeEvent('webviewreset', onResetRequested);
+      };
+    },[loading]);
+
+    return resetting || loading ? (
+      <Loading
+        tagline={resetting ? 'Reloading Editor' : 'Loading Editor'}
+        height="100%"
+      />
     ) : (
       <>
         <TextInput