ansxor.ca
forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
don't underline handle in post meta (#3591)
* alignment
remove the unnecessary styles now
seriously?
flex-end everything
flex shrink
test
test
rm unneeded flex
flex the text
don't underline handle in post meta
* use `paddingLeft`
* use `paddingLeft` but with `4`
* Fix overflow color
* Use nbsp to make mobile work
---------
Co-authored-by: Dan Abramov <dan.abramov@gmail.com>
authored by
Dan Abramov
and committed by
GitHub
086dc93a
7e16276c
+24
-15
src/view/com/util/Link.tsx
+24
-15
src/view/com/util/Link.tsx
···
2
import {
3
GestureResponderEvent,
4
Platform,
5
StyleProp,
6
TextStyle,
7
-
TextProps,
8
View,
9
ViewStyle,
10
-
Pressable,
11
-
TouchableOpacity,
12
} from 'react-native'
13
-
import {useLinkProps, StackActions} from '@react-navigation/native'
14
-
import {Text} from './text/Text'
15
-
import {TypographyVariant} from 'lib/ThemeContext'
16
-
import {router} from '../../../routes'
17
import {
18
convertBskyAppUrlIfNeeded,
19
isExternalUrl,
20
linkRequiresWarning,
21
} from 'lib/strings/url-helpers'
22
import {isAndroid, isWeb} from 'platform/detection'
23
-
import {sanitizeUrl} from '@braintree/sanitize-url'
24
-
import {PressableWithHover} from './PressableWithHover'
25
-
import {useModalControls} from '#/state/modals'
26
-
import {useOpenLink} from '#/state/preferences/in-app-browser'
27
import {WebAuxClickWrapper} from 'view/com/util/WebAuxClickWrapper'
28
-
import {
29
-
DebouncedNavigationProp,
30
-
useNavigationDeduped,
31
-
} from 'lib/hooks/useNavigationDeduped'
32
import {useTheme} from '#/alf'
33
34
type Event =
35
| React.MouseEvent<HTMLAnchorElement, MouseEvent>
···
149
onPress,
150
disableMismatchWarning,
151
navigationAction,
152
...orgProps
153
}: {
154
testID?: string
···
162
title?: string
163
disableMismatchWarning?: boolean
164
navigationAction?: 'push' | 'replace' | 'navigate'
165
} & TextProps) {
166
const {...props} = useLinkProps({to: sanitizeUrl(href)})
167
const navigation = useNavigationDeduped()
···
172
console.error('Unable to detect mismatching label')
173
}
174
175
props.onPress = React.useCallback(
176
(e?: Event) => {
177
const requiresWarning =
···
267
navigationAction?: 'push' | 'replace' | 'navigate'
268
disableMismatchWarning?: boolean
269
onPointerEnter?: () => void
270
}
271
export const TextLinkOnWebOnly = memo(function DesktopWebTextLink({
272
testID,
···
2
import {
3
GestureResponderEvent,
4
Platform,
5
+
Pressable,
6
StyleProp,
7
+
TextProps,
8
TextStyle,
9
+
TouchableOpacity,
10
View,
11
ViewStyle,
12
} from 'react-native'
13
+
import {sanitizeUrl} from '@braintree/sanitize-url'
14
+
import {StackActions, useLinkProps} from '@react-navigation/native'
15
+
16
+
import {useModalControls} from '#/state/modals'
17
+
import {useOpenLink} from '#/state/preferences/in-app-browser'
18
+
import {
19
+
DebouncedNavigationProp,
20
+
useNavigationDeduped,
21
+
} from 'lib/hooks/useNavigationDeduped'
22
import {
23
convertBskyAppUrlIfNeeded,
24
isExternalUrl,
25
linkRequiresWarning,
26
} from 'lib/strings/url-helpers'
27
+
import {TypographyVariant} from 'lib/ThemeContext'
28
import {isAndroid, isWeb} from 'platform/detection'
29
import {WebAuxClickWrapper} from 'view/com/util/WebAuxClickWrapper'
30
import {useTheme} from '#/alf'
31
+
import {router} from '../../../routes'
32
+
import {PressableWithHover} from './PressableWithHover'
33
+
import {Text} from './text/Text'
34
35
type Event =
36
| React.MouseEvent<HTMLAnchorElement, MouseEvent>
···
150
onPress,
151
disableMismatchWarning,
152
navigationAction,
153
+
anchorNoUnderline,
154
...orgProps
155
}: {
156
testID?: string
···
164
title?: string
165
disableMismatchWarning?: boolean
166
navigationAction?: 'push' | 'replace' | 'navigate'
167
+
anchorNoUnderline?: boolean
168
} & TextProps) {
169
const {...props} = useLinkProps({to: sanitizeUrl(href)})
170
const navigation = useNavigationDeduped()
···
175
console.error('Unable to detect mismatching label')
176
}
177
178
+
if (anchorNoUnderline) {
179
+
dataSet = dataSet ?? {}
180
+
dataSet.noUnderline = 1
181
+
}
182
+
183
props.onPress = React.useCallback(
184
(e?: Event) => {
185
const requiresWarning =
···
275
navigationAction?: 'push' | 'replace' | 'navigate'
276
disableMismatchWarning?: boolean
277
onPointerEnter?: () => void
278
+
anchorNoUnderline?: boolean
279
}
280
export const TextLinkOnWebOnly = memo(function DesktopWebTextLink({
281
testID,
+19
-16
src/view/com/util/PostMeta.tsx
+19
-16
src/view/com/util/PostMeta.tsx
···
35
const handle = opts.author.handle
36
const prefetchProfileQuery = usePrefetchProfileQuery()
37
38
return (
39
<View style={[styles.container, opts.style]}>
40
{opts.showAvatar && (
···
49
/>
50
</View>
51
)}
52
-
<View style={styles.maxWidth}>
53
<TextLinkOnWebOnly
54
type={opts.displayNameType || 'lg-bold'}
55
style={[pal.text, opts.displayNameStyle]}
56
-
numberOfLines={1}
57
lineHeight={1.2}
58
disableMismatchWarning
59
text={
···
62
displayName,
63
opts.moderation?.ui('displayName'),
64
)}
65
-
66
-
<Text
67
-
type="md"
68
-
numberOfLines={1}
69
-
lineHeight={1.2}
70
-
style={pal.textLight}>
71
-
{sanitizeHandle(handle, '@')}
72
-
</Text>
73
</>
74
}
75
-
href={makeProfileLink(opts.author)}
76
-
onPointerEnter={
77
-
isWeb ? () => prefetchProfileQuery(opts.author.did) : undefined
78
-
}
79
/>
80
-
</View>
81
{!isAndroid && (
82
<Text
83
type="md"
···
110
const styles = StyleSheet.create({
111
container: {
112
flexDirection: 'row',
113
-
alignItems: 'center',
114
paddingBottom: 2,
115
gap: 4,
116
zIndex: 1,
···
35
const handle = opts.author.handle
36
const prefetchProfileQuery = usePrefetchProfileQuery()
37
38
+
const profileLink = makeProfileLink(opts.author)
39
+
const onPointerEnter = isWeb
40
+
? () => prefetchProfileQuery(opts.author.did)
41
+
: undefined
42
+
43
return (
44
<View style={[styles.container, opts.style]}>
45
{opts.showAvatar && (
···
54
/>
55
</View>
56
)}
57
+
<Text numberOfLines={1} style={[styles.maxWidth, pal.textLight]}>
58
<TextLinkOnWebOnly
59
type={opts.displayNameType || 'lg-bold'}
60
style={[pal.text, opts.displayNameStyle]}
61
lineHeight={1.2}
62
disableMismatchWarning
63
text={
···
66
displayName,
67
opts.moderation?.ui('displayName'),
68
)}
69
</>
70
}
71
+
href={profileLink}
72
+
onPointerEnter={onPointerEnter}
73
+
/>
74
+
<TextLinkOnWebOnly
75
+
type="md"
76
+
disableMismatchWarning
77
+
style={[pal.textLight, {flexShrink: 4}]}
78
+
text={'\xa0' + sanitizeHandle(handle, '@')}
79
+
href={profileLink}
80
+
onPointerEnter={onPointerEnter}
81
+
anchorNoUnderline
82
/>
83
+
</Text>
84
{!isAndroid && (
85
<Text
86
type="md"
···
113
const styles = StyleSheet.create({
114
container: {
115
flexDirection: 'row',
116
+
alignItems: 'flex-end',
117
paddingBottom: 2,
118
gap: 4,
119
zIndex: 1,