Mirrors/notesnook
1
0
Fork 0
mirror of https://github.com/streetwriters/notesnook.git synced 2026-09-03 04:31:46 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix note loading errors

Browse Source
This commit is contained in:
ammarahm-ed
2021-02-05 11:02:54 +05:00
parent 046b832620
commit 8ac1c75dc3
8 changed files with 206 additions and 98 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
apps/mobile/android/app/src/main/assets/init.js
View File

@@ -65,6 +65,11 @@ function init_tiny(size) {
editor.on('focus', () => {
reactNativeEventHandler('focus', 'editor');
});
editor.on("SetContent", event => {
if (!event.paste) {
reactNativeEventHandler('noteLoaded', true);
}
})
editor.on('Change', function (e) {
clearTimeout(changeTimer);
if (isLoading) {

128
apps/mobile/src/views/Editor/EditorHeader.js
View File

@@ -1,23 +1,23 @@
import React, { useEffect } from 'react';
import { Keyboard, Platform, View } from 'react-native';
import React, {useEffect} from 'react';
import {Keyboard, Platform, View} from 'react-native';
import RNExitApp from 'react-native-exit-app';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { notesnook } from '../../../e2e/test.ids';
import { ActionIcon } from '../../components/ActionIcon';
import { ActionSheetEvent } from '../../components/DialogManager/recievers';
import { useTracked } from '../../provider';
import { DDS } from '../../services/DeviceDetection';
import { eSendEvent, ToastEvent } from '../../services/EventManager';
import {useSafeAreaInsets} from 'react-native-safe-area-context';
import {notesnook} from '../../../e2e/test.ids';
import {ActionIcon} from '../../components/ActionIcon';
import {ActionSheetEvent} from '../../components/DialogManager/recievers';
import {useTracked} from '../../provider';
import {DDS} from '../../services/DeviceDetection';
import {eSendEvent, ToastEvent} from '../../services/EventManager';
import Navigation from '../../services/Navigation';
import { editing } from '../../utils';
import { db } from '../../utils/DB';
import {editing} from '../../utils';
import {db} from '../../utils/DB';
import {
eCloseFullscreenEditor,
eOpenFullscreenEditor
eOpenFullscreenEditor,
} from '../../utils/Events';
import { sideMenuRef, tabBarRef } from '../../utils/Refs';
import { sleep } from '../../utils/TimeUtils';
import { EditorTitle } from './EditorTitle';
import {sideMenuRef, tabBarRef} from '../../utils/Refs';
import {sleep} from '../../utils/TimeUtils';
import {EditorTitle} from './EditorTitle';
import {
checkNote,
clearEditor,
@@ -28,7 +28,7 @@ import {
post,
saveNote,
setColors,
setIntent
setIntent,
} from './Functions';
import HistoryComponent from './HistoryComponent';
import tiny from './tiny/tiny';
@@ -38,20 +38,13 @@ let tapCount = 0;
const EditorHeader = () => {
const [state] = useTracked();
const {colors, fullscreen, deviceMode,premiumUser} = state;
const {colors, fullscreen} = state;
const insets = useSafeAreaInsets();
useEffect(() => {
setColors(colors);
}, [colors.bg]);
useEffect(() => {
EditorWebView.current?.reload();
}, [premiumUser]);
const _onBackPress = async () => {
if (sideMenuRef.current === null) {
if (tapCount > 0) {
@@ -141,56 +134,57 @@ const EditorHeader = () => {
style={{
flexDirection: 'row',
}}>
<ActionIcon
name="plus"
color={colors.accent}
customStyle={{
marginLeft: 10,
borderRadius: 5,
}}
onPress={async () => {
await loadNote({type: 'new'});
}}
/>
{DDS.isLargeTablet() && !fullscreen ? (
<>
<ActionIcon
name="fullscreen"
name="plus"
color={colors.accent}
customStyle={{
marginLeft: 10,
borderRadius: 5,
}}
onPress={async () => {
await loadNote({type: 'new'});
}}
/>
{DDS.isLargeTablet() && !fullscreen ? (
<ActionIcon
name="fullscreen"
color={colors.heading}
customStyle={{
marginLeft: 10,
}}
onPress={() => {
eSendEvent(eOpenFullscreenEditor);
editing.isFullscreen = true;
}}
/>
) : null}
<HistoryComponent />
<ActionIcon
name="dots-horizontal"
color={colors.heading}
customStyle={{
marginLeft: 10,
}}
onPress={() => {
eSendEvent(eOpenFullscreenEditor);
editing.isFullscreen = true;
onPress={async () => {
let note = getNote() && db.notes.note(getNote().id).data;
if (editing.isFocused) {
tiny.call(EditorWebView, tiny.blur);
await sleep(500);
editing.isFocused = true;
}
ActionSheetEvent(
note,
true,
true,
['Add to', 'Share', 'Export', 'Delete'],
['Dark Mode', 'Add to Vault', 'Pin', 'Favorite'],
);
}}
/>
) : null}
<HistoryComponent />
<ActionIcon
name="dots-horizontal"
color={colors.heading}
customStyle={{
marginLeft: 10,
}}
onPress={async () => {
let note = getNote() && db.notes.note(getNote().id).data;
if (editing.isFocused) {
tiny.call(EditorWebView,tiny.blur)
await sleep(500);
editing.isFocused = true;
}
ActionSheetEvent(
note,
true,
true,
['Add to', 'Share', 'Export', 'Delete'],
['Dark Mode', 'Add to Vault', 'Pin', 'Favorite'],
);
}}
/>
</>
</View>
</View>
</>

100
apps/mobile/src/views/Editor/EditorOverlay.js Normal file
View File

@@ -0,0 +1,100 @@
import React, {useEffect, useState} from 'react';
import {ActivityIndicator} from 'react-native';
import {View} from 'react-native';
import {Button} from '../../components/Button';
import Heading from '../../components/Typography/Heading';
import Paragraph from '../../components/Typography/Paragraph';
import {useTracked} from '../../provider';
import {
eSendEvent,
eSubscribeEvent,
eUnSubscribeEvent,
} from '../../services/EventManager';
import {SIZE} from '../../utils/SizeUtils';
let timer = null;
let timerError = null;
const EditorOverlay = () => {
const [state] = useTracked();
const {colors} = state;
const [loading, setLoading] = useState(false);
const [error, setError] = useState(false);
const load = (loading) => {
clearTimeout(timer);
clearTimeout(timerError);
if (loading) {
timer = setTimeout(() => {
setLoading(loading);
timerError = setTimeout(() => {
setError(true);
}, 6000);
}, 3000);
} else {
setError(false);
setLoading(false);
}
};
useEffect(() => {
eSubscribeEvent('loadingNote', load);
return () => {
eUnSubscribeEvent('loadingNote', load);
};
}, []);
return (
loading && (
<View
style={{
position: 'absolute',
width: '100%',
height: '100%',
backgroundColor: 'rgba(0,0,0,0.2)',
justifyContent: 'center',
alignItems: 'center',
}}>
<View
style={{
width: '80%',
justifyContent: 'center',
alignItems: 'center',
backgroundColor: colors.bg,
borderRadius: 5,
paddingVertical: 20,
}}>
<ActivityIndicator color={colors.accent} size={SIZE.xxxl} />
<Paragraph size={SIZE.md}>Loading Note</Paragraph>
{error && (
<>
<Button
type="error"
style={{
marginTop: 10,
}}
onPress={() => {
eSendEvent('webviewreset');
}}
title="Taking too long? Reload Editor"
/>
<Paragraph
textBreakStrategy="balanced"
size={SIZE.xs}
color={colors.icon}
style={{
textAlign: 'center',
maxWidth: '70%',
marginTop: 5,
}}>
If the editor fails to load even after reloading. Try restarting
the app.
</Paragraph>
</>
)}
</View>
</View>
)
);
};
export default EditorOverlay;

1
apps/mobile/src/views/Editor/EditorTitle.js
View File

@@ -60,7 +60,6 @@ export const EditorTitle = () => {
<TextInput
defaultValue={title}
style={{
//fontFamily: "sans-serif",
fontWeight:'bold',
fontSize: SIZE.xl,
color: colors.heading,

33
apps/mobile/src/views/Editor/EditorWrapper.js
View File

@@ -1,15 +1,16 @@
import React, { useEffect } from 'react';
import { KeyboardAvoidingView, Platform, SafeAreaView, View } from 'react-native';
import { PanGestureHandler, State } from 'react-native-gesture-handler';
import Animated, { Easing } from 'react-native-reanimated';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { GetPremium } from '../../components/ActionSheetComponent/GetPremium';
import React, {useEffect} from 'react';
import {KeyboardAvoidingView, Platform, SafeAreaView, View} from 'react-native';
import {PanGestureHandler, State} from 'react-native-gesture-handler';
import Animated, {Easing} from 'react-native-reanimated';
import {useSafeAreaInsets} from 'react-native-safe-area-context';
import {GetPremium} from '../../components/ActionSheetComponent/GetPremium';
import Paragraph from '../../components/Typography/Paragraph';
import { useTracked } from '../../provider';
import { DDS } from '../../services/DeviceDetection';
import { eSendEvent } from '../../services/EventManager';
import { eOnLoadNote } from '../../utils/Events';
import { editorRef } from '../../utils/Refs';
import {useTracked} from '../../provider';
import {DDS} from '../../services/DeviceDetection';
import {eSendEvent} from '../../services/EventManager';
import {eOnLoadNote} from '../../utils/Events';
import {editorRef} from '../../utils/Refs';
import EditorOverlay from './EditorOverlay';
import Editor from './index';
let prevVal = 0;
let finalValue = 80;
@@ -95,15 +96,15 @@ export const EditorWrapper = ({dimensions}) => {
width: DDS.isLargeTablet() ? dimensions.width * 0.55 : dimensions.width,
height: '100%',
backgroundColor: colors.bg,
borderLeftWidth:1,
borderLeftColor:DDS.isLargeTablet() ? colors.nav : 'transparent'
borderLeftWidth: 1,
borderLeftColor: DDS.isLargeTablet() ? colors.nav : 'transparent',
}}>
<SafeAreaView
style={{
width: '100%',
height: '100%',
}}>
<GetPremium context="editor" offset={50 + insets.top} />
<GetPremium context="editor" offset={50 + insets.top} />
<View
style={{
position: 'absolute',
@@ -140,7 +141,7 @@ export const EditorWrapper = ({dimensions}) => {
zIndex: 10,
transform: [
{
translateY:Platform.OS === "ios" ? -80 : -80 + insets.top,
translateY: Platform.OS === 'ios' ? -80 : -80 + insets.top,
},
],
}}>
@@ -173,6 +174,8 @@ export const EditorWrapper = ({dimensions}) => {
</View>
<Editor />
<EditorOverlay />
</AnimatedKeyboardView>
</PanGestureHandler>
</SafeAreaView>

17
apps/mobile/src/views/Editor/Functions.js
View File

@@ -185,6 +185,7 @@ export const loadNote = async (item) => {
EditorWebView.current?.reload();
}
} else {
eSendEvent('loadingNote', true);
editing.isFocused = false;
clearTimer();
await setNote(item);
@@ -239,10 +240,10 @@ export const _onMessage = async (evt) => {
eSendEvent('historyEvent', message.value);
break;
case 'tiny':
console.log('change',message);
console.log('change', message);
content = {
type:message.type,
data:message.value
type: message.type,
data: message.value,
};
onNoteChange();
break;
@@ -258,6 +259,9 @@ export const _onMessage = async (evt) => {
case 'scroll':
eSendEvent('editorScroll', message);
break;
case 'noteLoaded':
eSendEvent('loadingNote', !message.value);
break;
case 'premium':
let user = await db.user.getUser();
if (user && !user.isEmailConfirmed) {
@@ -303,9 +307,8 @@ function onNoteChange() {
}
export async function clearEditor() {
tiny.call(EditorWebView,tiny.isLoading);
clearTimer();
tiny.call(EditorWebView, tiny.reset);
clearTimer();
if (noteEdited && id) {
await saveNote(false);
}
@@ -391,7 +394,7 @@ export async function saveNote() {
return;
}
let locked = id ? db.notes.note(id).data.locked : null;
console.log(content,"SAVE Content");
console.log(content, 'SAVE Content');
let noteData = {
title,
@@ -466,7 +469,7 @@ const loadNoteInEditor = async () => {
intent = false;
tiny.call(EditorWebView, tiny.html(content.data));
setColors();
tiny.call(EditorWebView, tiny.updateDateEdited(note.dateEdited));
tiny.call(EditorWebView, tiny.updateDateEdited(timeConverter(note.dateEdited)));
tiny.call(EditorWebView, tiny.updateSavingState('Saved'));
}
tiny.call(EditorWebView, tiny.clearHistory);

1
apps/mobile/src/views/Editor/index.js
View File

@@ -16,6 +16,7 @@ import {getCurrentColors} from '../../utils/Colors';
import {SIZE} from '../../utils/SizeUtils';
import {sleep} from '../../utils/TimeUtils';
import EditorHeader from './EditorHeader';
import EditorOverlay from './EditorOverlay';
import {
editorTitleInput,
EditorWebView,

19
apps/mobile/src/views/Editor/tiny/tiny.js
View File

@@ -1,12 +1,13 @@
const reset = `
(() => {
isLoading = true;
document.getElementById("titleInput").value = '';
autosize();
tinyMCE.activeEditor.setContent('');
editor.undoManager.clear();
editor.('', 'custom');
document.activeElement.blur();
window.blur();
editor.resetContent();
})();
`;
export const keyboardStateChanged = `(() => {
var range = editor.getSelection();
if (range) {
@@ -51,7 +52,8 @@ export const clearEditor = `
editor.setContent("");
`;
const clearTitle = `
document.getElementById(titleInput).value = '';
document.getElementById(titleInput).value = '';
autosize();
`;
const focusTitle = `
@@ -59,7 +61,8 @@ document.getElementById("titleInput").focus();
`;
const setTitle = (value) => `
document.getElementById(titleInput).value = '${value}';
document.getElementById("titleInput").value = '${value}';
autosize();
`;
const cacheRange = `current_selection_range = editor.selection.getRng();`;
@@ -103,7 +106,7 @@ const updateTheme = (value) => `
`;
const isLoading =`
const isLoading = `
isLoading = true;
`;
@@ -157,5 +160,5 @@ export default {
updateTheme,
setTitle,
restoreRange,
isLoading
isLoading,
};