mirror of https://git.lenooby09.tech/LeNooby09/social-app.git
1import React from 'react'
2import {View} from 'react-native'
3import {Trans, msg} from '@lingui/macro'
4import {useLingui} from '@lingui/react'
5import {useNavigation} from '@react-navigation/native'
6
7import {useTheme, atoms as a} from '#/alf'
8import {Text} from '#/components/Typography'
9import {Button, ButtonText} from '#/components/Button'
10import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo'
11import {NavigationProp} from '#/lib/routes/types'
12
13export function ErrorState({error}: {error: string}) {
14 const t = useTheme()
15 const {_} = useLingui()
16 const navigation = useNavigation<NavigationProp>()
17
18 const onPressBack = React.useCallback(() => {
19 if (navigation.canGoBack()) {
20 navigation.goBack()
21 } else {
22 navigation.navigate('Home')
23 }
24 }, [navigation])
25
26 return (
27 <View style={[a.px_xl]}>
28 <CircleInfo width={48} style={[t.atoms.text_contrast_low]} />
29
30 <Text style={[a.text_xl, a.font_bold, a.pb_md, a.pt_xl]}>
31 <Trans>Hmmmm, we couldn't load that moderation service.</Trans>
32 </Text>
33 <Text
34 style={[
35 a.text_md,
36 a.leading_normal,
37 a.pb_md,
38 t.atoms.text_contrast_medium,
39 ]}>
40 <Trans>
41 This moderation service is unavailable. See below for more details. If
42 this issue persists, contact us.
43 </Trans>
44 </Text>
45 <View
46 style={[
47 a.relative,
48 a.py_md,
49 a.px_lg,
50 a.rounded_md,
51 a.mb_2xl,
52 t.atoms.bg_contrast_25,
53 ]}>
54 <Text style={[a.text_md, a.leading_normal]}>{error}</Text>
55 </View>
56
57 <View style={{flexDirection: 'row'}}>
58 <Button
59 size="small"
60 color="secondary"
61 variant="solid"
62 label={_(msg`Go Back`)}
63 accessibilityHint="Return to previous page"
64 onPress={onPressBack}>
65 <ButtonText>
66 <Trans>Go Back</Trans>
67 </ButtonText>
68 </Button>
69 </View>
70 </View>
71 )
72}