git.iko.soy/bridge
on master help sign in
Make /views/Login functional/stateless
4240306Fang
src/views/Login.js+60−78
compare with master
unifiedsplit
@@ -1,8 +1,9 @@
1import { Nothing, Just } from 'folktale/maybe';
1import { Nothing, Just } from 'folktale/maybe';
2−import React from 'react';
2+import React, { useState } from 'react';
3import * as azimuth from 'azimuth-js';
3import * as azimuth from 'azimuth-js';
4
4
5−import { H1, Row, Col } from '../components/old/Base';
5+import { H1 } from 'indigo-react';
6+import View from '../components/View';
6import Tabs from '../components/Tabs';
7import Tabs from '../components/Tabs';
7
8
8import Ticket from './Login/Ticket';
9import Ticket from './Login/Ticket';
@@ -10,13 +11,12 @@ import Mnemonic from './Login/Mnemonic';
10import Advanced from './Login/Advanced';
11import Advanced from './Login/Advanced';
11
12
12import * as need from '../lib/need';
13import * as need from '../lib/need';
13−import { compose } from '../lib/lib';
14import { ROUTE_NAMES } from '../lib/routeNames';
14import { ROUTE_NAMES } from '../lib/routeNames';
15
15
16−import { withHistory } from '../store/history';
16+import { useHistory } from '../store/history';
17−import { withNetwork } from '../store/network';
17+import { useNetwork } from '../store/network';
18−import { withWallet } from '../store/wallet';
18+import { useWallet } from '../store/wallet';
19−import { withPointCursor } from '../store/pointCursor';
19+import { usePointCursor } from '../store/pointCursor';
20
20
21const TABS = {
21const TABS = {
22 TICKET: Symbol('TICKET'),
22 TICKET: Symbol('TICKET'),
@@ -24,46 +24,39 @@ const TABS = {
24 ADVANCED: Symbol('ADVANCED'),
24 ADVANCED: Symbol('ADVANCED'),
25};
25};
26
26
27−class Login extends React.Component {
27+export default function Login() {
28− constructor(props) {
28+ // globals
29− super(props);
29+ const history = useHistory();
30+ const { contracts } = useNetwork();
31+ const { wallet } = useWallet();
32+ const { pointCursor, setPointCursor } = usePointCursor();
30
33
31− this.state = {
34+ // inputs
32− currentTab: TABS.TICKET,
35+ const [currentTab, setCurrentTab] = useState(TABS.TICKET);
33− };
34
36
35− this.handleTabChange = this.handleTabChange.bind(this);
37+ //TODO figure out how to do things once
36− this.continue = this.continue.bind(this);
38+ // // we expect wallet and pointCursor to not be set yet
37− }
39+ // setUrbitWallet(Nothing());
40+ // setWallet(Nothing());
41+ // setPointCursor(Nothing());
38
42
39− componentDidMount() {
43+ const doContinue = async () => {
40− // we expect wallet and pointCursor to not be set yet
41− this.props.setUrbitWallet(Nothing());
42− this.props.setWallet(Nothing());
43− this.props.setPointCursor(Nothing());
44− }
45−
46− handleTabChange(currentTab) {
47− this.setState({ currentTab });
48− }
49−
50− async continue() {
51− const wallet = need.wallet(this.props);
44+ const realWallet = need.wallet(wallet);
52− const contracts = need.contracts(this.props);
45+ const realContracts = need.contracts(contracts);
53
46
54 // if no point cursor set by login logic, try to deduce it
47 // if no point cursor set by login logic, try to deduce it
55 let deduced = Nothing();
48 let deduced = Nothing();
56 if (Nothing.hasInstance(this.props.pointCursor)) {
49 if (Nothing.hasInstance(this.props.pointCursor)) {
57 const owned = await azimuth.azimuth.getOwnedPoints(
50 const owned = await azimuth.azimuth.getOwnedPoints(
58− contracts,
51+ realContracts,
59− wallet.address
52+ realWallet.address
60 );
53 );
61 if (owned.length === 1) {
54 if (owned.length === 1) {
62 deduced = Just(owned[0]);
55 deduced = Just(owned[0]);
63 } else if (owned.length === 0) {
56 } else if (owned.length === 0) {
64 const canOwn = await azimuth.azimuth.getTransferringFor(
57 const canOwn = await azimuth.azimuth.getTransferringFor(
65− contracts,
58+ realContracts,
66− wallet.address
59+ realWallet.address
67 );
60 );
68 if (canOwn.length === 1) {
61 if (canOwn.length === 1) {
69 deduced = Just(canOwn[0]);
62 deduced = Just(canOwn[0]);
@@ -72,51 +65,40 @@ class Login extends React.Component {
72 }
65 }
73
66
74 if (Just.hasInstance(deduced)) {
67 if (Just.hasInstance(deduced)) {
75− this.props.setPointCursor(deduced);
68+ setPointCursor(deduced);
76− this.props.history.popAndPush(ROUTE_NAMES.POINT_HOME);
69+ history.popAndPush(ROUTE_NAMES.POINT_HOME);
77− } else if (Just.hasInstance(this.props.pointCursor)) {
70+ } else if (Just.hasInstance(pointCursor)) {
78− this.props.history.popAndPush(ROUTE_NAMES.POINT_HOME);
71+ history.popAndPush(ROUTE_NAMES.POINT_HOME);
79 } else {
72 } else {
80 //TODO to new overview (maybe should be merged into point home?)
73 //TODO to new overview (maybe should be merged into point home?)
81− this.props.history.popAndPush(ROUTE_NAMES.SHIPS);
74+ history.popAndPush(ROUTE_NAMES.POINTS);
82 }
75 }
83− }
76+ };
84−
77+
85− render() {
78+ const tabViews = {
79+ [TABS.TICKET]: Ticket,
80+ [TABS.MNEMONIC]: Mnemonic,
81+ [TABS.ADVANCED]: Advanced,
82+ };
83+
86− const tabOptions = [
84+ const tabOptions = [
87− { title: 'Ticket', value: TABS.TICKET },
85+ { title: 'Ticket', value: TABS.TICKET },
88− { title: 'Mnemonic', value: TABS.MNEMONIC },
86+ { title: 'Mnemonic', value: TABS.MNEMONIC },
89− { title: 'Advanced', value: TABS.ADVANCED },
87+ { title: 'Advanced', value: TABS.ADVANCED },
90− ];
88+ ];
91−
89+
92− const tabViews = {
93− [TABS.TICKET]: Ticket,
94− [TABS.MNEMONIC]: Mnemonic,
95− [TABS.ADVANCED]: Advanced,
96− };
97−
98− return (
90+ return (
99− <Row>
91+ <View>
100− <Col>
101− <H1>{'Login'}</H1>
92+ <H1>Login</H1>
102−
93+
103− <Tabs
94+ <Tabs
104− tabViews={tabViews}
95+ tabViews={tabViews}
105− tabOptions={tabOptions}
96+ tabOptions={tabOptions}
106− currentTab={this.state.currentTab}
97+ currentTab={currentTab}
107− onTabChange={this.handleTabChange}
98+ onTabChange={setCurrentTab}
108− //
99+ //
109− loginCompleted={this.continue}
100+ loginCompleted={doContinue}
110− />
101+ />
111− </Col>
102+ </View>
112− </Row>
113− );
103+ );
114− }
115}
104}
116−
117−export default compose(
118− withHistory,
119− withNetwork,
120− withWallet,
121− withPointCursor
122−)(Login);