Improved navigation

ReactNativeClient/lib/components/screens/note.js

@@ -3,6 +3,7 @@ import { View, Button, TextInput, WebView, Text } from 'react-native';
 import { connect } from 'react-redux'
 import { Log } from 'lib/log.js'
 import { Note } from 'lib/models/note.js'
+import { Folder } from 'lib/models/folder.js'
 import { ScreenHeader } from 'lib/components/screen-header.js';
 import { Checkbox } from 'lib/components/checkbox.js'
 import { _ } from 'lib/locale.js';
@@ -21,6 +22,7 @@ class NoteScreenComponent extends React.Component {
 			mode: 'view',
 			noteMetadata: '',
 			showNoteMetadata: false,
+			folder: null,
 		}
 	}
 
@@ -35,6 +37,23 @@ class NoteScreenComponent extends React.Component {
 				this.refreshNoteMetadata();
 			});
 		}
+
+		this.refreshFolder();
+	}
+
+	async currentFolder() {
+		let folderId = this.props.folderId;
+		if (!folderId) {
+			if (this.state.note && this.state.note.parent_id) folderId = this.state.note.parent_id;
+		}
+
+		if (!folderId) return Folder.defaultFolder();
+
+		return Folder.load(folderId);
+	}
+
+	async refreshFolder() {
+		this.setState({ folder: await this.currentFolder() });
 	}
 
 	noteComponent_change(propName, propValue) {
@@ -61,8 +80,19 @@ class NoteScreenComponent extends React.Component {
 	}
 
 	async saveNoteButton_press() {
-		let isNew = !this.state.note.id;
-		let note = await Note.save(this.state.note);
+		let note = Object.assign({}, this.state.note);
+
+		if (!this.state.note.parent_id) {
+			let folder = await Folder.defaultFolder();
+			if (!folder) {
+				Log.warn('Cannot save note without a notebook');
+				return;
+			}
+			note.parent_id = folder.id;
+		}
+
+		let isNew = !note.id;
+		note = await Note.save(note);
 		this.setState({ note: note });
 		if (isNew) Note.updateGeolocation(note.id);
 		this.refreshNoteMetadata();
@@ -92,6 +122,7 @@ class NoteScreenComponent extends React.Component {
 	render() {
 		const note = this.state.note;
 		const isTodo = !!Number(note.is_todo);
+		const folder = this.state.folder;
 		let todoComponents = null;
 
 		if (note.is_todo) {
@@ -118,11 +149,17 @@ class NoteScreenComponent extends React.Component {
 			bodyComponent = <TextInput style={{flex: 1, textAlignVertical: 'top', fontFamily: 'monospace'}} multiline={true} value={note.body} onChangeText={(text) => this.body_changeText(text)} />
 		}
 
-		console.info(this.state.noteMetadata);
+		let title = null;
+		let noteHeaderTitle = note && note.title ? note.title : _('New note');
+		if (folder) {
+			title = folder.title + ' > ' + noteHeaderTitle;
+		} else {
+			title = noteHeaderTitle;
+		}
 
 		return (
 			<View style={{flex: 1}}>
-				<ScreenHeader navState={this.props.navigation.state} menuOptions={this.menuOptions()} />
+				<ScreenHeader navState={this.props.navigation.state} menuOptions={this.menuOptions()} title={title} />
 				<View style={{ flexDirection: 'row' }}>
 					{ isTodo && <Checkbox checked={!!Number(note.todo_completed)} /> }<TextInput style={{flex:1}} value={note.title} onChangeText={(text) => this.title_changeText(text)} />
 				</View>

ReactNativeClient/lib/components/screens/welcome.js

@@ -4,6 +4,7 @@ import { connect } from 'react-redux'
 import { Log } from 'lib/log.js'
 import { ScreenHeader } from 'lib/components/screen-header.js';
 import { ActionButton } from 'lib/components/action-button.js';
+import { _ } from 'lib/locale.js';
 
 class WelcomeScreenComponent extends React.Component {
 	
@@ -19,10 +20,12 @@ class WelcomeScreenComponent extends React.Component {
 				</View>
 			);
 		} else {
+			let message = this.props.folders.length ? _('Click on the (+) button to create a new note or notebook. Click on the side menu to access your existing notebooks.') : _('You currently have no notebook. Create one by clicking on (+) button.');
+
 			return (
 				<View style={{flex: 1}}>
 					<ScreenHeader navState={this.props.navigation.state} />
-					<Text>You currently have no notebook. Create one by clicking on (+) button.</Text>
+					<Text>{message}</Text>
 					<ActionButton></ActionButton>
 				</View>
 			);			
@@ -35,6 +38,7 @@ const WelcomeScreen = connect(
 	(state) => {
 		return {
 			loading: state.loading,
+			folders: state.folders,
 		};
 	}
 )(WelcomeScreenComponent)

ReactNativeClient/root.js

@@ -46,7 +46,14 @@ let defaultState = {
 	historyCanGoBack: false,
 };
 
+const initialRoute = {
+	type: 'Navigation/NAVIGATE',
+	routeName: 'Welcome',
+	params: {}
+};
+
 let navHistory = [];
+navHistory.push(initialRoute);
 
 const reducer = (state = defaultState, action) => {
 	reg.logger().info('Reducer action', action.type);
@@ -105,6 +112,8 @@ const reducer = (state = defaultState, action) => {
 
 			newState.historyCanGoBack = navHistory.length >= 2;
 
+			console.info(navHistory);
+
 			Keyboard.dismiss(); // TODO: should probably be in some middleware
 			break;
 
@@ -341,11 +350,7 @@ class AppComponent extends React.Component {
 	}
 }
 
-defaultState.nav = AppNavigator.router.getStateForAction({
-	type: 'Navigation/NAVIGATE',
-	routeName: 'Welcome',
-	params: {}
-});
+defaultState.nav = AppNavigator.router.getStateForAction(initialRoute);
 
 const mapStateToProps = (state) => {
 	return {