on e366ef3 help sign in
bridge/src/views/Points.js
245 lines 6.3 kB history raw
1import React from 'react';
2import { Row, Col, H1, H2, P } from '../components/old/Base';
3import { Button } from '../components/old/Base';
4import * as azimuth from 'azimuth-js';
6import PointList from '../components/old/PointList';
7import { NETWORK_TYPES } from '../lib/network';
8import { ROUTE_NAMES } from '../lib/routeNames';
9import { withHistory } from '../store/history';
10import { ETH_ZERO_ADDR, eqAddr } from '../lib/wallet';
11import { withNetwork } from '../store/network';
12import { compose } from '../lib/lib';
13import { withWallet } from '../store/wallet';
14import { withPointCache } from '../store/pointCache';
16const hasTransferProxy = (cache, point) =>
17 point in cache ? !eqAddr(cache[point].transferProxy, ETH_ZERO_ADDR) : false;
19class Points extends React.Component {
20 constructor(props) {
21 super(props);
23 const { networkType } = props;
24 const loading = networkType !== NETWORK_TYPES.OFFLINE;
26 this.state = {
27 points: [],
28 incoming: [],
29 managing: [],
30 voting: [],
31 spawning: [],
32 eclipticOwner: false,
33 loading: loading,
34 };
35 }
37 componentDidMount() {
38 const { web3, wallet, contracts, addToPointCache } = this.props;
40 web3.chain(_ =>
41 contracts.chain(ctrcs =>
42 wallet.chain(async wal => {
43 const addr = wal.address;
45 const points = await azimuth.azimuth.getOwnedPoints(ctrcs, addr);
47 const incoming = await azimuth.azimuth.getTransferringFor(
48 ctrcs,
49 addr
50 );
52 const managing = await azimuth.azimuth.getManagerFor(ctrcs, addr);
54 const voting = await azimuth.azimuth.getVotingFor(ctrcs, addr);
56 const spawning = await azimuth.azimuth.getSpawningFor(ctrcs, addr);
58 const owner = await azimuth.ecliptic.owner(ctrcs);
60 const eclipticOwner = eqAddr(addr, owner);
62 this.setState({
63 points,
64 incoming,
65 managing,
66 voting,
67 spawning,
68 eclipticOwner,
69 loading: false,
70 });
72 this.cachePoints(ctrcs, addToPointCache, points);
73 })
74 )
75 );
76 }
78 cachePoints(contracts, addToPointCache, points) {
79 points.forEach(point => {
80 azimuth.azimuth
81 .getPoint(contracts, point)
82 .then(details => addToPointCache({ [point]: details }));
83 });
84 }
86 render() {
87 const { history, pointCache } = this.props;
89 const {
90 points,
91 incoming,
92 managing,
93 voting,
94 spawning,
95 loading,
96 eclipticOwner,
97 } = this.state;
99 const lookupPointButton = (
100 <Row>
101 <Col>
102 <Button
103 prop-type={'link'}
104 prop-size={'md'}
105 onClick={() => history.push(ROUTE_NAMES.VIEW_SHIP)}>
106 {'View a point →'}
107 </Button>
108 <P>{'View a point on Azimuth.'}</P>
109 </Col>
110 </Row>
111 );
113 const createGalaxyButton =
114 eclipticOwner === false ? (
115 <div />
116 ) : (
117 <Row>
118 <Col>
119 <Button
120 prop-type={'link'}
121 prop-size={'md'}
122 onClick={() => history.push(ROUTE_NAMES.CREATE_GALAXY)}>
123 {'Create a galaxy →'}
124 </Button>
125 <P>
126 {
127 'You have the authority to create a new Galaxy and you can do so here.'
128 }
129 </P>
130 </Col>
131 </Row>
132 );
134 const outgoing = points.filter(point =>
135 hasTransferProxy(pointCache, point)
136 );
138 const outgoingPoints =
139 outgoing.length !== 0 ? (
140 <React.Fragment>
141 <H2>{'Outgoing Transfers'}</H2>
142 <P>
143 {`You own these points until the recipient accepts the incoming
144 transfer. You may cancel the transfer until accepted.`}
145 </P>
146 <PointList routeHandler={history.push} points={outgoing} />
147 </React.Fragment>
148 ) : (
149 <div />
150 );
152 const incomingPoints =
153 incoming.length !== 0 ? (
154 <React.Fragment>
155 <H2>{'Incoming Transfers'}</H2>
156 <P>
157 {`You do not own these points until you accept the incoming transfer.
158 You may reject any incoming transfers.`}
159 </P>
160 <PointList routeHandler={history.push} points={incoming} />
161 </React.Fragment>
162 ) : (
163 <div />
164 );
166 const managingPoints =
167 managing.length !== 0 ? (
168 <React.Fragment>
169 <H2>{'You Are a Management Proxy For'}</H2>
170 <P>
171 {`You can configure or set network keys and conduct sponsorship
172 related operations for these points.`}
173 </P>
174 <PointList routeHandler={history.push} points={managing} />
175 </React.Fragment>
176 ) : (
177 <div />
178 );
180 const votingPoints =
181 voting.length !== 0 ? (
182 <React.Fragment>
183 <H2>{'You Are a Voting Proxy For'}</H2>
184 <P>
185 {`Since you are part of the Galactic Senate, you can cast votes on
186 new Azimuth proposals on behalf of these points.`}
187 </P>
188 <PointList routeHandler={history.push} points={voting} />
189 </React.Fragment>
190 ) : (
191 <div />
192 );
194 const spawningPoints =
195 spawning.length !== 0 ? (
196 <React.Fragment>
197 <H2>{'You Are a Spawn Proxy For'}</H2>
198 <P>{`You can create new child ships under these points.`}</P>
199 <PointList routeHandler={history.push} points={spawning} />
200 </React.Fragment>
201 ) : (
202 <div />
203 );
205 return (
206 <Row>
207 <Col>
208 <H1>{'Points'}</H1>
210 <P>{`A point is an identity on the Ethereum blockchain.
211 Points declare keys for ships on the Arvo network.`}</P>
213 {lookupPointButton}
215 {createGalaxyButton}
217 {incomingPoints}
219 {outgoingPoints}
221 <H2>{'Your Points'}</H2>
223 <PointList
224 routeHandler={history.push}
225 points={points}
226 loading={loading}
227 />
229 {managingPoints}
231 {votingPoints}
233 {spawningPoints}
234 </Col>
235 </Row>
236 );
237 }
240export default compose(
241 withNetwork,
242 withHistory,
243 withWallet,
244 withPointCache
245)(Points);