From 6972066f91329999b1c185560316ad04f3c0b13c Mon Sep 17 00:00:00 2001
From: ivic00 <102467664+ivic00@users.noreply.github.com>
Date: Wed, 18 Dec 2024 21:22:38 +0100
Subject: [PATCH] menu button rework

---
 app/(auth)/_layout.tsx | 20 +++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/app/(auth)/_layout.tsx b/app/(auth)/_layout.tsx
index 230f5c8..89585e4 100644
--- a/app/(auth)/_layout.tsx
+++ b/app/(auth)/_layout.tsx
@@ -13,7 +13,7 @@ import {
   TouchableOpacity,
   View,
 } from "react-native-ui-lib";
-import { ImageBackground, StyleSheet } from "react-native";
+import { ImageBackground, Pressable, StyleSheet } from "react-native";
 import DrawerButton from "@/components/shared/DrawerButton";
 import NavGroceryIcon from "@/assets/svgs/NavGroceryIcon";
 import NavToDosIcon from "@/assets/svgs/NavToDosIcon";
@@ -99,6 +99,7 @@ export default function TabLayout() {
     navigation: DrawerNavigationProp<DrawerParamList>;
     route: RouteProp<DrawerParamList>;
   }): DrawerNavigationOptions => ({
+    lazy: true,
     headerShown: true,
     headerTitleAlign:
       Device.deviceType === DeviceType.TABLET ? "left" : "center",
@@ -125,12 +126,21 @@ export default function TabLayout() {
       fontSize: Device.deviceType === DeviceType.TABLET ? 22 : 17,
     },
     headerLeft: () => (
-      <TouchableOpacity
-        onPress={navigation.toggleDrawer}
-        style={{ marginLeft: 16 }}
+      <Pressable
+        onPress={() => {
+          navigation.toggleDrawer()
+        }}
+        hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}
+        style={({ pressed }) => [
+          { 
+            marginLeft: 16,
+            opacity: pressed ? 0.4 : 1 
+          }
+        ]}
+    
       >
         <DrawerIcon />
-      </TouchableOpacity>
+      </Pressable>
     ),
     headerRight: () => {
       const showViewSwitch = ["calendar", "todos", "index"].includes(