feat: fix payment flow

src/components/Overlay.js

@@ -19,6 +19,7 @@ const Overlay = ({
   contentContainerStyle = {},
 
   hasPortal = true,
+  keepMounted = false,
 }) => {
   const { isNative } = useLayoutType()
 
@@ -27,15 +28,17 @@ const Overlay = ({
   const shouldUseBlur = resolvedBlurIntensity > 0
   const BackgroundView = shouldUseBlur ? BlurView : View
   const backgroundProps = shouldUseBlur ? { intensity: resolvedBlurIntensity, tint: 'dark' } : {}
+  const shouldRender = isVisible || keepMounted
+  const isKeptHidden = keepMounted && !isVisible
 
   return (
     <ContentContainerView>
       <AnimatePresence>
-        {isVisible ? (
+        {shouldRender ? (
           <Motion.View
             key="overlay"
             initial={{ opacity: 0 }}
-            animate={{ opacity: 1 }}
+            animate={{ opacity: isVisible ? 1 : 0 }}
             exit={{ opacity: 0 }}
             transition={{
               type: 'tween',
@@ -47,6 +50,7 @@ const Overlay = ({
               backgroundColor: Palette.ultraLightBlack,
               flex: 1,
               ...Style.containerCenter,
+              pointerEvents: isKeptHidden ? 'none' : 'auto',
             }}
           >
             <BackgroundView