75 lines
3.1 KiB
JavaScript
75 lines
3.1 KiB
JavaScript
import 'react-native-gesture-handler'
|
|
import { NavigationContainer } from '@react-navigation/native'
|
|
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'
|
|
import { createStackNavigator } from '@react-navigation/stack'
|
|
import { SafeAreaProvider } from 'react-native-safe-area-context'
|
|
import { StatusBar } from 'expo-status-bar'
|
|
import { Text, View } from 'react-native'
|
|
|
|
import { AuthProvider, useAuth } from './src/context/AuthContext.jsx'
|
|
import HomeScreen from './src/screens/HomeScreen.jsx'
|
|
import InventoryScreen from './src/screens/InventoryScreen.jsx'
|
|
import SearchScreen from './src/screens/SearchScreen.jsx'
|
|
import BarcodeScreen from './src/screens/BarcodeScreen.jsx'
|
|
import ProfileScreen from './src/screens/ProfileScreen.jsx'
|
|
import ShoppingListsScreen from './src/screens/ShoppingListsScreen.jsx'
|
|
import MealPlannersScreen from './src/screens/MealPlannersScreen.jsx'
|
|
import AdminScreen from './src/screens/AdminScreen.jsx'
|
|
import UsersScreen from './src/screens/UsersScreen.jsx'
|
|
import { colors } from './src/theme.js'
|
|
|
|
const Tab = createBottomTabNavigator()
|
|
const Stack = createStackNavigator()
|
|
|
|
function TabIcon({ name, focused }) {
|
|
const icons = {
|
|
Home: '🏠', Inventory: '📦', Search: '🔍', Barcode: '📷',
|
|
Shopping: '🛒', Meals: '🍽️', Profile: '👤', Admin: '⚙️', Users: '👥',
|
|
}
|
|
return (
|
|
<Text style={{ fontSize: 18, opacity: focused ? 1 : 0.5 }}>{icons[name] || '•'}</Text>
|
|
)
|
|
}
|
|
|
|
function MainTabs() {
|
|
const { isSiteAdmin } = useAuth()
|
|
|
|
return (
|
|
<Tab.Navigator
|
|
screenOptions={({ route }) => ({
|
|
tabBarIcon: ({ focused }) => <TabIcon name={route.name} focused={focused} />,
|
|
tabBarActiveTintColor: colors.primary,
|
|
tabBarInactiveTintColor: colors.textMuted,
|
|
tabBarStyle: { backgroundColor: colors.surface, borderTopColor: colors.border },
|
|
headerStyle: { backgroundColor: colors.surface },
|
|
headerTintColor: colors.text,
|
|
headerTitleStyle: { fontWeight: '700' },
|
|
tabBarLabelStyle: { fontSize: 10 },
|
|
})}
|
|
>
|
|
<Tab.Screen name="Home" component={HomeScreen} options={{ title: 'Home' }} />
|
|
<Tab.Screen name="Inventory" component={InventoryScreen} options={{ title: 'Inventory' }} />
|
|
<Tab.Screen name="Search" component={SearchScreen} options={{ title: 'Search' }} />
|
|
<Tab.Screen name="Barcode" component={BarcodeScreen} options={{ title: 'Barcode' }} />
|
|
<Tab.Screen name="Shopping" component={ShoppingListsScreen} options={{ title: 'Shopping' }} />
|
|
<Tab.Screen name="Meals" component={MealPlannersScreen} options={{ title: 'Meals' }} />
|
|
<Tab.Screen name="Profile" component={ProfileScreen} options={{ title: 'Profile' }} />
|
|
{isSiteAdmin && <Tab.Screen name="Admin" component={AdminScreen} options={{ title: 'Admin' }} />}
|
|
{isSiteAdmin && <Tab.Screen name="Users" component={UsersScreen} options={{ title: 'Users' }} />}
|
|
</Tab.Navigator>
|
|
)
|
|
}
|
|
|
|
export default function App() {
|
|
return (
|
|
<SafeAreaProvider>
|
|
<AuthProvider>
|
|
<NavigationContainer>
|
|
<MainTabs />
|
|
</NavigationContainer>
|
|
<StatusBar style="auto" />
|
|
</AuthProvider>
|
|
</SafeAreaProvider>
|
|
)
|
|
}
|