From bdd8eab87e68ae7ea19ec2d9b30e7f4a5d866ccc Mon Sep 17 00:00:00 2001
From: Laurent Cozic <laurent@cozic.net>
Date: Tue, 30 Jul 2019 11:36:56 +0200
Subject: [PATCH] Mobile: Make it clearer when there are no notebooks and added
 a button create one

---
 ReactNativeClient/lib/components/note-list.js | 31 +++++++++++++++++--
 1 file changed, 28 insertions(+), 3 deletions(-)

diff --git a/ReactNativeClient/lib/components/note-list.js b/ReactNativeClient/lib/components/note-list.js
index 87aafa7a6..880d9ce15 100644
--- a/ReactNativeClient/lib/components/note-list.js
+++ b/ReactNativeClient/lib/components/note-list.js
@@ -1,7 +1,7 @@
 const React = require('react');
 const Component = React.Component;
 const { connect } = require('react-redux');
-const { ListView, Text, StyleSheet } = require('react-native');
+const { ListView, Text, StyleSheet, Button, View } = require('react-native');
 const { _ } = require('lib/locale.js');
 const { NoteItem } = require('lib/components/note-item.js');
 const { time } = require('lib/time-utils.js');
@@ -22,6 +22,8 @@ class NoteListComponent extends Component {
 		};
 		this.rootRef_ = null;
 		this.styles_ = {};
+
+		this.createNotebookButton_click = this.createNotebookButton_click.bind(this);
 	}
 
 	styles() {
@@ -39,6 +41,10 @@ class NoteListComponent extends Component {
 				paddingBottom: theme.marginBottom,
 				fontSize: theme.fontSize,
 				color: theme.color,
+				textAlign: 'center',
+			},
+			noNotebookView: {
+
 			},
 		};
 
@@ -46,6 +52,14 @@ class NoteListComponent extends Component {
 		return this.styles_[themeId];
 	}
 
+	createNotebookButton_click() {
+		this.props.dispatch({
+			type: 'NAV_GO',
+			routeName: 'Folder',
+			folderId: null,
+		});
+	}
+
 	filterNotes(notes) {
 		const todoFilter = 'all'; //Setting.value('todoFilter');
 		if (todoFilter == 'all') return notes;
@@ -98,8 +112,18 @@ class NoteListComponent extends Component {
 				/>
 			);
 		} else {
-			const noItemMessage = _('There are currently no notes. Create one by clicking on the (+) button.');
-			return <Text style={this.styles().noItemMessage}>{noItemMessage}</Text>;
+			if (!this.props.folders.length) {
+				const noItemMessage = _('You currently have no notebooks.');
+				return (
+					<View style={this.styles().noNotebookView}>
+						<Text style={this.styles().noItemMessage}>{noItemMessage}</Text>
+						<Button title={_('Create a notebook')} onPress={this.createNotebookButton_click} />
+					</View>
+				);
+			} else {
+				const noItemMessage = _('There are currently no notes. Create one by clicking on the (+) button.');
+				return <Text style={this.styles().noItemMessage}>{noItemMessage}</Text>;
+			}			
 		}
 	}
 }
@@ -107,6 +131,7 @@ class NoteListComponent extends Component {
 const NoteList = connect(state => {
 	return {
 		items: state.notes,
+		folders: state.folders,
 		notesSource: state.notesSource,
 		theme: state.settings.theme,
 		noteSelectionEnabled: state.noteSelectionEnabled,