git.iko.soy/bridge
on 5ca110d help sign in
bridge/src/views/CreateGalaxy.js
165 lines 4.2 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';
6import { useNetwork } from 'store/network';
7import { usePointCache } from 'store/pointCache';
9import * as need from 'lib/need';
10import useEthereumTransaction from 'lib/useEthereumTransaction';
11import { GAS_LIMITS } from 'lib/constants';
12import patp2dec from 'lib/patp2dec';
13import { isZeroAddress } from 'lib/wallet';
14import { useLocalRouter } from 'lib/LocalRouter';
16import ViewHeader from 'components/ViewHeader';
17import InlineEthereumTransaction from 'components/InlineEthereumTransaction';
18import View from 'components/View';
19import BridgeForm from 'form/BridgeForm';
20import { PointInput, AddressInput } from 'form/Inputs';
21import {
22 composeValidator,
23 buildPointValidator,
24 buildAddressValidator,
25 hasErrors,
26} from 'form/validators';
27import FormError from 'form/FormError';
29function useCreateGalaxy() {
30 const { contracts } = useNetwork();
31 const { syncKnownPoint } = usePointCache();
33 const _contracts = need.contracts(contracts);
35 const [galaxy, setGalaxy] = useState();
37 return useEthereumTransaction(
38 useCallback(
39 (galaxy, owner) => {
40 setGalaxy(galaxy);
41 return azimuth.ecliptic.createGalaxy(_contracts, galaxy, owner);
42 },
43 [_contracts]
44 ),
45 useCallback(() => syncKnownPoint(galaxy), [galaxy, syncKnownPoint]),
46 GAS_LIMITS.DEFAULT
47 );
50export default function CreateGalaxy() {
51 const { pop } = useLocalRouter();
52 const { contracts } = useNetwork();
53 const _contracts = need.contracts(contracts);
55 const {
56 construct,
57 unconstruct,
58 completed,
59 inputsLocked,
60 bind,
61 } = useCreateGalaxy();
63 const validateFormAsync = useCallback(
64 async values => {
65 const currentOwner = await azimuth.azimuth.getOwner(
66 _contracts,
67 patp2dec(values.galaxyName)
68 );
70 const isAvailable = isZeroAddress(currentOwner);
71 if (!isAvailable) {
72 return { galaxyName: 'This galaxy is already spawned and owned.' };
73 }
74 },
75 [_contracts]
76 );
78 const validateForm = useCallback(
79 (values, errors) => {
80 if (hasErrors(errors)) {
81 return errors;
82 }
84 return validateFormAsync(values, errors);
85 },
86 [validateFormAsync]
87 );
89 const validate = useMemo(
90 () =>
91 composeValidator(
92 {
93 galaxyName: buildPointValidator(1),
94 owner: buildAddressValidator(),
95 },
96 validateForm
97 ),
98 [validateForm]
99 );
101 const onValues = useCallback(
102 ({ valid, values }) => {
103 if (valid) {
104 construct(patp2dec(values.galaxyName), values.owner);
105 } else {
106 unconstruct();
107 }
108 },
109 [construct, unconstruct]
110 );
112 return (
113 <View pop={pop} inset>
114 <Grid>
115 <Grid.Item full as={ViewHeader}>
116 Create a Galaxy
117 </Grid.Item>
119 <BridgeForm validate={validate} onValues={onValues}>
120 {({ handleSubmit, values }) => (
121 <>
122 {completed && (
123 <Grid.Item
124 full
125 as={Text}
126 className={cn('f5 wrap', {
127 green3: completed,
128 })}>
129 {values.galaxyName} has been created and can be claimed by{' '}
130 {values.owner}.
131 </Grid.Item>
132 )}
134 <Grid.Item
135 full
136 as={PointInput}
137 className="mt4"
138 name="galaxyName"
139 label="Galaxy Name"
140 disabled={inputsLocked}
141 />
142 <Grid.Item
143 full
144 as={AddressInput}
145 className="mb4"
146 name="owner"
147 label="Ethereum Address"
148 disabled={inputsLocked}
149 />
151 <Grid.Item full as={FormError} />
153 <Grid.Item
154 full
155 as={InlineEthereumTransaction}
156 {...bind}
157 onReturn={() => pop()}
158 />
159 </>
160 )}
161 </BridgeForm>
162 </Grid>
163 </View>
164 );