fix external links in TextLink
This commit is contained in:
+18
-26
@@ -11,11 +11,7 @@ import {
|
|||||||
type ViewStyle,
|
type ViewStyle,
|
||||||
} from 'react-native'
|
} from 'react-native'
|
||||||
import {sanitizeUrl} from '@braintree/sanitize-url'
|
import {sanitizeUrl} from '@braintree/sanitize-url'
|
||||||
import {
|
import {StackActions} from '@react-navigation/native'
|
||||||
StackActions,
|
|
||||||
useLinkBuilder,
|
|
||||||
useLinkProps,
|
|
||||||
} from '@react-navigation/native'
|
|
||||||
|
|
||||||
import {
|
import {
|
||||||
type DebouncedNavigationProp,
|
type DebouncedNavigationProp,
|
||||||
@@ -51,7 +47,7 @@ interface Props extends React.ComponentProps<typeof TouchableOpacity> {
|
|||||||
hoverStyle?: StyleProp<ViewStyle>
|
hoverStyle?: StyleProp<ViewStyle>
|
||||||
noFeedback?: boolean
|
noFeedback?: boolean
|
||||||
asAnchor?: boolean
|
asAnchor?: boolean
|
||||||
dataSet?: Object | undefined
|
dataSet?: any
|
||||||
anchorNoUnderline?: boolean
|
anchorNoUnderline?: boolean
|
||||||
navigationAction?: 'push' | 'replace' | 'navigate'
|
navigationAction?: 'push' | 'replace' | 'navigate'
|
||||||
onPointerEnter?: () => void
|
onPointerEnter?: () => void
|
||||||
@@ -73,6 +69,7 @@ export const Link = memo(function Link({
|
|||||||
onBeforePress,
|
onBeforePress,
|
||||||
accessibilityActions,
|
accessibilityActions,
|
||||||
onAccessibilityAction,
|
onAccessibilityAction,
|
||||||
|
dataSet: dataSetProp,
|
||||||
...props
|
...props
|
||||||
}: Props) {
|
}: Props) {
|
||||||
const t = useTheme()
|
const t = useTheme()
|
||||||
@@ -103,6 +100,14 @@ export const Link = memo(function Link({
|
|||||||
{name: 'activate', label: title},
|
{name: 'activate', label: title},
|
||||||
]
|
]
|
||||||
|
|
||||||
|
const dataSet = useMemo(() => {
|
||||||
|
const ds = {...dataSetProp}
|
||||||
|
if (anchorNoUnderline) {
|
||||||
|
ds.noUnderline = 1
|
||||||
|
}
|
||||||
|
return ds
|
||||||
|
}, [dataSetProp, anchorNoUnderline])
|
||||||
|
|
||||||
if (noFeedback) {
|
if (noFeedback) {
|
||||||
return (
|
return (
|
||||||
<WebAuxClickWrapper>
|
<WebAuxClickWrapper>
|
||||||
@@ -133,17 +138,6 @@ export const Link = memo(function Link({
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
if (anchorNoUnderline) {
|
|
||||||
// @ts-ignore web only -prf
|
|
||||||
props.dataSet = props.dataSet || {}
|
|
||||||
// @ts-ignore web only -prf
|
|
||||||
props.dataSet.noUnderline = 1
|
|
||||||
}
|
|
||||||
|
|
||||||
if (title && !props.accessibilityLabel) {
|
|
||||||
props.accessibilityLabel = title
|
|
||||||
}
|
|
||||||
|
|
||||||
const Com = props.hoverStyle ? PressableWithHover : Pressable
|
const Com = props.hoverStyle ? PressableWithHover : Pressable
|
||||||
return (
|
return (
|
||||||
<Com
|
<Com
|
||||||
@@ -152,8 +146,11 @@ export const Link = memo(function Link({
|
|||||||
onPress={onPress}
|
onPress={onPress}
|
||||||
accessible={accessible}
|
accessible={accessible}
|
||||||
accessibilityRole="link"
|
accessibilityRole="link"
|
||||||
|
accessibilityLabel={props.accessibilityLabel ?? title}
|
||||||
|
accessibilityHint={props.accessibilityHint}
|
||||||
// @ts-ignore web only -prf
|
// @ts-ignore web only -prf
|
||||||
href={anchorHref}
|
href={anchorHref}
|
||||||
|
dataSet={dataSet}
|
||||||
{...props}>
|
{...props}>
|
||||||
{children ? children : <Text>{title || 'link'}</Text>}
|
{children ? children : <Text>{title || 'link'}</Text>}
|
||||||
</Com>
|
</Com>
|
||||||
@@ -175,7 +172,7 @@ export const TextLink = memo(function TextLink({
|
|||||||
disableMismatchWarning,
|
disableMismatchWarning,
|
||||||
navigationAction,
|
navigationAction,
|
||||||
anchorNoUnderline,
|
anchorNoUnderline,
|
||||||
...orgProps
|
...props
|
||||||
}: {
|
}: {
|
||||||
testID?: string
|
testID?: string
|
||||||
type?: TypographyVariant
|
type?: TypographyVariant
|
||||||
@@ -191,12 +188,6 @@ export const TextLink = memo(function TextLink({
|
|||||||
anchorNoUnderline?: boolean
|
anchorNoUnderline?: boolean
|
||||||
onBeforePress?: () => void
|
onBeforePress?: () => void
|
||||||
} & TextProps) {
|
} & TextProps) {
|
||||||
const {buildAction} = useLinkBuilder()
|
|
||||||
const sanitized = sanitizeUrl(href)
|
|
||||||
const {onPress: _, ...props} = useLinkProps({
|
|
||||||
href: sanitized,
|
|
||||||
action: buildAction(sanitized),
|
|
||||||
})
|
|
||||||
const navigation = useNavigationDeduped()
|
const navigation = useNavigationDeduped()
|
||||||
const {openModal, closeModal} = useModalControls()
|
const {openModal, closeModal} = useModalControls()
|
||||||
const openLink = useOpenLink()
|
const openLink = useOpenLink()
|
||||||
@@ -286,8 +277,9 @@ export const TextLink = memo(function TextLink({
|
|||||||
// @ts-ignore web only -prf
|
// @ts-ignore web only -prf
|
||||||
hrefAttrs={hrefAttrs} // hack to get open in new tab to work on safari. without this, safari will open in a new window
|
hrefAttrs={hrefAttrs} // hack to get open in new tab to work on safari. without this, safari will open in a new window
|
||||||
onPress={onPress}
|
onPress={onPress}
|
||||||
{...props}
|
accessibilityRole="link"
|
||||||
{...orgProps}>
|
href={convertBskyAppUrlIfNeeded(sanitizeUrl(href))}
|
||||||
|
{...props}>
|
||||||
{text}
|
{text}
|
||||||
</Text>
|
</Text>
|
||||||
)
|
)
|
||||||
|
|||||||
Reference in New Issue
Block a user