From 0b210fd446111a0e2afbb238db2cc7e0aa358db1 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Tue, 9 Aug 2022 19:23:38 -0300
Subject: [PATCH] Use SWR for Sourcify metadata fetching

---
 src/TransactionPageContent.tsx |  7 ++++--
 src/sourcify/useSourcify.ts    | 41 +++++++++++-----------------------
 src/url.ts                     |  4 ++++
 3 files changed, 22 insertions(+), 30 deletions(-)

diff --git a/src/TransactionPageContent.tsx b/src/TransactionPageContent.tsx
index 7320a2e..9211b97 100644
--- a/src/TransactionPageContent.tsx
+++ b/src/TransactionPageContent.tsx
@@ -11,7 +11,10 @@ import { SelectionContext, useSelection } from "./useSelection";
 import { SelectedTransactionContext } from "./useSelectedTransaction";
 import { BlockNumberContext } from "./useBlockTagContext";
 import { useAppConfigContext } from "./useAppConfig";
-import { useSourcify, useTransactionDescription } from "./sourcify/useSourcify";
+import {
+  useSourcifyMetadata,
+  useTransactionDescription,
+} from "./sourcify/useSourcify";
 
 const Details = React.lazy(() => import("./transaction/Details"));
 const Logs = React.lazy(() => import("./transaction/Logs"));
@@ -44,7 +47,7 @@ const TransactionPageContent: React.FC<TransactionPageContentProps> = ({
   const selectionCtx = useSelection();
 
   const { sourcifySource } = useAppConfigContext();
-  const metadata = useSourcify(
+  const metadata = useSourcifyMetadata(
     txData?.to,
     provider?.network.chainId,
     sourcifySource
diff --git a/src/sourcify/useSourcify.ts b/src/sourcify/useSourcify.ts
index 4f8f31f..89aecae 100644
--- a/src/sourcify/useSourcify.ts
+++ b/src/sourcify/useSourcify.ts
@@ -1,6 +1,7 @@
 import { useState, useEffect, useMemo } from "react";
 import { Interface } from "@ethersproject/abi";
 import { ErrorDescription } from "@ethersproject/abi/lib/interface";
+import useSWRImmutable from "swr/immutable";
 import { ChecksummedAddress, TransactionData } from "../types";
 import { sourcifyMetadata, SourcifySource, sourcifySourceFile } from "../url";
 
@@ -102,38 +103,22 @@ const fetchSourcifyMetadata = async (
   }
 };
 
-// TODO: replace every occurrence with the multiple version one
-export const useSourcify = (
+export const useSourcifyMetadata = (
   address: ChecksummedAddress | undefined,
   chainId: number | undefined,
   source: SourcifySource
 ): Metadata | null | undefined => {
-  const [rawMetadata, setRawMetadata] = useState<Metadata | null | undefined>();
-
-  useEffect(() => {
-    if (!address || chainId === undefined) {
-      return;
-    }
-    setRawMetadata(undefined);
-
-    const abortController = new AbortController();
-    const fetchMetadata = async () => {
-      const _metadata = await fetchSourcifyMetadata(
-        address,
-        chainId,
-        source,
-        abortController
-      );
-      setRawMetadata(_metadata);
-    };
-    fetchMetadata();
-
-    return () => {
-      abortController.abort();
-    };
-  }, [address, chainId, source]);
-
-  return rawMetadata;
+  const metadataURL = () =>
+    address === undefined || chainId === undefined
+      ? null
+      : sourcifyMetadata(address, chainId, source);
+  const { data, error } = useSWRImmutable<Metadata>(metadataURL, (url) =>
+    fetch(url).then((res) => res.json())
+  );
+  if (error) {
+    return null;
+  }
+  return data;
 };
 
 export const useMultipleMetadata = (
diff --git a/src/url.ts b/src/url.ts
index 6a7a411..69d8397 100644
--- a/src/url.ts
+++ b/src/url.ts
@@ -53,6 +53,10 @@ const resolveSourcifySource = (source: SourcifySource) => {
   throw new Error(`Unknown Sourcify integration source code: ${source}`);
 };
 
+/**
+ * Builds a complete Sourcify metadata.json URL given the contract address
+ * and chain.
+ */
 export const sourcifyMetadata = (
   address: ChecksummedAddress,
   chainId: number,