From 9461355bc6fa9d3946df2c2e72f2fa67190881de Mon Sep 17 00:00:00 2001
From: Chensokheng <52232579+Chensokheng@users.noreply.github.com>
Date: Wed, 25 Oct 2023 15:50:55 +0700
Subject: [PATCH] fix(doc): scroll stuck when user resize after open menu in
 mobile view (#18294)

menuState.setMenuMobileOpen(!mobileMenuOpen)
---
 apps/docs/layouts/SiteLayout.tsx | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/apps/docs/layouts/SiteLayout.tsx b/apps/docs/layouts/SiteLayout.tsx
index f65a3985c80..d7663697789 100644
--- a/apps/docs/layouts/SiteLayout.tsx
+++ b/apps/docs/layouts/SiteLayout.tsx
@@ -5,7 +5,7 @@ import NavigationMenu from '~/components/Navigation/NavigationMenu/NavigationMen
 import TopNavBar from '~/components/Navigation/NavigationMenu/TopNavBar'
 
 import Head from 'next/head'
-import { PropsWithChildren, memo } from 'react'
+import { PropsWithChildren, memo, useEffect } from 'react'
 import Footer from '~/components/Navigation/Footer'
 import { menuState, useMenuLevelId, useMenuMobileOpen } from '~/hooks/useMenuState'
 
@@ -202,6 +202,19 @@ const MobileHeader = memo(function MobileHeader() {
 
 const MobileMenuBackdrop = memo(function MobileMenuBackdrop() {
   const mobileMenuOpen = useMenuMobileOpen()
+
+  useEffect(() => {
+    window.addEventListener('resize', (e: UIEvent) => {
+      const w = e.target as Window
+      if (mobileMenuOpen && w.innerWidth >= 1024) {
+        menuState.setMenuMobileOpen(!mobileMenuOpen)
+      }
+    })
+    return () => {
+      window.removeEventListener('resize', () => {})
+    }
+  }, [mobileMenuOpen])
+
   return (
     <div
       className={[