Files
mmm-projet/app/(tabs)/_layout.tsx

67 lines
2.1 KiB
TypeScript

import { Tabs } from 'expo-router';
import React from 'react';
import { HapticTab } from '@/components/expoExempleComponents/haptic-tab';
import { IconSymbol } from '@/components/ui/icon-symbol';
import { Colors } from '@/constants/theme';
import { useColorScheme } from '@/hooks/use-color-scheme';
import AntDesign from '@expo/vector-icons/AntDesign';
import { useUser } from '../ContextUser';
import { useAuthHandler } from '../AuthHandler';
export default function TabLayout() {
const colorScheme = useColorScheme();
const { role } = useUser();
// Handle auth in tabs layout
useAuthHandler();
return (
<Tabs screenOptions={{tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint, headerShown: false, tabBarButton: HapticTab}}>
<Tabs.Screen name="index" options={{ href: null}}/>
<Tabs.Screen name="explore" options={{ href: null }}/>
<Tabs.Screen name="templateSreen" options={{ href: null}}/>
<Tabs.Screen
name="home"
options={{
title: 'Home',
tabBarIcon: ({ color }) => (
<IconSymbol size={28} name="house.fill" color={color} />
),
}}
/>
<Tabs.Screen
name="gestionnaire_ressource"
options={{
title: 'Ressources',
tabBarIcon: ({ color }) => (
<IconSymbol size={28} name="backpack.fill" color={color} />
),
}}
/>
<Tabs.Screen
name="gestion_user"
options={{
title: 'Users',
tabBarIcon: ({ color }) => <IconSymbol size={28} name="person.fill" color={color} />,
}}
/>
<Tabs.Screen
name="mapScreen"
options={{
title: 'Map',
tabBarIcon: ({ color }) => <IconSymbol size={28} name="paperplane.fill" color={color} />,
}}
/>
<Tabs.Screen
name="addScreen"
options={{
title: 'Ajouter',
href: role === 'chef' ? '/(tabs)/addScreen' : null,
tabBarIcon: ({ color }) => (
<AntDesign name="plus" size={24} color={color} />
),
}}
/>
</Tabs>
);
}