update: navigation drawer

App.js

@@ -25,8 +25,8 @@ export default function App() {
 
     <NavigationContainer>
     <Drawer.Navigator initialRouteName="Authntications">
-      <Drawer.Screen name="Authentications" component={AuthStack} />
-      {/* <Drawer.Screen name="Agripreneurs" component={BottomTab} /> */}
+      <Drawer.Screen name="HOME" component={AuthStack} />
+      <Drawer.Screen name="About Us" component={homeStack} />
       {/* <Drawer.Screen name="MainTab" component={MainTabScreen} /> */}
       {/* <Drawer.Screen name="About Us" component={AboutUs} /> */}
     </Drawer.Navigator>

Navigations/AuthStack.js

@@ -8,6 +8,7 @@ import { HomeScreen } from "../screen/HomeScreen";
 import { Leaderboard } from "../screen/Leaderboard";
 import { PriceScreen } from "../screen/PriceScreen";
 import { gamification } from "../screen/gamification";
+import { IotScreen } from "../screen/IotScreen";
 import { AboutUs } from "../screen/AboutUs";
 import axios from "axios";
 
@@ -20,28 +21,28 @@ export function AuthStack({ navigation }) {
         name="SignIn"
         component={SignIn}
         options={{
-          headerLeft: () => {
-            return (
-              <Ionicons
-                name="md-menu"
-                size={30}
-                color="black"
-                onPress={() => navigation.openDrawer()}
-              />
-            );
-          },
+          // headerLeft: () => {
+          //   return (
+          //     <Ionicons
+          //       name="md-menu"
+          //       size={30}
+          //       color="black"
+          //       onPress={() => navigation.openDrawer()}
+          //     />
+          //   );
+          // },
           headerStyle: {
             backgroundColor: 'white',
           },
-          headerLeftContainerStyle: { paddingLeft: 10 },
-          headerRight: () => {
-            return (
-              <MaterialIcons name="logout"
-               size={30} 
-               color="black"
-                />
-            );
-          },
+          headerTitleAlign: "center",
+          // headerRight: () => {
+          //   return (
+          //     <MaterialIcons name="logout"
+          //      size={30} 
+          //      color="black"
+          //       />
+          //   );
+          // },
         }}
       />
       <Stack.Screen
@@ -52,12 +53,34 @@ export function AuthStack({ navigation }) {
           headerTitleAlign: "center",
         }}
       />
+      <Stack.Screen
+        name="IotScreen"
+        component={IotScreen}
+        options={{
+          title: "IOT Page",
+          headerTitleAlign: "center",
+        }}
+      />
       <Stack.Screen
         name="HomeScreen"
         component={HomeScreen}
         options={{
           title: "Agripreneurs",
           headerTitleAlign: "center",
+          headerLeft: () => {
+            return (
+              <Ionicons
+                name="md-menu"
+                size={30}
+                color="black"
+                onPress={() => navigation.openDrawer()}
+              />
+            );
+          },
+          headerStyle: {
+            backgroundColor: 'white',
+          },
+          headerLeftContainerStyle: { paddingLeft: 10 },
           headerRight: () => {
             return (
               <MaterialIcons name="logout"

Navigations/homeStack.js

@@ -6,6 +6,7 @@ import { HomeScreen } from "../screen/HomeScreen";
 import { Leaderboard } from "../screen/Leaderboard";
 import { PriceScreen } from "../screen/PriceScreen";
 import { gamification } from "../screen/gamification";
+
 import { AboutUs } from "../screen/AboutUs";
 
 const Stack = createStackNavigator();
@@ -13,7 +14,7 @@ const Stack = createStackNavigator();
 export function homeStack({ navigation }) {
   return (
     <Stack.Navigator>
-      <Stack.Screen
+      {/* <Stack.Screen
         name="Agripreneurs"
         component={HomeScreen}
         options={{
@@ -56,7 +57,7 @@ export function homeStack({ navigation }) {
           title: "Gamification Page",
           headerTitleAlign: "center",
         }}
-      />
+      /> */}
       <Stack.Screen
         name="AboutUs"
         component={AboutUs}