on abbbcbc help sign in
bridge/src/views/AcceptTransfer.js
121 lines 3.4 kB history raw
1import { Just } from 'folktale/maybe';
2import React from 'react';
3import { H1, P } from '../components/old/Base';
4import {
5 InnerLabel,
6 AddressInput,
7 ShowBlockie,
8 Anchor,
9} from '../components/old/Base';
10import * as azimuth from 'azimuth-js';
11import * as ob from 'urbit-ob';
12import * as need from '../lib/need';
14import StatelessTransaction from '../components/old/StatelessTransaction';
15import { NETWORK_TYPES } from '../lib/network';
16import { isValidAddress } from '../lib/wallet';
17import { withNetwork } from '../store/network';
18import { compose } from '../lib/lib';
19import { withWallet } from '../store/wallet';
20import { withPointCursor } from '../store/pointCursor';
21import View from 'components/View';
23class AcceptTransfer extends React.Component {
24 constructor(props) {
25 super(props);
27 const receivingAddress = need.addressFromWallet(props.wallet);
28 const incomingPoint = need.point(props.pointCursor);
30 this.state = {
31 receivingAddress: receivingAddress,
32 incomingPoint: incomingPoint,
33 };
35 this.handleAddressInput = this.handleAddressInput.bind(this);
36 this.createUnsignedTxn = this.createUnsignedTxn.bind(this);
37 this.statelessRef = React.createRef();
38 }
40 handleAddressInput(proxyAddress) {
41 this.setState({ proxyAddress });
42 this.statelessRef.current.clearTxn();
43 }
45 createUnsignedTxn() {
46 const { state, props } = this;
48 const validContracts = need.contracts(props.contracts);
49 const validPoint = need.point(props.pointCursor);
50 //TODO state.incomingPoint ?
52 return Just(
53 azimuth.ecliptic.transferPoint(
54 validContracts,
55 validPoint,
56 state.receivingAddress,
57 true
58 )
59 );
60 }
62 render() {
63 const { state, props } = this;
64 const validAddress = isValidAddress(state.receivingAddress);
65 const canGenerate = validAddress === true;
67 const esvisible =
68 props.networkType === NETWORK_TYPES.ROPSTEN ||
69 props.networkType === NETWORK_TYPES.MAINNET;
71 const esdomain =
72 props.networkType === NETWORK_TYPES.ROPSTEN
73 ? 'ropsten.etherscan.io'
74 : 'etherscan.io';
76 return (
77 <View>
78 <H1>
79 {'Accept Transfer of '}{' '}
80 <code>{` ${ob.patp(state.incomingPoint)} `}</code>
81 </H1>
83 <P>
84 {"By default, the recipient is the address you're logged in " +
85 'as. But you can transfer to any address you like.'}
86 </P>
88 <AddressInput
89 className="mono mt-8"
90 prop-size="lg"
91 prop-format="innerLabel"
92 value={state.receivingAddress}
93 onChange={v => this.handleAddressInput(v)}>
94 <InnerLabel>{'Receiving Address'}</InnerLabel>
95 <ShowBlockie className={'mt-1'} address={state.receivingAddress} />
96 </AddressInput>
98 <Anchor
99 className={'mt-1 sm'}
100 prop-size="sm"
101 prop-disabled={!isValidAddress(state.receivingAddress) || !esvisible}
102 target={'_blank'}
103 href={`https://${esdomain}/address/${state.receivingAddress}`}>
104 {'View on Etherscan ↗'}
105 </Anchor>
107 <StatelessTransaction
108 canGenerate={canGenerate}
109 createUnsignedTxn={this.createUnsignedTxn}
110 ref={this.statelessRef}
111 />
112 </View>
113 );
114 }
117export default compose(
118 withNetwork,
119 withWallet,
120 withPointCursor
121)(AcceptTransfer);