oppi.li
forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 馃挮
1import React from 'react'
2import {View} from 'react-native'
3import {msg, Trans} from '@lingui/macro'
4import {useLingui} from '@lingui/react'
5
6import {useLoggedOutViewControls} from '#/state/shell/logged-out'
7import {useCloseAllActiveElements} from '#/state/util'
8import {Logo} from '#/view/icons/Logo'
9import {atoms as a} from '#/alf'
10import {AppLanguageDropdown} from '#/components/AppLanguageDropdown'
11import {Button, ButtonText} from '#/components/Button'
12import {Link} from '#/components/Link'
13import {Text} from '#/components/Typography'
14
15let NavSignupCard = ({}: {}): React.ReactNode => {
16 const {_} = useLingui()
17 const {requestSwitchToAccount} = useLoggedOutViewControls()
18 const closeAllActiveElements = useCloseAllActiveElements()
19
20 const showSignIn = React.useCallback(() => {
21 closeAllActiveElements()
22 requestSwitchToAccount({requestedAccount: 'none'})
23 }, [requestSwitchToAccount, closeAllActiveElements])
24
25 const showCreateAccount = React.useCallback(() => {
26 closeAllActiveElements()
27 requestSwitchToAccount({requestedAccount: 'new'})
28 // setShowLoggedOut(true)
29 }, [requestSwitchToAccount, closeAllActiveElements])
30
31 return (
32 <View style={[{maxWidth: 200}]}>
33 <Link to="/" label="Bluesky - Home">
34 <Logo width={32} />
35 </Link>
36
37 <View style={[a.pt_lg]}>
38 <Text
39 style={[a.text_3xl, a.font_bold, {lineHeight: a.text_3xl.fontSize}]}>
40 <Trans>Join the conversation</Trans>
41 </Text>
42 </View>
43
44 <View style={[a.flex_row, a.flex_wrap, a.gap_sm, a.pt_md]}>
45 <Button
46 onPress={showCreateAccount}
47 label={_(msg`Create account`)}
48 size="small"
49 variant="solid"
50 color="primary">
51 <ButtonText>
52 <Trans>Create account</Trans>
53 </ButtonText>
54 </Button>
55 <Button
56 onPress={showSignIn}
57 label={_(msg`Sign in`)}
58 size="small"
59 variant="solid"
60 color="secondary">
61 <ButtonText>
62 <Trans>Sign in</Trans>
63 </ButtonText>
64 </Button>
65 </View>
66
67 <View style={[a.mt_md, a.w_full, {height: 32}]}>
68 <AppLanguageDropdown />
69 </View>
70 </View>
71 )
72}
73NavSignupCard = React.memo(NavSignupCard)
74export {NavSignupCard}