Add Binance web3 wallet on Ethereum

bancorprotocol · Dec 10, 2024 · a57d736 · a57d736
1 parent 27bb2d7
commit a57d736
Show file tree

Hide file tree

Showing 7 changed files with 284 additions and 10 deletions.
diff --git a/package.json b/package.json
@@ -5,6 +5,7 @@
   "dependencies": {
     "@babel/core": "^7.0.0-0",
     "@bancor/carbon-sdk": "0.0.99-DEV",
+    "@binance/w3w-wagmi-connector-v2": "^1.2.4-alpha.0",
     "@cloudflare/workers-types": "^4.20230717.0",
     "@ethersproject/abi": "^5.0.0",
     "@ethersproject/bytes": "^5.0.0",

diff --git a/src/assets/logos/binanceWallet.svg b/src/assets/logos/binanceWallet.svg
diff --git a/src/components/common/WalletIcon.tsx b/src/components/common/WalletIcon.tsx
@@ -6,6 +6,7 @@ import { ReactComponent as IconGnosisLogo } from 'assets/logos/gnosis.svg';
 import { ReactComponent as IconImposterLogo } from 'assets/logos/imposter.svg';
 import { ReactComponent as IconMetaMaskLogo } from 'assets/logos/metamask.svg';
 import { ReactComponent as IconWalletConnectLogo } from 'assets/logos/walletConnect.svg';
+import { ReactComponent as IconBinanceLogo } from 'assets/logos/binanceWallet.svg';
 import { ReactComponent as IconWallet } from 'assets/icons/wallet.svg';
 
 type Props = {
@@ -51,6 +52,8 @@ export const WalletIcon = ({
       return <IconCompassWalletLogo className={className} />;
     case 'Seif Wallet':
       return <IconSeifWalletLogo className={className} />;
+    case 'Binance Web3 Wallet':
+      return <IconBinanceLogo className={className} />;
     default:
       return <IconWallet className={className} />;
   }

diff --git a/src/config/ethereum/common.ts b/src/config/ethereum/common.ts
@@ -32,7 +32,13 @@ export const commonConfig: AppConfig = {
     simulatorRepo: 'https://github.com/bancorprotocol/carbon-simulator',
     duneDashboard: 'https://dune.com/bancor/carbon-by-bancor',
   },
-  selectedConnectors: ['MetaMask', 'WalletConnect', 'Coinbase Wallet', 'Safe'],
+  selectedConnectors: [
+    'MetaMask',
+    'WalletConnect',
+    'Coinbase Wallet',
+    'Safe',
+    'Binance',
+  ],
   blockedConnectors: ['Tailwind', 'Compass Wallet', 'Seif'],
   walletConnectProjectId: 'f9d8863ab6c03f2293d7d56d7c0c0853',
   isSimulatorEnabled: true,

diff --git a/src/libs/wagmi/connectors.ts b/src/libs/wagmi/connectors.ts
@@ -16,6 +16,7 @@ import {
   currentChain,
 } from 'libs/wagmi';
 import { externalLinks } from 'libs/routing';
+import { getWagmiConnectorV2 } from '@binance/w3w-wagmi-connector-v2';
 
 const PLACEHOLDER_TAG = '_placeholder';
 
@@ -61,6 +62,9 @@ const createPlaceholderConnector = ({
 
 const getDefaultConnector = (connectorType: SelectableConnectionName) => {
   switch (connectorType) {
+    case 'Binance':
+      const binanceConnector = getWagmiConnectorV2();
+      return binanceConnector();
     case 'Compass Wallet':
       return createPlaceholderConnector({
         name: 'Compass Wallet',

diff --git a/src/libs/wagmi/wagmi.types.ts b/src/libs/wagmi/wagmi.types.ts
@@ -13,6 +13,7 @@ export const selectableConnectionNames = [
   'Tailwind',
   'Compass Wallet',
   'Seif',
+  'Binance',
 ] as const;
 
 export type SelectableConnectionName =