on cbb04ce help sign in
bridge/src/views/Admin/AdminSetProxy.js
202 lines 5.5 kB history raw
1import React, { useCallback, useEffect } from 'react';
2import cn from 'classnames';
3import { Grid, Text, Input, Flex, ToggleInput } from 'indigo-react';
4import * as azimuth from 'azimuth-js';
6import { useNetwork } from 'store/network';
7import { usePointCache } from 'store/pointCache';
8import { usePointCursor } from 'store/pointCursor';
10import {
11 PROXY_TYPE,
12 proxyTypeToHuman,
13 proxyTypeToHumanDescription,
14} from 'lib/proxy';
15import * as need from 'lib/need';
16import { useLocalRouter } from 'lib/LocalRouter';
17import { ETH_ZERO_ADDR, eqAddr, isZeroAddress } from 'lib/wallet';
18import capitalize from 'lib/capitalize';
19import { useAddressInput, useCheckboxInput } from 'lib/useInputs';
20import useEthereumTransaction from 'lib/useEthereumTransaction';
22import ViewHeader from 'components/ViewHeader';
23import InlineEthereumTransaction from 'components/InlineEthereumTransaction';
24import { GAS_LIMITS } from 'lib/constants';
26const proxyFromDetails = (details, contracts, proxyType) => {
27 switch (proxyType) {
28 case PROXY_TYPE.MANAGEMENT:
29 return details.managementProxy;
30 case PROXY_TYPE.SPAWN:
31 return details.spawnProxy;
32 case PROXY_TYPE.TRANSFER:
33 return details.transferProxy;
34 case PROXY_TYPE.VOTING:
35 if (eqAddr(details.votingProxy, contracts.delegatedSending.address)) {
36 return `${details.votingProxy} (invites contract)`;
37 } else {
38 return details.votingProxy;
39 }
40 default:
41 throw new Error(`Unknown proxyType: ${proxyType}`);
42 }
43};
45function useSetProxy(proxyType) {
46 const { contracts } = useNetwork();
47 const { pointCursor } = usePointCursor();
48 const { syncDetails } = usePointCache();
50 const _contracts = need.contracts(contracts);
51 const _point = need.point(pointCursor);
53 const { construct, ...rest } = useEthereumTransaction(
54 useCallback(
55 address => {
56 const txArgs = [_contracts, _point, address];
58 switch (proxyType) {
59 case PROXY_TYPE.MANAGEMENT:
60 return azimuth.ecliptic.setManagementProxy(...txArgs);
61 case PROXY_TYPE.SPAWN:
62 return azimuth.ecliptic.setSpawnProxy(...txArgs);
63 case PROXY_TYPE.TRANSFER:
64 return azimuth.ecliptic.setTransferProxy(...txArgs);
65 case PROXY_TYPE.VOTING:
66 return azimuth.ecliptic.setVotingProxy(...txArgs);
67 default:
68 throw new Error(`Unknown proxyType ${proxyType}`);
69 }
70 },
71 [_contracts, _point, proxyType]
72 ),
73 useCallback(() => syncDetails(_point), [_point, syncDetails]),
74 GAS_LIMITS.SET_PROXY
75 );
77 // force-unset
78 const unset = useCallback(() => {
79 construct(ETH_ZERO_ADDR);
80 }, [construct]);
82 return {
83 construct,
84 unset,
85 ...rest,
86 };
89export default function AdminSetProxy() {
90 const { data, pop } = useLocalRouter();
91 const { getDetails } = usePointCache();
92 const { pointCursor } = usePointCursor();
93 const { contracts } = useNetwork();
95 const _point = need.point(pointCursor);
96 const _details = need.details(getDetails(_point));
97 const _contracts = need.contracts(contracts);
99 const properProxyType = capitalize(proxyTypeToHuman(data.proxyType));
101 const {
102 construct,
103 unconstruct,
104 unset,
105 inputsLocked,
106 completed,
107 bind,
108 } = useSetProxy(data.proxyType);
110 const [unsetInput, { data: isUnsetting }] = useCheckboxInput({
111 name: 'unset',
112 label: 'Unset',
113 inverseLabel: 'Specify',
114 initialValue: false,
115 disabled: inputsLocked,
116 });
117 const [
118 addressInput,
119 { pass: validAddress, data: address },
120 { reset: resetAddress },
121 ] = useAddressInput({
122 name: 'address',
123 label: `New ${properProxyType} Address`,
124 disabled: inputsLocked || isUnsetting,
125 });
127 useEffect(() => {
128 if (isUnsetting) {
129 unset();
130 resetAddress();
131 } else if (validAddress) {
132 construct(address);
133 } else {
134 unconstruct();
135 }
136 }, [
137 validAddress,
138 address,
139 construct,
140 isUnsetting,
141 unset,
142 unconstruct,
143 resetAddress,
144 ]);
146 const proxyAddress = proxyFromDetails(_details, _contracts, data.proxyType);
147 const isProxySet = !isZeroAddress(proxyAddress);
149 const proxyAddressLabel = `${
150 completed ? 'New' : 'Current'
151 } ${properProxyType} Address`;
153 return (
154 <Grid>
155 <Grid.Item full as={ViewHeader}>
156 {properProxyType} Address
157 </Grid.Item>
159 <Grid.Item full as={Text} className="mb4 f5">
160 {proxyTypeToHumanDescription(data.proxyType)}
161 </Grid.Item>
163 <Grid.Item
164 full
165 as={Text}
166 className={cn('f6 mb1', {
167 green3: completed,
168 })}>
169 {proxyAddressLabel}
170 </Grid.Item>
172 <Grid.Item full as={Flex} row justify="between" align="center">
173 <Flex.Item
174 flex
175 as={Text}
176 className={cn('mono', {
177 black: !completed && isProxySet,
178 gray4: !completed && !isProxySet,
179 green3: completed,
180 })}>
181 {isProxySet ? proxyAddress : 'Unset'}
182 </Flex.Item>
183 {!completed && isProxySet && (
184 <Flex.Item as={ToggleInput} {...unsetInput} />
185 )}
186 </Grid.Item>
188 {completed ? (
189 <Grid.Item full className="mb4" />
190 ) : (
191 <Grid.Item full as={Input} {...addressInput} className="mv4" />
192 )}
194 <Grid.Item
195 full
196 as={InlineEthereumTransaction}
197 {...bind}
198 onReturn={() => pop()}
199 />
200 </Grid>
201 );