routes.js

// @flow
/* eslint-disable */
import * as React from 'react';
import {
  EvilIcons as Icon,
  MaterialCommunityIcons as MIcon,
} from '@expo/vector-icons';

import {
  createStackNavigator,
  createSwitchNavigator,
  NavigationActions,
} from 'react-navigation';

import {createBottomTabNavigator, BottomTabBar} from 'react-navigation-tabs';

// Authentication including login and signup
import {
  AuthScreen,
  HomeScreen,
  LoginScreen,
  SignupScreen,
  ForgetPasswordScreen,
} from './features/auth/screens';

// Vendor related screens
import {VendorListScreen, VendorProfileScreen} from './features/vendor/screens';
// Dishes related Screens
import {DishProfileScreen} from './features/dish/screens';
// Search related screens
import {SearchScreen} from './features/search/screens';
// User related screens
import {ProfileScreen} from './features/user/screens';
// Bookmark related screens
import {BookmarkScreen} from './features/bookmarks/screens';

// Utils
import {K5ButtonText} from './generals/components/KakiLImaButton';
import * as COLORS from './generals/constants/colors.bs';

let sharedRoutes = {
  VendorProfile: {
    screen: VendorProfileScreen,
    navigationOptions: ({navigation}) => ({
      title: navigation.state.params.title,
    }),
  },
  VendorList: {
    screen: VendorListScreen,
    navigationOptions: ({navigation}) => ({
      title: navigation.state.params.title,
    }),
  },
  DishProfile: {
    screen: DishProfileScreen,
    navigationOptions: ({navigation}) => ({
      title: navigation.state.params.title,
    }),
  },
};

let HomeStackNavigator = createStackNavigator(
  {
    MyHome: {
      screen: HomeScreen,
      navigationOptions: {
        header: null,
      },
    },
    ...sharedRoutes,
  },
  {
    headerMode: 'screen',
  },
);

let SearchStackNavigator = createStackNavigator(
  {
    MySearch: {
      screen: SearchScreen,
      navigationOptions: {
        header: null,
      },
    },
    ...sharedRoutes,
  },
  {
    headerMode: 'screen',
  },
);

let BookmarkStackNavigator = createStackNavigator(
  {
    MyBookmark: {
      screen: BookmarkScreen,
      navigationOptions: {
        header: null,
      },
    },
    ...sharedRoutes,
  },
  {headerMode: 'screen'},
);

let ProfileStackNavigator = createStackNavigator(
  {
    MyProfile: {
      screen: ProfileScreen,
      navigationOptions: {
        header: null,
      },
    },
    ...sharedRoutes,
  },
  {headerMode: 'screen'},
);

let MainTabNavigator = createBottomTabNavigator(
  {
    Home: {
      screen: HomeStackNavigator,
      navigationOptions: {
        tabBarIcon: ({tintColor}) => (
          <MIcon
            containerStyle={{justifyContent: 'center', alignItems: 'center'}}
            color={tintColor}
            name="food"
            size={33}
          />
        ),
      },
    },
    Search: {
      screen: SearchStackNavigator,
      navigationOptions: {
        tabBarIcon: ({tintColor}) => (
          <Icon
            containerStyle={{justifyContent: 'center', alignItems: 'center'}}
            color={tintColor}
            name="search"
            size={33}
          />
        ),
      },
    },
    Bookmark: {
      screen: BookmarkStackNavigator,
      navigationOptions: {
        tabBarIcon: ({tintColor}) => (
          <Icon
            containerStyle={{justifyContent: 'center', alignItems: 'center'}}
            color={tintColor}
            name="heart"
            size={33}
          />
        ),
        tabBarLabel: 'Love',
      },
    },
    Profile: {
      screen: ProfileStackNavigator,
      navigationOptions: {
        tabBarIcon: ({tintColor}) => (
          <Icon
            containerStyle={{justifyContent: 'center', alignItems: 'center'}}
            color={tintColor}
            name="user"
            size={33}
          />
        ),
      },
    },
  },
  {
    tabBarOptions: {
      activeTintColor: COLORS.carrot,
      style: {backgroundColor: COLORS.white},
    },
    swipeEnabled: true,
  },
);

let AuthStackNavigator = createStackNavigator(
  {
    MainAuth: {
      screen: AuthScreen,
      navigationOptions: {
        header: null,
      },
    },
    Login: {
      screen: LoginScreen,
      navigationOptions: ({navigation}) => ({
        headerStyle: {
          marginLeft: 10,
          marginRight: 20,
        },
        headerTransparent: true,
        headerTintColor: COLORS.cloud,
        headerRight: (
          <K5ButtonText
            value="forget password"
            onPress={() => navigation.navigate('ForgetPassword')}
          />
        ),
      }),
    },
    Signup: {
      screen: SignupScreen,
      navigationOptions: ({navigation}) => ({
        headerStyle: {
          marginLeft: 10,
          marginRight: 20,
        },
        headerTransparent: true,
        headerTintColor: COLORS.cloud,
        headerRight: (
          <K5ButtonText
            value="Login"
            onPress={() => navigation.navigate('Login')}
          />
        ),
      }),
    },
    ForgetPassword: {
      screen: ForgetPasswordScreen,
      navigationOptions: ({navigation}) => ({
        headerStyle: {
          marginLeft: 10,
        },
        headerTransparent: true,
        headerTintColor: COLORS.cloud,
      }),
    },
  },
  {
    headerMode: 'screen',
  },
);

let KakiLimaApp = createSwitchNavigator(
  {
    Auth: {
      screen: AuthStackNavigator,
    },
    Main: {
      screen: MainTabNavigator,
    },
  },
  {headerMode: 'screen', initialRouteName: 'Main'},
);

export default KakiLimaApp;