Skip to content

C
clone_excelso
Commit f51b347a authored by Wahyu Adjie Prasetyo's avatar Wahyu Adjie Prasetyo
Browse files
Options

Auth js

parent 67c55620
Hide whitespace changes
Inline Side-by-side
Showing with 125 additions and 108 deletions
view/Auth.js
View file @ f51b347a
...@@ -55,6 +55,7 @@ import WelcomeLog from './WelcomeLog'; ...@@ -55,6 +55,7 @@ import WelcomeLog from './WelcomeLog';
import RatingOrder from './RatingOrder'; import RatingOrder from './RatingOrder';
import UseBalance from './UseBalance'; import UseBalance from './UseBalance';
import PaymentCode from './PaymentCode'; import PaymentCode from './PaymentCode';
import UpdateVersion from './UpdateVersion';
enableScreens(); enableScreens();
...@@ -70,8 +71,8 @@ const BottomNavigation = ({ state, descriptors, navigation }) => { ...@@ -70,8 +71,8 @@ const BottomNavigation = ({ state, descriptors, navigation }) => {
options.tabBarLabel !== undefined options.tabBarLabel !== undefined
? options.tabBarLabel ? options.tabBarLabel
: options.title !== undefined : options.title !== undefined
? options.title ? options.title
: route.name; : route.name;
const isFocused = state.index === index; const isFocused = state.index === index;
...@@ -93,7 +94,7 @@ const BottomNavigation = ({ state, descriptors, navigation }) => { ...@@ -93,7 +94,7 @@ const BottomNavigation = ({ state, descriptors, navigation }) => {
target: route.key, target: route.key,
}); });
}; };
let icon = require('../assets/icon/icon-home.png') let icon = require('../assets/icon/icon-home.png')
if (label === 'HOME') { if (label === 'HOME') {
icon = require('../assets/icon/icon-home.png') icon = require('../assets/icon/icon-home.png')
...@@ -118,11 +119,11 @@ const BottomNavigation = ({ state, descriptors, navigation }) => { ...@@ -118,11 +119,11 @@ const BottomNavigation = ({ state, descriptors, navigation }) => {
testID={options.tabBarTestID} testID={options.tabBarTestID}
onPress={onPress} onPress={onPress}
onLongPress={onLongPress} onLongPress={onLongPress}
style={{ flex: 1, alignItems: 'center', backgroundColor: 'white', borderTopWidth:1, borderTopColor: '#f0f0f0' }} style={{ flex: 1, alignItems: 'center', backgroundColor: 'white', borderTopWidth: 1, borderTopColor: '#f0f0f0' }}
> >
<Image source={icon} style={{ height: 50, width: 50, tintColor: isFocused ? '#CFB368' : 'gray'}} /> <Image source={icon} style={{ height: 50, width: 50, tintColor: isFocused ? '#CFB368' : 'gray' }} />
</TouchableOpacity> </TouchableOpacity>
); );
})} })}
...@@ -130,72 +131,72 @@ const BottomNavigation = ({ state, descriptors, navigation }) => { ...@@ -130,72 +131,72 @@ const BottomNavigation = ({ state, descriptors, navigation }) => {
) )
} }
function HomePage({navigation}) { function HomePage({ navigation }) {
return ( return (
<Tab.Navigator tabBar={props => <BottomNavigation {...props}/>} <Tab.Navigator tabBar={props => <BottomNavigation {...props} />}
// screenOptions={({ route }) => ({ // screenOptions={({ route }) => ({
// tabBarIcon: ({ focused, color, size }) => { // tabBarIcon: ({ focused, color, size }) => {
// let iconName; // let iconName;
// if (route.name === 'HOME') { // if (route.name === 'HOME') {
// iconName = focused ? 'ios-home' : 'ios-home' // iconName = focused ? 'ios-home' : 'ios-home'
// } else if (route.name === 'MENU') { // } else if (route.name === 'MENU') {
// iconName = focused ? 'ios-paper' : 'ios-paper'; // iconName = focused ? 'ios-paper' : 'ios-paper';
// } else if (route.name === 'REWARDS') { // } else if (route.name === 'REWARDS') {
// iconName = focused ? 'ios-gift' : 'ios-gift'; // iconName = focused ? 'ios-gift' : 'ios-gift';
// } else if (route.name === 'ORDER') { // } else if (route.name === 'ORDER') {
// iconName = focused ? 'md-cart' : 'md-cart'; // iconName = focused ? 'md-cart' : 'md-cart';
// } else if (route.name === 'OUTLETS') { // } else if (route.name === 'OUTLETS') {
// iconName = focused ? 'ios-cafe' : 'ios-cafe'; // iconName = focused ? 'ios-cafe' : 'ios-cafe';
// } else if (route.name === 'ACCOUNT') { // } else if (route.name === 'ACCOUNT') {
// iconName = focused ? 'account' : 'account'; // iconName = focused ? 'account' : 'account';
// return <MaterialCommunityIcons name={iconName} size={size} color={color} /> // return <MaterialCommunityIcons name={iconName} size={size} color={color} />
// } // }
// // You can return any component that you like here! // // You can return any component that you like here!
// return <Ionicons name={iconName} size={size} color={color} />; // return <Ionicons name={iconName} size={size} color={color} />;
// }, // },
// })} // })}
// screenOptions={({ route }) => ({ // screenOptions={({ route }) => ({
// tabBarIcon: ({ focused, color, size }) => { // tabBarIcon: ({ focused, color, size }) => {
// let iconName; // let iconName;
// console.log('name', route.name) // console.log('name', route.name)
// console.log('focused', focused) // console.log('focused', focused)
// console.log('color', color) // console.log('color', color)
// console.log('size', size) // console.log('size', size)
// // console.log('nav', navigation) // // console.log('nav', navigation)
// if (route.name === 'HOME') { // if (route.name === 'HOME') {
// // iconName = focused ? 'ios-home' : 'ios-home' // // iconName = focused ? 'ios-home' : 'ios-home'
// return <Image source={require('../assets/icon/icon-home.png')} style={{ height: 50, width: 50 }} tintColor={focused ? '#CFB368' : 'gray'} /> // return <Image source={require('../assets/icon/icon-home.png')} style={{ height: 50, width: 50 }} tintColor={focused ? '#CFB368' : 'gray'} />
// } else if (route.name === 'MENU') { // } else if (route.name === 'MENU') {
// // iconName = focused ? 'ios-paper' : 'ios-paper'; // // iconName = focused ? 'ios-paper' : 'ios-paper';
// return <Image source={require('../assets/icon/icon-menu.png')} style={{ height: 50, width: 50 }} tintColor={focused ? '#CFB368' : 'gray'} /> // return <Image source={require('../assets/icon/icon-menu.png')} style={{ height: 50, width: 50 }} tintColor={focused ? '#CFB368' : 'gray'} />
// } else if (route.name === 'REWARDS') { // } else if (route.name === 'REWARDS') {
// // iconName = focused ? 'ios-gift' : 'ios-gift'; // // iconName = focused ? 'ios-gift' : 'ios-gift';
// return <Image source={require('../assets/icon/icon-rewards.png')} style={{ height: 50, width: 50 }} tintColor={focused ? '#CFB368' : 'gray'} /> // return <Image source={require('../assets/icon/icon-rewards.png')} style={{ height: 50, width: 50 }} tintColor={focused ? '#CFB368' : 'gray'} />
// } else if (route.name === 'ORDER') { // } else if (route.name === 'ORDER') {
// // iconName = focused ? 'md-cart' : 'md-cart'; // // iconName = focused ? 'md-cart' : 'md-cart';
// return <Image source={require('../assets/icon/icon-order.png')} style={{ height: 50, width: 50 }} tintColor={focused ? '#CFB368' : 'gray'} /> // return <Image source={require('../assets/icon/icon-order.png')} style={{ height: 50, width: 50 }} tintColor={focused ? '#CFB368' : 'gray'} />
// } else if (route.name === 'OUTLETS') { // } else if (route.name === 'OUTLETS') {
// // iconName = focused ? 'ios-cafe' : 'ios-cafe'; // // iconName = focused ? 'ios-cafe' : 'ios-cafe';
// return <Image source={require('../assets/icon/icon-outlets.png')} style={{ height: 50, width: 50 }} tintColor={focused ? '#CFB368' : 'gray'} /> // return <Image source={require('../assets/icon/icon-outlets.png')} style={{ height: 50, width: 50 }} tintColor={focused ? '#CFB368' : 'gray'} />
// } else if (route.name === 'ACCOUNT') { // } else if (route.name === 'ACCOUNT') {
// // iconName = focused ? 'account' : 'account'; // // iconName = focused ? 'account' : 'account';
// return <Image source={require('../assets/icon/icon-account.png')} style={{ height: 50, width: 50 }} tintColor={focused ? '#CFB368' : 'gray'} /> // return <Image source={require('../assets/icon/icon-account.png')} style={{ height: 50, width: 50 }} tintColor={focused ? '#CFB368' : 'gray'} />
// } // }
// // You can return any component that you like here! // // You can return any component that you like here!
// return <Ionicons name={iconName} size={size} color={color} />; // return <Ionicons name={iconName} size={size} color={color} />;
// }, // },
// })} // })}
// tabBarOptions={{ activeTintColor: '#CFB368', inactiveTintColor: 'gray', showLabel: false }} // tabBarOptions={{ activeTintColor: '#CFB368', inactiveTintColor: 'gray', showLabel: false }}
> >
<Tab.Screen name="HOME" component={Home} /> <Tab.Screen name="HOME" component={Home} />
...@@ -282,7 +283,7 @@ class Auth extends React.Component { ...@@ -282,7 +283,7 @@ class Auth extends React.Component {
textAlign: 'center' textAlign: 'center'
}, title: 'EMAIL CONFIRMATION' }, title: 'EMAIL CONFIRMATION'
}} /> }} />
<Stack.Screen name="Login" component={Login} options={{headerShown:false}} /> <Stack.Screen name="Login" component={Login} options={{ headerShown: false }} />
<Stack.Screen name="LoginWelcome" component={WelcomeLog} options={{ <Stack.Screen name="LoginWelcome" component={WelcomeLog} options={{
headerShown: false, headerShown: false,
}} /> }} />
...@@ -388,19 +389,19 @@ class Auth extends React.Component { ...@@ -388,19 +389,19 @@ class Auth extends React.Component {
title: 'TRANSFER BALANCE' title: 'TRANSFER BALANCE'
}} /> }} />
<Stack.Screen name="Register" component={Register} /> <Stack.Screen name="Register" component={Register} />
<Stack.Screen name="Email Confirmation" component={EmailConfirmation} options={{ <Stack.Screen name="Email Confirmation" component={EmailConfirmation} options={{
headerStyle: { backgroundColor: '#CFB368' }, headerStyle: { backgroundColor: '#CFB368' },
headerTitleContainerStyle: { alignContent: 'center' }, headerTitleContainerStyle: { alignContent: 'center' },
headerTitleAlign: 'center', headerTitleAlign: 'center',
headerTintColor: '#fff', headerTintColor: '#fff',
headerTitleStyle: { headerTitleStyle: {
alignSelf: 'center', alignSelf: 'center',
fontFamily: 'Gotham-Black', fontFamily: 'Gotham-Black',
fontSize: 20, fontSize: 20,
color: 'white', color: 'white',
textAlign: 'center' textAlign: 'center'
}, title: 'EMAIL CONFIRMATION' }, title: 'EMAIL CONFIRMATION'
}} /> }} />
<Stack.Screen name="Upgrade Premium" component={UpgradePremium} <Stack.Screen name="Upgrade Premium" component={UpgradePremium}
options={{ options={{
headerStyle: { backgroundColor: '#CFB368' }, headerStyle: { backgroundColor: '#CFB368' },
...@@ -536,6 +537,22 @@ class Auth extends React.Component { ...@@ -536,6 +537,22 @@ class Auth extends React.Component {
}, title: 'RATING ORDER' }, title: 'RATING ORDER'
}} }}
/> />
<Stack.Screen name="UpdateVersion" component={UpdateVersion}
options={{
headerStyle: { backgroundColor: '#CFB368' },
headerTitleContainerStyle: { alignContent: 'center' },
headerTitleAlign: 'center',
headerTintColor: '#fff',
headerTitleStyle: {
alignSelf: 'center',
fontFamily: 'Gotham-Black',
fontSize: 20,
color: 'white',
textAlign: 'center'
}, title: 'UPDATE VERSION'
}}
/>
<Stack.Screen name="UseBalance" component={UseBalance} <Stack.Screen name="UseBalance" component={UseBalance}
options={{ options={{
headerStyle: { backgroundColor: '#CFB368' }, headerStyle: { backgroundColor: '#CFB368' },
...@@ -624,7 +641,7 @@ class Auth extends React.Component { ...@@ -624,7 +641,7 @@ class Auth extends React.Component {
<Stack.Screen name="Confirm Mobile" component={ConfirmMobile} /> <Stack.Screen name="Confirm Mobile" component={ConfirmMobile} />
<Stack.Screen name="Balance" component={Balance} /> <Stack.Screen name="Balance" component={Balance} />
<Stack.Screen name="Redeem Code" component={RedeemCode} <Stack.Screen name="Redeem Code" component={RedeemCode}
options={({ navigation }) => ({ options={({ navigation }) => ({
headerStyle: { backgroundColor: "#CFB368" }, headerStyle: { backgroundColor: "#CFB368" },
headerBackTitleStyle: { color: 'white' }, headerBackTitleStyle: { color: 'white' },
headerTintColor: '#fff', headerTintColor: '#fff',
...@@ -667,17 +684,17 @@ class Auth extends React.Component { ...@@ -667,17 +684,17 @@ class Auth extends React.Component {
{/* <Stack.Screen name="Email Confirmation" component={EmailConfirmation} /> */} {/* <Stack.Screen name="Email Confirmation" component={EmailConfirmation} /> */}
<Stack.Screen name="News Detail" component={NewsDetail} options={{ <Stack.Screen name="News Detail" component={NewsDetail} options={{
headerStyle: { backgroundColor: "#CFB368" }, headerStyle: { backgroundColor: "#CFB368" },
headerBackTitleStyle: { color: 'white' }, headerBackTitleStyle: { color: 'white' },
headerTintColor: '#fff', headerTintColor: '#fff',
headerTitleAlign: 'center', headerTitleAlign: 'center',
headerTitleStyle: { headerTitleStyle: {
fontFamily: 'Gotham-Black', fontFamily: 'Gotham-Black',
color: 'white', color: 'white',
fontSize: 20, fontSize: 20,
}, },
title: 'NEWS DETAIL' title: 'NEWS DETAIL'
}} /> }} />
<Stack.Screen name="CONFIRM YOUR ORDER" component={MenuConfirmation} <Stack.Screen name="CONFIRM YOUR ORDER" component={MenuConfirmation}
options={{ options={{
headerStyle: { backgroundColor: "#CFB368" }, headerStyle: { backgroundColor: "#CFB368" },
...@@ -706,17 +723,17 @@ class Auth extends React.Component { ...@@ -706,17 +723,17 @@ class Auth extends React.Component {
title: 'REGISTER' title: 'REGISTER'
}} /> }} />
<Stack.Screen name="TopUpInfo" component={TopUpInfo} options={{ <Stack.Screen name="TopUpInfo" component={TopUpInfo} options={{
headerStyle: { backgroundColor: "#CFB368" }, headerStyle: { backgroundColor: "#CFB368" },
headerBackTitleStyle: { color: 'white' }, headerBackTitleStyle: { color: 'white' },
headerTintColor: '#fff', headerTintColor: '#fff',
headerTitleAlign: 'center', headerTitleAlign: 'center',
headerTitleStyle: { headerTitleStyle: {
fontFamily: 'Gotham-Black', fontFamily: 'Gotham-Black',
color: 'white', color: 'white',
fontSize: 20, fontSize: 20,
}, },
title: 'TOPUP INFO ' title: 'TOPUP INFO '
}} /> }} />
<Stack.Screen name="Reward Detail" component={RewardDetail} <Stack.Screen name="Reward Detail" component={RewardDetail}
options={{ options={{
headerStyle: { backgroundColor: "#CFB368" }, headerStyle: { backgroundColor: "#CFB368" },
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment