<template>
    <style-wrapper>
        <root>
            <app-navigator></app-navigator>
        </root>
    </style-wrapper>
</template>

<script>
    import { React } from 'react';

    import {
        createDrawerNavigator,
        createStackNavigator,
        createAppContainer,
    } from 'vue-native-router';

    import { Root, StyleProvider } from 'native-base';

    import StyleWrapper from "./theme/styleWrapper";

    import Lessons from "./screens/lessons/LessonsScreen";
    import AddLessonScreen from "./screens/lessons/AddLessonScreen";
    import EditLessonScreen from "./screens/lessons/EditLessonScreen";
    import Calls from "./screens/calls/CallsScreen";
    import AddCallScreen from "./screens/calls/AddCallScreen";
    import EditCallScreen from "./screens/calls/EditCallScreen";
    import Settings from "./screens/SettingsScreen";

    import Login from "./screens/auth/LoginScreen";
    import Register from "./screens/auth/RegisterScreen";

    import Greetings from "./screens/Greetings";

    import SideBar from "./components/SideBar";

    const Drawer = createDrawerNavigator(
        {
            Lessons: { screen: Lessons },
            Calls: { screen: Calls },
            Settings: { screen: Settings },
        },
        {
            initialRouteName: 'Lessons',
            contentOptions: {
                activeTintColor: "#3f51b5"
            },
            contentComponent: SideBar
    }
    );

    const StackNavigator = createStackNavigator(
        {
            Drawer: { screen: Drawer },

            Lessons: { screen: Lessons },
            AddLesson: { screen: AddLessonScreen },
            EditLesson: { screen: EditLessonScreen },

            Calls: { screen: Calls },
            AddCall: { screen: AddCallScreen },
            EditCall: { screen: EditCallScreen },

            Settings: { screen: Settings },

            Login: { screen: Login },
            Register: { screen: Register },

            Greetings: { screen: Greetings }
        },
        {
            initialRouteName: 'Login',
            headerMode: 'none'
        }
    );

    const AppNavigator = createAppContainer(StackNavigator);

    export default {
        components: {
            Root,
            AppNavigator,
            StyleWrapper
        },
        data() {
            return {

            }
        }
    }
</script>