Extract Sourcify logo component

src/AddressTransactions.tsx

@@ -16,12 +16,12 @@ import StandardFrame from "./StandardFrame";
 import StandardSubtitle from "./StandardSubtitle";
 import Copy from "./components/Copy";
 import NavTab from "./components/NavTab";
+import SourcifyLogo from "./sourcify/SourcifyLogo";
 import AddressTransactionResults from "./address/AddressTransactionResults";
 import Contracts from "./address/Contracts";
 import { RuntimeContext } from "./useRuntime";
 import { useAppConfigContext } from "./useAppConfig";
 import { useSingleMetadata } from "./useSourcify";
-import SourcifyLogo from "./sourcify.svg";
 
 const AddressTransactions: React.FC = () => {
   const { provider } = useContext(RuntimeContext);
@@ -143,13 +143,7 @@ const AddressTransactions: React.FC = () => {
                       </span>
                     ) : (
                       <span className="self-center">
-                        <img
+                        <SourcifyLogo />
-                          src={SourcifyLogo}
-                          alt="Sourcify logo"
-                          title="Verified by Sourcify"
-                          width={16}
-                          height={16}
-                        />
                       </span>
                     )}
                   </span>

src/components/DecoratedAddressLink.tsx

@@ -7,10 +7,10 @@ import { faMoneyBillAlt } from "@fortawesome/free-solid-svg-icons/faMoneyBillAlt
 import { faBurn } from "@fortawesome/free-solid-svg-icons/faBurn";
 import { faCoins } from "@fortawesome/free-solid-svg-icons/faCoins";
 import AddressOrENSName from "./AddressOrENSName";
+import SourcifyLogo from "../sourcify/SourcifyLogo";
 import { AddressContext, ZERO_ADDRESS } from "../types";
 import { ResolvedAddresses } from "../api/address-resolver";
 import { Metadata } from "../useSourcify";
-import SourcifyLogo from "../sourcify.svg";
 
 type DecoratedAddressLinkProps = {
   address: string;
@@ -80,13 +80,7 @@ const DecoratedAddressLink: React.FC<DecoratedAddressLinkProps> = ({
           className="self-center flex-shrink-0 flex items-center"
           to={`/address/${address}/contract`}
         >
-          <img
+          <SourcifyLogo />
-            src={SourcifyLogo}
-            alt="Sourcify logo"
-            title="Verified by Sourcify"
-            width={16}
-            height={16}
-          />
         </NavLink>
       )}
       <AddressOrENSName

src/sourcify/SourcifyLogo.tsx

@@ -0,0 +1,14 @@
+import React from "react";
+import SourcifyIcon from "./sourcify.svg";
+
+const SourcifyLogo: React.FC = () => (
+  <img
+    src={SourcifyIcon}
+    alt="Sourcify logo"
+    title="Verified by Sourcify"
+    width={16}
+    height={16}
+  />
+);
+
+export default SourcifyLogo;