@@ -0,0 +1,91 @@
1+import React, { useEffect } from 'react';
2+import cn from 'classnames';
3+import { Grid, Text } from 'indigo-react';
4+import * as azimuth from 'azimuth-js';
5+
6+import { useNetwork } from 'store/network';
7+import { usePointCursor } from 'store/pointCursor';
8+import { usePointCache } from 'store/pointCache';
9+
10+import * as need from 'lib/need';
11+import { useLocalRouter } from 'lib/LocalRouter';
12+import useCurrentPointName from 'lib/useCurrentPointName';
13+import useEthereumTransaction from 'lib/useEthereumTransaction';
14+import { GAS_LIMITS } from 'lib/constants';
15+import { ETH_ZERO_ADDR } from 'lib/wallet';
16+import useLifecycle from 'lib/useLifecycle';
17+
18+import ViewHeader from 'components/ViewHeader';
19+import MiniBackButton from 'components/MiniBackButton';
20+import InlineEthereumTransaction from 'components/InlineEthereumTransaction';
21+
22+function useCancelTransfer() {
23+ const { contracts } = useNetwork();
24+ const { pointCursor } = usePointCursor();
25+ const { syncOwnedPoint } = usePointCache();
26+
27+ const _contracts = need.contracts(contracts);
28+ const _point = need.point(pointCursor);
29+
30+ const { construct, confirmed, bind } = useEthereumTransaction(
31+ GAS_LIMITS.CANCEL_TRANSFER
32+ );
33+
34+ useLifecycle(() => {
35+ construct(
36+ azimuth.ecliptic.setTransferProxy(_contracts, _point, ETH_ZERO_ADDR)
37+ );
38+ });
39+
40+ // sync point details after success
41+ useEffect(() => {
42+ if (confirmed) {
43+ syncOwnedPoint(_point);
44+ }
45+ }, [_point, confirmed, syncOwnedPoint]);
46+
47+ return {
48+ confirmed,
49+ bind,
50+ };
51+}
52+
53+export default function AdminCancelTransfer() {
54+ const { pop } = useLocalRouter();
55+ const { getDetails } = usePointCache();
56+ const { pointCursor } = usePointCursor();
57+ const _point = need.point(pointCursor);
58+
59+ const name = useCurrentPointName();
60+ const _details = need.details(getDetails(_point));
61+
62+ const { confirmed, bind } = useCancelTransfer();
63+
64+ return (
65+ <Grid>
66+ <Grid.Item full as={MiniBackButton} onClick={() => pop()} />
67+
68+ <Grid.Item full as={ViewHeader}>
69+ Cancel Outgoing Transfer
70+ </Grid.Item>
71+
72+ <Grid.Item
73+ full
74+ as={Text}
75+ className={cn('f5', {
76+ green3: confirmed,
77+ })}>
78+ {confirmed
79+ ? `The outgoing transfer of ${name} has been cancelled.`
80+ : `Cancel the outgoing transfer of ${name} to ${_details.transferProxy}.`}
81+ </Grid.Item>
82+
83+ <Grid.Item
84+ full
85+ as={InlineEthereumTransaction}
86+ {...bind}
87+ onReturn={() => pop()}
88+ />
89+ </Grid>
90+ );
91+}