Added support for navigation

ReactNativeClient/index.android.js

@@ -2,12 +2,12 @@ import React, { Component } from 'react';
 import { AppRegistry, View, Button, TextInput } from 'react-native';
 
 import { connect } from 'react-redux'
-import { createStore } from 'redux';
 import { Provider } from 'react-redux'
+import { createStore } from 'redux';
+import { combineReducers } from 'redux';
 
 import { WebApi } from 'src/web-api.js'
 import { Database } from 'src/database.js'
-//import { Session } from 'src/model/session.js';
 
 import { SessionService } from 'src/services/session-service.js';
 
@@ -16,88 +16,88 @@ import { Log } from 'src/log.js'
 import { LoginButton } from 'src/components/login-button.js';
 
 
-let debugMode = true;
-let clientId = 'A7D301DA7D301DA7D301DA7D301DA7D3';
+// let debugMode = true;
+// let clientId = 'A7D301DA7D301DA7D301DA7D301DA7D3';
 
-let db = new Database();
-db.setDebugEnabled(debugMode);
-db.open();
+// let db = new Database();
+// db.setDebugEnabled(debugMode);
+// db.open();
 
 
 
-let defaultState = {
-	'myButtonLabel': 'click',
-	'counter': 0,
-}
+// let defaultState = {
+// 	'myButtonLabel': 'click',
+// 	'counter': 0,
+// }
 
-function shallowcopy(a) {
-	return Object.assign({}, a);
-}
+// function shallowcopy(a) {
+// 	return Object.assign({}, a);
+// }
 
-let store = createStore(reducer, defaultState);
+// let store = createStore(reducer, defaultState);
 
-function reducer(state, action) {
-	switch (action.type) {
+// function reducer(state, action) {
+// 	switch (action.type) {
 
-		case 'SET_BUTTON_NAME':
+// 		case 'SET_BUTTON_NAME':
 
-			var state = shallowcopy(state);
-			state.myButtonLabel = action.name;
-			return state;
+// 			var state = shallowcopy(state);
+// 			state.myButtonLabel = action.name;
+// 			return state;
 
-		case 'INC_COUNTER':
+// 		case 'INC_COUNTER':
 
-			var state = shallowcopy(state);
-			state.counter++;
-			return state;
+// 			var state = shallowcopy(state);
+// 			state.counter++;
+// 			return state;
 
-	}
+// 	}
 
-	return state;
-}
+// 	return state;
+// }
 
-class MyInput extends Component {
+// class MyInput extends Component {
 
-	render() {
-		return <TextInput onChangeText={this.props.onChangeText} />
-	}
+// 	render() {
+// 		return <TextInput onChangeText={this.props.onChangeText} />
+// 	}
 
-}
+// }
 
-const mapStateToInputProps = function(state) {
-	return {}
-}
+// const mapStateToInputProps = function(state) {
+// 	return {}
+// }
 
-const mapDispatchToInputProps = function(dispatch) {
-	return {
-		onChangeText(text) {
-			dispatch({
-				type: 'SET_BUTTON_NAME',
-				name: text
-			});
-		}
-	}
-}
+// const mapDispatchToInputProps = function(dispatch) {
+// 	return {
+// 		onChangeText(text) {
+// 			dispatch({
+// 				type: 'SET_BUTTON_NAME',
+// 				name: text
+// 			});
+// 		}
+// 	}
+// }
 
-const MyConnectionInput = connect(
-	mapStateToInputProps,
-	mapDispatchToInputProps
-)(MyInput)
+// const MyConnectionInput = connect(
+// 	mapStateToInputProps,
+// 	mapDispatchToInputProps
+// )(MyInput)
 
-class App extends Component {
+// class App extends Component {
 
-	render() {
-		return (
-			<Provider store={store}>
-				<View>
-					<MyConnectionInput />
-					<LoginButton />
-				</View>
-			</Provider>
-		)
-	}
+// 	render() {
+// 		return (
+// 			<Provider store={store}>
+// 				<View>
+// 					<MyConnectionInput />
+// 					<LoginButton />
+// 				</View>
+// 			</Provider>
+// 		)
+// 	}
 
-}
+// }
 
 // let api = new WebApi('http://192.168.1.2');
 // let sessionService = new SessionService(api);
