diff --git a/app/index.tsx b/app/index.tsx
index 8ef59ff..a1c8b6a 100644
--- a/app/index.tsx
+++ b/app/index.tsx
@@ -15,6 +15,8 @@ const Index = () => {
     const {
         isProfileActive,
         setProfileActive,
+        isMenuActive,
+        setMenuActive,
         userId,
         userName,
         setUserName,
@@ -41,6 +43,7 @@ const Index = () => {
         <View style={[styles.indexContainer, { backgroundColor: theme.colors.background }]}>
             <TopNav
                 toggleProfile={() => setProfileActive(true)}
+                toggleMenu={() => setMenuActive(true)}
             />
             <Status
                 id={userId}
@@ -50,6 +53,7 @@ const Index = () => {
                 setStatus={setUserStatus}
                 currentTheme={currentTheme}
                 isProfileActive={isProfileActive}
+                isMenuActive={isMenuActive}
             />
             <Profile
                 visible={isProfileActive}
diff --git a/components/Status.tsx b/components/Status.tsx
index bbb211b..0c53b68 100644
--- a/components/Status.tsx
+++ b/components/Status.tsx
@@ -27,9 +27,10 @@ interface StatusProps {
     setStatus: (currentStatus: string) => void;
     currentTheme: string;
     isProfileActive: boolean;
+    isMenuActive: boolean;
 }
 
-const Status: React.FC<StatusProps> = ({ id, name, image, currentStatus, setStatus, currentTheme, isProfileActive })  => {
+const Status: React.FC<StatusProps> = ({ id, name, image, currentStatus, setStatus, currentTheme, isProfileActive, isMenuActive })  => {
     log.debug("WebSocket URL: ", WS_URL);
     log.debug("API URL: ", API_URL);
     const theme = useTheme();
@@ -166,7 +167,7 @@ const Status: React.FC<StatusProps> = ({ id, name, image, currentStatus, setStat
     }, [lastMessage, setStatus, id]);
 
     return (
-        <View style={[styles.container, isProfileActive && { display: 'none' }]}>
+        <View style={[styles.container, (isProfileActive || isMenuActive) && { display: 'none' }]}>
             <ImageBackground source={require('../assets/images/bg.webp')} style={styles.imageBackground} />
             <View style={styles.listContainer}>
                 <List.Section style={styles.listColumn}>
diff --git a/components/TopNav.tsx b/components/TopNav.tsx
index bd468e9..8784993 100644
--- a/components/TopNav.tsx
+++ b/components/TopNav.tsx
@@ -6,7 +6,7 @@ import About from "@/components/About";
 import Privacy from "@/components/Privacy";
 import Broken from "@/components/Broken";
 
-const TopNav = ({ toggleProfile }: { toggleProfile: () => void; }) => {
+const TopNav = ({ toggleProfile, toggleMenu }: { toggleProfile: () => void; toggleMenu: () => void; }) => {
     const theme = useTheme();
     const colorScheme = useColorScheme();
     const [aboutVisible, setAboutVisible] = useState(false);
@@ -25,10 +25,7 @@ const TopNav = ({ toggleProfile }: { toggleProfile: () => void; }) => {
                         <Menu.Item onPress={() => { setMenuVisible(false); setBugVisible(true);}} title="Report a Bug" style={{ backgroundColor: theme.colors.primaryContainer }}/>
                     </Menu>
                     <Appbar.Action icon="menu"
-                        onPressIn={(event) => {
-                            setMenuAnchor({ x: event.nativeEvent.pageX, y: event.nativeEvent.pageY + 40 });
-                            setMenuVisible(true);
-                        }}
+                        onPress={toggleMenu}
                         iconColor={theme.colors.primary} />
                 </View>
                 <View style={styles.logoContainer} >
diff --git a/context/UserContext.tsx b/context/UserContext.tsx
index 151f63b..8dfda1b 100644
--- a/context/UserContext.tsx
+++ b/context/UserContext.tsx
@@ -11,6 +11,8 @@ export const API_URL = process.env.EXPO_PUBLIC_API_URL;
 interface UserContextType {
     isProfileActive: boolean;
     setProfileActive: (active: boolean) => void;
+    isMenuActive: boolean;
+    setMenuActive: (active: boolean) => void;
     userId: string;
     userName: string;
     setUserName: (name: string) => void;
@@ -34,6 +36,7 @@ interface UserProviderProps {
 
 export const UserProvider: React.FC<UserProviderProps> = ({ children }) => {
     const [isProfileActive, setProfileActive] = useState(false);
+    const [isMenuActive, setMenuActive] = useState(false);
     const [userId, setUserId] = useState("");
     const [userName, setUserName] = useState("");
     const [userImage, setUserImage] = useState("");
@@ -130,6 +133,8 @@ export const UserProvider: React.FC<UserProviderProps> = ({ children }) => {
             value={{
                 isProfileActive,
                 setProfileActive,
+                isMenuActive,
+                setMenuActive,
                 userId,
                 userName,
                 setUserName,