diff --git a/apps/mobile/src/components/NoteItem/index.js b/apps/mobile/src/components/NoteItem/index.js index 845deba1f..08c6a7cec 100644 --- a/apps/mobile/src/components/NoteItem/index.js +++ b/apps/mobile/src/components/NoteItem/index.js @@ -244,7 +244,7 @@ const NoteItem = props => { { hideMenu(); - NavigationService.navigate('Folders', { + NavigationService.push('Folders', { note: item, title: 'Choose Notebook', isMove: true, diff --git a/apps/mobile/src/components/NotesList/index.js b/apps/mobile/src/components/NotesList/index.js index 94151d6eb..7e1e580fa 100644 --- a/apps/mobile/src/components/NotesList/index.js +++ b/apps/mobile/src/components/NotesList/index.js @@ -40,6 +40,7 @@ export const NotesList = ({ <> item.dateCreated.toString()} ListFooterComponent={ { - const [colors, setColors] = useState(COLOR_SCHEME); - const [notes, setNotes] = useState([]); - const fetchNotes = async () => { - let allNotes = await storage.getNotes(); - console.log(allNotes); - if (allNotes) { - setNotes(allNotes); - } - }; - useEffect(() => { - fetchNotes(); - }, [update]); - - useEffect(() => { - onThemeUpdate(() => { - setColors(COLOR_SCHEME); - }); - return () => { - clearThemeUpdateListener(() => { - setColors(COLOR_SCHEME); - }); - }; - }, []); - - return ( - <> - { - y = event.nativeEvent.contentOffset.y; - onScroll(y); - }} - style={{ - height: '100%', - width: '100%', - }} - ListHeaderComponent={ - - } - ListFooterComponent={ - - - - End - - - - } - keyExtractor={(item, index) => item.dateCreated.toString()} - renderItem={({item, index}) => ( - - )} - /> - - ); -}; diff --git a/apps/mobile/src/components/SearchInput/index.js b/apps/mobile/src/components/SearchInput/index.js index 5882f1ee9..0541731a1 100644 --- a/apps/mobile/src/components/SearchInput/index.js +++ b/apps/mobile/src/components/SearchInput/index.js @@ -55,6 +55,7 @@ export const Search = props => { ref={inputRef} style={{ fontFamily: WEIGHT.regular, + color: colors.pri, maxWidth: '90%', width: '90%', fontSize: SIZE.md, diff --git a/apps/mobile/src/services/NavigationService.js b/apps/mobile/src/services/NavigationService.js index 0e3e2da65..eb10dafc5 100755 --- a/apps/mobile/src/services/NavigationService.js +++ b/apps/mobile/src/services/NavigationService.js @@ -1,4 +1,8 @@ -import {createAppContainer, NavigationActions} from 'react-navigation'; +import { + createAppContainer, + NavigationActions, + StackActions, +} from 'react-navigation'; import {createStackNavigator} from 'react-navigation-stack'; import Home from '../views/Home/index'; import Editor from '../views/Editor'; @@ -81,7 +85,9 @@ const TopLevelNavigator = createStackNavigator( }, { initialRouteName: 'Home', - cardStyle: false, + defaultNavigationOptions: { + gesturesEnabled: false, + }, }, ); @@ -102,9 +108,19 @@ function navigate(routeName, params) { ); } +function push(routeName, params) { + _navigator.dispatch( + StackActions.push({ + routeName, + params, + }), + ); +} + // add other navigation functions that you need and export them export default { navigate, + push, setTopLevelNavigator, }; diff --git a/apps/mobile/src/views/AccountSettings/index.js b/apps/mobile/src/views/AccountSettings/index.js index 232396a8b..1aa13b9c5 100644 --- a/apps/mobile/src/views/AccountSettings/index.js +++ b/apps/mobile/src/views/AccountSettings/index.js @@ -29,6 +29,7 @@ import {ListItem} from '../../components/ListItem'; import {Header} from '../../components/header'; import NoteItem from '../../components/NoteItem'; import {useForceUpdate} from '../ListsEditor'; +import {AnimatedSafeAreaView} from '../Home'; const w = Dimensions.get('window').width; const h = Dimensions.get('window').height; @@ -47,7 +48,9 @@ export const AccountSettings = ({navigation}) => { }; }, []); return ( - { Logout - + ); }; diff --git a/apps/mobile/src/views/Favorites/index.js b/apps/mobile/src/views/Favorites/index.js index d549560a2..f5a44c779 100644 --- a/apps/mobile/src/views/Favorites/index.js +++ b/apps/mobile/src/views/Favorites/index.js @@ -27,6 +27,7 @@ import {Reminder} from '../../components/Reminder'; import {ListItem} from '../../components/ListItem'; import {Header} from '../../components/header'; import {useForceUpdate} from '../ListsEditor'; +import {AnimatedSafeAreaView} from '../Home'; const w = Dimensions.get('window').width; const h = Dimensions.get('window').height; @@ -46,9 +47,15 @@ export const Favorites = ({navigation}) => { }; }, []); return ( - +
- + ); }; diff --git a/apps/mobile/src/views/Folders/index.js b/apps/mobile/src/views/Folders/index.js index d082fc1a2..0184d3c43 100644 --- a/apps/mobile/src/views/Folders/index.js +++ b/apps/mobile/src/views/Folders/index.js @@ -35,7 +35,9 @@ import {NotebookItem} from '../../components/NotebookItem'; import {Search} from '../../components/SearchInput'; import {storage} from '../../../App'; import {Header} from '../../components/header'; - +import {AnimatedSafeAreaView} from '../Home'; +import * as Animatable from 'react-native-animatable'; +import {NavigationEvents} from 'react-navigation'; export const Folders = ({navigation}) => { const [colors, setColors] = useState(COLOR_SCHEME); const [addNotebook, setAddNotebook] = useState(false); @@ -82,11 +84,18 @@ export const Folders = ({navigation}) => { }, []); return ( - + { + marginSet = false; + }} + /> { @@ -100,7 +109,9 @@ export const Folders = ({navigation}) => { style={{ height: '100%', }}> - { placeholder="Search your notebook" hide={hideHeader} /> - + { - + ); }; diff --git a/apps/mobile/src/views/Home/index.js b/apps/mobile/src/views/Home/index.js index 055ef8347..51d3178a3 100755 --- a/apps/mobile/src/views/Home/index.js +++ b/apps/mobile/src/views/Home/index.js @@ -21,7 +21,6 @@ import { } from '../../common/common'; import {styles} from './styles'; import {Search} from '../../components/SearchInput'; -import {RecentList} from '../../components/Recents'; import {w, h} from '../../utils/utils'; import {Header} from '../../components/header'; import {NavigationEvents} from 'react-navigation'; @@ -29,7 +28,6 @@ import {NotesList} from '../../components/NotesList'; import {storage} from '../../../App'; import Icon from 'react-native-vector-icons/Feather'; import NavigationService from '../../services/NavigationService'; -import {ScrollView} from 'react-native-gesture-handler'; import {useForceUpdate} from '../ListsEditor'; import * as Animatable from 'react-native-animatable'; @@ -41,13 +39,14 @@ export const Home = ({navigation}) => { // State const [loading, setLoading] = useState(true); const [colors, setColors] = useState(COLOR_SCHEME); - const [hidden, setHidden] = useState(false); + const [search, setSearch] = useState(false); const [text, setText] = useState(''); - const [searchResults, setSearchResults] = useState([]); const [update, setUpdate] = useState(0); const [hideHeader, setHideHeader] = useState(false); const [margin, setMargin] = useState(150); const [buttonHide, setButtonHide] = useState(false); + const [notes, setNotes] = useState([]); + const [keyword, setKeyword] = useState(''); const forceUpdate = useForceUpdate(); // Variables @@ -57,6 +56,9 @@ export const Home = ({navigation}) => { let headerHeight = 0; let searchHeight = 0; let marginSet = false; + let searchResults = null; + let allNotes = []; + // Effects useEffect(() => { @@ -76,6 +78,10 @@ export const Home = ({navigation}) => { }; }, []); + useEffect(() => { + fetchNotes(); + }, []); + useEffect(() => { Keyboard.addListener('keyboardDidShow', () => { setButtonHide(true); @@ -104,29 +110,45 @@ export const Home = ({navigation}) => { }; const onSubmitEditing = async () => { if (!text || text.length < 1) { - setHidden(false); + setSearch(false); + if (allNotes) { + setNotes(allNotes); + } else { + fetchNotes(); + } } else { - setHidden(true); - let results = await storage.searchNotes(text); - if (results) { - setSearchResults(results); + setSearch(true); + setKeyword(text); + searchResults = await storage.searchNotes(text); + if (searchResults) { + setNotes(searchResults); } } }; const onBlur = () => { if (text && text.length < 2) { - setHidden(false); + setSearch(false); + if (allNotes) { + setNotes(allNotes); + } else { + fetchNotes(); + } } }; const onFocus = () => { - setHidden(false); + setSearch(false); }; const clearSearch = () => { - setSearchResults([]); - setHidden(false); + searchResults = null; + setSearch(false); + if (allNotes) { + setNotes(allNotes); + } else { + fetchNotes(); + } }; const setMarginTop = () => { @@ -144,6 +166,13 @@ export const Home = ({navigation}) => { } }; + const fetchNotes = async () => { + allNotes = await storage.getNotes(); + if (allNotes) { + setNotes(allNotes); + } + }; + // Render return Platform.isPad ? ( @@ -154,6 +183,9 @@ export const Home = ({navigation}) => { DeviceEventEmitter.emit('openSidebar'); setUpdate(update + 1); }} + onDidBlur={() => { + marginSet = false; + }} />
@@ -232,60 +264,30 @@ export const Home = ({navigation}) => { value={text} /> - {hidden ? ( - { - if (buttonHide) return; - if (y < 30) setHideHeader(false); - if (y > offsetY) { - if (y - offsetY < 150 || countDown > 0) return; - countDown = 1; - countUp = 0; - setHideHeader(true); - } else { - if (offsetY - y < 150 || countUp > 0) return; - countDown = 0; - countUp = 1; - setHideHeader(false); - } - offsetY = y; - }} - searchResults={searchResults} - keyword={text} - /> - ) : ( - { - if (buttonHide) return; - if (y < 30) { - setHideHeader(false); - countDown = 0; - countUp = 1; - } - if (y > offsetY) { - if (y - offsetY < 100 || countDown > 0) return; - countDown = 1; - countUp = 0; - setHideHeader(true); - offsetY = y; - console.log(y, offsetY, 'down'); - } else { - if (offsetY - y < 100 || countUp > 0) return; - countDown = 0; - countUp = 1; - setHideHeader(false); - offsetY = y; - console.log(y, offsetY, 'up'); - } - offsetY = y; - console.log(offsetY); - }} - margin={margin} - update={update} - /> - )} + { + if (buttonHide) return; + if (y < 30) setHideHeader(false); + if (y > offsetY) { + if (y - offsetY < 150 || countDown > 0) return; + countDown = 1; + countUp = 0; + setHideHeader(true); + } else { + if (offsetY - y < 150 || countUp > 0) return; + countDown = 0; + countUp = 1; + setHideHeader(false); + } + offsetY = y; + }} + isSearch={search} + notes={notes} + keyword={keyword} + /> + {buttonHide ? null : ( { diff --git a/apps/mobile/src/views/Notebook/index.js b/apps/mobile/src/views/Notebook/index.js index bf6b7d72f..fb11d4929 100644 --- a/apps/mobile/src/views/Notebook/index.js +++ b/apps/mobile/src/views/Notebook/index.js @@ -33,7 +33,9 @@ import {NotebookItem} from '../../components/NotebookItem'; import {Search} from '../../components/SearchInput'; import {useForceUpdate} from '../ListsEditor'; import {AddTopicDialog} from '../../components/AddTopicDialog'; - +import {AnimatedSafeAreaView} from '../Home'; +import * as Animatable from 'react-native-animatable'; +import {NavigationEvents} from 'react-navigation'; const w = Dimensions.get('window').width; const h = Dimensions.get('window').height; @@ -84,11 +86,18 @@ export const Notebook = ({navigation}) => { // Render return ( - + { + marginSet = false; + }} + /> { setAddTopic(false); }} /> - { placeholder={`Search in ${params.title}`} hide={hideHeader} /> - + { - + ); }; diff --git a/apps/mobile/src/views/Notes/index.js b/apps/mobile/src/views/Notes/index.js index 517fcb0f6..1d077e093 100644 --- a/apps/mobile/src/views/Notes/index.js +++ b/apps/mobile/src/views/Notes/index.js @@ -32,7 +32,7 @@ import {useForceUpdate} from '../ListsEditor'; import {NotesList} from '../../components/NotesList'; import {AnimatedSafeAreaView} from '../Home'; import {storage} from '../../../App'; - +import * as Animatable from 'react-native-animatable'; const w = Dimensions.get('window').width; const h = Dimensions.get('window').height; @@ -69,13 +69,18 @@ export const Notes = ({navigation}) => { }, []); useEffect(() => { - let notes = []; + let allNotes = []; params.notes.forEach(note => { let noteToAdd = storage.getNote(note); - notes[notes.length] = noteToAdd; + if (noteToAdd) { + allNotes[notes.length] = noteToAdd; + } }); - setNotes(notes); + + if (allNotes && allNotes.length > 0) { + setNotes(allNotes); + } }, []); const setMarginTop = () => { @@ -95,19 +100,21 @@ export const Notes = ({navigation}) => { return ( - @@ -133,7 +140,7 @@ export const Notes = ({navigation}) => { placeholder={`Search in ${params.title}`} hide={hideHeader} /> - + { } offsetY = y; }} + isSearch={false} notes={notes} + keyword={null} /> { }; }, []); return ( - { justifyContent: 'space-between', alignItems: 'center', marginBottom: 10, - backgroundColor: colors.bg, }}> { - + ); };