@@ -0,0 +1,139 @@
1+import Maybe from 'folktale/maybe'
2+import React from 'react'
3+import { pour } from 'sigil-js'
4+import * as ob from 'urbit-ob'
5+import * as azimuth from 'azimuth-js'
6+
7+import { addressFromSecp256k1Public, EthereumWallet } from '../lib/wallet'
8+
9+import PointList from '../components/PointList'
10+import ReactSVGComponents from '../components/ReactSVGComponents'
11+import KeysAndMetadata from './Point/KeysAndMetadata'
12+import Actions from './Point/Actions'
13+import { BRIDGE_ERROR } from '../lib/error'
14+import { Row, Col, Warning, Button, H1, H3 } from '../components/Base'
15+
16+
17+class InviteClaim extends React.Component {
18+
19+ constructor(props) {
20+ super(props)
21+
22+ this.state = {
23+ loaded: false,
24+ point: Maybe.Nothing(),
25+ newTicket: Maybe.Nothing(),
26+ isGenerating: true
27+ }
28+ }
29+
30+ componentDidMount() {
31+ const { web3, wallet, contracts, setPointCursor } = this.props
32+
33+ web3.chain(_ =>
34+ contracts.chain(ctrcs =>
35+ wallet.chain(async wal => {
36+ const addr = addressFromSecp256k1Public(wal.publicKey);
37+ console.log('fetching incoming for', addr)
38+ const incoming = await azimuth.azimuth.getTransferringFor(ctrcs, addr)
39+ console.log('incoming', incoming)
40+
41+ this.state.loaded = true;
42+ if (0 === incoming.length) {
43+ setPointCursor(Maybe.Nothing());
44+ } else {
45+ setPointCursor(Maybe.Just(incoming[0]));
46+ this.generateWallet(incoming[0])
47+ if (1 < incoming.length) {
48+ //TODO notify user "...and others"
49+ }
50+ }
51+ })))
52+ }
53+
54+ componentDidUpdate(prevProps) {
55+ //
56+ }
57+
58+ generateWallet(point) {
59+ //TODO combine wg/views/Generate and Download into single lib function?
60+ }
61+
62+ render() {
63+
64+ const { pointCursor } = this.props
65+
66+ //TODO do something about DOM duplication below
67+
68+ if (!this.state.loaded) {
69+ return (
70+ <Row>
71+ <Col>
72+ {'Loading...'}
73+ </Col>
74+ </Row>
75+ )
76+ }
77+
78+ if (!Maybe.Just.hasInstance(pointCursor)) {
79+ return (
80+ <Row>
81+ <Col>
82+ <Warning>
83+ <h3 className={'mb-2'}>{'Warning'}</h3>
84+ {
85+ 'This invite has no claimable balance.'
86+ }
87+ </Warning>
88+ </Col>
89+ </Row>
90+ )
91+ }
92+
93+
94+ const point = pointCursor.matchWith({
95+ Just: (cursor) => cursor.value,
96+ Nothing: () => {
97+ throw BRIDGE_ERROR.MISSING_POINT
98+ }
99+ })
100+
101+ const name = ob.patp(point)
102+
103+ const sigil = pour({
104+ patp: name,
105+ renderer: ReactSVGComponents,
106+ size: 256
107+ })
108+
109+ return (
110+ <Row>
111+ <Col>
112+ <div className={'mt-12 pt-6'}>
113+ { sigil }
114+ </div>
115+ <H1><code>{ name }</code></H1>
116+
117+ <p>{'TODO copy'}</p>
118+
119+ <Button
120+ className={'mt-8'}
121+ prop-size={'lg wide'}
122+ disabled={this.state.isGenerating}
123+ onClick={() => console.log('TODO download wallet')}>
124+
125+ <span className="relative">
126+ {this.state.isGenerating &&
127+ <span className="btn-spinner"></span>
128+ }
129+ {'Generating wallet...'}
130+ </span>
131+ </Button>
132+
133+ </Col>
134+ </Row>
135+ )
136+ }
137+}
138+
139+export default InviteClaim