fix: compatible with android for summary modal

This commit is contained in:
lawvs 2025-06-21 04:18:29 +08:00
parent 412dfe478e
commit f9595ffff8
1 changed files with 32 additions and 28 deletions

View File

@ -13,6 +13,7 @@ import {
StyleSheet,
Text,
TextInput,
TouchableOpacity,
View,
} from "react-native"
import Animated, {
@ -108,13 +109,13 @@ export const AISummary: FC<{
</MaskedView>
</View>
{summaryTextForSheet && (
<Pressable
<TouchableOpacity
onPress={() => setSheetOpen(true)}
className="bg-quaternary-system-fill rounded-full p-1.5 active:opacity-70"
hitSlop={{ top: 8, bottom: 8, left: 8, right: 8 }}
>
<CopyCuteReIcon width={14} height={14} color={purpleColor} />
</Pressable>
</TouchableOpacity>
)}
</View>
<Animated.View style={animatedContentStyle}>
@ -239,33 +240,36 @@ const SelectableTextSheet: FC<{
onRequestClose={handleClose}
animationType="fade"
statusBarTranslucent
navigationBarTranslucent
>
<Pressable onPress={handleClose} style={StyleSheet.absoluteFill}>
<View className="bg-black/40" style={StyleSheet.absoluteFill} />
</Pressable>
<Animated.View
className="bg-system-background absolute inset-x-0 bottom-0 max-h-[70%] overflow-hidden rounded-t-2xl border-t-zinc-200 p-4 dark:border-t-zinc-800"
style={[{ paddingBottom: insets.bottom + 10 }, sheetAnimatedStyle]}
>
<View className="mb-4 flex-row items-center justify-between">
<Pressable
onPress={handleCopyAll}
className="rounded-full bg-zinc-100 p-2 active:opacity-80 dark:bg-zinc-800"
>
<CopyCuteReIcon width={18} height={18} color={textColor} />
</Pressable>
<Text className="text-label text-lg font-semibold">AI Summary</Text>
<Pressable
onPress={handleClose}
className="rounded-full bg-zinc-100 p-2 active:opacity-80 dark:bg-zinc-800"
>
<CloseCuteReIcon width={18} height={18} color={textColor} />
</Pressable>
</View>
<ScrollView showsVerticalScrollIndicator={false}>
<SelectableText className="text-label text-base leading-6">{text}</SelectableText>
</ScrollView>
</Animated.View>
<View className="relative max-h-screen min-h-screen w-screen">
<Pressable onPress={handleClose} style={StyleSheet.absoluteFill}>
<View className="bg-black/40" style={StyleSheet.absoluteFill} />
</Pressable>
<Animated.View
className="bg-system-background absolute inset-x-0 bottom-0 max-h-[70%] overflow-hidden rounded-t-2xl border-t-zinc-200 p-4 dark:border-t-zinc-800"
style={[{ paddingBottom: insets.bottom + 10 }, sheetAnimatedStyle]}
>
<View className="mb-4 flex-row items-center justify-between">
<TouchableOpacity
onPress={handleCopyAll}
className="rounded-full bg-zinc-100 p-2 active:opacity-80 dark:bg-zinc-800"
>
<CopyCuteReIcon width={18} height={18} color={textColor} />
</TouchableOpacity>
<Text className="text-label text-lg font-semibold">AI Summary</Text>
<TouchableOpacity
onPress={handleClose}
className="rounded-full bg-zinc-100 p-2 active:opacity-80 dark:bg-zinc-800"
>
<CloseCuteReIcon width={18} height={18} color={textColor} />
</TouchableOpacity>
</View>
<ScrollView showsVerticalScrollIndicator={false}>
<SelectableText className="text-label text-base leading-6">{text}</SelectableText>
</ScrollView>
</Animated.View>
</View>
</Modal>
)
}