diff --git a/src/components/images/Gallery/index.tsx b/src/components/images/Gallery/index.tsx index f14e8b5913..06b06d60eb 100644 --- a/src/components/images/Gallery/index.tsx +++ b/src/components/images/Gallery/index.tsx @@ -9,8 +9,6 @@ import { isValidElement, } from 'react' import {FlatList, Pressable, useWindowDimensions, View} from 'react-native' -import {DrawerGestureContext} from 'react-native-drawer-layout' -import {Gesture, GestureDetector} from 'react-native-gesture-handler' import Animated, {type AnimatedRef, useAnimatedRef} from 'react-native-reanimated' import {Image} from 'expo-image' import {type AppBskyEmbedImages} from '@atproto/api' @@ -102,6 +100,9 @@ export function Gallery({ return 200 } }, [bps]) + const isWithinQuote = + viewContext === PostEmbedViewContext.FeedEmbedRecordWithMedia + const hideBadges = isWithinQuote /* * Container overflow styles @@ -205,6 +206,8 @@ export function Gallery({ renderItem={({item, index}) => { return ( void itemRef: (node: View | null) => void + hideBadges?: boolean + largeAltBadge?: boolean onContainerRef: (index: number, ref: AnimatedRef) => void onThumbDims: (index: number, dims: Dimensions) => void onPress?: () => void onPressIn?: () => void }) { const t = useTheme() + const {t: l} = useLingui() const containerRef = useAnimatedRef() const [aspectRatio, setAspectRatio] = useState(() => getAspectRatio(image.aspectRatio), @@ -347,8 +355,14 @@ function GalleryImage({ onPress={onPress} onPressIn={onPressIn} accessibilityRole="button" - accessibilityLabel={image.alt || undefined} - accessibilityHint="" + accessibilityLabel={ + image.alt || l`Image ${index + 1}` + } + accessibilityHint={l`Opens full image`} + android_ripple={{ + color: utils.alpha(t.atoms.bg.backgroundColor, 0.2), + foreground: true, + }} style={[a.rounded_md, a.overflow_hidden, t.atoms.bg_contrast_25]}> { const ar = getAspectRatio(e.source) @@ -370,6 +384,39 @@ function GalleryImage({ }) }} /> + + {image.alt && !hideBadges ? ( + + + ALT + + + ) : null} + + )