From 9ca0ff46b4f7db45b25a113611bce49641e1cdad Mon Sep 17 00:00:00 2001 From: epiqueras Date: Sun, 13 Sep 2020 22:15:50 -0400 Subject: [PATCH] chore: implement vouching --- .../index.js} | 12 +--- .../submission-details-card/vouch-button.js | 58 +++++++++++++++++++ components/index.js | 1 + components/web3-provider.js | 35 +++++++---- icons/index.js | 1 + icons/warning.js | 19 ++++++ 6 files changed, 105 insertions(+), 21 deletions(-) rename _pages/profile/[id]/{submission-details-card.js => submission-details-card/index.js} (96%) create mode 100644 _pages/profile/[id]/submission-details-card/vouch-button.js create mode 100644 icons/warning.js diff --git a/_pages/profile/[id]/submission-details-card.js b/_pages/profile/[id]/submission-details-card/index.js similarity index 96% rename from _pages/profile/[id]/submission-details-card.js rename to _pages/profile/[id]/submission-details-card/index.js index 94525cdd..12b7d1d7 100644 --- a/_pages/profile/[id]/submission-details-card.js +++ b/_pages/profile/[id]/submission-details-card/index.js @@ -1,6 +1,5 @@ import { Box, - Button, Card, Flex, Image, @@ -13,6 +12,8 @@ import { Ether, User } from "@kleros/icons"; import { useMemo } from "react"; import { graphql, useFragment } from "relay-hooks"; +import VouchButton from "./vouch-button"; + import { partyEnum, submissionStatusEnum, useEvidenceFile } from "data"; const submissionDetailsCardFragments = { @@ -111,14 +112,7 @@ export default function SubmissionDetailsCard({ submission, contract }) { {evidence?.file?.name} {evidence?.file?.bio} - + ({ args: [accounts?.[0], submissionID] }), [ + accounts, + submissionID, + ]) + ); + const { send, loading } = useContract( + "proofOfHumanity", + vouched ? "removeVouch" : "addVouch" + ); + const text = status !== "pending" && `${vouched ? "" : "Remove "}Vouch`; + return ( + + {text} + + } + modal + > + + + + Make sure the person exists and that you have physically encountered + them. Note that in the case of a dispute, if a submission is rejected + for reason “Duplicate” or “Does not exist”, everyone who had vouched + for it will get removed from the registry. + + + + + ); +} diff --git a/components/index.js b/components/index.js index 1f9d5a46..05fd02ec 100644 --- a/components/index.js +++ b/components/index.js @@ -23,6 +23,7 @@ export { default as Input } from "./input"; export { default as Layout } from "./layout"; export { default as Link } from "./link"; export { default as List, ListItem } from "./list"; +export { default as Popup } from "./popup"; export { default as RelayProvider, useQuery } from "./relay-provider"; export { default as SVG } from "./svg"; export { default as Select, Option } from "./select"; diff --git a/components/web3-provider.js b/components/web3-provider.js index 2e009274..c562b5e0 100644 --- a/components/web3-provider.js +++ b/components/web3-provider.js @@ -7,6 +7,7 @@ import { useContext, useEffect, useMemo, + useReducer, useState, } from "react"; import { useStorageReducer } from "react-storage-hooks"; @@ -168,6 +169,9 @@ export function useContract( const run = useCallback( (_args, _options) => contract && + (!args || + args.findIndex((value) => value === undefined || value === null) === + -1) && contract.methods[method](...(args || []), ...(_args || []))[type]({ ...options, ..._options, @@ -190,15 +194,20 @@ export function useContract( _args = __args.slice(0, -1); _options = __args[__args.length - 1]; } else _args = __args; - run(_args, _options) - .on("transactionHash", (transactionHash) => - dispatch({ type: "transactionHash", transactionHash }) - ) - .on("confirmation", (confirmation) => - dispatch({ type: "confirmation", confirmation }) - ) - .on("receipt", (receipt) => dispatch({ type: "receipt", receipt })) - .on("error", (error) => dispatch({ type: "error", error })); + return new Promise((resolve) => + run(_args, _options) + .on("transactionHash", (transactionHash) => + dispatch({ type: "transactionHash", transactionHash }) + ) + .on("confirmation", (confirmation) => + dispatch({ type: "confirmation", confirmation }) + ) + .on("receipt", (receipt) => { + dispatch({ type: "receipt", receipt }); + resolve(receipt); + }) + .on("error", (error) => dispatch({ type: "error", error })) + ); }, [run, dispatch] ); @@ -218,18 +227,20 @@ export function useContract( }), [sendState.transactionHash, sendState.receipt, web3] ); + const [reCallRef, reCall] = useReducer(() => ({}), {}); const data = usePromise( () => + reCallRef && type && !isSend && - run().then((res) => + run().then?.((res) => typeof res === "boolean" || Number.isNaN(Number(res)) || res?.startsWith("0x") ? res : web3.utils.toBN(res) ), - [type, isSend, run, web3] + [reCallRef, type, isSend, run, web3] ); return isSend @@ -239,5 +250,5 @@ export function useContract( send, loading: sendState.transactionHash && !sendState.receipt && !receipt, } - : data; + : [...data, reCall]; } diff --git a/icons/index.js b/icons/index.js index be352702..f67ebd12 100644 --- a/icons/index.js +++ b/icons/index.js @@ -15,4 +15,5 @@ export { default as Trash } from "./trash"; export { default as Twitter } from "./twitter"; export { default as User } from "./user"; export { default as Video } from "./video"; +export { default as Warning } from "./warning"; export { default as X } from "./x"; diff --git a/icons/warning.js b/icons/warning.js new file mode 100644 index 00000000..2fe8e53a --- /dev/null +++ b/icons/warning.js @@ -0,0 +1,19 @@ +import { SVG } from "@kleros/components"; + +export default function Warning({ size = 16, ...rest }) { + return ( + + + + ); +}