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