on 261ea40 help sign in
bridge/src/views/Admin/AdminSetProxy.js
205 lines 5.6 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 MiniBackButton from 'components/MiniBackButton';
24import InlineEthereumTransaction from 'components/InlineEthereumTransaction';
25import { GAS_LIMITS } from 'lib/constants';
27const proxyFromDetails = (details, contracts, proxyType) => {
28 switch (proxyType) {
29 case PROXY_TYPE.MANAGEMENT:
30 return details.managementProxy;
31 case PROXY_TYPE.SPAWN:
32 return details.spawnProxy;
33 case PROXY_TYPE.TRANSFER:
34 return details.transferProxy;
35 case PROXY_TYPE.VOTING:
36 if (eqAddr(details.votingProxy, contracts.delegatedSending.address)) {
37 return `${details.votingProxy} (invites contract)`;
38 } else {
39 return details.votingProxy;
40 }
41 default:
42 throw new Error(`Unknown proxyType: ${proxyType}`);
43 }
44};
46function useSetProxy(proxyType) {
47 const { contracts } = useNetwork();
48 const { pointCursor } = usePointCursor();
49 const { syncDetails } = usePointCache();
51 const _contracts = need.contracts(contracts);
52 const _point = need.point(pointCursor);
54 const { construct, ...rest } = useEthereumTransaction(
55 useCallback(
56 address => {
57 const txArgs = [_contracts, _point, address];
59 switch (proxyType) {
60 case PROXY_TYPE.MANAGEMENT:
61 return azimuth.ecliptic.setManagementProxy(...txArgs);
62 case PROXY_TYPE.SPAWN:
63 return azimuth.ecliptic.setSpawnProxy(...txArgs);
64 case PROXY_TYPE.TRANSFER:
65 return azimuth.ecliptic.setTransferProxy(...txArgs);
66 case PROXY_TYPE.VOTING:
67 return azimuth.ecliptic.setVotingProxy(...txArgs);
68 default:
69 throw new Error(`Unknown proxyType ${proxyType}`);
70 }
71 },
72 [_contracts, _point, proxyType]
73 ),
74 useCallback(() => syncDetails(_point), [_point, syncDetails]),
75 GAS_LIMITS.SET_PROXY
76 );
78 // force-unset
79 const unset = useCallback(() => {
80 construct(ETH_ZERO_ADDR);
81 }, [construct]);
83 return {
84 construct,
85 unset,
86 ...rest,
87 };
90export default function AdminSetProxy() {
91 const { data, pop } = useLocalRouter();
92 const { getDetails } = usePointCache();
93 const { pointCursor } = usePointCursor();
94 const { contracts } = useNetwork();
96 const _point = need.point(pointCursor);
97 const _details = need.details(getDetails(_point));
98 const _contracts = need.contracts(contracts);
100 const properProxyType = capitalize(proxyTypeToHuman(data.proxyType));
102 const {
103 construct,
104 unconstruct,
105 unset,
106 inputsLocked,
107 completed,
108 bind,
109 } = useSetProxy(data.proxyType);
111 const [unsetInput, { data: isUnsetting }] = useCheckboxInput({
112 name: 'unset',
113 label: 'Unset',
114 inverseLabel: 'Specify',
115 initialValue: false,
116 disabled: inputsLocked,
117 });
118 const [
119 addressInput,
120 { pass: validAddress, data: address },
121 { reset: resetAddress },
122 ] = useAddressInput({
123 name: 'address',
124 label: `New ${properProxyType} Address`,
125 disabled: inputsLocked || isUnsetting,
126 });
128 useEffect(() => {
129 if (isUnsetting) {
130 unset();
131 resetAddress();
132 } else if (validAddress) {
133 construct(address);
134 } else {
135 unconstruct();
136 }
137 }, [
138 validAddress,
139 address,
140 construct,
141 isUnsetting,
142 unset,
143 unconstruct,
144 resetAddress,
145 ]);
147 const proxyAddress = proxyFromDetails(_details, _contracts, data.proxyType);
148 const isProxySet = !isZeroAddress(proxyAddress);
150 const proxyAddressLabel = `${
151 completed ? 'New' : 'Current'
152 } ${properProxyType} Address`;
154 return (
155 <Grid>
156 <Grid.Item full as={MiniBackButton} onClick={() => pop()} />
158 <Grid.Item full as={ViewHeader}>
159 {properProxyType} Address
160 </Grid.Item>
162 <Grid.Item full as={Text} className="mb4 f5">
163 {proxyTypeToHumanDescription(data.proxyType)}
164 </Grid.Item>
166 <Grid.Item
167 full
168 as={Text}
169 className={cn('f6 mb1', {
170 green3: completed,
171 })}>
172 {proxyAddressLabel}
173 </Grid.Item>
175 <Grid.Item full as={Flex} row justify="between" align="center">
176 <Flex.Item
177 flex
178 as={Text}
179 className={cn('mono', {
180 black: !completed && isProxySet,
181 gray4: !completed && !isProxySet,
182 green3: completed,
183 })}>
184 {isProxySet ? proxyAddress : 'Unset'}
185 </Flex.Item>
186 {!completed && isProxySet && (
187 <Flex.Item as={ToggleInput} {...unsetInput} />
188 )}
189 </Grid.Item>
191 {completed ? (
192 <Grid.Item full className="mb4" />
193 ) : (
194 <Grid.Item full as={Input} {...addressInput} className="mv4" />
195 )}
197 <Grid.Item
198 full
199 as={InlineEthereumTransaction}
200 {...bind}
201 onReturn={() => pop()}
202 />
203 </Grid>
204 );