up

App.tsx

@@ -1,20 +1,53 @@
-import { StatusBar } from 'expo-status-bar';
-import { StyleSheet, Text, View } from 'react-native';
+import { StatusBar } from "expo-status-bar";
+import { StyleSheet, ScrollView } from "react-native";
+import { SafeAreaProvider } from "react-native-safe-area-context";
+import { NavigationContainer } from "@react-navigation/native";
+import {
+  createStackNavigator,
+  StackScreenProps,
+} from "@react-navigation/stack";
+import {
+  createDrawerNavigator,
+  DrawerItemList,
+  DrawerItem,
+  DrawerContentScrollView,
+} from "@react-navigation/drawer";
+
+import Header from "./src/components/header/Header";
+import Footer from "./src/components/footer/Footer";
+import HomePage from "./src/screens/HomeScreen";
 
 export default function App() {
   return (
-    <View style={styles.container}>
-      <Text>Open up App.tsx to start working on your app!</Text>
-      <StatusBar style="auto" />
-    </View>
+    <SafeAreaProvider>
+      <Header />
+      <NavigationContainer>
+        <AllPage />
+      </NavigationContainer>
+      {/* <Footer /> */}
+    </SafeAreaProvider>
   );
 }
+const Drawer = createDrawerNavigator();
+const Stack = createStackNavigator();
+
+const AllPage = () => {
+  return (
+    <Stack.Navigator
+      initialRouteName="homepage"
+      screenOptions={{
+        headerShown: false, // Ẩn header cho tất cả màn hình
+      }}
+    >
+      <Stack.Screen name="homepage" component={HomePage} />
+    </Stack.Navigator>
+  );
+};
 
 const styles = StyleSheet.create({
   container: {
-    flex: 1,
-    backgroundColor: '#fff',
-    alignItems: 'center',
-    justifyContent: 'center',
+    marginLeft: "auto",
+    marginRight: "auto",
+    maxWidth: 480,
   },
 });