Basic Login navigation improvement

app/components/Sidebar.js

@@ -10,8 +10,9 @@ const Sidebar = props =>
     style={styles.sidebar}
   >
     <Text style={styles.header}>MENU</Text>
-    <Text onPress={() => props.navigate('login')} style={styles.button} >Log in</Text>
     <Text onPress={() => props.navigate('welcome')} style={styles.button} >Welcome</Text>
+    <Text onPress={() => props.navigate('events')} style={styles.button} >Events</Text>
+    <Text onPress={() => props.navigate('authenticate')} style={styles.button} >Authenticate</Text>
   </View>
 ;
 

app/components/navigator.js

@@ -6,44 +6,50 @@ import Login from './Login';
 import Welcome from './Welcome';
 import Sidebar from './Sidebar';
 
-// const mapStateToProps = state => state.currentScene;
-
-const mapStateToProps = state => (
-  { currentScene: state.navigation.currentScene }
-);
+const mapStateToProps = state => ({
+  currentScene: state.navigation.currentScene,
+  loggedIn: state.navigation.token != '',
+});
 
 const mapDispatchToProps = dispatch => ({
   navigate: scene => dispatch(actions.navigate(scene)),
 });
 
-const sceneToComponent = (scene) => {
+const sceneToComponent = scene => {
   switch (scene) {
-    case 'login':
-      return <Login />;
     case 'welcome':
       return <Welcome />;
+    // case 'events':
+    //   return <Events />;
+    // case 'authenticate':
+    //   return <Authenticeren />
     default:
-      return <Login />;
+      return <Welcome />;
   }
 };
 
-const ReduxNavigator = props => (
-  <Drawer
-    type="displace"
-    content={<Sidebar />}
-    openDrawerOffset={0.4}
-    panOpenMask={0.2}
-    panCloseMask={0.2}
-    panThreshold={0.3}
-    tweenHandler={ratio => ({ main: { opacity: (2 - ratio) / 2 } })}
-    tapToClose
-  >
-    {sceneToComponent(props.currentScene)}
-  </Drawer>
-  );
+const ReduxNavigator = props => {
+  if (props.loggedIn) {
+    return <Drawer
+      type="displace"
+      content={<Sidebar />}
+      openDrawerOffset={0.4}
+      panOpenMask={0.2}
+      panCloseMask={0.2}
+      panThreshold={0.3}
+      tweenHandler={ratio => ({ main: { opacity: (2 - ratio) / 2 } })}
+      tapToClose
+    >
+      {sceneToComponent(props.currentScene)}
+    </Drawer>;
+  } else {
+    return <Login />;
+  }
+};
 
 ReduxNavigator.propTypes = {
   currentScene: React.PropTypes.string.isRequired,
+  loggedIn: React.PropTypes.bool.isRequired,
 };
 
 export default connect(mapStateToProps, mapDispatchToProps)(ReduxNavigator);

app/reducers/navigation.js

@@ -3,11 +3,12 @@ import * as types from '../actions/actionTypes';
 const initialState = {
   previousScenes: [],
   currentScene: 'login',
+  loggedIn: false,
 };
 
 
 export default function navigate(state = initialState, action = {}) {
-  const { currentScene, previousScenes } = state;
+  const { currentScene, previousScenes, loggedIn } = state;
   switch (action.type) {
     case types.LOGIN:
       if (action.success) {
@@ -17,23 +18,29 @@ export default function navigate(state = initialState, action = {}) {
             currentScene,
           ],
           currentScene: 'welcome',
+          loggedIn,
         };
       }
-      return { ...state };
+      return state;
     case types.BACK: {
       const scene = previousScenes.pop();
       return {
         previousScenes,
         currentScene: scene,
+        loggedIn,
       };
     }
     case types.NAVIGATE: {
       return {
-        previousScenes: [],
+        previousScenes: [
+          ...previousScenes,
+          currentScene,
+        ],
         currentScene: action.scene,
+        loggedIn,
       };
     }
     default:
-      return { ...state };
+      return state;
   }
 }