on c19b2a8 help sign in
bridge/src/views/Login.js
98 lines 2.3 kB history raw
1import React, { useCallback, useState } from 'react';
2import { P, H4, Grid } from 'indigo-react';
4import { version } from '../../package.json';
6import { useHistory } from 'store/history';
7import { useWallet } from 'store/wallet';
9import { WALLET_TYPES } from 'lib/wallet';
11import View from 'components/View';
12import Tabs from 'components/Tabs';
13import Crumbs from 'components/Crumbs';
14import Footer from 'components/Footer';
15import { ForwardButton, OfflineButton } from 'components/Buttons';
17import Ticket from './Login/Ticket';
18import Other from './Login/Other';
20const NAMES = {
21 TICKET: 'TICKET',
22 OTHER: 'OTHER',
23};
25const VIEWS = {
26 [NAMES.TICKET]: Ticket,
27 [NAMES.OTHER]: Other,
28};
30const OPTIONS = [
31 { text: 'Master Ticket', value: NAMES.TICKET },
32 { text: 'Other', value: NAMES.OTHER },
33];
35const walletTypeToViewName = walletType => {
36 if (walletType === WALLET_TYPES.TICKET || !walletType) {
37 return NAMES.TICKET;
38 }
39 return NAMES.OTHER;
40};
42export default function Login() {
43 // globals
44 const { pop, push, names } = useHistory();
45 const { walletType } = useWallet();
47 // inputs
48 const [currentTab, setCurrentTab] = useState(
49 walletTypeToViewName(walletType)
50 );
52 const goToActivate = useCallback(() => push(names.ACTIVATE), [
53 push,
54 names.ACTIVATE,
55 ]);
57 const goHome = useCallback(() => {
58 push(names.POINTS);
59 }, [push, names]);
61 return (
62 <View pop={pop} inset>
63 <Grid>
64 <Grid.Item full as={Crumbs} routes={[{ text: 'Bridge' }]} />
65 <Grid.Item full as={H4} className="mt4">
66 Login
67 </Grid.Item>
69 <Grid.Item
70 full
71 as={Tabs}
72 className="mt1"
73 // Tabs
74 views={VIEWS}
75 options={OPTIONS}
76 currentTab={currentTab}
77 onTabChange={setCurrentTab}
78 // Tab extra
79 goHome={goHome}
80 />
81 <Grid.Item full as={P} className="f6">
82 Version {version}
83 </Grid.Item>
84 </Grid>
86 <Footer>
87 <Grid>
88 <Grid.Divider />
89 <Grid.Item full as={ForwardButton} onClick={goToActivate}>
90 Activate
91 </Grid.Item>
92 <Grid.Divider />
93 <Grid.Item full as={OfflineButton} />
94 </Grid>
95 </Footer>
96 </View>
97 );