MODAFOCA

routes.js

import React, { Component, PureComponent } from 'react';
import {
	createStackNavigator,
	createBottomTabNavigator
} from 'react-navigation';
import { Image, View, Text } from 'react-native';
import { Actions, Scene, Router } from 'react-native-router-flux';
import Icon from 'react-native-vector-icons/FontAwesome';

import colors from './src/constants/colors';
import { logout } from './src/actions/authActions';

import Auth from './src/container/auth';
import OrderList from './src/container/order/orderList';
import OrderDetail from './src/container/order/orderDetail';
import ProductList from './src/container/product/productList';
import Cart from './src/container/cart';
import CartStep2 from './src/container/cart/step2';
import FinancialOptions from './src/container/cart/financialOptions';
import GeneralInformation from './src/container/cart/generalInformation';
import Dashboard from './src/container/dashboard/dashboard';
import ResetPasswordForm from './src/container/auth/resetPasswordForm';

import CustomHeader from './src/components/shared/CustomHeader';

class test extends PureComponent {
	render() {
		return <Text>OLOKO</Text>;
	}
}

const AuthNavigator = createStackNavigator({
	auth: {
		screen: Auth,
		navigationOptions: {
			header: null
		}
	}
});

const LoggedNavigator = createStackNavigator({
	orderlist: {
		screen: OrderList,
		navigationOptions: {
			header: _ => <CustomHeader />
		}
	},
	orderDetail: {
		screen: OrderDetail,
		navigationOptions: {
			header: _ => <CustomHeader />
		}
	},
	dashboard: {
		screen: test,
		navigationOptions: {
			header: null
		}
	},
	productList: {
		screen: ProductList,
		navigationOptions: {
			header: null
		}
	}
});

//tabs
const TabNavigator = createBottomTabNavigator(
	{
		HomeTab: {
			screen: LoggedNavigator,
			navigationOptions: () => ({
				tabBarIcon: ({ tintColor }) => (
					<Icon name="home" size={30} color={tintColor} />
				)
			})
		},
		products: {
			screen: LoggedNavigator,
			navigationOptions: () => ({
				tabBarIcon: ({ tintColor }) => (
					<Icon name="list" size={30} color={tintColor} />
				)
			})
		},
		dashboard: {
			screen: LoggedNavigator,
			navigationOptions: () => ({
				tabBarIcon: ({ tintColor }) => (
					<Icon name="bar-chart" size={30} color={tintColor} />
				)
			})
		},
		profile: {
			screen: LoggedNavigator,
			navigationOptions: () => ({
				tabBarIcon: ({ tintColor }) => (
					<Icon name="user" size={30} color={tintColor} />
				)
			})
		}
	},
	{
		tabBarPosition: 'bottom',
		animationEnabled: false,
		swipeEnabled: false,
		tabBarOptions: {
			showLabel: false,
			activeTintColor: colors.kionColor,
			inactiveTintColor: colors.secondary,
			style: {
				backgroundColor: colors.white
			}
		}
	}
);

class Routers extends Component {
	logout = () => {
		if (this.props.logout()) {
			Actions.login({ type: 'reset' });
		}
	};

	render() {
		let optionsAppNavigator = {
			initialRouteName: 'Index',
			headerMode: 'none'
		};

		const AppNavigator = createStackNavigator(
			{
				Index: {
					screen: AuthNavigator
				},
				StacksInTabs: {
					name: 'Principal Tab',
					screen: TabNavigator
				}
			},
			optionsAppNavigator
		);
		return <AppNavigator />;
	}
}

export default Routers;