forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
Use `Pressable` for most links/embeds (#1181)
* delay press on all links
* use Pressable for all accessible links
authored by
Eric Bailey
and committed by
GitHub
46202274
4654a9a4
+15
-33
+3
-10
src/view/com/feeds/CustomFeed.tsx
+3
-10
src/view/com/feeds/CustomFeed.tsx
···
1
1
import React from 'react'
2
-
import {
3
-
Pressable,
4
-
StyleProp,
5
-
StyleSheet,
6
-
View,
7
-
ViewStyle,
8
-
TouchableOpacity,
9
-
} from 'react-native'
2
+
import {Pressable, StyleProp, StyleSheet, View, ViewStyle} from 'react-native'
10
3
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
11
4
import {Text} from '../util/text/Text'
12
5
import {usePalette} from 'lib/hooks/usePalette'
···
68
61
}, [store, item])
69
62
70
63
return (
71
-
<TouchableOpacity
64
+
<Pressable
72
65
testID={`feed-${item.displayName}`}
73
66
accessibilityRole="button"
74
67
style={[styles.container, pal.border, style]}
···
132
125
{pluralize(item.data.likeCount || 0, 'user')}
133
126
</Text>
134
127
) : null}
135
-
</TouchableOpacity>
128
+
</Pressable>
136
129
)
137
130
},
138
131
)
+4
-3
src/view/com/util/Link.tsx
+4
-3
src/view/com/util/Link.tsx
···
9
9
TextProps,
10
10
View,
11
11
ViewStyle,
12
+
Pressable,
13
+
TouchableWithoutFeedback,
12
14
TouchableOpacity,
13
-
TouchableWithoutFeedback,
14
15
} from 'react-native'
15
16
import {
16
17
useLinkProps,
···
112
113
}
113
114
114
115
return (
115
-
<TouchableOpacity
116
+
<Pressable
116
117
testID={testID}
117
118
style={style}
118
119
onPress={onPress}
···
122
123
href={asAnchor ? sanitizeUrl(href) : undefined}
123
124
{...props}>
124
125
{children ? children : <Text>{title || 'link'}</Text>}
125
-
</TouchableOpacity>
126
+
</Pressable>
126
127
)
127
128
})
128
129
+3
-11
src/view/com/util/images/AutoSizedImage.tsx
+3
-11
src/view/com/util/images/AutoSizedImage.tsx
···
1
1
import React from 'react'
2
-
import {
3
-
StyleProp,
4
-
StyleSheet,
5
-
TouchableOpacity,
6
-
View,
7
-
ViewStyle,
8
-
} from 'react-native'
2
+
import {StyleProp, StyleSheet, Pressable, View, ViewStyle} from 'react-native'
9
3
import {Image} from 'expo-image'
10
4
import {clamp} from 'lib/numbers'
11
5
import {useStores} from 'state/index'
12
6
import {Dimensions} from 'lib/media/types'
13
7
14
-
export const DELAY_PRESS_IN = 500
15
8
const MIN_ASPECT_RATIO = 0.33 // 1/3
16
9
const MAX_ASPECT_RATIO = 5 // 5/1
17
10
···
57
50
58
51
if (onPress || onLongPress || onPressIn) {
59
52
return (
60
-
<TouchableOpacity
53
+
<Pressable
61
54
onPress={onPress}
62
55
onLongPress={onLongPress}
63
56
onPressIn={onPressIn}
64
-
delayPressIn={DELAY_PRESS_IN}
65
57
style={[styles.container, style]}
66
58
accessible={true}
67
59
accessibilityRole="button"
···
74
66
accessibilityIgnoresInvertColors
75
67
/>
76
68
{children}
77
-
</TouchableOpacity>
69
+
</Pressable>
78
70
)
79
71
}
80
72
+3
-6
src/view/com/util/images/Gallery.tsx
+3
-6
src/view/com/util/images/Gallery.tsx
···
1
1
import {AppBskyEmbedImages} from '@atproto/api'
2
2
import React, {ComponentProps, FC} from 'react'
3
-
import {StyleSheet, Text, TouchableOpacity, View} from 'react-native'
3
+
import {StyleSheet, Text, Pressable, View} from 'react-native'
4
4
import {Image} from 'expo-image'
5
5
6
6
type EventFunction = (index: number) => void
···
14
14
imageStyle: ComponentProps<typeof Image>['style']
15
15
}
16
16
17
-
const DELAY_PRESS_IN = 500
18
-
19
17
export const GalleryItem: FC<GalleryItemProps> = ({
20
18
images,
21
19
index,
···
28
26
29
27
return (
30
28
<View>
31
-
<TouchableOpacity
32
-
delayPressIn={DELAY_PRESS_IN}
29
+
<Pressable
33
30
onPress={onPress ? () => onPress(index) : undefined}
34
31
onPressIn={onPressIn ? () => onPressIn(index) : undefined}
35
32
onLongPress={onLongPress ? () => onLongPress(index) : undefined}
···
44
41
accessibilityHint=""
45
42
accessibilityIgnoresInvertColors
46
43
/>
47
-
</TouchableOpacity>
44
+
</Pressable>
48
45
{image.alt === '' ? null : (
49
46
<View style={styles.altContainer}>
50
47
<Text style={styles.alt} accessible={false}>
+2
-2
src/view/com/util/post-embeds/YoutubeEmbed.tsx
+2
-2
src/view/com/util/post-embeds/YoutubeEmbed.tsx