import React from "react";
import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
import { createNativeStackNavigator } from "@react-navigation/native-stack";
import { NavigationContainer } from "@react-navigation/native";

import Denuncias from "./screens/Denuncias";
import Derechos from "./screens/Derechos";
import Analisis from "./screens/Analisis";
import Formulario from "./screens/Formulario";
import Lista from "./screens/Lista";
import Drna from "./screens/Drna";

const StackDenuncias = createNativeStackNavigator();

function Stacks() {
    return (
        <StackDenuncias.Navigator
         initialRouteName="DenunciasIni"
        >
           
            <StackDenuncias.Screen
                name="DenunciasIni"
                component={Denuncias}
            />
            <StackDenuncias.Screen
                name="Formulario"
                component={Formulario}
            />
            <StackDenuncias.Screen
                name="Lista"
                component={Lista}
            />
            <StackDenuncias.Screen
                name="Drna"
                component={Drna}
            />
           
        </StackDenuncias.Navigator>
    )
}

const Tab = createBottomTabNavigator();

function Tabs() {
    return (
        <Tab.Navigator
        initialRouteName="Denuncias">
            <Tab.Screen name="Denuncias" component={Stacks} 
            options={{
                headerShown:false
            }} />
            <Tab.Screen name="Derechos" component={Derechos} />
            <Tab.Screen name="Analisis" component={Analisis} />
        </Tab.Navigator>
    );
}

export default function Navigation(){
    return (
        <NavigationContainer>
            <Tabs />
        </NavigationContainer>
    );
}