git.iko.soy/bridge
on fc0bf50 help sign in
bridge/src/views/CreateGalaxy.js
153 lines 4.0 kB history raw
1import React, { useCallback, useMemo, useState } from 'react';
2import cn from 'classnames';
3import { Grid, Text, Input } 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 } from 'form/Inputs';
21import {
22 composeValidator,
23 buildPointValidator,
24 buildAddressValidator,
25} from 'form/validators';
26import FormError from 'form/FormError';
28function useCreateGalaxy() {
29 const { contracts } = useNetwork();
30 const { syncKnownPoint } = usePointCache();
32 const _contracts = need.contracts(contracts);
34 const [galaxy, setGalaxy] = useState();
36 return useEthereumTransaction(
37 useCallback(
38 (galaxy, owner) => {
39 setGalaxy(galaxy);
40 return azimuth.ecliptic.createGalaxy(_contracts, galaxy, owner);
41 },
42 [_contracts]
43 ),
44 useCallback(() => syncKnownPoint(galaxy), [galaxy, syncKnownPoint]),
45 GAS_LIMITS.DEFAULT
46 );
49export default function CreateGalaxy() {
50 const { pop } = useLocalRouter();
51 const { contracts } = useNetwork();
52 const _contracts = need.contracts(contracts);
54 const {
55 construct,
56 unconstruct,
57 completed,
58 inputsLocked,
59 bind,
60 } = useCreateGalaxy();
62 const validateForm = useCallback(
63 async values => {
64 const currentOwner = await azimuth.azimuth.getOwner(
65 _contracts,
66 patp2dec(values.galaxyName)
67 );
69 const isAvailable = isZeroAddress(currentOwner);
70 if (!isAvailable) {
71 return { galaxyName: 'This galaxy is already spawned and owned.' };
72 }
73 },
74 [_contracts]
75 );
77 const validate = useMemo(
78 () =>
79 composeValidator(
80 {
81 galaxyName: buildPointValidator(1),
82 owner: buildAddressValidator(),
83 },
84 validateForm
85 ),
86 [validateForm]
87 );
89 const onValues = useCallback(
90 ({ valid, values }) => {
91 if (valid) {
92 construct(patp2dec(values.galaxyName), values.owner);
93 } else {
94 unconstruct();
95 }
96 },
97 [construct, unconstruct]
98 );
100 return (
101 <View pop={pop} inset>
102 <Grid>
103 <Grid.Item full as={ViewHeader}>
104 Create a Galaxy
105 </Grid.Item>
107 <BridgeForm validate={validate} onValues={onValues}>
108 {({ handleSubmit, values }) => (
109 <>
110 {completed && (
111 <Grid.Item
112 full
113 as={Text}
114 className={cn('f5', {
115 green3: completed,
116 })}>
117 {values.galaxyName} has been created and can be claimed by{' '}
118 {values.owner}.
119 </Grid.Item>
120 )}
122 <Grid.Item
123 full
124 as={PointInput}
125 className="mt4"
126 name="galaxyName"
127 label="Galaxy Name"
128 disabled={inputsLocked}
129 />
130 <Grid.Item
131 full
132 as={Input}
133 className="mb4"
134 name="owner"
135 label="Ethereum Address"
136 disabled={inputsLocked}
137 />
139 <Grid.Item full as={FormError} />
141 <Grid.Item
142 full
143 as={InlineEthereumTransaction}
144 {...bind}
145 onReturn={() => pop()}
146 />
147 </>
148 )}
149 </BridgeForm>
150 </Grid>
151 </View>
152 );