on dedd4b5 help sign in
bridge/src/views/IssueChild.js
195 lines 5.4 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 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';
18import { validateChild } from 'lib/validators';
20import ViewHeader from 'components/ViewHeader';
21import InlineEthereumTransaction from 'components/InlineEthereumTransaction';
22import View from 'components/View';
23import { PointInput, AddressInput } from 'form/Inputs';
24import {
25 composeValidator,
26 buildPointValidator,
27 buildAddressValidator,
28 hasErrors,
29} from 'form/validators';
30import BridgeForm from 'form/BridgeForm';
31import FormError from 'form/FormError';
32import CopiableAddress from 'components/copiable/CopiableAddress';
33import { convertToInt } from 'lib/convertToInt';
35export function useIssueChild() {
36 const { contracts } = useNetwork();
37 const { syncDates } = usePointCache();
39 const _contracts = need.contracts(contracts);
41 const [spawnedPoint, setSpawnedPoint] = useState();
43 return useEthereumTransaction(
44 useCallback(
45 (spawnedPoint, owner) => {
46 console.log(1, spawnedPoint, owner, _contracts)
47 setSpawnedPoint(spawnedPoint);
48 return azimuth.ecliptic.spawn(_contracts, spawnedPoint, owner);
49 },
50 [_contracts]
51 ),
52 useCallback(() => syncDates(spawnedPoint), [spawnedPoint, syncDates]),
53 GAS_LIMITS.DEFAULT
54 );
57export default function IssueChild() {
58 const { pop } = useLocalRouter();
59 const { contracts } = useNetwork();
60 const { pointCursor } = usePointCursor();
62 const _contracts = need.contracts(contracts);
63 const _point = convertToInt(need.point(pointCursor), 10);
65 const availablePointsPromise = useConstant(() =>
66 azimuth.azimuth
67 .getUnspawnedChildren(_contracts, _point)
68 .then(points => new Set(points))
69 );
71 const candidates = useMemo(() => {
72 const getCandidate = () => ob.patp(getSpawnCandidate(_point));
74 return [getCandidate(), getCandidate(), getCandidate(), getCandidate()];
75 }, [_point]);
77 const {
78 isDefaultState,
79 construct,
80 unconstruct,
81 completed,
82 inputsLocked,
83 bind,
84 } = useIssueChild();
86 const validateFormAsync = useCallback(
87 async values => {
88 const point = patp2dec(values.point);
89 const hasPoint = (await availablePointsPromise).has(point);
91 if (!hasPoint) {
92 return { point: 'This point cannot be spawned.' };
93 }
94 },
95 [availablePointsPromise]
96 );
98 const validateForm = useCallback(
99 (values, errors) => {
100 if (hasErrors(errors)) {
101 return errors;
102 }
104 return validateFormAsync(values, errors);
105 },
106 [validateFormAsync]
107 );
109 const validate = useMemo(
110 () =>
111 composeValidator(
112 {
113 point: buildPointValidator(4, [validateChild(ob.patp(_point))]),
114 owner: buildAddressValidator(),
115 },
116 validateForm
117 ),
118 [_point, validateForm]
119 );
121 const onValues = useCallback(
122 ({ valid, values }) => {
123 if (valid) {
124 construct(patp2dec(values.point), values.owner);
125 } else {
126 unconstruct();
127 }
128 },
129 [construct, unconstruct]
130 );
132 return (
133 <View pop={pop} inset>
134 <Grid>
135 <Grid.Item full as={ViewHeader}>
136 Issue Child Point
137 </Grid.Item>
139 {isDefaultState && (
140 <Grid.Item full as={Text}>
141 Perhaps one of {candidates.slice(0, 3).join(', ')}, or{' '}
142 {candidates[candidates.length - 1]}?
143 </Grid.Item>
144 )}
146 <BridgeForm validate={validate} onValues={onValues}>
147 {({ handleSubmit, values }) => (
148 <>
149 {completed && (
150 <Grid.Item
151 full
152 as={Text}
153 className={cn('f5 wrap', {
154 green3: completed,
155 })}>
156 {values.point} has been spawned and can be claimed by{' '}
157 <CopiableAddress>{values.owner}</CopiableAddress>.
158 </Grid.Item>
159 )}
161 {!completed && (
162 <>
163 <Grid.Item
164 full
165 as={PointInput}
166 name="point"
167 disabled={inputsLocked}
168 className="mt4"
169 />
170 <Grid.Item
171 full
172 as={AddressInput}
173 className="mb4"
174 name="owner"
175 label="Ethereum Address"
176 disabled={inputsLocked}
177 />
178 </>
179 )}
181 <Grid.Item full as={FormError} />
183 <Grid.Item
184 full
185 as={InlineEthereumTransaction}
186 {...bind}
187 onReturn={() => pop()}
188 />
189 </>
190 )}
191 </BridgeForm>
192 </Grid>
193 </View>
194 );