104 lines
4.9 KiB
JavaScript
104 lines
4.9 KiB
JavaScript
import React, { useContext, useState } from "react";
|
|
import {
|
|
NativeBaseProvider,
|
|
Icon
|
|
} from "native-base";
|
|
import { NavigationContainer } from '@react-navigation/native';
|
|
import { createNativeStackNavigator } from '@react-navigation/native-stack';
|
|
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
|
|
import LogIn from "./components/LogIn";
|
|
import Home from "./components/Home";
|
|
import RecoverPassword from "./components/RecoverPassword";
|
|
import Reservas from "./components/Reservas";
|
|
import Profile from "./components/Profile";
|
|
import { MaterialCommunityIcons } from '@expo/vector-icons';
|
|
import AreaComun from "./components/AreaComun";
|
|
import { UserContext, UserContextProvider } from "./context/UserContext";
|
|
import AgregarInvitados from "./components/AgregarInvitados";
|
|
import Invitados from "./components/Invitados"
|
|
|
|
const Stack = createNativeStackNavigator();
|
|
const Tab = createBottomTabNavigator();
|
|
|
|
function HomeTab({ route }) {
|
|
const { user } = useContext(UserContext);
|
|
const [selected, setSelected] = useState(0);
|
|
|
|
return (
|
|
|
|
<Tab.Navigator initialParams={user} initialRouteName="Comunicados" >
|
|
<Tab.Screen name="Mis Comunicados" component={Home} initialParams={user} options={{headerStyle: {
|
|
backgroundColor: "#D7A86E"
|
|
}, tabBarIcon: () => (<Icon mb="2" as={<MaterialCommunityIcons name={selected === 0 ? 'home' : 'home-outline'} />} color="#D7A86E" size="md" />)}} onclick={() => setSelected(0)}
|
|
/>
|
|
<Tab.Screen name="Mis Reservas" component={Reservas } initialParams={user} options={{headerStyle: {
|
|
backgroundColor: "#D7A86E"
|
|
}, tabBarIcon: () => (<Icon mb="2" as={<MaterialCommunityIcons name={selected === 1 ? 'tree' : 'tree-outline'} />} color="#D7A86E" size="md" />)} } onclick={() => setSelected(1)} />
|
|
<Tab.Screen name="Mis Invitados" component={Invitados} initialParams={user} options={{headerStyle: {
|
|
backgroundColor: "#D7A86E"
|
|
}, tabBarIcon: () => (<Icon mb="2" as={<MaterialCommunityIcons name={selected === 1 ? 'contacts' : 'contacts-outline'} />} color="#D7A86E" size="md" />)} } onclick={() => setSelected(1)} />
|
|
<Tab.Screen name="Perfil" component={Profile} initialParams={user} options={{headerStyle: {
|
|
backgroundColor: "#D7A86E"
|
|
}, tabBarIcon: () => (<Icon mb="2" as={<MaterialCommunityIcons name={selected === 2 ? 'account' : 'account-outline'} />} color="#D7A86E" size="md" />)}} onclick={() => setSelected(2)} />
|
|
</Tab.Navigator>
|
|
|
|
)
|
|
}
|
|
|
|
function HomeTabGuarda({ route }) {
|
|
const { user } = useContext(UserContext);
|
|
const [selected, setSelected] = useState(0);
|
|
|
|
return (
|
|
|
|
<Tab.Navigator initialParams={user} initialRouteName="Comunicados" >
|
|
<Tab.Screen name="Mis Comunicados Guarda" component={Home} initialParams={user} options={{headerStyle: {
|
|
backgroundColor: "#D7A86E"
|
|
}, tabBarIcon: () => (<Icon mb="2" as={<MaterialCommunityIcons name={selected === 0 ? 'home' : 'home-outline'} />} color="#D7A86E" size="md" />)}} onclick={() => setSelected(0)}
|
|
/>
|
|
<Tab.Screen name="Mis Invitados" component={Invitados} initialParams={user} options={{headerStyle: {
|
|
backgroundColor: "#D7A86E"
|
|
}, tabBarIcon: () => (<Icon mb="2" as={<MaterialCommunityIcons name={selected === 1 ? 'contacts' : 'contacts-outline'} />} color="#D7A86E" size="md" />)} } onclick={() => setSelected(1)} />
|
|
<Tab.Screen name="Mi Perfil" component={Profile} initialParams={user} options={{headerStyle: {
|
|
backgroundColor: "#D7A86E"
|
|
}, tabBarIcon: () => (<Icon mb="2" as={<MaterialCommunityIcons name={selected === 2 ? 'account' : 'account-outline'} />} color="#D7A86E" size="md" />)}} onclick={() => setSelected(2)} />
|
|
</Tab.Navigator>
|
|
|
|
)
|
|
}
|
|
export default function App() {
|
|
return (
|
|
<NativeBaseProvider>
|
|
<UserContextProvider>
|
|
<NavigationContainer>
|
|
<Stack.Navigator initialRouteName="Iniciar Sesión">
|
|
{/* <Stack.Screen name="Mis Reservas" component={Reservas} options={{
|
|
headerStyle: {
|
|
backgroundColor: "#D7A86E"
|
|
}
|
|
}} /> */}
|
|
<Stack.Screen name="Comunicados" component={HomeTab} options={{ headerShown: false }} />
|
|
<Stack.Screen name="Comunicados Guarda" component={HomeTabGuarda} options={{ headerShown: false }} />
|
|
|
|
<Stack.Screen name="Reservar" component={AreaComun} options={{
|
|
headerStyle: {
|
|
backgroundColor: "#D7A86E"
|
|
}
|
|
}} />
|
|
<Stack.Screen name="Agregar Invitado" component={AgregarInvitados} options={{
|
|
headerStyle: {
|
|
backgroundColor: "#D7A86E"
|
|
}
|
|
}} />
|
|
<Stack.Screen name="Iniciar Sesión" component={LogIn} options={{
|
|
headerStyle: {
|
|
backgroundColor: "#D7A86E"
|
|
}
|
|
}} />
|
|
</Stack.Navigator>
|
|
</NavigationContainer>
|
|
</UserContextProvider>
|
|
</NativeBaseProvider>
|
|
);
|
|
}
|