mirror of https://git.lenooby09.tech/LeNooby09/social-app.git
lenooby09.tech
1import {View} from 'react-native'
2import {msg, Trans} from '@lingui/macro'
3import {useLingui} from '@lingui/react'
4
5import {useGoBack} from '#/lib/hooks/useGoBack'
6import {CenteredView} from '#/view/com/util/Views'
7import {atoms as a, useBreakpoints, useTheme} from '#/alf'
8import {Button, ButtonText} from '#/components/Button'
9import {Text} from '#/components/Typography'
10
11export function Error({
12 title,
13 message,
14 onRetry,
15 onGoBack,
16 hideBackButton,
17 sideBorders = true,
18}: {
19 title?: string
20 message?: string
21 onRetry?: () => unknown
22 onGoBack?: () => unknown
23 hideBackButton?: boolean
24 sideBorders?: boolean
25}) {
26 const {_} = useLingui()
27 const t = useTheme()
28 const {gtMobile} = useBreakpoints()
29 const goBack = useGoBack(onGoBack)
30
31 return (
32 <CenteredView
33 style={[
34 a.h_full_vh,
35 a.align_center,
36 a.gap_5xl,
37 !gtMobile && a.justify_between,
38 t.atoms.border_contrast_low,
39 {paddingTop: 175, paddingBottom: 110},
40 ]}
41 sideBorders={sideBorders}>
42 <View style={[a.w_full, a.align_center, a.gap_lg]}>
43 <Text style={[a.font_bold, a.text_3xl]}>{title}</Text>
44 <Text
45 style={[
46 a.text_md,
47 a.text_center,
48 t.atoms.text_contrast_high,
49 {lineHeight: 1.4},
50 gtMobile ? {width: 450} : [a.w_full, a.px_lg],
51 ]}>
52 {message}
53 </Text>
54 </View>
55 <View style={[a.gap_md, gtMobile ? {width: 350} : [a.w_full, a.px_lg]]}>
56 {onRetry && (
57 <Button
58 variant="solid"
59 color="primary"
60 label={_(msg`Press to retry`)}
61 onPress={onRetry}
62 size="large"
63 style={[a.rounded_sm, a.overflow_hidden, {paddingVertical: 10}]}>
64 <ButtonText>
65 <Trans>Retry</Trans>
66 </ButtonText>
67 </Button>
68 )}
69 {!hideBackButton && (
70 <Button
71 variant="solid"
72 color={onRetry ? 'secondary' : 'primary'}
73 label={_(msg`Return to previous page`)}
74 onPress={goBack}
75 size="large"
76 style={[a.rounded_sm, a.overflow_hidden, {paddingVertical: 10}]}>
77 <ButtonText>
78 <Trans>Go Back</Trans>
79 </ButtonText>
80 </Button>
81 )}
82 </View>
83 </CenteredView>
84 )
85}