diff --git a/src/App.web.tsx b/src/App.web.tsx index 7d98737a3b..1664812d08 100644 --- a/src/App.web.tsx +++ b/src/App.web.tsx @@ -1,5 +1,5 @@ -import 'lib/sentry' // must be near top -import 'view/icons' +import '#/lib/sentry' // must be near top +import '#/view/icons' import './style.css' import React, {useEffect, useState} from 'react' diff --git a/src/components/Link.tsx b/src/components/Link.tsx index 6c25faffb8..c80b9f3707 100644 --- a/src/components/Link.tsx +++ b/src/components/Link.tsx @@ -9,6 +9,7 @@ import {sanitizeUrl} from '@braintree/sanitize-url' import {StackActions, useLinkProps} from '@react-navigation/native' import {BSKY_DOWNLOAD_URL} from '#/lib/constants' +import {useNavigationDeduped} from '#/lib/hooks/useNavigationDeduped' import {AllNavigatorParams} from '#/lib/routes/types' import {shareUrl} from '#/lib/sharing' import { @@ -17,11 +18,10 @@ import { isExternalUrl, linkRequiresWarning, } from '#/lib/strings/url-helpers' -import {isNative} from '#/platform/detection' +import {isNative, isWeb} from '#/platform/detection' import {shouldClickOpenNewTab} from '#/platform/urls' import {useModalControls} from '#/state/modals' import {useOpenLink} from '#/state/preferences/in-app-browser' -import {useNavigationDeduped} from 'lib/hooks/useNavigationDeduped' import {atoms as a, flatten, TextStyleProp, useTheme, web} from '#/alf' import {Button, ButtonProps} from '#/components/Button' import {useInteractionState} from '#/components/hooks/useInteractionState' @@ -244,7 +244,10 @@ export function Link({ export type InlineLinkProps = React.PropsWithChildren< BaseLinkProps & TextStyleProp & Pick > & - Pick + Pick & { + disableUnderline?: boolean + title?: TextProps['title'] + } export function InlineLinkText({ children, @@ -257,6 +260,7 @@ export function InlineLinkText({ selectable, label, shareOnLongPress, + disableUnderline, ...rest }: InlineLinkProps) { const t = useTheme() @@ -290,11 +294,12 @@ export function InlineLinkText({ {...rest} style={[ {color: t.palette.primary_500}, - (hovered || focused || pressed) && { - ...web({outline: 0}), - textDecorationLine: 'underline', - textDecorationColor: flattenedStyle.color ?? t.palette.primary_500, - }, + (hovered || focused || pressed) && + !disableUnderline && { + ...web({outline: 0}), + textDecorationLine: 'underline', + textDecorationColor: flattenedStyle.color ?? t.palette.primary_500, + }, flattenedStyle, ]} role="link" @@ -365,3 +370,18 @@ export function BaseLink({ ) } + +export function WebOnlyInlineLinkText({ + children, + to, + onPress, + ...props +}: InlineLinkProps) { + return isWeb ? ( + + {children} + + ) : ( + {children} + ) +} diff --git a/src/screens/Messages/Conversation/MessageInputEmbed.tsx b/src/screens/Messages/Conversation/MessageInputEmbed.tsx index bf28ed4fe9..2d1551019e 100644 --- a/src/screens/Messages/Conversation/MessageInputEmbed.tsx +++ b/src/screens/Messages/Conversation/MessageInputEmbed.tsx @@ -174,7 +174,6 @@ export function MessageInputEmbed({ showAvatar author={post.author} moderation={moderation} - authorHasWarning={!!post.author.labels?.length} timestamp={post.indexedAt} postHref={itemHref} style={a.flex_0} diff --git a/src/view/com/post-thread/PostThreadItem.tsx b/src/view/com/post-thread/PostThreadItem.tsx index 3fb2309b96..ead9df1161 100644 --- a/src/view/com/post-thread/PostThreadItem.tsx +++ b/src/view/com/post-thread/PostThreadItem.tsx @@ -558,18 +558,14 @@ let PostThreadItemLoaded = ({ diff --git a/src/view/com/post/Post.tsx b/src/view/com/post/Post.tsx index 9033fb96f7..ec730a5e16 100644 --- a/src/view/com/post/Post.tsx +++ b/src/view/com/post/Post.tsx @@ -163,7 +163,7 @@ function PostInner({ diff --git a/src/view/com/posts/FeedItem.tsx b/src/view/com/posts/FeedItem.tsx index b1509b2719..fb9cdb065e 100644 --- a/src/view/com/posts/FeedItem.tsx +++ b/src/view/com/posts/FeedItem.tsx @@ -245,7 +245,7 @@ let FeedItemInner = ({ onBeforePress={onBeforePress} dataSet={{feedContext}}> - + {isThreadChild && ( onOpenAuthor?: () => void style?: StyleProp } let PostMeta = (opts: PostMetaOpts): React.ReactNode => { - const {i18n} = useLingui() + const t = useTheme() + const {i18n, _} = useLingui() - const pal = usePalette('default') const displayName = opts.author.displayName || opts.author.handle const handle = opts.author.handle const profileLink = makeProfileLink(opts.author) @@ -53,9 +49,18 @@ let PostMeta = (opts: PostMetaOpts): React.ReactNode => { }, [queryClient, opts.author]) return ( - + {opts.showAvatar && ( - + { )} - - + - {forceLTR( - sanitizeDisplayName( - displayName, - opts.moderation?.ui('displayName'), - ), - )} - - } - href={profileLink} - onBeforePress={onBeforePressAuthor} - /> - + + {forceLTR( + sanitizeDisplayName( + displayName, + opts.moderation?.ui('displayName'), + ), + )} + + + - {NON_BREAKING_SPACE + sanitizeHandle(handle, '@')} - - } - href={profileLink} - onBeforePress={onBeforePressAuthor} - anchorNoUnderline - /> + disableUnderline + onPress={onBeforePressAuthor} + style={[a.text_md, t.atoms.text_contrast_medium, a.leading_tight]}> + + {NON_BREAKING_SPACE + sanitizeHandle(handle, '@')} + + - {!isAndroid && ( - - · - - )} + + + · + + {({timeElapsed}) => ( - + disableMismatchWarning + disableUnderline + onPress={onBeforePressPost} + style={[ + a.text_md, + t.atoms.text_contrast_medium, + a.leading_tight, + web({ + whiteSpace: 'nowrap', + }), + ]}> + {timeElapsed} + )} @@ -129,21 +138,3 @@ let PostMeta = (opts: PostMetaOpts): React.ReactNode => { } PostMeta = memo(PostMeta) export {PostMeta} - -const styles = StyleSheet.create({ - container: { - flexDirection: 'row', - alignItems: 'flex-end', - paddingBottom: 2, - gap: 4, - zIndex: 1, - flex: 1, - }, - avatar: { - alignSelf: 'center', - }, - maxWidth: { - flex: isAndroid ? 1 : undefined, - flexShrink: isAndroid ? undefined : 1, - }, -}) diff --git a/src/view/com/util/post-embeds/QuoteEmbed.tsx b/src/view/com/util/post-embeds/QuoteEmbed.tsx index 79e3264046..3b8152c8b8 100644 --- a/src/view/com/util/post-embeds/QuoteEmbed.tsx +++ b/src/view/com/util/post-embeds/QuoteEmbed.tsx @@ -24,15 +24,15 @@ import {useLingui} from '@lingui/react' import {useQueryClient} from '@tanstack/react-query' import {HITSLOP_20} from '#/lib/constants' +import {usePalette} from '#/lib/hooks/usePalette' +import {InfoCircleIcon} from '#/lib/icons' import {moderatePost_wrapped} from '#/lib/moderatePost_wrapped' +import {makeProfileLink} from '#/lib/routes/links' import {s} from '#/lib/styles' import {useModerationOpts} from '#/state/preferences/moderation-opts' +import {precacheProfile} from '#/state/queries/profile' import {useSession} from '#/state/session' -import {usePalette} from 'lib/hooks/usePalette' -import {InfoCircleIcon} from 'lib/icons' -import {makeProfileLink} from 'lib/routes/links' -import {precacheProfile} from 'state/queries/profile' -import {ComposerOptsQuote} from 'state/shell/composer' +import {ComposerOptsQuote} from '#/state/shell/composer' import {atoms as a, useTheme} from '#/alf' import {RichText} from '#/components/RichText' import {ContentHider} from '../../../../components/moderation/ContentHider' @@ -238,7 +238,6 @@ export function QuoteEmbed({ author={quote.author} moderation={moderation} showAvatar - authorHasWarning={false} postHref={itemHref} timestamp={quote.indexedAt} />