From c3067b99529ecaebc775f670e2fe9b95910402be Mon Sep 17 00:00:00 2001
From: lawvs <18554747+lawvs@users.noreply.github.com>
Date: Mon, 12 May 2025 19:41:32 +0800
Subject: [PATCH] fix: add experimentalBlurMethod prop to ThemedBlurView in
 EntryNormalItem for better Android support

---
 apps/mobile/src/components/common/ThemedBlurView.tsx   | 10 +++++++++-
 .../modules/entry-list/templates/EntryNormalItem.tsx   |  6 +++++-
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/apps/mobile/src/components/common/ThemedBlurView.tsx b/apps/mobile/src/components/common/ThemedBlurView.tsx
index 794011105..f9e16ee7e 100644
--- a/apps/mobile/src/components/common/ThemedBlurView.tsx
+++ b/apps/mobile/src/components/common/ThemedBlurView.tsx
@@ -4,6 +4,12 @@ import { useColorScheme } from "nativewind"
 import { Platform, StyleSheet, View } from "react-native"
 import { useColor } from "react-native-uikit-colors"
 
+/**
+ * @android In Android, the BlurView is experimental and not fully supported,
+ * so we use a normal View with a background color with **100% opacity**.
+ * However, if the `experimentalBlurMethod` prop is explicitly provided,
+ * we'll use the BlurView even on Android,
+ */
 export const ThemedBlurView = ({
   ref,
   tint,
@@ -13,7 +19,9 @@ export const ThemedBlurView = ({
 
   const background = useColor("systemBackground")
 
-  return Platform.OS === "ios" ? (
+  const useBlurView = Platform.OS === "ios" || "experimentalBlurMethod" in rest
+
+  return useBlurView ? (
     <BlurView
       ref={ref}
       intensity={100}
diff --git a/apps/mobile/src/modules/entry-list/templates/EntryNormalItem.tsx b/apps/mobile/src/modules/entry-list/templates/EntryNormalItem.tsx
index 42b434bce..db44c2e5b 100644
--- a/apps/mobile/src/modules/entry-list/templates/EntryNormalItem.tsx
+++ b/apps/mobile/src/modules/entry-list/templates/EntryNormalItem.tsx
@@ -164,7 +164,11 @@ export const EntryNormalItem = memo(
                   }}
                 >
                   <View className="overflow-hidden rounded-full p-2">
-                    <ThemedBlurView style={StyleSheet.absoluteFillObject} intensity={30} />
+                    <ThemedBlurView
+                      style={StyleSheet.absoluteFillObject}
+                      intensity={30}
+                      experimentalBlurMethod="none"
+                    />
                     {isPlaying ? (
                       <PauseCuteFiIcon color="white" width={24} height={24} />
                     ) : isLoading ? (