chore: close currently open modals/popovers when sharing text into sn

packages/web/src/javascripts/Components/Popover/MobilePopoverContent.tsx

@@ -1,10 +1,11 @@
 import { useDisableBodyScrollOnMobile } from '@/Hooks/useDisableBodyScrollOnMobile'
 import { classNames } from '@standardnotes/snjs'
-import { ReactNode } from 'react'
+import { ReactNode, useCallback } from 'react'
 import Portal from '../Portal/Portal'
 import MobileModalAction from '../Modal/MobileModalAction'
 import { useModalAnimation } from '../Modal/useModalAnimation'
 import MobileModalHeader from '../Modal/MobileModalHeader'
+import { mergeRefs } from '@/Hooks/mergeRefs'
 
 const DisableScroll = () => {
   useDisableBodyScrollOnMobile()
@@ -12,6 +13,8 @@ const DisableScroll = () => {
   return null
 }
 
+type PopoverWithClose = HTMLDivElement & { close: () => void }
+
 const MobilePopoverContent = ({
   open,
   requestClose,
@@ -29,6 +32,15 @@ const MobilePopoverContent = ({
 }) => {
   const [isMounted, setPopoverElement] = useModalAnimation(open)
 
+  const addCloseMethod = useCallback(
+    (element: HTMLDivElement | null) => {
+      if (element) {
+        ;(element as PopoverWithClose).close = requestClose
+      }
+    },
+    [requestClose],
+  )
+
   if (!isMounted) {
     return null
   }
@@ -37,7 +49,7 @@ const MobilePopoverContent = ({
     <Portal>
       <DisableScroll />
       <div
-        ref={setPopoverElement}
+        ref={mergeRefs([setPopoverElement, addCloseMethod])}
         className="fixed top-0 left-0 z-modal flex h-full w-full flex-col bg-default pt-safe-top pb-safe-bottom"
         data-popover={id}
         data-mobile-popover