Files
projet_gestion_commande/frontend-admin/App.tsx
T
2026-02-07 22:33:02 +01:00

110 lines
3.4 KiB
TypeScript

import React, { useMemo } from "react";
import { StatusBar } from "expo-status-bar";
import { ActivityIndicator, View, StyleSheet } from "react-native";
import { NavigationContainer } from "@react-navigation/native";
import { createNativeStackNavigator } from "@react-navigation/native-stack";
import { AuthProvider, useAuth } from "./src/auth/AuthContext";
import { ThemeProvider, useTheme } from "./src/context/ThemeContext";
import type { Colors } from "./src/theme";
import { spacing } from "./src/theme";
import RoleSelectScreen from "./src/screens/auth/RoleSelectScreen";
import AdminLoginScreen from "./src/screens/auth/AdminLoginScreen";
import CabineLoginScreen from "./src/screens/auth/CabineLoginScreen";
import DeliveryLoginScreen from "./src/screens/auth/DeliveryLoginScreen";
import AdminNavigator from "./src/navigation/AdminNavigator";
import CabineNavigator from "./src/navigation/CabineNavigator";
import DeliveryNavigator from "./src/navigation/DeliveryNavigator";
import type { AuthStackParamList } from "./src/navigation/types";
const Stack = createNativeStackNavigator<AuthStackParamList>();
function AuthStack() {
const { colors } = useTheme();
return (
<Stack.Navigator
initialRouteName="RoleSelect"
screenOptions={{
headerStyle: { backgroundColor: colors.bgSecondary },
headerTintColor: colors.textWhite,
}}
>
<Stack.Screen
name="RoleSelect"
component={RoleSelectScreen}
options={{ title: "Admin Panel" }}
/>
<Stack.Screen
name="AdminLogin"
component={AdminLoginScreen}
options={{ title: "Connexion Admin" }}
/>
<Stack.Screen
name="CabineLogin"
component={CabineLoginScreen}
options={{ title: "Connexion Cabine" }}
/>
<Stack.Screen
name="DeliveryLogin"
component={DeliveryLoginScreen}
options={{ title: "Connexion Livreur" }}
/>
</Stack.Navigator>
);
}
function RootNavigator() {
const { isAuthenticated, isLoading, role } = useAuth();
const { colors } = useTheme();
if (isLoading) {
return (
<View
style={{
flex: 1,
justifyContent: "center",
alignItems: "center",
backgroundColor: colors.bgPrimary,
}}
>
<ActivityIndicator size="large" color={colors.accent} />
</View>
);
}
if (isAuthenticated) {
switch (role) {
case "admin":
return <AdminNavigator />;
case "cabine":
return <CabineNavigator />;
case "livreur":
return <DeliveryNavigator />;
}
}
return <AuthStack />;
}
export default function App() {
return (
<ThemeProvider>
<AuthProvider>
<NavigationContainer>
<RootNavigator />
<DynamicStatusBar />
</NavigationContainer>
</AuthProvider>
</ThemeProvider>
);
}
function DynamicStatusBar() {
const { isDark } = useTheme();
return <StatusBar style={isDark ? "light" : "dark"} />;
}