diff --git a/src/screens/Compose/ComponentView.styled.ts b/src/screens/Compose/ComponentView.styled.ts index 966ac906..36057622 100644 --- a/src/screens/Compose/ComponentView.styled.ts +++ b/src/screens/Compose/ComponentView.styled.ts @@ -1,10 +1,11 @@ import { ICON_LOCK } from '@Style/icons'; import { StyleKit } from '@Style/StyleKit'; +import { SafeAreaView } from 'react-native-safe-area-context'; import Icon from 'react-native-vector-icons/Ionicons'; import WebView from 'react-native-webview'; import styled from 'styled-components/native'; -export const FlexContainer = styled.View` +export const FlexContainer = styled(SafeAreaView)` flex: 1; background-color: ${({ theme }) => theme.stylekitBackgroundColor}; `; diff --git a/src/screens/Compose/ComponentView.tsx b/src/screens/Compose/ComponentView.tsx index 8159a6e1..f3cf84ba 100644 --- a/src/screens/Compose/ComponentView.tsx +++ b/src/screens/Compose/ComponentView.tsx @@ -197,13 +197,6 @@ export const ComponentView = ({ })()`; }; - // const setRef = ref => { - // if (ref) { - // console.log(ref); - // webViewRef.current = { postMessage: ref.postMessage }; - // } - // }; - return ( {liveComponent?.item.valid_until && diff --git a/src/screens/Compose/Compose.tsx b/src/screens/Compose/Compose.tsx index 2d410605..5262e8ab 100644 --- a/src/screens/Compose/Compose.tsx +++ b/src/screens/Compose/Compose.tsx @@ -23,6 +23,7 @@ import { ContentType, isPayloadSourceRetrieved, NoteMutator, + PayloadSource, Platform, SNComponent, SNNote, @@ -222,7 +223,6 @@ export const Compose = (): JSX.Element => { /** Same editor, no change */ return { updatedEditor: associatedEditor, changed: false }; } - await application?.componentGroup.activateComponent(associatedEditor); return { updatedEditor: associatedEditor, changed: true }; }, [application, editorComponent, note]); @@ -302,12 +302,20 @@ export const Compose = (): JSX.Element => { const removeEditorNoteValueChangeObserver = editor?.addNoteValueChangeObserver( (newNote, source) => { if (isPayloadSourceRetrieved(source!)) { - setNote(newNote); + if ( + !editorComponent || + (editorComponent && source !== PayloadSource.ComponentRetrieved) + ) { + setNote(newNote); + } + setTitle(newNote.title); setNoteText(newNote.text); } if (newNote.locked !== note?.locked) { - setNote(newNote); + if (note) { + setNote(newNote); + } } if (newNote.lastSyncBegan && newNote.lastSyncEnd) { if ( @@ -330,6 +338,8 @@ export const Compose = (): JSX.Element => { }; }, [ editor, + editorComponent, + note, note?.locked, setStatus, showAllChangesSavedStatus, diff --git a/src/screens/Notes/NoteList.tsx b/src/screens/Notes/NoteList.tsx index d54051b0..f5f56d74 100644 --- a/src/screens/Notes/NoteList.tsx +++ b/src/screens/Notes/NoteList.tsx @@ -108,7 +108,6 @@ export const NoteList = (props: Props): JSX.Element => { renderTags={renderTags} // options={props.options} highlighted={item.uuid === props.selectedNoteId} - // handleAction={props.handleAction} /> ); }; @@ -158,11 +157,12 @@ export const NoteList = (props: Props): JSX.Element => { keyboardDismissMode={'interactive'} keyboardAppearance={styleKit?.keyboardColorForActiveTheme()} inputBorderRadius={4} + tintColorSearch={theme.stylekitForegroundColor} inputStyle={[ styles.androidSearch, { backgroundColor: theme.stylekitContrastBackgroundColor, - color: theme.stylekitForegroundColor, + // color: theme.stylekitForegroundColor, }, ]} /> diff --git a/src/screens/SideMenu/NoteSideMenu.tsx b/src/screens/SideMenu/NoteSideMenu.tsx index 29234cc1..22355a1a 100644 --- a/src/screens/SideMenu/NoteSideMenu.tsx +++ b/src/screens/SideMenu/NoteSideMenu.tsx @@ -31,6 +31,7 @@ import { ComponentMutator, ContentType, NoteMutator, + PayloadSource, SNComponent, SNNote, SNSmartTag, @@ -106,9 +107,11 @@ export const NoteSideMenu = (props: Props) => { } ); const removeEditorNoteValueChangeObserver = editor?.addNoteValueChangeObserver( - newNote => { + (newNote, source) => { if (mounted) { - setNote(newNote); + if (source !== PayloadSource.ComponentRetrieved) { + setNote(newNote); + } } } ); @@ -121,6 +124,7 @@ export const NoteSideMenu = (props: Props) => { }, [editor]); useEffect(() => { + let isMounted = true; const removeComponentsObserver = application?.streamItems( ContentType.Component, async () => { @@ -130,12 +134,16 @@ export const NoteSideMenu = (props: Props) => { const displayComponents = sortAlphabetically( application!.componentManager!.componentsForArea(ComponentArea.Editor) ); - - setComponents(displayComponents); + if (isMounted) { + setComponents(displayComponents); + } } ); - return removeComponentsObserver; + return () => { + isMounted = false; + removeComponentsObserver && removeComponentsObserver(); + }; }, [application, note]); const disassociateComponentWithCurrentNote = useCallback( @@ -170,9 +178,7 @@ export const NoteSideMenu = (props: Props) => { note! ); if (!component) { - console.log('plain click', note?.prefersPlainEditor); if (!note?.prefersPlainEditor) { - console.log('prefers plain'); await application?.changeItem(note!.uuid, mutator => { const noteMutator = mutator as NoteMutator; noteMutator.prefersPlainEditor = true;