diff --git a/packages/govern-console/src/components/ActionBuilder/Screens/AbiForm.tsx b/packages/govern-console/src/components/ActionBuilder/Screens/AbiForm.tsx index 47016d08..28381c87 100644 --- a/packages/govern-console/src/components/ActionBuilder/Screens/AbiForm.tsx +++ b/packages/govern-console/src/components/ActionBuilder/Screens/AbiForm.tsx @@ -12,6 +12,7 @@ import { SPACING, Info, } from '@aragon/ui'; +import Switch from '@material-ui/core/Switch'; import { Controller, useForm } from 'react-hook-form'; import { validateContract, validateAbi } from 'utils/validations'; import { useWallet } from 'providers/AugmentedWallet'; @@ -21,6 +22,7 @@ import { constants } from 'ethers'; type FormInput = { contractAddress: string; + manualAbi: boolean; abi: string; }; @@ -38,6 +40,7 @@ export const AbiForm: React.FC = () => { const { gotoFunctionSelector } = useActionBuilderState(); const [showAbi, setShowAbi] = useState(false); + const [verified, setVerified] = useState(false); const gotoNextScreen = useCallback(() => { const formData = getValues(); @@ -51,15 +54,22 @@ export const AbiForm: React.FC = () => { return; } + const manualAbi = getValues('manualAbi'); const address = getValues('contractAddress'); const abiHandler = new AbiHandler(networkName); const abi = await abiHandler.get(address); + if (abi) { - gotoFunctionSelector(address, abi); + setVerified(true); + if (manualAbi) { + setShowAbi(true); + } else { + gotoFunctionSelector(address, abi); + } } else { setShowAbi(true); } - }, [networkName, trigger, getValues, gotoFunctionSelector, setShowAbi]); + }, [networkName, trigger, getValues, gotoFunctionSelector, setShowAbi, setVerified]); return ( @@ -109,25 +119,43 @@ export const AbiForm: React.FC = () => { + + ( +
+
Specify ABI manually:
+ + + An ABI is the specification used to interact with Ethereum smart contracts + +
+ )} + /> +
{showAbi && ( - - -
- - Contract not verified, please insert the input function ABI -
-
-
+ {!verified && ( + + +
+ + Contract not verified, please insert the input function ABI +
+
+
+ )}
Input function ABI
-
- - An ABI is the specification used to interact with Ethereum smart contracts - -