From 2dbe9daaff69cce97690933e134a65de1c42599e Mon Sep 17 00:00:00 2001 From: ammarahm-ed Date: Sat, 26 Mar 2022 20:46:21 +0500 Subject: [PATCH] refactor: replace `getNote()` with `editorController.current?.note` --- .../src/components/dialogs/vault/index.js | 5 +++-- .../src/components/mergeconflicts/index.js | 3 ++- .../src/components/notehistory/preview.js | 17 ++++++++--------- apps/mobile/src/screens/editor/EditorHeader.js | 12 +++++------- .../mobile/src/screens/editor/EditorSettings.js | 3 ++- .../src/screens/editor/tiny/toolbar/picker.js | 4 ++-- .../editor/tiny/toolbar/searchreplace.js | 3 ++- .../src/screens/editor/tiptap/commands.ts | 12 ++++++++++++ .../src/screens/editor/tiptap/useEditor.ts | 6 ++++++ apps/mobile/src/screens/home/index.js | 4 ++-- apps/mobile/src/screens/notes/index.js | 4 ++-- apps/mobile/src/services/sync.js | 3 ++- 12 files changed, 48 insertions(+), 28 deletions(-) diff --git a/apps/mobile/src/components/dialogs/vault/index.js b/apps/mobile/src/components/dialogs/vault/index.js index 53a5dc0ec..c353d03e9 100644 --- a/apps/mobile/src/components/dialogs/vault/index.js +++ b/apps/mobile/src/components/dialogs/vault/index.js @@ -34,6 +34,7 @@ import Seperator from '../../ui/seperator'; import { Toast } from '../../toast'; import Paragraph from '../../ui/typography/paragraph'; import SearchService from '../../../services/search'; +import { editorController } from '../../../screens/editor/tiptap/utils'; let Keychain; const passInputRef = createRef(); @@ -390,7 +391,7 @@ export class VaultDialog extends Component { return; } else { await db.vault.add(this.state.note.id); - if (this.state.note.id === getNote()?.id) { + if (this.state.note.id === editorController.current?.note?.id) { eSendEvent(eClearEditor); } this.close(); @@ -500,7 +501,7 @@ export class VaultDialog extends Component { } if (this.state.note?.id) { await db.vault.add(this.state.note.id); - if (this.state.note.id === getNote()?.id) { + if (this.state.note.id === editorController.current?.note?.id) { eSendEvent(eClearEditor); } this.setState({ diff --git a/apps/mobile/src/components/mergeconflicts/index.js b/apps/mobile/src/components/mergeconflicts/index.js index 81d9cc35c..fd5336d44 100644 --- a/apps/mobile/src/components/mergeconflicts/index.js +++ b/apps/mobile/src/components/mergeconflicts/index.js @@ -30,6 +30,7 @@ import DialogContainer from '../dialog/dialog-container'; import DialogHeader from '../dialog/dialog-header'; import Seperator from '../ui/seperator'; import Paragraph from '../ui/typography/paragraph'; +import { editorController } from '../../screens/editor/tiptap/utils'; const primaryWebView = createRef(); const secondaryWebView = createRef(); @@ -161,7 +162,7 @@ const MergeConflicts = () => { Navigation.routeNames.Favorites, Navigation.routeNames.Notes ]); - if (getNote()?.id === note.id) { + if (editorController.current?.note?.id === note.id) { updateNoteInEditor(); } close(); diff --git a/apps/mobile/src/components/notehistory/preview.js b/apps/mobile/src/components/notehistory/preview.js index a6706aca4..9041e2101 100644 --- a/apps/mobile/src/components/notehistory/preview.js +++ b/apps/mobile/src/components/notehistory/preview.js @@ -1,19 +1,18 @@ import React, { useRef } from 'react'; -import { Alert, Platform, View } from 'react-native'; +import { Platform, View } from 'react-native'; import WebView from 'react-native-webview'; -import { useThemeStore } from '../../stores/theme'; -import { useEditorStore } from '../../stores/stores'; +import { getNote, sourceUri } from '../../screens/editor/Functions'; +import { editorController } from '../../screens/editor/tiptap/utils'; import { eSendEvent, ToastEvent } from '../../services/event-manager'; import Navigation from '../../services/navigation'; +import { useEditorStore } from '../../stores/stores'; +import { useThemeStore } from '../../stores/theme'; import { db } from '../../utils/database'; import { eCloseProgressDialog, eOnLoadNote } from '../../utils/events'; import { openLinkInBrowser } from '../../utils/functions'; import { normalize } from '../../utils/size'; -import { getNote, sourceUri } from '../../screens/editor/Functions'; -import tiny from '../../screens/editor/tiny/tiny'; -import { IconButton } from '../ui/icon-button'; -import { Button } from '../ui/button'; import DialogHeader from '../dialog/dialog-header'; +import { Button } from '../ui/button'; import Paragraph from '../ui/typography/paragraph'; export default function NotePreview({ session, content }) { @@ -72,8 +71,8 @@ export default function NotePreview({ session, content }) { async function restore() { await db.noteHistory.restore(session.id); if (useEditorStore.getState()?.currentEditingNote === session?.noteId) { - if (getNote()) { - eSendEvent(eOnLoadNote, { ...getNote(), forced: true }); + if (editorController.current?.note) { + eSendEvent(eOnLoadNote, { ...editorController.current?.note, forced: true }); } } eSendEvent(eCloseProgressDialog, 'note_history'); diff --git a/apps/mobile/src/screens/editor/EditorHeader.js b/apps/mobile/src/screens/editor/EditorHeader.js index 6c9685f39..1eab58a32 100644 --- a/apps/mobile/src/screens/editor/EditorHeader.js +++ b/apps/mobile/src/screens/editor/EditorHeader.js @@ -1,6 +1,6 @@ import { EV, EVENTS } from 'notes-core/common'; import React, { useEffect, useRef } from 'react'; -import { BackHandler, InteractionManager, Keyboard, Platform, Vibration, View } from 'react-native'; +import { BackHandler, InteractionManager, Platform, Vibration, View } from 'react-native'; import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { notesnook } from '../../../e2e/test.ids'; import { Properties } from '../../components/properties'; @@ -15,7 +15,6 @@ import { import Navigation from '../../services/navigation'; import { useEditorStore, useSettingStore, useUserStore } from '../../stores/stores'; import { useThemeStore } from '../../stores/theme'; -import { editing } from '../../utils'; import umami from '../../utils/analytics'; import { SUBSCRIPTION_STATUS } from '../../utils/constants'; import { db } from '../../utils/database'; @@ -30,13 +29,12 @@ import { } from '../../utils/events'; import { tabBarRef } from '../../utils/global-refs'; import { EditorTitle } from './EditorTitle'; -import { clearEditor, getNote, setColors, startClosingSession } from './Functions'; import { ProgressCircle } from './ProgressCircle'; -import tiny, { safeKeyboardDismiss } from './tiny/tiny'; +import { safeKeyboardDismiss } from './tiny/tiny'; import { endSearch } from './tiny/toolbar/commands'; import { toolbarRef } from './tiny/toolbar/constants'; import picker from './tiny/toolbar/picker'; -import { editorState } from './tiptap/utils'; +import { editorController, editorState } from './tiptap/utils'; const EditorHeader = ({ editor }) => { const colors = useThemeStore(state => state.colors); @@ -114,7 +112,7 @@ const EditorHeader = ({ editor }) => { return; } - let note = getNote() && db.notes.note(getNote().id).data; + let note = db.notes.note(editorController.current?.note?.id)?.data; if (note.locked) { ToastEvent.show({ heading: 'Locked notes cannot be published', @@ -131,7 +129,7 @@ const EditorHeader = ({ editor }) => { }; const showActionsheet = async () => { - let note = getNote() && db.notes.note(getNote().id).data; + let note = db.notes.note(editorController.current?.note?.id)?.data; if (!note) { ToastEvent.show({ diff --git a/apps/mobile/src/screens/editor/EditorSettings.js b/apps/mobile/src/screens/editor/EditorSettings.js index 0b0208b7f..a2cef09b3 100644 --- a/apps/mobile/src/screens/editor/EditorSettings.js +++ b/apps/mobile/src/screens/editor/EditorSettings.js @@ -19,6 +19,7 @@ import { sleep } from '../../utils/time'; import { EditorWebView, getNote } from './Functions'; import tiny from './tiny/tiny'; import ToggleSwitch from 'toggle-switch-react-native'; +import { editorController } from './tiptap/utils'; export const EditorSettings = () => { const colors = useThemeStore(state => state.colors); @@ -144,7 +145,7 @@ export const EditorSettings = () => { changeDirection(${settings.directionality === 'rtl' ? false : true}) ` ); - eSendEvent('loadingNote', getNote()); + eSendEvent('loadingNote', editorController.current?.note); await sleep(100); EditorWebView.current?.reload(); } diff --git a/apps/mobile/src/screens/editor/tiny/toolbar/picker.js b/apps/mobile/src/screens/editor/tiny/toolbar/picker.js index 242e31739..80e30e7a1 100644 --- a/apps/mobile/src/screens/editor/tiny/toolbar/picker.js +++ b/apps/mobile/src/screens/editor/tiny/toolbar/picker.js @@ -12,7 +12,7 @@ import { db } from '../../../../utils/database'; import { eCloseProgressDialog } from '../../../../utils/events'; import { sleep } from '../../../../utils/time'; import { EditorWebView, getNote } from '../../Functions'; -import { editorState } from '../../tiptap/utils'; +import { editorController, editorState } from '../../tiptap/utils'; import tiny, { safeKeyboardDismiss } from '../tiny'; const FILE_SIZE_LIMIT = 500 * 1024 * 1024; @@ -338,7 +338,7 @@ async function attachFile(uri, hash, type, filename, options) { } else { encryptionInfo = { hash: hash }; } - await db.attachments.add(encryptionInfo, getNote()?.id); + await db.attachments.add(encryptionInfo, editorController.current?.note?.id); if (Platform.OS === 'ios') await RNFetchBlob.fs.unlink(uri); return true; diff --git a/apps/mobile/src/screens/editor/tiny/toolbar/searchreplace.js b/apps/mobile/src/screens/editor/tiny/toolbar/searchreplace.js index 31c27c588..42e06388c 100644 --- a/apps/mobile/src/screens/editor/tiny/toolbar/searchreplace.js +++ b/apps/mobile/src/screens/editor/tiny/toolbar/searchreplace.js @@ -12,6 +12,7 @@ import { EditorWebView, getNote } from '../../Functions'; import tiny from '../tiny'; import { endSearch } from './commands'; import { properties } from './constants'; +import { editorController } from '../../tiptap/utils'; const SearcReplace = () => { const colors = useThemeStore(state => state.colors); @@ -195,7 +196,7 @@ const SearcReplace = () => { fwdRef={switchModeRef} iconColor={enableReplace ? colors.accent : colors.icon} onPress={() => { - if (getNote()?.readonly) return; + if (editorController.current?.note?.readonly) return; hideAllTooltips(); if (enableReplace) { if (focusType === 2) { diff --git a/apps/mobile/src/screens/editor/tiptap/commands.ts b/apps/mobile/src/screens/editor/tiptap/commands.ts index 0fe64e800..0a23cef45 100644 --- a/apps/mobile/src/screens/editor/tiptap/commands.ts +++ b/apps/mobile/src/screens/editor/tiptap/commands.ts @@ -54,6 +54,18 @@ statusBar.current.set({date:"",saved:""}); setStatus = (date: string | undefined, saved: string) => call(this.ref, fn(`statusBar.current.set({date:"${date}",saved:"${saved}"})`)); + + setPlaceholder = (placeholder: string) => { + call( + this.ref, + fn(` + const element = document.querySelector(".is-editor-empty"); + if (element) { + element.setAttribute("data-placeholder","${placeholder}"); + } + `) + ); + }; } export default Commands; diff --git a/apps/mobile/src/screens/editor/tiptap/useEditor.ts b/apps/mobile/src/screens/editor/tiptap/useEditor.ts index 125fbeabc..d359a3edb 100644 --- a/apps/mobile/src/screens/editor/tiptap/useEditor.ts +++ b/apps/mobile/src/screens/editor/tiptap/useEditor.ts @@ -2,6 +2,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import WebView from 'react-native-webview'; import { DDS } from '../../../services/device-detection'; import { eSendEvent, eSubscribeEvent, eUnSubscribeEvent } from '../../../services/event-manager'; +import { TipManager } from '../../../services/tip-manager'; import { useEditorStore } from '../../../stores/stores'; import { useThemeStore } from '../../../stores/theme'; import { db } from '../../../utils/database'; @@ -48,6 +49,8 @@ export const useEditor = () => { const sessionHistoryId = useRef(); const state = useRef>(defaultState); console.log('state: ', defaultState); + const placeholderTip = useRef(TipManager.placeholderTip()); + const postMessage = useCallback( async (type: string, data: any) => await post(editorRef, type, data), [] @@ -102,6 +105,8 @@ export const useEditor = () => { currentContent.current = null; useEditorStore.getState().setCurrentlyEditingNote(null); commands.clearContent(); + placeholderTip.current = TipManager.placeholderTip(); + commands.setPlaceholder(placeholderTip.current); }, []); const saveNote = useCallback( @@ -306,6 +311,7 @@ export const useEditor = () => { console.log('force reload note'); loadNote({ ...currentNote.current, forced: true }); } else { + commands.setPlaceholder(placeholderTip.current); restoreEditorState(); } }, [state, currentNote, loadNote]); diff --git a/apps/mobile/src/screens/home/index.js b/apps/mobile/src/screens/home/index.js index b8970c4be..ae54c83db 100755 --- a/apps/mobile/src/screens/home/index.js +++ b/apps/mobile/src/screens/home/index.js @@ -14,7 +14,7 @@ import { db } from '../../utils/database'; import { eOnLoadNote } from '../../utils/events'; import { tabBarRef } from '../../utils/global-refs'; import { getNote } from '../editor/Functions'; -import { editorState } from '../editor/tiptap/utils'; +import { editorController, editorState } from '../editor/tiptap/utils'; export const Home = ({ navigation }) => { const notes = useNoteStore(state => state.notes); @@ -82,7 +82,7 @@ export const Home = ({ navigation }) => { const _onPressBottomButton = React.useCallback(async () => { if (!DDS.isTab) { - if (getNote()) { + if (!editorController.current?.note) { eSendEvent(eOnLoadNote, { type: 'new' }); editorState().currentlyEditing = true; editorState().movedAway = false; diff --git a/apps/mobile/src/screens/notes/index.js b/apps/mobile/src/screens/notes/index.js index 9c8f55b32..bdc0666fb 100644 --- a/apps/mobile/src/screens/notes/index.js +++ b/apps/mobile/src/screens/notes/index.js @@ -18,7 +18,7 @@ import { eOnLoadNote, eOpenAddTopicDialog, refreshNotesPage } from '../../utils/ import { openLinkInBrowser } from '../../utils/functions'; import { tabBarRef } from '../../utils/global-refs'; import { getNote } from '../editor/Functions'; -import { editorState } from '../editor/tiptap/utils'; +import { editorController, editorState } from '../editor/tiptap/utils'; const getNotes = (params, group = true) => { if (!params) return []; @@ -189,7 +189,7 @@ export const Notes = ({ route, navigation }) => { } setActionAfterFirstSave(); if (!DDS.isTab) { - if (getNote()) { + if (editorController.current?.note) { eSendEvent(eOnLoadNote, { type: 'new' }); editorState().currentlyEditing = true; editorState().movedAway = false; diff --git a/apps/mobile/src/services/sync.js b/apps/mobile/src/services/sync.js index 3af5dcff5..51921b663 100644 --- a/apps/mobile/src/services/sync.js +++ b/apps/mobile/src/services/sync.js @@ -5,6 +5,7 @@ import { doInBackground } from '../utils'; import { db } from '../utils/database'; import { getNote, updateNoteInEditor } from '../screens/editor/Functions'; import { ToastEvent } from './event-manager'; +import { editorController } from '../screens/editor/tiptap/utils'; const run = async (context = 'global', forced = false, full = true) => { let result = false; @@ -59,7 +60,7 @@ const run = async (context = 'global', forced = false, full = true) => { } finally { userstore.setLastSynced(await db.lastSynced()); initialize(); - if (getNote()?.id) { + if (editorController.current?.note?.id) { await updateNoteInEditor(); } userstore.setSyncing(false);