git.iko.soy/bridge
on dc028a2 help sign in
bridge/src/views/IssueChild.js
182 lines 4.9 kB history raw
1import React, { useCallback, useMemo, useState } from 'react';
2import cn from 'classnames';
3import { Grid, Text } from 'indigo-react';
4import * as azimuth from 'azimuth-js';
5import * as ob from 'urbit-ob';
7import { useNetwork } from 'store/network';
8import { usePointCache } from 'store/pointCache';
9import { usePointCursor } from 'store/pointCursor';
11import * as need from 'lib/need';
12import useEthereumTransaction from 'lib/useEthereumTransaction';
13import { GAS_LIMITS } from 'lib/constants';
14import patp2dec from 'lib/patp2dec';
15import { getSpawnCandidate } from 'lib/child';
16import { useLocalRouter } from 'lib/LocalRouter';
17import useConstant from 'lib/useConstant';
19import ViewHeader from 'components/ViewHeader';
20import InlineEthereumTransaction from 'components/InlineEthereumTransaction';
21import View from 'components/View';
22import { PointInput, AddressInput } from 'form/Inputs';
23import {
24 composeValidator,
25 buildPointValidator,
26 buildAddressValidator,
27} from 'form/validators';
28import BridgeForm from 'form/BridgeForm';
29import FormError from 'form/FormError';
31function useIssueChild() {
32 const { contracts } = useNetwork();
33 const { syncKnownPoint } = usePointCache();
35 const _contracts = need.contracts(contracts);
37 const [spawnedPoint, setSpawnedPoint] = useState();
39 return useEthereumTransaction(
40 useCallback(
41 (spawnedPoint, owner) => {
42 setSpawnedPoint(spawnedPoint);
43 return azimuth.ecliptic.spawn(_contracts, spawnedPoint, owner);
44 },
45 [_contracts]
46 ),
47 useCallback(() => syncKnownPoint(spawnedPoint), [
48 spawnedPoint,
49 syncKnownPoint,
50 ]),
51 GAS_LIMITS.DEFAULT
52 );
55export default function IssueChild() {
56 const { pop } = useLocalRouter();
57 const { contracts } = useNetwork();
58 const { pointCursor } = usePointCursor();
60 const _contracts = need.contracts(contracts);
61 const _point = parseInt(need.point(pointCursor), 10);
63 const availablePointsPromise = useConstant(() =>
64 azimuth.azimuth
65 .getUnspawnedChildren(_contracts, _point)
66 .then(points => new Set(points))
67 );
69 const candidates = useMemo(() => {
70 const getCandidate = () => ob.patp(getSpawnCandidate(_point));
72 return [getCandidate(), getCandidate(), getCandidate(), getCandidate()];
73 }, [_point]);
75 const {
76 isDefaultState,
77 construct,
78 unconstruct,
79 completed,
80 inputsLocked,
81 bind,
82 } = useIssueChild();
84 const validateForm = useCallback(
85 async values => {
86 const point = patp2dec(values.name);
87 const hasPoint = (await availablePointsPromise).has(point);
89 if (!hasPoint) {
90 return { point: 'This point cannot be spawned.' };
91 }
92 },
93 [availablePointsPromise]
94 );
96 const validate = useMemo(
97 () =>
98 composeValidator(
99 {
100 point: buildPointValidator(4),
101 owner: buildAddressValidator(),
102 },
103 validateForm
104 ),
105 [validateForm]
106 );
108 const onValues = useCallback(
109 ({ valid, values }) => {
110 if (valid) {
111 construct(patp2dec(values.point), values.owner);
112 } else {
113 unconstruct();
114 }
115 },
116 [construct, unconstruct]
117 );
119 return (
120 <View pop={pop} inset>
121 <Grid>
122 <Grid.Item full as={ViewHeader}>
123 Issue Child Point
124 </Grid.Item>
126 {isDefaultState && (
127 <Grid.Item full as={Text}>
128 Perhaps one of {candidates.slice(0, 3).join(', ')}, or{' '}
129 {candidates[candidates.length - 1]}?
130 </Grid.Item>
131 )}
133 <BridgeForm validate={validate} onValues={onValues}>
134 {({ handleSubmit, values }) => (
135 <>
136 {completed && (
137 <Grid.Item
138 full
139 as={Text}
140 className={cn('f5', {
141 green3: completed,
142 })}>
143 {values.point} has been spawned and can be claimed by{' '}
144 {values.owner}.
145 </Grid.Item>
146 )}
148 {!completed && (
149 <>
150 <Grid.Item
151 full
152 as={PointInput}
153 name="point"
154 disabled={inputsLocked}
155 className="mt4"
156 />
157 <Grid.Item
158 full
159 as={AddressInput}
160 className="mb4"
161 name="owner"
162 label="Ethereum Address"
163 disabled={inputsLocked}
164 />
165 </>
166 )}
168 <Grid.Item full as={FormError} />
170 <Grid.Item
171 full
172 as={InlineEthereumTransaction}
173 {...bind}
174 onReturn={() => pop()}
175 />
176 </>
177 )}
178 </BridgeForm>
179 </Grid>
180 </View>
181 );