on a8a2d64 help sign in
bridge/src/views/Party/PartySetPoolSize.js
168 lines 4.7 kB history raw
1import React, { useCallback, useMemo } from 'react';
2import cn from 'classnames';
3import { Grid, Text } from 'indigo-react';
4import * as azimuth from 'azimuth-js';
6import { useNetwork } from 'store/network';
7import { usePointCursor } from 'store/pointCursor';
8import { usePointCache } from 'store/pointCache';
10import * as need from 'lib/need';
11import useEthereumTransaction from 'lib/useEthereumTransaction';
12import { GAS_LIMITS } from 'lib/constants';
13import { useLocalRouter } from 'lib/LocalRouter';
14import useCurrentPermissions from 'lib/useCurrentPermissions';
15import patp2dec from 'lib/patp2dec';
17import ViewHeader from 'components/ViewHeader';
18import InlineEthereumTransaction from 'components/InlineEthereumTransaction';
19import View from 'components/View';
20import WarningBox from 'components/WarningBox';
22import BridgeForm from 'form/BridgeForm';
23import { PointInput, NumberInput } from 'form/Inputs';
24import {
25 composeValidator,
26 buildNumberValidator,
27 buildPointValidator,
28} from 'form/validators';
29import FormError from 'form/FormError';
30import CopiableAddress from 'components/CopiableAddress';
32function useSetPoolSize() {
33 const { contracts } = useNetwork();
34 const { pointCursor } = usePointCursor();
35 const { syncOwnedPoint } = usePointCache();
37 const _contracts = need.contracts(contracts);
38 const _point = need.point(pointCursor);
40 return useEthereumTransaction(
41 useCallback(
42 (poolOwner, poolSize) =>
43 azimuth.delegatedSending.setPoolSize(
44 _contracts,
45 _point,
46 poolOwner,
47 poolSize
48 ),
49 [_contracts, _point]
50 ),
51 useCallback(() => syncOwnedPoint(_point), [_point, syncOwnedPoint]),
52 GAS_LIMITS.DEFAULT // TODO: GAS_LIMITS.SET_POOL_SIZE
53 );
56export default function PartySetPoolSize() {
57 const { pop } = useLocalRouter();
58 const { contracts } = useNetwork();
60 const _contracts = need.contracts(contracts);
62 const { spawnIsDelegatedSending } = useCurrentPermissions();
64 const {
65 construct,
66 unconstruct,
67 completed,
68 inputsLocked,
69 bind,
70 } = useSetPoolSize();
72 const validate = useMemo(
73 () =>
74 composeValidator({
75 poolOwner: buildPointValidator(),
76 poolSize: buildNumberValidator(0),
77 }),
78 []
79 );
81 const onValues = useCallback(
82 ({ valid, values }) => {
83 if (valid) {
84 construct(patp2dec(values.poolOwner), values.poolSize);
85 } else {
86 unconstruct();
87 }
88 },
89 [construct, unconstruct]
90 );
92 const initialValues = useMemo(() => ({ poolSize: 5 }), []);
94 return (
95 <View pop={pop} inset>
96 <Grid>
97 <Grid.Item full as={ViewHeader}>
98 Set Pool Size
99 </Grid.Item>
101 {!spawnIsDelegatedSending && (
102 <Grid.Item full as={WarningBox} className="mb4 f6">
103 The spawn proxy must be set to{' '}
104 <CopiableAddress>
105 {_contracts.delegatedSending.address}
106 </CopiableAddress>{' '}
107 for invitations to be available.
108 </Grid.Item>
109 )}
111 <BridgeForm
112 validate={validate}
113 onValues={onValues}
114 initialValues={initialValues}>
115 {({ handleSubmit, values }) => (
116 <>
117 <Grid.Item
118 full
119 as={Text}
120 className={cn('f5 wrap', {
121 green3: completed,
122 })}>
123 {completed ? (
124 <>
125 {values.poolSize} invites have been allocated to{' '}
126 <CopiableAddress>{values.poolOwner}</CopiableAddress>
127 </>
128 ) : (
129 `Allocate invites to a child point.`
130 )}
131 </Grid.Item>
133 {!completed && (
134 <>
135 <Grid.Item
136 full
137 as={PointInput}
138 className="mt4"
139 name="poolOwner"
140 label="Point"
141 disabled={inputsLocked}
142 />
143 <Grid.Item
144 full
145 as={NumberInput}
146 className="mb4"
147 name="poolSize"
148 label="Pool Size"
149 disabled={inputsLocked}
150 />
151 </>
152 )}
154 <Grid.Item full as={FormError} />
156 <Grid.Item
157 full
158 as={InlineEthereumTransaction}
159 {...bind}
160 onReturn={() => pop()}
161 />
162 </>
163 )}
164 </BridgeForm>
165 </Grid>
166 </View>
167 );