jollywhoppers.com
Bluesky app fork with some witchin' additions 馃挮
witchsky.app
bluesky
fork
client
samuel.fm
1import {useMemo} from 'react'
2import {View} from 'react-native'
3import {msg} from '@lingui/core/macro'
4import {useLingui} from '@lingui/react'
5import {Trans} from '@lingui/react/macro'
6
7import {useCleanError} from '#/lib/hooks/useCleanError'
8import {OUTER_SPACE} from '#/screens/PostThread/const'
9import {atoms as a, useTheme} from '#/alf'
10import {Button, ButtonIcon, ButtonText} from '#/components/Button'
11import {ArrowRotateCounterClockwise_Stroke2_Corner0_Rounded as RetryIcon} from '#/components/icons/ArrowRotate'
12import * as Layout from '#/components/Layout'
13import {Text} from '#/components/Typography'
14
15export function ThreadError({
16 error,
17 onRetry,
18}: {
19 error: Error
20 onRetry: () => void
21}) {
22 const t = useTheme()
23 const {_} = useLingui()
24 const cleanError = useCleanError()
25
26 const {title, message} = useMemo(() => {
27 let title = _(msg`Error loading post`)
28 let message = _(msg`Something went wrong. Please try again in a moment.`)
29
30 const {raw, clean} = cleanError(error)
31
32 if (error.message.startsWith('Post not found')) {
33 title = _(msg`Post not found`)
34 message = clean || raw || message
35 }
36
37 return {title, message}
38 }, [_, error, cleanError])
39
40 return (
41 <Layout.Center>
42 <View
43 style={[
44 a.w_full,
45 a.align_center,
46 {
47 padding: OUTER_SPACE,
48 paddingTop: OUTER_SPACE * 2,
49 },
50 ]}>
51 <View
52 style={[
53 a.w_full,
54 a.align_center,
55 a.gap_xl,
56 {
57 maxWidth: 260,
58 },
59 ]}>
60 <View style={[a.gap_xs]}>
61 <Text
62 style={[
63 a.text_center,
64 a.text_lg,
65 a.font_semi_bold,
66 a.leading_snug,
67 ]}>
68 {title}
69 </Text>
70 <Text
71 style={[
72 a.text_center,
73 a.text_sm,
74 a.leading_snug,
75 t.atoms.text_contrast_medium,
76 ]}>
77 {message}
78 </Text>
79 </View>
80 <Button
81 label={_(msg`Retry`)}
82 size="small"
83 variant="solid"
84 color="secondary_inverted"
85 onPress={onRetry}>
86 <ButtonText>
87 <Trans>Retry</Trans>
88 </ButtonText>
89 <ButtonIcon icon={RetryIcon} position="right" />
90 </Button>
91 </View>
92 </View>
93 </Layout.Center>
94 )
95}