feat: add verification functionality (#71)

* feat: add source code verification

* fix: ci

* fix: sticky

* fix: bugs

Author: sirily11

.github/workflows/cloud-run.yaml

@@ -45,6 +45,7 @@ jobs:
             RPC_URL=${{secrets.RPC_TEST_URL}},
             REDIS_URL=${{secrets.REDIS_TEST_URL}},
             USER_SERVICE_URL=https://user.test.etdstatsapi.net
+            SOLIDITY_SERVICE_URL=https://functions.etdstatsapi.net/api/solidity/compile
           region: asia-southeast1
           flags: --allow-unauthenticated
 

.github/workflows/release.yaml

@@ -30,7 +30,7 @@ jobs:
           file: ./docker/services/service.dockerfile
           platforms: linux/amd64
           push: true
-          tags: ghcr.io/${{ github.repository }}/${{ matrix.app }}:${{ github.event.release.tag_name }},gcr.io/${{ secrets.GCP_PROJECT_ID }}/${{ matrix.app }}:${{ github.event.release.tag_name }}
+          tags: ghcr.io/${{ github.repository }}/${{ matrix.app }}:${{ github.event.release.tag_name }}
           build-args: |
             APP_NAME=${{ matrix.app }}
           cache-from: type=gha

apps/etdstats/lib/components/display/contract/ByteCodeDisplay.tsx

@@ -1,12 +1,22 @@
 import { Card, CardContent, Stack, Typography } from "@mui/material";
+import useCbor from "../../../hooks/useCbor";
 
 interface Props {
   bytecode: string;
 }
 
 export default function ByteCodeDisplay({ bytecode }: Props) {
+  const decodedData = useCbor(bytecode);
+
   return (
-    <Stack>
+    <Stack spacing={2}>
+      <Typography fontWeight={"bold"}>Metadata</Typography>
+      <Card variant="outlined" sx={{ boxShadow: "none" }}>
+        <CardContent>
+          <pre>{JSON.stringify(decodedData, null, 4)}</pre>
+        </CardContent>
+      </Card>
+      <Typography fontWeight={"bold"}>ByteCode</Typography>
       <Card variant="outlined" sx={{ boxShadow: "none" }}>
         <CardContent>
           <Typography sx={{ wordWrap: "break-word" }}>{bytecode}</Typography>

apps/etdstats/lib/hooks/useCbor.tsx

@@ -0,0 +1,47 @@
+import React from "react";
+import cbor from "cbor";
+
+function getMetadataBytes(bytecode: string) {
+  // get last 4 bytes of bytecode
+  const metadataLength = bytecode.slice(-4);
+  // convert to decimal
+  const metadataLengthDecimal = parseInt(metadataLength, 16);
+  // get metadata bytes
+  const metadataBytes = bytecode.slice(-metadataLengthDecimal * 2 - 4, -4);
+  return metadataBytes;
+}
+
+function parseMetadata(metadataBytes: string) {
+  const metadata = cbor.decode(Buffer.from(metadataBytes, "hex"));
+  return metadata;
+}
+
+function covertBufferObjectToHexObject(object: any) {
+  const hexObject: any = {};
+  for (const key in object) {
+    if (object.hasOwnProperty(key)) {
+      const element = object[key];
+      if (Buffer.isBuffer(element)) {
+        hexObject[key] = element.toString("hex");
+      } else {
+        hexObject[key] = element;
+      }
+    }
+  }
+  return hexObject;
+}
+
+export default function useCbor(bytecode: string) {
+  const [decodedData, setDecodedData] = React.useState<any | undefined>();
+
+  React.useEffect(() => {
+    if (bytecode) {
+      const metadataBytes = getMetadataBytes(bytecode);
+      const metadata = parseMetadata(metadataBytes);
+      const hexObject = covertBufferObjectToHexObject(metadata);
+      setDecodedData(hexObject);
+    }
+  }, [bytecode]);
+
+  return decodedData;
+}

apps/etdstats/lib/hooks/useContract.tsx

@@ -4,9 +4,25 @@ import { useCallback } from "react";
 import { useQuery } from "react-query";
 import useAuthentication from "./useAuthentication";
 
+const solcURL = "https://solc-bin.ethereum.org/bin/";
+
+interface VersionList {
+  builds: {
+    path: string;
+    version: string;
+    longVersion: string;
+    build: string;
+  }[];
+}
+
 export function useContract({ page }: { page: number }) {
   const { accessToken } = useAuthentication();
 
+  const solidityVersions = useQuery(["solidity", "versions"], async () => {
+    const { data } = await axios.get<VersionList>(solcURL + "list.json");
+    return data;
+  });
+
   const result = useQuery(["contracts", page], async () => {
     const analyticsService = new ContractService({
       client: axios,
@@ -55,20 +71,42 @@ export function useContract({ page }: { page: number }) {
 
   const getContract = useCallback(
     async (address: string) => {
-      const analyticsService = new ContractService({
+      const contractService = new ContractService({
         client: axios,
         baseUrl: process.env.NEXT_PUBLIC_CONTRACT_API_ENDPOINT!,
       });
-      const response = await analyticsService.getContract(address);
+      const response = await contractService.getContract(address);
       return response;
     },
     [accessToken]
   );
 
+  const compile = useCallback(
+    async (
+      source: string,
+      compiler: string | undefined,
+      contractName: string
+    ) => {
+      const contractService = new ContractService({
+        client: axios,
+        baseUrl: process.env.NEXT_PUBLIC_CONTRACT_API_ENDPOINT!,
+      });
+      const response = await contractService.compile(
+        source,
+        compiler,
+        contractName
+      );
+      return response;
+    },
+    []
+  );
+
   return {
     contracts: result,
+    solidityVersions,
     search,
     update,
     getContract,
+    compile,
   };
 }

apps/etdstats/package.json

@@ -21,6 +21,7 @@
     "@mui/x-data-grid": "5.17.10",
     "@types/react-highlight-words": "0.16.4",
     "axios": "1.1.3",
+    "cbor": "^8.1.0",
     "dayjs": "^1.11.6",
     "dexie": "3.2.2",
     "dexie-react-hooks": "1.1.1",
@@ -42,6 +43,7 @@
     "react-highlight-words": "0.18.0",
     "react-json-tree": "^0.17.0",
     "react-query": "3.39.2",
+    "react-syntax-highlighter": "^15.5.0",
     "recharts": "2.1.16",
     "ui": "workspace:*"
   },