bas.sh
forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
1import {View} from 'react-native'
2import Animated, {FadeIn, FadeOut} from 'react-native-reanimated'
3import {useSafeAreaInsets} from 'react-native-safe-area-context'
4import {msg, Trans} from '@lingui/macro'
5import {useLingui} from '@lingui/react'
6
7import {useHaptics} from '#/lib/haptics'
8import {useKawaiiMode} from '#/state/preferences/kawaii'
9import {ErrorBoundary} from '#/view/com/util/ErrorBoundary'
10import {CenteredView} from '#/view/com/util/Views'
11import {Logo} from '#/view/icons/Logo'
12import {Logotype} from '#/view/icons/Logotype'
13import {atoms as a, useTheme} from '#/alf'
14import {AppLanguageDropdown} from '#/components/AppLanguageDropdown'
15import {Button, ButtonText} from '#/components/Button'
16import {Text} from '#/components/Typography'
17
18export const SplashScreen = ({
19 onPressSignin,
20 onPressCreateAccount,
21}: {
22 onPressSignin: () => void
23 onPressCreateAccount: () => void
24}) => {
25 const t = useTheme()
26 const {_} = useLingui()
27
28 const playHaptic = useHaptics()
29 const insets = useSafeAreaInsets()
30 const kawaii = useKawaiiMode()
31
32 return (
33 <CenteredView style={[a.h_full, a.flex_1]}>
34 <Animated.View
35 entering={FadeIn.duration(90)}
36 exiting={FadeOut.duration(90)}
37 style={[a.flex_1]}>
38 <ErrorBoundary>
39 <View style={[a.flex_1, a.justify_center, a.align_center]}>
40 <Logo width={kawaii ? 164 : 92} fill="sky" />
41
42 {!kawaii && (
43 <View style={[a.pb_sm, a.pt_5xl]}>
44 <Logotype width={161} fill={t.atoms.text.color} />
45 </View>
46 )}
47
48 <Text
49 style={[
50 a.text_md,
51 a.font_semi_bold,
52 t.atoms.text_contrast_medium,
53 a.text_center,
54 ]}>
55 <Trans>Skeet yo stuff! 🗣️</Trans>
56 </Text>
57 </View>
58
59 <View
60 testID="signinOrCreateAccount"
61 style={[a.px_xl, a.gap_md, a.pb_2xl]}>
62 <Button
63 testID="createAccountButton"
64 onPress={() => {
65 onPressCreateAccount()
66 playHaptic('Light')
67 }}
68 label={_(msg`Create new account`)}
69 accessibilityHint={_(
70 msg`Opens flow to create a new Bluesky account`,
71 )}
72 size="large"
73 variant="solid"
74 color="primary">
75 <ButtonText>
76 <Trans>Create account</Trans>
77 </ButtonText>
78 </Button>
79 <Button
80 testID="signInButton"
81 onPress={() => {
82 onPressSignin()
83 playHaptic('Light')
84 }}
85 label={_(msg`Sign in`)}
86 accessibilityHint={_(
87 msg`Opens flow to sign in to your existing Bluesky account`,
88 )}
89 size="large"
90 variant="solid"
91 color="secondary">
92 <ButtonText>
93 <Trans>Sign in</Trans>
94 </ButtonText>
95 </Button>
96 </View>
97 <View
98 style={[
99 a.px_lg,
100 a.pt_md,
101 a.pb_2xl,
102 a.justify_center,
103 a.align_center,
104 ]}>
105 <View>
106 <AppLanguageDropdown />
107 </View>
108 </View>
109 <View style={{height: insets.bottom}} />
110 </ErrorBoundary>
111 </Animated.View>
112 </CenteredView>
113 )
114}