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