From 0aa301e251f2799ca9a96598a059eaf5c9d5045e Mon Sep 17 00:00:00 2001
From: Ashley Harrison <ashley.harrison@grafana.com>
Date: Tue, 11 Apr 2023 13:05:08 +0100
Subject: [PATCH] Navigation: Scrolled hamburger menu links now navigate
 correctly in Safari (#66261)

overlayProps/dialogProps need to go inside FocusScope
---
 public/app/core/components/MegaMenu/NavBarMenu.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/public/app/core/components/MegaMenu/NavBarMenu.tsx b/public/app/core/components/MegaMenu/NavBarMenu.tsx
index 7e34dc45069..0522c1eefa3 100644
--- a/public/app/core/components/MegaMenu/NavBarMenu.tsx
+++ b/public/app/core/components/MegaMenu/NavBarMenu.tsx
@@ -61,8 +61,8 @@ export function NavBarMenu({ activeItem, navItems, searchBarHidden, onClose }: P
         timeout={{ enter: animationSpeed, exit: 0 }}
         onExited={onClose}
       >
-        <div data-testid="navbarmenu" ref={ref} {...overlayProps} {...dialogProps} className={styles.container}>
-          <FocusScope contain autoFocus>
+        <FocusScope contain autoFocus>
+          <div data-testid="navbarmenu" ref={ref} {...overlayProps} {...dialogProps} className={styles.container}>
             <div className={styles.mobileHeader}>
               <Icon name="bars" size="xl" />
               <IconButton
@@ -82,8 +82,8 @@ export function NavBarMenu({ activeItem, navItems, searchBarHidden, onClose }: P
                 </ul>
               </CustomScrollbar>
             </nav>
-          </FocusScope>
-        </div>
+          </div>
+        </FocusScope>
       </CSSTransition>
       <CSSTransition
         nodeRef={backdropRef}