@@ -109,4 +109,96 @@ class App extends Component {
 // 	console.warn(error);
 // })
 
-AppRegistry.registerComponent('AwesomeProject', () => App);
+// AppRegistry.registerComponent('AwesomeProject', () => App);
+
+
+
+
+
+
+
+import { StackNavigator } from 'react-navigation';
+import { addNavigationHelpers } from 'react-navigation';
+
+class MainScreen extends React.Component {
+  static navigationOptions = {
+    title: 'Welcome',
+  };
+  render() {
+    const { navigate } = this.props.navigation;
+    return (
+      <Button
+        title="Go to Jane's profile"
+        onPress={() =>
+          navigate('Profile', { name: 'Jane' })
+        }
+      />
+    );
+  }
+}
+
+
+class ProfileScreen extends React.Component {
+  static navigationOptions = {
+    title: 'Profile',
+  };
+  render() {
+    const { navigate } = this.props.navigation;
+    return (
+      <Button
+        title="Go to main"
+        onPress={() =>
+          navigate('Main')
+        }
+      />
+    );
+  }
+}
+
+const AppNavigator = StackNavigator({
+	Main: {screen: MainScreen},
+	Profile: {screen: ProfileScreen},
+});
+
+class AppComponent extends React.Component {
+  render() {
+    return (
+      <AppNavigator navigation={addNavigationHelpers({
+        dispatch: this.props.dispatch,
+        state: this.props.nav,
+      })} />
+    );
+  }
+}
+
+const navInitialState = AppNavigator.router.getStateForAction(AppNavigator.router.getActionForPathAndParams('Main'));
+
+const navReducer = (state = navInitialState, action) => {
+	const nextState = AppNavigator.router.getStateForAction(action, state);
+	return nextState || state;
+};
+
+const appReducer = combineReducers({
+	nav: navReducer,
+});
+
+const mapStateToProps = (state) => ({
+  nav: state.nav
+});
+
+const App = connect(mapStateToProps)(AppComponent);
+
+const store = createStore(appReducer);
+
+class Root extends React.Component {
+  render() {
+    return (
+      <Provider store={store}>
+        <App />
+      </Provider>
+    );
+  }
+}
+
+//AppRegistry.registerComponent('AwesomeProject', () => AppNavigator);
+AppRegistry.registerComponent('AwesomeProject', () => Root);

ReactNativeClient/package.json

@@ -8,7 +8,8 @@
   },
   "dependencies": {
     "react": "16.0.0-alpha.6",
-		"react-native": "0.44.0"
+    "react-native": "0.44.0",
+    "react-navigation": "^1.0.0-beta.9"
   },
   "devDependencies": {
     "babel-jest": "19.0.0",
@@ -18,7 +19,7 @@
     "redux": "3.6.0",
     "react-redux": "4.4.8",
     "query-string": "4.3.4",
-		"react-native-sqlite-storage": "3.3.*",
+    "react-native-sqlite-storage": "3.3.*"
   },
   "jest": {
     "preset": "react-native"

ReactNativeClient/src/components/login-button.js

@@ -6,14 +6,15 @@ import { _ } from 'src/locale.js';
 class LoginButtonComponent extends Component {
 
 	render() {
-		return <Button onPress={this.props.onPress} title={_(this.props.label)} />
+		return <Button onPress={this.props.onPress} title={_("Login")} />
 	}
 
 }
 
 const LoginButton = connect(
 	(state) => {
-		return { label: state.myButtonLabel };
+		return {};
+		//return { label: state.myButtonLabel };
 	},
 	(dispatch) => {
 		return {

ReactNativeClient/src/components/offline-button.js

@@ -0,0 +1,29 @@
+import React, { Component } from 'react';
+import { connect } from 'react-redux'
+import { Button } from 'react-native';
+import { _ } from 'src/locale.js';
+
+class OfflineButtonComponent extends Component {
+
+	render() {
+		return <Button onPress={this.props.onPress} title={_(this.props.label)} />
+	}
+
+}
+
+const OfflineButton = connect(
+	(state) => {
+		//return { label: state.myButtonLabel };
+	},
+	(dispatch) => {
+		return {
+			onPress: function() {
+				dispatch({
+					type: 'WORK_OFFLINE'
+				});
+			}
+		}
+	}
+)(OfflineButtonComponent)
+
+export { OfflineButton };