Add logout button

app/api/token.js

@@ -9,4 +9,8 @@ async function set(token) {
   return await AsyncStorage.setItem(settings.get('STORAGE_KEY'), token);
 }
 
-export default { get, set };
+async function clear() {
+  return await AsyncStorage.removeItem(settings.get('STORAGE_KEY'));
+}
+
+export default { get, set, clear };

app/components/navigation/LogoutButton.js

@@ -0,0 +1,47 @@
+import React from 'react-native';
+import GlobalStyles from '../../settings/styles';
+import Icon from 'react-native-vector-icons/FontAwesome';
+import token from '../../api/token';
+import RouteMaster from '../routes/RouteMaster';
+
+var {
+  StyleSheet,
+  TouchableHighlight,
+  View,
+  Text
+} = React;
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center'
+  },
+  toolbarButton: {
+    paddingHorizontal: 15,
+  },
+  text: {
+    color: GlobalStyles.get('CIRCLE_NAVBAR_TEXT'),
+    fontSize: 18,
+    paddingHorizontal: 10
+  }
+});
+
+export default class LogoutButton extends React.Component {
+  logout() {
+    token.clear();
+    this.props.nav.resetTo(RouteMaster.get('LOGIN'));
+  }
+
+  render() {
+    return (
+      <View style={styles.container}>
+        <TouchableHighlight
+          style={styles.toolbarButton}
+          underlayColor={GlobalStyles.get('CIRCLE_NAVBAR_BG')}
+          onPress={this.logout.bind(this)}>
+          <Text style={styles.text}><Icon name="sign-out" style={styles.text}/></Text>
+        </TouchableHighlight>
+      </View>
+    );
+  }
+}

app/components/navigation/RouteMapper.js

@@ -1,33 +1,37 @@
 import React from 'react-native'; // eslint-disable-line no-unused-vars
 
-import NavigationTitle from './Title';
+import Title from './Title';
-import NavigationBackButton from './BackButton';
+import BackButton from './BackButton';
-import NavigationInfoButton from './InfoButton';
+import InfoButton from './InfoButton';
+import LogoutButton from './LogoutButton';
+import RouteMaster from '../routes/RouteMaster';
 
 import { View } from 'react-native';
 
 export default {
 
   LeftButton(route, nav, index, navState) {
-    if (index === 0) {
+    if (route.id === RouteMaster.get('HOME').id) {
-      return <View />;
+      return <LogoutButton nav={nav}/>;
     }
-
+    if (index >= 1) {
       return (
-      <NavigationBackButton nav={nav} />
+        <BackButton nav={nav} />
       );
+    }
+    return <View />;
   },
 
   RightButton(route, nav, index, navState) {
-    if (route.id === 'login') {
+    if (route.id === RouteMaster.get('LOGIN').id) {
-      return <NavigationInfoButton nav={nav} route={route} />;
+      return <InfoButton nav={nav} route={route} />;
     }
     return <View />;
   },
 
   Title(route, nav, index, navState) {
     return (
-      <NavigationTitle route={route} />
+      <Title route={route} />
     );
   },