import React from 'react';
import { createAppContainer, createSwitchNavigator } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack';
import { createDrawerNavigator } from 'react-navigation-drawer';

import Verify from '~/Screens/Login/Verify';
import Login from '~/Screens/Login';
import Dashboard from '~/Screens/Dashboard';
import Drawer from '~/Screens/Drawer';
import NavigationHeader from '~/Components/Layouts/NavigationHeader';
import ScreensCreator from '~/Generated/Screens';
import { Platform } from 'react-native';

const LoginNavigator = createStackNavigator({
    Login,
});

const mainStackNavigatorOptions = {
    headerMode: 'screen',
    headerTitleAlign: 'center',
    initialRouteName: 'Index',
    defaultNavigationOptions: ({navigation}) => { 
        return { 
            header: () => <NavigationHeader navigation={navigation} />,
            headerStyle: Platform.OS == "ios" ? { height: 50 } : {}
        }
    }
};

const Screens = ScreensCreator(mainStackNavigatorOptions);

const MainNavigator = createDrawerNavigator({
    Dashboard: createStackNavigator({
        Dashboard
    }, { 
        headerMode: 'screen',
        headerTitleAlign: 'center',
        defaultNavigationOptions: ({navigation}) => { 
            return { 
                header: () => <NavigationHeader navigation={navigation} />,
                headerStyle: Platform.OS == "ios" ? { height: 50 } : {},
            } 
        }
    }),

    ...Screens

}, {
    drawerPosition: 'left',
    drawerType: 'slide',
    contentComponent: Drawer,
    unmountInactiveRoutes: true,
});

const AppNavigator = createSwitchNavigator({
    Verify,
    LoginNavigator,
    MainNavigator
}, {
    initialRouteName: 'Verify',
    unmountInactiveRoutes: true,
});

export default createAppContainer(AppNavigator);