enable web3modal dark mode + Coinbase, Binance, Torus support

citydaoproject · May 16, 2022 · f229a82 · f229a82
1 parent ed7ba25
commit f229a82
Show file tree

Hide file tree

Showing 3 changed files with 542 additions and 41 deletions.
diff --git a/hooks/useWallet.tsx b/hooks/useWallet.tsx
@@ -2,6 +2,8 @@
 import { Provider } from '@ethersproject/abstract-provider';
 import { JsonRpcProvider } from '@ethersproject/providers';
 import WalletConnectProvider from '@walletconnect/web3-provider';
+import CoinbaseWalletSDK from '@coinbase/wallet-sdk';
+import Torus from '@toruslabs/torus-embed';
 import { providers } from 'ethers';
 import { useCallback, useEffect } from 'react';
 import Web3Modal from 'web3modal';
@@ -12,16 +14,31 @@ const INFURA_ID = process.env.NEXT_PUBLIC_INFURA_ID;
 
 const providerOptions = {
   walletconnect: {
-    package: WalletConnectProvider, // required
+    package: WalletConnectProvider,
     options: {
-      infuraId: INFURA_ID, // required
+      infuraId: INFURA_ID,
     },
   },
+  coinbasewallet: {
+    package: CoinbaseWalletSDK,
+    options: {
+      appName: 'CityDAO Parcel-0',
+      infuraId: INFURA_ID,
+      darkMode: true,
+    },
+  },
+  torus: {
+    package: Torus,
+  },
+  binancechainwallet: {
+    package: true,
+  },
 };
 
 let web3Modal: any;
 if (typeof window !== 'undefined') {
   web3Modal = new Web3Modal({
+    theme: 'dark',
     network: 'mainnet', // optional
     cacheProvider: true,
     providerOptions, // required

diff --git a/package.json b/package.json
@@ -15,6 +15,8 @@
   },
   "dependencies": {
     "@citydao/parcel-contracts": "^0.0.4",
+    "@coinbase/wallet-sdk": "^3.1.0",
+    "@toruslabs/torus-embed": "^1.22.6",
     "@types/react-modal": "^3.13.1",
     "@walletconnect/web3-provider": "^1.7.8",
     "ethers": "^5.5.1",