diff --git a/src/components/Post/Embed/PostPlaceholder.tsx b/src/components/Post/Embed/PostPlaceholder.tsx index 8402340269..8a4ee97c72 100644 --- a/src/components/Post/Embed/PostPlaceholder.tsx +++ b/src/components/Post/Embed/PostPlaceholder.tsx @@ -1,33 +1,29 @@ -import {StyleSheet, View} from 'react-native' +import {View} from 'react-native' -import {usePalette} from '#/lib/hooks/usePalette' -import {InfoCircleIcon} from '#/lib/icons' -import {Text} from '#/view/com/util/text/Text' import {atoms as a, useTheme} from '#/alf' +import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfoIcon} from '#/components/icons/CircleInfo' +import {Text} from '#/components/Typography' export function PostPlaceholder({children}: {children: React.ReactNode}) { const t = useTheme() - const pal = usePalette('default') + return ( - - + style={[ + a.flex_row, + a.gap_xs, + a.rounded_md, + a.py_md, + a.px_md, + a.mt_sm, + a.align_center, + a.border, + t.atoms.border_contrast_low, + ]}> + + {children} ) } - -const styles = StyleSheet.create({ - errorContainer: { - flexDirection: 'row', - alignItems: 'center', - gap: 4, - borderRadius: 8, - marginTop: 8, - paddingVertical: 14, - paddingHorizontal: 14, - borderWidth: StyleSheet.hairlineWidth, - }, -}) diff --git a/src/lib/icons.tsx b/src/lib/icons.tsx index b508fc94b5..a58497e633 100644 --- a/src/lib/icons.tsx +++ b/src/lib/icons.tsx @@ -72,30 +72,3 @@ export function ComposeIcon2({ ) } - -export function InfoCircleIcon({ - style, - size, - strokeWidth = 1.5, -}: { - style?: StyleProp - size?: string | number - strokeWidth?: number -}) { - return ( - - - - ) -} diff --git a/src/view/com/posts/DiscoverFallbackHeader.tsx b/src/view/com/posts/DiscoverFallbackHeader.tsx index e35a33aaf7..9e6a9e57c3 100644 --- a/src/view/com/posts/DiscoverFallbackHeader.tsx +++ b/src/view/com/posts/DiscoverFallbackHeader.tsx @@ -1,39 +1,35 @@ import {View} from 'react-native' -import {Trans} from '@lingui/macro' +import {msg, Trans} from '@lingui/macro' +import {useLingui} from '@lingui/react' -import {usePalette} from '#/lib/hooks/usePalette' -import {InfoCircleIcon} from '#/lib/icons' -import {TextLink} from '../util/Link' -import {Text} from '../util/text/Text' +import {atoms as a, useTheme} from '#/alf' +import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfoIcon} from '#/components/icons/CircleInfo' +import {InlineLinkText} from '#/components/Link' +import {Text} from '#/components/Typography' export function DiscoverFallbackHeader() { - const pal = usePalette('default') + const t = useTheme() + const {_} = useLingui() + return ( - - - + + + - - + + We ran out of posts from your follows. Here's the latest from{' '} - + + Discover + .