git.iko.soy/bridge
on 3d8aeb6 help sign in
bridge/src/views/Party/PartySetPoolSize.js
131 lines 3.6 kB history raw
1import React, { useCallback, useEffect } 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 { usePointCursor } from 'store/pointCursor';
8import { usePointCache } from 'store/pointCache';
10import * as need from 'lib/need';
11import { usePointInput, useNumberInput } from 'lib/useInputs';
12import useEthereumTransaction from 'lib/useEthereumTransaction';
13import { GAS_LIMITS } from 'lib/constants';
14import { useLocalRouter } from 'lib/LocalRouter';
16import ViewHeader from 'components/ViewHeader';
17import InlineEthereumTransaction from 'components/InlineEthereumTransaction';
18import patp2dec from 'lib/patp2dec';
19import View from 'components/View';
20import useCurrentPermissions from 'lib/useCurrentPermissions';
21import WarningBox from 'components/WarningBox';
23function useSetPoolSize() {
24 const { contracts } = useNetwork();
25 const { pointCursor } = usePointCursor();
26 const { syncOwnedPoint } = usePointCache();
28 const _contracts = need.contracts(contracts);
29 const _point = need.point(pointCursor);
31 return useEthereumTransaction(
32 useCallback(
33 (poolOwner, poolSize) =>
34 azimuth.delegatedSending.setPoolSize(
35 _contracts,
36 _point,
37 poolOwner,
38 poolSize
39 ),
40 [_contracts, _point]
41 ),
42 useCallback(() => syncOwnedPoint(_point), [_point, syncOwnedPoint]),
43 GAS_LIMITS.DEFAULT // TODO: GAS_LIMITS.SET_POOL_SIZE
44 );
47export default function PartySetPoolSize() {
48 const { pop } = useLocalRouter();
49 const { contracts } = useNetwork();
51 const _contracts = need.contracts(contracts);
53 const { spawnIsDelegatedSending } = useCurrentPermissions();
55 const {
56 construct,
57 unconstruct,
58 completed,
59 inputsLocked,
60 bind,
61 } = useSetPoolSize();
63 const [poolOwnerInput, { pass: validPoint, data: poolOwner }] = usePointInput(
64 {
65 name: 'point',
66 label: 'Point',
67 disabled: inputsLocked,
68 }
69 );
71 const [
72 poolSizeInput,
73 { pass: validPoolSize, data: poolSize },
74 ] = useNumberInput({
75 name: 'poolsize',
76 label: 'Pool Size',
77 initialValue: 5,
78 disabled: inputsLocked,
79 });
81 useEffect(() => {
82 if (validPoint && validPoolSize) {
83 construct(patp2dec(poolOwner), poolSize);
84 } else {
85 unconstruct();
86 }
87 }, [poolOwner, construct, validPoint, validPoolSize, poolSize, unconstruct]);
89 return (
90 <View pop={pop} inset>
91 <Grid>
92 <Grid.Item full as={ViewHeader}>
93 Set Pool Size
94 </Grid.Item>
95 {!spawnIsDelegatedSending && (
96 <Grid.Item full as={WarningBox} className="mb4">
97 The spawn proxy must be set to{' '}
98 <code className="mono f6">
99 {_contracts.delegatedSending.address}
100 </code>{' '}
101 for invitations to be available.
102 </Grid.Item>
103 )}
104 <Grid.Item
105 full
106 as={Text}
107 className={cn('f5', {
108 green3: completed,
109 })}>
110 {completed
111 ? `${poolSize} invites have been allocated to ${poolOwner}`
112 : `Allocate invites to a child point.`}
113 </Grid.Item>
115 {!completed && (
116 <>
117 <Grid.Item full as={Input} {...poolOwnerInput} className="mt4" />
118 <Grid.Item full as={Input} {...poolSizeInput} className="mb4" />
119 </>
120 )}
122 <Grid.Item
123 full
124 as={InlineEthereumTransaction}
125 {...bind}
126 onReturn={() => pop()}
127 />
128 </Grid>
129 </View>
130 );