fix: close menu & toggle notes list when note action occurs (#1601)

packages/web/src/javascripts/Components/ResponsivePane/ResponsivePaneProvider.tsx

@@ -1,6 +1,6 @@
 import { ElementIds } from '@/Constants/ElementIDs'
 import { isMobileScreen } from '@/Utils'
-import { useEffect, ReactNode, useMemo, createContext, useCallback, useContext, useState } from 'react'
+import { useEffect, ReactNode, useMemo, createContext, useCallback, useContext, useState, memo } from 'react'
 import { AppPaneId } from './AppPaneMetadata'
 
 type ResponsivePaneData = {
@@ -24,6 +24,8 @@ type Props = {
   children: ReactNode
 }
 
+const MemoizedChildren = memo(({ children }: Props) => <div>{children}</div>)
+
 const ResponsivePaneProvider = ({ children }: Props) => {
   const [currentSelectedPane, setCurrentSelectedPane] = useState<AppPaneId>(
     isMobileScreen() ? AppPaneId.Items : AppPaneId.Editor,
@@ -63,7 +65,11 @@ const ResponsivePaneProvider = ({ children }: Props) => {
     [currentSelectedPane, toggleAppPane],
   )
 
-  return <ResponsivePaneContext.Provider value={contextValue}>{children}</ResponsivePaneContext.Provider>
+  return (
+    <ResponsivePaneContext.Provider value={contextValue}>
+      <MemoizedChildren children={children} />
+    </ResponsivePaneContext.Provider>
+  )
 }
 
 export default ResponsivePaneProvider