demo app hanoicomputer home category productdetail cart

App.tsx

@@ -0,0 +1,117 @@
+import { StatusBar } from 'expo-status-bar';
+import React from 'react';
+import { SafeAreaProvider } from 'react-native-safe-area-context';
+import { Alert, Button, Image, StyleSheet, Dimensions, SafeAreaView, ScrollView, TouchableOpacity } from 'react-native';
+import { Header, MainSeach } from './components/header/headerMain';
+
+import useCachedResources from './hooks/useCachedResources';
+import useColorScheme from './hooks/useColorScheme';
+import Navigation from './navigation';
+import { createDrawerNavigator, DrawerItemList, DrawerItem, DrawerContentScrollView } from '@react-navigation/drawer';
+import { NavigationContainer } from '@react-navigation/native';
+import { createStackNavigator, StackScreenProps } from '@react-navigation/stack';
+import { Text, View, } from './components/Themed';
+import TabOneScreen from './screens/TabOneScreen';
+import TabTwoScreen from './screens/TabTwoScreen';
+import ProductDetail from './screens/ProductDetail';
+import CartDetail from './screens/Cart';
+
+export default function App() {
+    const isLoadingComplete = useCachedResources();
+    const colorScheme = useColorScheme();
+
+    if (!isLoadingComplete) {
+        return null;
+    } else {
+        return (
+            <NavigationContainer>
+                <MainContentRouter />
+            </NavigationContainer>
+
+        );
+    }
+}
+
+
+const Drawer = createDrawerNavigator();
+const Stack = createStackNavigator();
+
+/* cài đặt thông số cho header */
+const HeaderAllPageOpion = ({ navigation }: { navigation: any }) => {
+    return (
+        {
+            headerLeft: () => (
+                <Header props={navigation} />
+            ),
+            headerTitle: () => (
+                <Text></Text>
+            ),
+            headerStyle: {
+                backgroundColor: '#3385ff',
+                height: 130,
+            }
+        }
+    )
+}
+
+/* redirect về trang chủ */
+const HomePage = ({ navigation }: { navigation: any }) => {
+    return (
+        <Stack.Navigator>
+            <Stack.Screen
+                name="homepage"
+                component={TabOneScreen}
+                options={HeaderAllPageOpion}
+            />
+        </Stack.Navigator>
+    );
+}
+
+/* redirect về danh mục */
+const ProductList = ({ navigation }: { navigation: any }) => {
+    return (
+        <Stack.Navigator>
+            <Stack.Screen
+                name="homepage"
+                component={TabTwoScreen}
+                options={HeaderAllPageOpion}
+            />
+        </Stack.Navigator>
+    );
+}
+
+const ProductDetailRec = ({ navigation }: { navigation: any }) => {
+    return (
+        <Stack.Navigator>
+            <Stack.Screen
+                name="homepage"
+                component={ProductDetail}
+                options={HeaderAllPageOpion}
+            />
+        </Stack.Navigator>
+    );
+}
+
+const CartPage = ({ navigation }: { navigation: any }) => {
+    return (
+        <Stack.Navigator>
+            <Stack.Screen
+                name="homepage"
+                component={CartDetail}
+                options={HeaderAllPageOpion}
+            />
+        </Stack.Navigator>
+    );
+}
+
+const MainContentRouter = () => {
+    return (
+        <Drawer.Navigator>
+            <Drawer.Screen name="Home" component={HomePage} />
+            <Drawer.Screen name="Laptop, Máy Tính Xách Tay" component={ProductList} />
+            <Drawer.Screen name="Trang san pham" component={ProductDetailRec} />
+            <Drawer.Screen name="cart" component={CartPage} />
+        </Drawer.Navigator>
+    );
+}
+