Merge branch '9-store-state' into 'master'

Added state storage, implemented basic logout functionality

Closes #9

See merge request !8

app/actions/actionTypes.js

 export const NAVIGATE = 'NAVIGATE';
 export const BACK = 'BACK';
+export const LOGININIT = 'LOGININIT';
 export const LOGINPROGRESS = 'LOGINPROGRESS';
 export const LOGINSUCCESS = 'LOGINSUCCESS';
 export const LOGINFAILURE = 'LOGINFAILURE';
+export const LOGOUT = 'LOGOUT';
 export const OPENDRAWER = 'OPENDRAWER';

app/actions/login.js

+import { AsyncStorage } from 'react-native';
 import * as types from './actionTypes';
 
+const USERNAMEKEY = '@MyStore:username';
+const TOKENKEY = '@MyStore:token';
+
 export function loginSuccess(username, token) {
   return {
     type: types.LOGINSUCCESS,
@@ -43,10 +47,28 @@ export function login(username, password) {
       .then(
         (responseJson) => {
           if (responseJson.token) {
-            return dispatch(loginSuccess(username, responseJson.token));
+            return AsyncStorage.multiSet([[USERNAMEKEY, username], [TOKENKEY, responseJson.token]])
+              .then(
+                () => dispatch(loginSuccess(username, responseJson.token)),
+              );
           }
           return dispatch(loginFailure());
         })
       .catch(() => dispatch(loginFailure()));
   };
 }
+
+export function initLogin(username, token) {
+  return {
+    type: types.LOGININIT,
+    username,
+    token,
+  };
+}
+
+export function logout() {
+  AsyncStorage.multiRemove([USERNAMEKEY, TOKENKEY]);
+  return {
+    type: types.LOGOUT,
+  };
+}

app/app.js

-import React from 'react';
-import { BackAndroid } from 'react-native';
+import React, { Component } from 'react';
+import { AsyncStorage } from 'react-native';
 import { createStore, applyMiddleware, combineReducers } from 'redux';
 import { Provider } from 'react-redux';
 import thunk from 'redux-thunk';
 
 import * as reducers from './reducers';
 import ReduxNavigator from './components/navigator';
-import { back } from './actions/navigation';
+import { initLogin } from './actions/login';
 
 const createStoreWithMiddleware = applyMiddleware(thunk)(createStore);
 const reducer = combineReducers(reducers);
 const store = createStoreWithMiddleware(reducer);
 
-BackAndroid.addEventListener('hardwareBackPress', () => {
-  if (store.getState().navigation.previousScenes.length === 0) {
-    return false;
+const USERNAMEKEY = '@MyStore:username';
+const TOKENKEY = '@MyStore:token';
+const pairsToObject = (obj, pair) => {
+  const obj2 = { ...obj };
+  obj2[pair[0]] = pair[1];
+  return obj2;
+};
+
+class Main extends Component {
+  componentDidMount() {
+    AsyncStorage.multiGet([USERNAMEKEY, TOKENKEY])
+      .then(
+        (result) => {
+          const values = result.reduce(pairsToObject, {});
+          const username = values[USERNAMEKEY];
+          const token = values[TOKENKEY];
+
+          if (username !== null && token !== null) {
+            store.dispatch(initLogin(username, token));
+          }
+        });
   }
-  store.dispatch(back());
-  return true;
-});
 
-const Main = () =>
-  <Provider store={store}>
-    <ReduxNavigator />
-  </Provider>
-;
+  render() {
+    return (
+      <Provider store={store}>
+        <ReduxNavigator />
+      </Provider>
+    );
+  }
+}
 
 export default Main;

app/components/Login.js

@@ -10,6 +10,8 @@ const loginResult = (status) => {
       return 'Logging in';
     case 'failure':
       return 'Login failed';
+    case 'logout':
+      return 'Logout successful';
     default:
       return '';
   }

app/components/Welcome.js

 import React from 'react';
-import { View, Text } from 'react-native';
+import { View, Text, Button } from 'react-native';
+import { connect } from 'react-redux';
+import { logout } from '../actions/login';
 
-const Welcome = () =>
+const Welcome = props =>
   <View>
     <Text>Welcome!</Text>
-  </View>
-;
+    <Button title="Uitloggen" onPress={() => props.logout()} />
+  </View>;
 
-export default Welcome;
+Welcome.propTypes = {
+  logout: React.PropTypes.func.isRequired,
+};
+
+const mapDispatchToProps = dispatch => ({
+  logout: () => dispatch(logout()),
+});
+
+export default connect(() => ({}), mapDispatchToProps)(Welcome);

app/reducers/login.js

@@ -14,7 +14,9 @@ export default function login(state = initialState, action = {}) {
       return { ...state, loginState: 'failure' };
     case types.LOGINPROGRESS:
       return { ...state, loginState: 'progress' };
+    case types.LOGOUT:
+      return { ...state, loginState: 'logout' };
     default:
-      return { ...state };
+      return state;
   }
 }

app/reducers/navigation.js

@@ -52,6 +52,15 @@ export default function navigate(state = initialState, action = {}) {
         drawerOpen: action.drawerOpen,
       };
     }
+    case types.LOGININIT: {
+      return {
+        ...state,
+        loggedIn: true,
+      };
+    }
+    case types.LOGOUT: {
+      return initialState;
+    }
     default:
       return state;
   }