Fix missing upper level triggerFilePath in contract selections

apps/contract-verification/src/app/Verifiers/EtherscanVerifier.tsx

@@ -14,9 +14,9 @@ export class EtherscanVerifier extends AbstractVerifier {
   async verify(chainId: string, address: string, compilerAbstract: CompilerAbstract, selectedContractFileAndName: string) {
     const CODE_FORMAT = 'solidity-standard-json-input'
 
-    const [selectedFileName, selectedContractName] = selectedContractFileAndName.split(':')
+    const [_triggerFilePath, selectedFilePath, selectedContractName] = selectedContractFileAndName.split(':')
     // TODO: Handle version Vyper contracts. This relies on Solidity metadata.
-    const metadata = JSON.parse(compilerAbstract.data.contracts[selectedFileName][selectedContractName].metadata)
+    const metadata = JSON.parse(compilerAbstract.data.contracts[selectedFilePath][selectedContractName].metadata)
     const body = {
       chainId,
       codeformat: CODE_FORMAT,

apps/contract-verification/src/app/Verifiers/SourcifyVerifier.ts

@@ -9,10 +9,10 @@ export class SourcifyVerifier extends AbstractVerifier {
   }
 
   async verify(chainId: string, address: string, compilerAbstract: CompilerAbstract, selectedContractFileAndName: string) {
-    const [selectedFileName, selectedContractName] = selectedContractFileAndName.split(':')
-    const metadataStr = compilerAbstract.data.contracts[selectedFileName][selectedContractName].metadata
+    const [_triggerFileName, selectedFilePath, selectedContractName] = selectedContractFileAndName.split(':')
+    const metadataStr = compilerAbstract.data.contracts[selectedFilePath][selectedContractName].metadata
     const sources = compilerAbstract.source.sources
-    console.log('selectedFileName:', selectedFileName)
+    console.log('selectedFilePath:', selectedFilePath)
     console.log('selectedContractName:', selectedContractName)
     console.log('compilerAbstract:', compilerAbstract)
     console.log('selectedContractMetadataStr:', metadataStr)

apps/contract-verification/src/app/app.tsx

@@ -21,7 +21,8 @@ const App = () => {
   const [chains, setChains] = useState<Chain[]>([]) // State to hold the chains data
   const [targetFileName, setTargetFileName] = useState('')
   const [compilationOutput, setCompilationOutput] = useState<{[key: string]: CompilerAbstract} | undefined>()
-  // Contract file and name in format contracts/Storage.sol:Storage
+  // Contract file and name in format contracts/Storage.sol:contracts/Owner.sol:Owner
+  // TODO: What happens if contract or filepath contains ":"" ?
   const [selectedContractFileAndName, setSelectedContractFileAndName] = useState<string | undefined>()
   const [verifiers, setVerifiers] = useState<AbstractVerifier[]>([])
   const [submittedContracts, setSubmittedContracts] = useState<SubmittedContracts>({})

apps/contract-verification/src/app/components/ContractDropdown.tsx

@@ -39,20 +39,24 @@ export const ContractDropdown: React.FC<ContractDropdownProps> = ({label, id}) =
   return (
     <div className="form-group">
       <label htmlFor={id}>{label}</label>
-
       <select className={`form-control custom-select pr-4 ${!hasContracts ? 'disabled-cursor' : ''}`} id={id} disabled={!hasContracts} onChange={handleSelectContract}>
         {hasContracts ? (
-          Object.keys(compilationOutput).map((fileName) =>
-            Object.keys(compilationOutput[fileName].data.contracts).map((fileName2) => (
-              <optgroup key={fileName2 + '-lower'} label={fileName2}>
-                {Object.keys(compilationOutput[fileName].data.contracts[fileName2]).map((contractName) => (
-                  <option key={fileName2 + ':' + contractName} value={fileName2 + ':' + contractName}>
-                    {contractName}
+          Object.keys(compilationOutput).map((compilationTriggerFileName) => (
+            <optgroup key={compilationTriggerFileName} label={`[Compilation Trigger File]: ${compilationTriggerFileName}`}>
+              {Object.keys(compilationOutput[compilationTriggerFileName].data.contracts).map((fileName2) => (
+                <>
+                  <option disabled style={{fontWeight: 'bold'}}>
+                    [File]: {fileName2}
                   </option>
-                ))}
-              </optgroup>
-            ))
-          )
+                  {Object.keys(compilationOutput[compilationTriggerFileName].data.contracts[fileName2]).map((contractName) => (
+                    <option key={fileName2 + ':' + contractName} value={compilationTriggerFileName + ':' + fileName2 + ':' + contractName}>
+                      {'\u00A0\u00A0\u00A0' + contractName} {/* Indentation for contract names */}
+                    </option>
+                  ))}
+                </>
+              ))}
+            </optgroup>
+          ))
         ) : (
           <option>No Compiled Contracts. Please compile and select a contract</option>
         )}

apps/contract-verification/src/app/views/VerifyView.tsx

@@ -37,9 +37,9 @@ export const VerifyView = () => {
   const handleVerify = async (e) => {
     e.preventDefault() // Don't change the page
 
-    const [filePath, contractName] = selectedContractFileAndName.split(':')
+    const [triggerFilePath, filePath, contractName] = selectedContractFileAndName.split(':')
     const enabledVerifiers = verifiers.filter((verifier) => verifier.enabled)
-    const compilerAbstract = compilationOutput[filePath]
+    const compilerAbstract = compilationOutput[triggerFilePath]
     if (!compilerAbstract) {
       throw new Error(`Error: Compilation output not found for ${selectedContractFileAndName}`)
     }