From aa1f7d976ece3da7657dd29813e1f16ce61d60bc Mon Sep 17 00:00:00 2001
From: Aman Harwara <amanharwara@protonmail.com>
Date: Fri, 12 May 2023 22:00:27 +0530
Subject: [PATCH] chore: dont autofocus menu items on mobile

---
 packages/web/src/javascripts/Components/Menu/Menu.tsx | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/packages/web/src/javascripts/Components/Menu/Menu.tsx b/packages/web/src/javascripts/Components/Menu/Menu.tsx
index ff096b1af..ce0677372 100644
--- a/packages/web/src/javascripts/Components/Menu/Menu.tsx
+++ b/packages/web/src/javascripts/Components/Menu/Menu.tsx
@@ -10,6 +10,7 @@ import {
 import { KeyboardKey } from '@standardnotes/ui-services'
 import { useListKeyboardNavigation } from '@/Hooks/useListKeyboardNavigation'
 import { mergeRefs } from '@/Hooks/mergeRefs'
+import { MutuallyExclusiveMediaQueryBreakpoints, useMediaQuery } from '@/Hooks/useMediaQuery'
 
 type MenuProps = {
   className?: string
@@ -51,7 +52,13 @@ const Menu = forwardRef(
       [closeMenu, onKeyDown],
     )
 
-    const { setInitialFocus } = useListKeyboardNavigation(menuElementRef, initialFocus, shouldAutoFocus)
+    const isMobileScreen = useMediaQuery(MutuallyExclusiveMediaQueryBreakpoints.sm)
+
+    const { setInitialFocus } = useListKeyboardNavigation(
+      menuElementRef,
+      initialFocus,
+      isMobileScreen ? false : shouldAutoFocus,
+    )
 
     useImperativeHandle(forwardedRef, () => ({
       focus: () => {