@ -1,12 +1,13 @@
import React , { useState } from "react"
import { Formik , ErrorMessage , Field } from "formik"
import { getEtherScanApi , getNetworkName , getReceiptStatus } from "../utils"
import { getEtherScanApi , getNetworkName , getReceiptStatus , getProxyContractReceiptStatus } from "../utils"
import { Receipt } from "../types"
import { AppContext } from "../AppContext"
import { SubmitButton } from "../components"
import { Navigate } from "react-router-dom"
import { Button } from "react-bootstrap"
import { CustomTooltip } from '@remix-ui/helper'
interface FormValues {
receiptGuid : string
@ -14,6 +15,8 @@ interface FormValues {
export const ReceiptsView : React.FC = ( ) = > {
const [ results , setResults ] = useState ( { succeed : false , message : '' } )
const [ isProxyContractReceipt , setIsProxyContractReceipt ] = useState ( false )
const onGetReceiptStatus = async (
values : FormValues ,
clientInstance : any ,
@ -25,15 +28,27 @@ export const ReceiptsView: React.FC = () => {
setResults ( {
succeed : false ,
message : "Cannot verify in the selected network"
} )
} )
return
}
const etherscanApi = getEtherScanApi ( networkId )
const result = await getReceiptStatus (
values . receiptGuid ,
apiKey ,
etherscanApi
)
let result
if ( isProxyContractReceipt ) {
result = await getProxyContractReceiptStatus (
values . receiptGuid ,
apiKey ,
etherscanApi
)
if ( result . status === '1' ) {
result . message = result . result
result . result = 'Successfully Updated'
}
} else
result = await getReceiptStatus (
values . receiptGuid ,
apiKey ,
etherscanApi
)
setResults ( {
succeed : result.status === '1' ? true : false ,
message : result.result || ( result . status === '0' ? 'Verification failed' : result . message )
@ -71,7 +86,7 @@ export const ReceiptsView: React.FC = () => {
onGetReceiptStatus ( values , clientInstance , apiKey )
}
>
{ ( { errors , touched , handleSubmit } ) = > (
{ ( { errors , touched , handleSubmit , handleChange } ) = > (
< form onSubmit = { handleSubmit } >
< div
className = "form-group"
@ -93,6 +108,21 @@ export const ReceiptsView: React.FC = () => {
component = "div"
/ >
< / div >
< div className = "d-flex mb-2 custom-control custom-checkbox" >
< Field
className = "custom-control-input"
type = "checkbox"
name = "isProxyReceipt"
id = "isProxyReceipt"
onChange = { async ( e ) = > {
handleChange ( e )
if ( e . target . checked ) setIsProxyContractReceipt ( true )
else setIsProxyContractReceipt ( false )
} }
/ >
< label className = "form-check-label custom-control-label" htmlFor = "isProxyReceipt" > It ' s a proxy contract GUID < / label >
< / div >
< SubmitButton text = "Check" disable = { ! touched . receiptGuid || ( touched . receiptGuid && errors . receiptGuid ) ? true : false } / >
< / form >
) }
@ -108,8 +138,14 @@ export const ReceiptsView: React.FC = () => {
dangerouslySetInnerHTML = { { __html : results.message ? results . message : '' } }
/ >
< ReceiptsTable receipts = { receipts } / >
< Button title = "Clear the list of receipt" onClick = { ( ) = > { setReceipts ( [ ] ) } } > Clear < / Button >
< ReceiptsTable receipts = { receipts } / > < br / >
< CustomTooltip
tooltipText = "Clear the list of receipts"
tooltipId = 'etherscan-clear-receipts'
placement = 'bottom'
>
< Button onClick = { ( ) = > { setReceipts ( [ ] ) } } > Clear < / Button >
< / CustomTooltip >
< / div >
)
}
@ -120,7 +156,7 @@ export const ReceiptsView: React.FC = () => {
const ReceiptsTable : React.FC < { receipts : Receipt [ ] } > = ( { receipts } ) = > {
return (
< div className = "table-responsive" style = { { fontSize : "0.7 em" } } >
< div className = "table-responsive" style = { { fontSize : "0.8 em" } } >
< h6 > Receipts < / h6 >
< table className = "table table-sm" >
< thead >
@ -135,10 +171,21 @@ const ReceiptsTable: React.FC<{ receipts: Receipt[] }> = ({ receipts }) => {
receipts . map ( ( item : Receipt , index ) = > {
return (
< tr key = { item . guid } >
< td className = { item . status === 'Pass - Verified'
< td className = { ( item . status === 'Pass - Verified' || item . status === 'Successfully Updated' )
? 'text-success' : ( item . status === 'Pending in queue'
? 'text-warning' : ( item . status === 'Already Verified'
? 'text-info' : 'text-secondary' ) ) } > { item . status } < / td >
? 'text-info' : 'text-secondary' ) ) } >
{ item . status }
{ item . status === 'Successfully Updated' && < CustomTooltip
placement = { 'bottom' }
tooltipClasses = "text-wrap"
tooltipId = "etherscan-receipt-proxy-status"
tooltipText = { item . message }
>
< i style = { { fontSize : 'small' } } className = { 'ml-1 fal fa-info-circle align-self-center' } aria - hidden = "true" > < / i >
< / CustomTooltip >
}
< / td >
< td > { item . guid } < / td >
< / tr >
)