2017-07-14 20:49:14 +02:00
|
|
|
import React, { Component } from 'react';
|
|
|
|
import { connect } from 'react-redux'
|
2017-07-31 22:03:12 +02:00
|
|
|
import { NotesScreen } from 'lib/components/screens/notes.js';
|
2017-08-01 21:08:38 +02:00
|
|
|
import { SearchScreen } from 'lib/components/screens/search.js';
|
2017-07-14 20:49:14 +02:00
|
|
|
import { View } from 'react-native';
|
|
|
|
import { _ } from 'lib/locale.js';
|
2017-10-30 20:27:51 +02:00
|
|
|
import { themeStyle } from 'lib/components/global-style.js';
|
2017-07-14 20:49:14 +02:00
|
|
|
|
|
|
|
class AppNavComponent extends Component {
|
|
|
|
|
2017-08-01 21:08:38 +02:00
|
|
|
constructor() {
|
|
|
|
super();
|
|
|
|
this.previousRouteName_ = null;
|
|
|
|
}
|
2017-08-01 19:59:01 +02:00
|
|
|
|
2017-08-01 21:08:38 +02:00
|
|
|
render() {
|
2017-07-14 20:49:14 +02:00
|
|
|
if (!this.props.route) throw new Error('Route must not be null');
|
|
|
|
|
2017-08-01 21:08:38 +02:00
|
|
|
// Note: certain screens are kept into memory, in particular Notes and Search
|
|
|
|
// so that the scroll position is not lost when the user navigate away from them.
|
|
|
|
|
2017-07-14 20:49:14 +02:00
|
|
|
let route = this.props.route;
|
2017-07-31 22:03:12 +02:00
|
|
|
let Screen = null;
|
|
|
|
let notesScreenVisible = false;
|
2017-08-01 21:08:38 +02:00
|
|
|
let searchScreenVisible = false;
|
2017-07-31 22:03:12 +02:00
|
|
|
|
|
|
|
if (route.routeName == 'Notes') {
|
|
|
|
notesScreenVisible = true;
|
2017-08-01 21:08:38 +02:00
|
|
|
} else if (route.routeName == 'Search') {
|
|
|
|
searchScreenVisible = true;
|
2017-07-31 22:03:12 +02:00
|
|
|
} else {
|
|
|
|
Screen = this.props.screens[route.routeName].screen;
|
|
|
|
}
|
2017-07-14 20:49:14 +02:00
|
|
|
|
2017-08-01 21:08:38 +02:00
|
|
|
// Keep the search screen loaded if the user is viewing a note from that search screen
|
|
|
|
// so that if the back button is pressed, the screen is still loaded. However, unload
|
|
|
|
// it if navigating away.
|
|
|
|
let searchScreenLoaded = searchScreenVisible || (this.previousRouteName_ == 'Search' && route.routeName == 'Note');
|
|
|
|
|
|
|
|
this.previousRouteName_ = route.routeName;
|
|
|
|
|
2017-10-30 20:27:51 +02:00
|
|
|
const theme = themeStyle(this.props.theme);
|
|
|
|
|
|
|
|
const style = { flex: 1, backgroundColor: theme.backgroundColor }
|
|
|
|
|
2017-07-14 20:49:14 +02:00
|
|
|
return (
|
2017-10-30 20:27:51 +02:00
|
|
|
<View style={style}>
|
2017-07-31 22:03:12 +02:00
|
|
|
<NotesScreen visible={notesScreenVisible} navigation={{ state: route }} />
|
2017-08-01 21:08:38 +02:00
|
|
|
{ searchScreenLoaded && <SearchScreen visible={searchScreenVisible} navigation={{ state: route }} /> }
|
|
|
|
{ (!notesScreenVisible && !searchScreenVisible) && <Screen navigation={{ state: route }} /> }
|
2017-07-14 20:49:14 +02:00
|
|
|
</View>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
const AppNav = connect(
|
|
|
|
(state) => {
|
|
|
|
return {
|
|
|
|
route: state.route,
|
2017-10-30 20:27:51 +02:00
|
|
|
theme: state.settings.theme,
|
2017-07-14 20:49:14 +02:00
|
|
|
};
|
|
|
|
}
|
|
|
|
)(AppNavComponent)
|
|
|
|
|
|
|
|
export { AppNav };
|