fix: add appName for metamask connector

gnosischain · May 15, 2024 · 3be2562 · 3be2562
1 parent 5d97747
commit 3be2562
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 5 deletions.
diff --git a/app/connect/page.tsx b/app/connect/page.tsx
@@ -7,9 +7,11 @@ import Image from "next/image";
 import { useAccount, useConnect } from "wagmi";
 import Link from "next/link";
 
+const connectorImages = ["coinbaseWallet.png", "walletConnect.png", "metaMask.png"];
+
 export default function Page() {
   const account = useAccount();
-  const { connectors, connect, status, error } = useConnect();
+  const { connectors, connect } = useConnect();
   const router = useRouter();
 
   useEffect(() => {
@@ -28,11 +30,10 @@ export default function Page() {
         </div>
         <p className="text-2xl lg:text-3xl text-black font-bold mt-8 w-1/2 text-center">Choose your preferred wallet</p>
         <div className="w-full flex flex-col divide-slate-700 divide-y mt-8">
-          {connectors.map((connector) => {
-            console.log(connector.id);
+          {connectors.map((connector, index) => {
             return (
               <div className="flex w-full justify-between items-center text-black hover:bg-[#E8E1CF] py-4 p-2 first:rounded-t-lg last:rounded-b-lg" key={connector.uid} onClick={() => connect({ connector })}>
-                {connector.name} <Image src={"/" + connector.id + ".png"} alt={connector.id} width={48} height={24} />
+                {connector.name} <Image src={connectorImages[index]} alt={connector.id} width={48} height={24} />
               </div>
             );
           })}

diff --git a/public/coinbasewalletSDK.png → public/coinbasewallet.png b/public/coinbasewalletSDK.png → public/coinbasewallet.png
diff --git a/public/metaMaskSDK.png → public/metaMask.png b/public/metaMaskSDK.png → public/metaMask.png
diff --git a/wagmi.ts b/wagmi.ts
@@ -5,7 +5,7 @@ import { coinbaseWallet, metaMask, walletConnect } from "wagmi/connectors";
 export const config = createConfig({
   chains: [gnosis, gnosisChiado],
   multiInjectedProviderDiscovery: false,
-  connectors: [coinbaseWallet({ appName: "Gnosis Deposit" }), walletConnect({ projectId: process.env.NEXT_PUBLIC_WC_PROJECT_ID || "" }), metaMask()],
+  connectors: [coinbaseWallet({ appName: "Gnosis Deposit" }), walletConnect({ projectId: process.env.NEXT_PUBLIC_WC_PROJECT_ID || "" }), metaMask({dappMetadata: {name: "Gnosis Deposit"}})],
   ssr: true,
   transports: {
     [gnosis.id]: http("https://rpc.gnosischain.com/"),