git.iko.soy/bridge
on d760cbf help sign in
bridge/src/views/Login.js
145 lines 3.9 kB history raw
1import React, { useCallback, useState } from 'react';
2import { Just, Nothing } from 'folktale/maybe';
3import * as azimuth from 'azimuth-js';
5import { H4, Grid } from 'indigo-react';
7import Ticket from './Login/Ticket';
8import Mnemonic from './Login/Mnemonic';
9import Advanced from './Login/Advanced';
10import Hardware from './Login/Hardware';
12import * as need from 'lib/need';
14import { useHistory } from 'store/history';
15import { useNetwork } from 'store/network';
16import { useWallet } from 'store/wallet';
17import { usePointCursor } from 'store/pointCursor';
19import View from 'components/View';
20import Tabs from 'components/Tabs';
21import Crumbs from 'components/Crumbs';
22import Footer from 'components/Footer';
23import { ForwardButton, OfflineButton } from 'components/Buttons';
25const NAMES = {
26 TICKET: 'TICKET',
27 MNEMONIC: 'MNEMONIC',
28 HARDWARE: 'HARDWARE',
29 ADVANCED: 'ADVANCED',
30};
32const VIEWS = {
33 [NAMES.TICKET]: Ticket,
34 [NAMES.MNEMONIC]: Mnemonic,
35 [NAMES.HARDWARE]: Hardware,
36 [NAMES.ADVANCED]: Advanced,
37};
39const OPTIONS = [
40 { text: 'Master Ticket', value: NAMES.TICKET },
41 { text: 'Mnemonic', value: NAMES.MNEMONIC },
42 { text: 'Hardware', value: NAMES.HARDWARE },
43 { text: 'Advanced', value: NAMES.ADVANCED },
44];
46export default function Login() {
47 // globals
48 const { push, replaceWith, names } = useHistory();
49 const { contracts } = useNetwork();
50 const { wallet } = useWallet();
51 const { pointCursor, setPointCursor } = usePointCursor();
53 // inputs
54 const [currentTab, setCurrentTab] = useState(NAMES.TICKET);
56 const goToActivate = useCallback(
57 () => replaceWith([{ key: names.LANDING }, { key: names.ACTIVATE }]),
58 [replaceWith, names]
59 );
61 const goToPoints = useCallback(() => {
62 push(names.POINTS);
63 }, [push, names]);
65 const goToPoint = useCallback(() => {
66 goToPoints();
67 push(names.POINT);
68 }, [goToPoints, push, names]);
70 const doContinue = useCallback(async () => {
71 const _wallet = need.wallet(wallet);
72 const _contracts = need.contracts(contracts);
74 // if no point cursor set by login logic, try to deduce it
75 let deduced = pointCursor;
76 if (Nothing.hasInstance(deduced)) {
77 const owned = await azimuth.azimuth.getOwnedPoints(
78 _contracts,
79 _wallet.address
80 );
81 if (owned.length === 1) {
82 deduced = Just(owned[0]);
83 } else if (owned.length === 0) {
84 const canOwn = await azimuth.azimuth.getTransferringFor(
85 _contracts,
86 _wallet.address
87 );
88 if (canOwn.length === 1) {
89 deduced = Just(canOwn[0]);
90 }
91 }
92 }
94 // if we have a deduced point or one in the global context,
95 // navigate to that specific point, otherwise navigate to list of points
96 if (Just.hasInstance(deduced)) {
97 setPointCursor(deduced);
98 goToPoint();
99 } else {
100 goToPoints();
101 }
102 }, [contracts, pointCursor, setPointCursor, wallet, goToPoint, goToPoints]);
104 return (
105 <View inset>
106 <Grid>
107 <Grid.Item full as={Crumbs} routes={[{ text: 'Multipass' }]} />
108 <Grid.Item full as={H4} className="mt4">
109 Login
110 </Grid.Item>
112 <Grid.Item
113 full
114 as={Tabs}
115 className="mt1"
116 views={VIEWS}
117 options={OPTIONS}
118 currentTab={currentTab}
119 onTabChange={setCurrentTab}
120 />
122 <Grid.Item
123 full
124 as={ForwardButton}
125 solid
126 className="mt2"
127 disabled={Nothing.hasInstance(wallet)}
128 onClick={doContinue}>
129 Continue
130 </Grid.Item>
131 </Grid>
133 <Footer>
134 <Grid>
135 <Grid.Divider />
136 <Grid.Item full as={ForwardButton} onClick={goToActivate}>
137 Activate
138 </Grid.Item>
139 <Grid.Divider />
140 <Grid.Item full as={OfflineButton} />
141 </Grid>
142 </Footer>
143 </View>
144 );