Skip to content

Instantly share code, notes, and snippets.

@qrobin qrobin/App.js
Last active May 23, 2017

Embed
What would you like to do?
class App extends Component {
constructor(props) {
super(props);
this.state = {
loggedIn: this.props.loggedIn
};
}
componentDidMount() {
// Here I have some logic with local database and the 'loggedIn' prop
}
render() {
return this.props.loggedIn ? <MainDrawer {...this.props} /> : <AuthStack />;
}
}
import React from 'react';
import { View, TouchableOpacity, Image, StyleSheet, Platform } from 'react-native';
import { NavigationActions } from 'react-navigation';
const is_iOS = (Platform.OS === 'ios');
const DrawerIcon = (props) => {
return (
<TouchableOpacity onPress={() => {
console.log(props);
props.screenProps.navigation.navigate('DrawerOpen');
}}>
<Image style={s.navHeaderIcon} source={require('icons/menu.png')} />
</TouchableOpacity>
);
};
export default (props) => {
return (
<View style={s.navHeaderContainer}>
<Image style={s.navHeaderIcon} source={require('assets/logo.png')} />
{!props.subRoute ? <DrawerIcon {...props} /> : null}
</View>
);
};
const s = StyleSheet.create({
navHeaderContainer: {
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'space-between',
backgroundColor: 'white',
height: is_iOS ? 76 : 60,
paddingTop: is_iOS ? 16 : 0,
paddingHorizontal: 20
},
navHeaderIcon: {
height: 40,
width: 40,
resizeMode: 'contain'
}
});
import React from 'react';
import { TouchableOpacity, Text, View } from 'react-native';
import { StackNavigator, DrawerNavigator } from 'react-navigation';
import { NavHeader } from 'molecules';
import { ScannerScreen, EventsScreen, TicketsScreen, LoginScreen, PassRecoveryScreen } from 'screens';
import realm from '_realm';
import store from 'store';
export const AuthStack = StackNavigator({
Login: {
screen: (props) => <LoginScreen {...props} />
},
PassRecovery: {
screen: () => <PassRecoveryScreen />
}
}, {
headerMode: 'none',
mode: 'modal'
});
export const MainDrawer = DrawerNavigator({
AppStack: {
screen: (props) => <AppStack screenProps={props} />
}
}, {
contentComponent: () => <Logout />,
drawerPosition: 'right'
});
const Logout = () => (
<View style={{marginTop: 50, borderTopWidth: .5, borderBottomWidth: .5, paddingLeft: 20, paddingVertical: 10 }}>
<TouchableOpacity onPress={() => {
realm.write(() => { realm.delete(realm.objects('Token')); });
store.dispatch({type: 'LOGGED_IN', payload: false });
store.dispatch({ type: 'PUT_TOKEN', payload: '' });
}}>
<Text style={{fontSize: 18, fontWeight: '600'}}>LOGOUT</Text>
</TouchableOpacity>
</View>
);
const AppStack = StackNavigator({
EventsScreen: {
name: 'Events',
screen: (props) => <EventsScreen {...props} />
},
ScannerStack: {
name: 'Scanner',
screen: (props) => <ScannerStack screenProps={props.navigation} />
}
}, {
navigationOptions: {
header: (props) => <NavHeader {...props} />
}
});
const ScannerStack = StackNavigator({
ScannerScreen: {
name: 'Scanner',
screen: (props) => <ScannerScreen {...props} />
},
TicketsScreen: {
name: 'TicketsScreen',
screen: () => <TicketsScreen />
}
}, {
mode: 'modal',
headerMode: 'none',
navigationOptions: {
header: () => <NavHeader subRoute />
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.