add title attr to text text links

This commit is contained in:
Eric Bailey
2023-08-21 10:40:12 -05:00
parent 257c15ec1f
commit c028cd184e
3 changed files with 26 additions and 16 deletions
+10
View File
@@ -135,6 +135,7 @@ export const TextLink = observer(function TextLink({
numberOfLines, numberOfLines,
lineHeight, lineHeight,
dataSet, dataSet,
title,
}: { }: {
testID?: string testID?: string
type?: TypographyVariant type?: TypographyVariant
@@ -144,10 +145,12 @@ export const TextLink = observer(function TextLink({
numberOfLines?: number numberOfLines?: number
lineHeight?: number lineHeight?: number
dataSet?: any dataSet?: any
title?: string
} & TextProps) { } & TextProps) {
const {...props} = useLinkProps({to: sanitizeUrl(href)}) const {...props} = useLinkProps({to: sanitizeUrl(href)})
const store = useStores() const store = useStores()
const navigation = useNavigation<NavigationProp>() const navigation = useNavigation<NavigationProp>()
const anchorRef = React.useRef(null)
props.onPress = React.useCallback( props.onPress = React.useCallback(
(e?: Event) => { (e?: Event) => {
@@ -166,8 +169,14 @@ export const TextLink = observer(function TextLink({
return {} return {}
}, [href]) }, [href])
React.useEffect(() => {
// @ts-expect-error web only, shows date on hover -esb
anchorRef.current?.setNativeProps?.({title})
}, [title])
return ( return (
<Text <Text
ref={anchorRef}
testID={testID} testID={testID}
type={type} type={type}
style={style} style={style}
@@ -197,6 +206,7 @@ interface DesktopWebTextLinkProps extends TextProps {
accessible?: boolean accessible?: boolean
accessibilityLabel?: string accessibilityLabel?: string
accessibilityHint?: string accessibilityHint?: string
title?: string
} }
export const DesktopWebTextLink = observer(function DesktopWebTextLink({ export const DesktopWebTextLink = observer(function DesktopWebTextLink({
testID, testID,
+1
View File
@@ -79,6 +79,7 @@ export const PostMeta = observer(function (opts: PostMetaOpts) {
lineHeight={1.2} lineHeight={1.2}
text={timeElapsed} text={timeElapsed}
accessibilityLabel={niceDate(opts.timestamp)} accessibilityLabel={niceDate(opts.timestamp)}
title={niceDate(opts.timestamp)}
accessibilityHint="" accessibilityHint=""
href={opts.postHref} href={opts.postHref}
/> />
+15 -16
View File
@@ -8,19 +8,18 @@ export type CustomTextProps = TextProps & {
lineHeight?: number lineHeight?: number
} }
export function Text({ export const Text = React.forwardRef<any, CustomTextProps>(
type = 'md', ({type = 'md', children, lineHeight, style, ...props}, ref) => {
children, const theme = useTheme()
lineHeight, const typography = theme.typography[type]
style, const lineHeightStyle = lineHeight ? lh(theme, type, lineHeight) : undefined
...props return (
}: React.PropsWithChildren<CustomTextProps>) { <RNText
const theme = useTheme() ref={ref}
const typography = theme.typography[type] style={[s.black, typography, lineHeightStyle, style]}
const lineHeightStyle = lineHeight ? lh(theme, type, lineHeight) : undefined {...props}>
return ( {children}
<RNText style={[s.black, typography, lineHeightStyle, style]} {...props}> </RNText>
{children} )
</RNText> },
) )
}