Something went wrong. Try again.
Bluesky app fork with some witchin' additions 💫
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115import {View} from 'react-native'import { FontAwesomeIcon, type FontAwesomeIconStyle,} from '@fortawesome/react-native-fontawesome'import {msg} from '@lingui/core/macro'import {useLingui} from '@lingui/react'import {Trans} from '@lingui/react/macro'
import {usePalette} from '#/lib/hooks/usePalette'import {useEnableSquareButtons} from '#/state/preferences/enable-square-buttons'import {atoms as a, useTheme} from '#/alf'import {Button, ButtonIcon, ButtonText} from '#/components/Button'import {ArrowRotateCounterClockwise_Stroke2_Corner0_Rounded as ArrowRotateCounterClockwiseIcon} from '#/components/icons/ArrowRotate'import * as Layout from '#/components/Layout'import {Text} from '#/components/Typography'
export function ErrorScreen({ title, message, details, onPressTryAgain, testID, showHeader,}: { title: string message: string details?: string onPressTryAgain?: () => void testID?: string showHeader?: boolean}) { const t = useTheme() const pal = usePalette('default') const {_} = useLingui() const enableSquareButtons = useEnableSquareButtons()
return ( <Layout.Center testID={testID}> {showHeader && ( <Layout.Header.Outer> <Layout.Header.BackButton /> <Layout.Header.Content> <Layout.Header.TitleText> <Trans>Error</Trans> </Layout.Header.TitleText> </Layout.Header.Content> <Layout.Header.Slot /> </Layout.Header.Outer> )} <View style={[a.px_xl, a.py_2xl]}> <View style={[a.mb_md, a.align_center]}> <View style={[ enableSquareButtons ? a.rounded_sm : a.rounded_full, {width: 50, height: 50}, a.align_center, a.justify_center, {backgroundColor: t.palette.contrast_950}, ]}> <FontAwesomeIcon icon="exclamation" style={pal.textInverted as FontAwesomeIconStyle} size={24} /> </View> </View> <Text style={[a.text_center, a.font_bold, a.text_2xl, a.mb_md]}> {title} </Text> <Text style={[a.text_center, a.text_md, a.mb_xl]}>{message}</Text> {details && ( <View style={[ a.w_full, a.border, t.atoms.border_contrast_medium, t.atoms.bg_contrast_25, a.mb_xl, a.py_sm, a.px_lg, a.rounded_xs, a.overflow_hidden, ]}> <Text testID={`${testID}-details`} style={[a.text_center, a.text_md, t.atoms.text_contrast_high]}> {details} </Text> </View> )} {onPressTryAgain && ( <View style={[a.align_center]}> <Button testID="errorScreenTryAgainButton" onPress={onPressTryAgain} variant="solid" color="secondary_inverted" size="small" label={_(msg`Retry`)} accessibilityHint={_( msg`Retries the last action, which errored out`, )}> <ButtonIcon icon={ArrowRotateCounterClockwiseIcon} /> <ButtonText> <Trans context="action">Try again</Trans> </ButtonText> </Button> </View> )} </View> </Layout.Center> )}