App.js

import React, {useEffect, useState} from 'react'
import { NavigationContainer } from '@react-navigation/native'
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'
import { createNativeStackNavigator } from '@react-navigation/native-stack'
import { Ionicons } from '@expo/vector-icons'

import mapHome from './src/pages/map/MapHome'
import NewPlace from './src/pages/newPlace/newPlace'
import { ContextProvider } from './src/context/AuthContext'
import { Connexion } from './src/pages/connexion/connexion'


const Tab = createBottomTabNavigator()
const tabBarIconConfig = {
  Home: 'newspaper-outline',
  maps: 'map',
  logement: 'ios-add-circle-sharp',
}

export default function App() {
  return (
    <ContextProvider><NavigationContainer>
      <Tab.Navigator
        initialRouteName='Home'
        screenOptions={({ route }) => ({
          //Icons
          tabBarIcon: ({ focused, color, size }) =>
            <Ionicons name={tabBarIconConfig?.[route.name]} size={size} color={color} />,
          //Style
          tabBarActiveTintColor: 'blue',
          tabBarInactiveTintColor: 'gray',
          headerShown: false
        })}
      >
        <Tab.Screen name="Home" component={Connexion} />
        <Tab.Screen name="logement" component={NewPlace} />
        <Tab.Screen name="maps" component={mapHome} />
      </Tab.Navigator>
    </NavigationContainer></ContextProvider>
  );
}