Login/Logout and save user info

ReactNativeClient/src/components/screen-header.js

@@ -4,6 +4,7 @@ import { View, Text, Button, StyleSheet } from 'react-native';
 import { Log } from 'src/log.js';
 import { Menu, MenuOptions, MenuOption, MenuTrigger } from 'react-native-popup-menu';
 import { _ } from 'src/locale.js';
+import { Setting } from 'src/models/setting.js';
 
 const styles = StyleSheet.create({
 	divider: {
@@ -37,21 +38,54 @@ class ScreenHeaderComponent extends Component {
 		}
 	}
 
+	menu_login = () => {
+		this.props.dispatch({
+			type: 'Navigation/NAVIGATE',
+			routeName: 'Login',
+		});
+	}
+
+	menu_logout = () => {
+		let user = { email: null, session: null };
+		Setting.setObject('user', user);
+		this.props.dispatch({
+			type: 'USER_SET',
+			user: user,
+		});
+	}
+
 	render() {
+		let key = 0;
 		let menuOptionComponents = [];
 		for (let i = 0; i < this.props.menuOptions.length; i++) {
 			let o = this.props.menuOptions[i];
-			let key = 'menuOption_' + i;
 			menuOptionComponents.push(
-				<MenuOption value={o.onPress} key={key}>
+				<MenuOption value={o.onPress} key={'menuOption_' + key++}>
 					<Text>{o.title}</Text>
-				</MenuOption>
-			);
-			if (i == this.props.menuOptions.length - 1) {
-				menuOptionComponents.push(<View key={'menuDivider_' + i} style={styles.divider}/>);
-			}
+				</MenuOption>);
 		}
 
+		if (menuOptionComponents.length) {
+			menuOptionComponents.push(<View key={'menuOption_' + key++} style={styles.divider}/>);
+		}
+
+		if (this.props.user && this.props.user.session) {
+			menuOptionComponents.push(
+				<MenuOption value={this.menu_logout} key={'menuOption_' + key++}>
+					<Text>{_('Logout')}</Text>
+				</MenuOption>);
+		} else {
+			menuOptionComponents.push(
+				<MenuOption value={this.menu_login} key={'menuOption_' + key++}>
+					<Text>{_('Login')}</Text>
+				</MenuOption>);
+		}
+
+		menuOptionComponents.push(
+			<MenuOption value={1} key={'menuOption_' + key++}>
+				<Text>{_('Configuration')}</Text>
+			</MenuOption>);
+
 		let title = 'title' in this.props && this.props.title !== null ? this.props.title : _(this.props.navState.routeName);
 
 		return (
@@ -64,9 +98,6 @@ class ScreenHeaderComponent extends Component {
 					</MenuTrigger>
 					<MenuOptions>
 						{ menuOptionComponents }
-						<MenuOption value={1}>
-							<Text>{_('Configuration')}</Text>
-						</MenuOption>
 					</MenuOptions>
 				</Menu>
 			</View>
@@ -77,7 +108,7 @@ class ScreenHeaderComponent extends Component {
 
 const ScreenHeader = connect(
 	(state) => {
-		return {};
+		return { user: state.user };
 	}
 )(ScreenHeaderComponent)
 

ReactNativeClient/src/components/screens/login.js

@@ -22,6 +22,10 @@ class LoginScreenComponent extends React.Component {
 		};
 	}
 
+	componentWillMount() {
+		this.setState({ email: this.props.user.email });
+	}
+
 	email_changeText = (text) => {
 		this.setState({ email: text });
 	}
@@ -38,8 +42,22 @@ class LoginScreenComponent extends React.Component {
 			'password': this.state.password,
 			'client_id': Setting.value('clientId'),
 		}).then((session) => {
-			Log.info('GOT DATA:');
-			Log.info(session);
+			Log.info('Got session', session);
+
+			let user = {
+				email: this.state.email,
+				session: session.id,
+			};
+			Setting.setObject('user', user);
+
+			this.props.dispatch({
+				type: 'USER_SET',
+				user: user,
+			});
+
+			this.props.dispatch({
+				type: 'Navigation/BACK',
+			});
 		}).catch((error) => {
 			this.setState({ errorMessage: _('Could not login: %s)', error.message) });
 		});
@@ -61,7 +79,9 @@ class LoginScreenComponent extends React.Component {
 
 const LoginScreen = connect(
 	(state) => {
-		return {};
+		return {
+			user: state.user,
+		};
 	}
 )(LoginScreenComponent)
 

ReactNativeClient/src/models/setting.js

@@ -4,25 +4,35 @@ import { Database } from 'src/database.js';
 
 class Setting extends BaseModel {
 
+	static defaults_ = {
+		'clientId': { value: '', type: 'string' },
+		'sessionId': { value: '', type: 'string' },
+		'lastUpdateTime': { value: '', type: 'int' },
+		'user.email': { value: '', type: 'string' },
+		'user.session': { value: '', type: 'string' },
+	};
+
 	static tableName() {
 		return 'settings';
 	}
 
 	static defaultSetting(key) {
-		if (!this.defaults_) {
-			this.defaults_ = {
-				'clientId': { value: '', type: 'string' },
-				'sessionId': { value: '', type: 'string' },
-				'lastUpdateTime': { value: '', type: 'int' },
-			}
-		}		
 		if (!(key in this.defaults_)) throw new Error('Unknown key: ' + key);
-
 		let output = Object.assign({}, this.defaults_[key]);
 		output.key = key;
 		return output;
 	}
 
+	static keys() {
+		if (this.keys_) return this.keys_;
+		this.keys_ = [];
+		for (let n in this.defaults_) {
+			if (!this.defaults_.hasOwnProperty(n)) continue;
+			this.keys_.push(n);
+		}
+		return this.keys_;
+	}
+
 	static load() {
 		this.cache_ = [];
 		return this.db().selectAll('SELECT * FROM settings').then((r) => {
@@ -33,7 +43,12 @@ class Setting extends BaseModel {
 	}
 
 	static setValue(key, value) {
+		// if (value !== null && typeof value === 'object') {
+		// 	return this.setObject(key, value);
+		// }
+
 		this.scheduleUpdate();
+
 		for (let i = 0; i < this.cache_.length; i++) {
 			if (this.cache_[i].key == key) {
 				this.cache_[i].value = value;
@@ -46,6 +61,17 @@ class Setting extends BaseModel {
 		this.cache_.push(s);
 	}
 
+	// static del(key) {
+	// 	this.scheduleUpdate();
+
+	// 	for (let i = 0; i < this.cache_.length; i++) {
+	// 		if (this.cache_[i].key == key) {
+	// 			this.cache_[i].value = value;
+	// 			return;
+	// 		}
+	// 	}
+	// }
+
 	static value(key) {
 		for (let i = 0; i < this.cache_.length; i++) {
 			if (this.cache_[i].key == key) {
@@ -57,6 +83,27 @@ class Setting extends BaseModel {
 		return s.value;
 	}
 
+	// Currently only supports objects with properties one level deep
+	static object(key) {
+		let output = {};
+		let keys = this.keys();
+		for (let i = 0; i < keys.length; i++) {
+			let k = keys[i].split('.');
+			if (k[0] == key) {
+				output[k[1]] = this.value(keys[i]);
+			}
+		}
+		return output;
+	}
+
+	// Currently only supports objects with properties one level deep
+	static setObject(key, object) {
+		for (let n in object) {
+			if (!object.hasOwnProperty(n)) continue;
+			this.setValue(key + '.' + n, object[n]);
+		}
+	}
+
 	static scheduleUpdate() {
 		if (this.updateTimeoutId) clearTimeout(this.updateTimeoutId);
 

ReactNativeClient/src/root.js

@@ -26,6 +26,7 @@ let defaultState = {
 	selectedNoteId: null,
 	selectedFolderId: null,
 	listMode: 'view',
+	user: { email: 'laurent@cozic.net', session: null },
 };
 
 const reducer = (state = defaultState, action) => {
@@ -128,6 +129,12 @@ const reducer = (state = defaultState, action) => {
 			newState.folders = newFolders;
 			break;
 
+		case 'USER_SET':
+
+			newState = Object.assign({}, state);
+			newState.user = action.user;
+			break;
+
 		case 'SET_LIST_MODE':
 
 			newState = Object.assign({}, state);
@@ -163,7 +170,15 @@ class AppComponent extends React.Component {
 			Log.info('Loading settings...');
 			return Setting.load();
 		}).then(() => {
+			let user = Setting.object('user');
 			Log.info('Client ID', Setting.value('clientId'));
+			Log.info('User', user);
+
+			this.props.dispatch({
+				type: 'USER_SET',
+				user: user,
+			});
+
 			Log.info('Loading folders...');
 
 			Folder.all().then((folders) => {