From 956daccf29ab197a7d69948d22e0ff2c0ba3aff1 Mon Sep 17 00:00:00 2001
From: Joseph Izang <josephizang@gmail.com>
Date: Wed, 15 Nov 2023 14:38:01 +0300
Subject: [PATCH] fix abi display in vyper ui

---
 apps/vyper/src/app/app.tsx                    | 46 -------------------
 apps/vyper/src/app/components/VyperResult.tsx |  3 +-
 2 files changed, 1 insertion(+), 48 deletions(-)

diff --git a/apps/vyper/src/app/app.tsx b/apps/vyper/src/app/app.tsx
index fe1fa98421..aad3dd429f 100644
--- a/apps/vyper/src/app/app.tsx
+++ b/apps/vyper/src/app/app.tsx
@@ -53,52 +53,6 @@ const App: React.FC = () => {
     start()
   }, [])
 
-  // useEffect(() => {
-  //   const getStandardOutput = () => {
-  //     const contractName = contract.split('/').slice(-1)[0].split('.')[0]
-  //     const compiledAbi = output['contractTypes'][contractName].abi
-  //     const deployedBytecode = output['contractTypes'][contractName].deploymentBytecode.bytecode.replace('0x', '')
-  //     const bytecode = output['contractTypes'][contractName].runtimeBytecode.bytecode.replace('0x', '')
-  //     const compiledAst = output['contractTypes'][contractName].abi
-  //     //const methodIdentifiers = JSON.parse(JSON.stringify(compilationResult['method_identifiers']).replace(/0x/g, ''))
-  //     return {
-  //       sources: {
-  //         [contract]: {
-  //           id: 1,
-  //           ast: compiledAst,
-  //           legacyAST: {} as any
-  //         }
-  //       },
-  //       contracts: {
-  //         [contract]: {
-  //           // If the language used has no contract names, this field should equal to an empty string
-  //           [contractName]: {
-  //             // The Ethereum Contract ABI. If empty, it is represented as an empty array.
-  //             // See https://github.com/ethereum/wiki/wiki/Ethereum-Contract-ABI
-  //             abi: compiledAbi,
-  //             evm: {
-  //               bytecode: {
-  //                 linkReferences: {},
-  //                 object: deployedBytecode,
-  //                 opcodes: ''
-  //               },
-  //               deployedBytecode: {
-  //                 linkReferences: {},
-  //                 object: bytecode,
-  //                 opcodes: ''
-  //               },
-  //               // methodIdentifiers: methodIdentifiers
-  //             }
-  //           }
-  //         } as any
-  //       }
-  //     }
-  //   }
-  //   const data = getStandardOutput()
-  //   console.log({ data })
-  //   setCompilerResponse(data)
-  // }, [output])
-
   /** Update the environment state value */
   function setEnvironment(environment: 'local' | 'remote') {
     setState({...state, environment})
diff --git a/apps/vyper/src/app/components/VyperResult.tsx b/apps/vyper/src/app/components/VyperResult.tsx
index 6ba82c4ce4..c2b942a818 100644
--- a/apps/vyper/src/app/components/VyperResult.tsx
+++ b/apps/vyper/src/app/components/VyperResult.tsx
@@ -54,8 +54,7 @@ function VyperResult({ output }: VyperResultProps) {
             Copy ABI
           </Button>
         </CopyToClipboard>
-        {/* <JSONTree src={output.abi} /> */}
-        <ReactJson src={output.abi} />
+        <JSONTree src={output.abi} />
       </Tab>
       <Tab eventKey="bytecode" title="Bytecode">
         <CopyToClipboard getContent={() => output.bytecode}>