-
Notifications
You must be signed in to change notification settings - Fork 39
/
remove-button.js
99 lines (98 loc) · 2.34 KB
/
remove-button.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
import {
Box,
Button,
Card,
Popup,
Text,
useContract,
useWeb3,
zeroAddress,
} from "@kleros/components";
import { useMemo } from "react";
import { graphql, useFragment } from "relay-hooks";
const removeButtonFragments = {
contract: graphql`
fragment removeButtonContract on Contract {
submissionBaseDeposit
sharedStakeMultiplier
}
`,
request: graphql`
fragment removeButtonRequest on Request {
arbitrator
arbitratorExtraData
}
`,
};
export default function RemoveButton({ request, contract, submissionID }) {
const { arbitrator, arbitratorExtraData } = useFragment(
removeButtonFragments.request,
request
);
const [arbitrationCost] = useContract(
"klerosLiquid",
"arbitrationCost",
useMemo(
() => ({
address: arbitrator,
args: [arbitratorExtraData],
}),
[arbitrator, arbitratorExtraData]
)
);
const { web3 } = useWeb3();
const { sharedStakeMultiplier, submissionBaseDeposit } = useFragment(
removeButtonFragments.contract,
contract
);
const totalCost = arbitrationCost
?.add(
arbitrationCost
.mul(web3.utils.toBN(sharedStakeMultiplier))
.div(web3.utils.toBN(10000))
)
.add(web3.utils.toBN(submissionBaseDeposit));
const { send, loading } = useContract("proofOfHumanity", "removeSubmission");
return (
<Popup
trigger={
<Button
sx={{
marginY: 1,
width: "100%",
}}
>
Request Removal
</Button>
}
modal
>
{(close) => (
<Box sx={{ fontWeight: "bold", padding: 2 }}>
<Text sx={{ marginBottom: 1 }}>Deposit:</Text>
<Card
variant="muted"
sx={{ fontSize: 2, marginBottom: 3 }}
mainSx={{ padding: 0 }}
>
<Text>
{totalCost && `${web3.utils.fromWei(totalCost)} ETH Deposit`}
</Text>
</Card>
<Button
sx={{ display: "block", margin: "auto" }}
disabled={!totalCost}
onClick={() =>
send(submissionID, zeroAddress, { value: totalCost }).then(() =>
close()
)
}
loading={loading}
>
Request Removal
</Button>
</Box>
)}
</Popup>
);
}