last tickets

src/components/Overlay.js

@@ -1,5 +1,5 @@
 import React from "react";
-import { Platform, Pressable, StyleSheet } from "react-native";
+import { Pressable, StyleSheet, View } from "react-native";
 import { AnimatePresence, Motion } from "@legendapp/motion";
 import { BlurView } from "expo-blur";
 import { Portal } from "@gorhom/portal";
@@ -23,6 +23,13 @@ const Overlay = ({
   const { isNative } = useLayoutType();
 
   const ContentContainerView = hasPortal ? Portal : React.Fragment;
+  const resolvedBlurIntensity =
+    blurIntensity ?? (isNative ? defaultBlurIntensity : 15);
+  const shouldUseBlur = resolvedBlurIntensity > 0;
+  const BackgroundView = shouldUseBlur ? BlurView : View;
+  const backgroundProps = shouldUseBlur
+    ? { intensity: resolvedBlurIntensity, tint: "dark" }
+    : {};
 
   return (
     <ContentContainerView>
@@ -45,9 +52,8 @@ const Overlay = ({
               ...Style.containerCenter,
             }}
           >
-            <BlurView
-              intensity={blurIntensity || isNative ? defaultBlurIntensity : 15}
-              tint="dark"
+            <BackgroundView
+              {...backgroundProps}
               style={{
                 width: "100%",
                 height: "100%",
@@ -69,7 +75,7 @@ const Overlay = ({
                 }}
               />
               {children}
-            </BlurView>
+            </BackgroundView>
           </Motion.View>
         ) : null}
       </AnimatePresence>