Merge pull request #933 from webdev403/hotfix/okxwallet-connection

Fix okxwallet connection
QuickSwap · Jul 25, 2023 · 18cd2d3 · 18cd2d3
2 parents 87c2d3d + 55de61b
commit 18cd2d3
Show file tree

Hide file tree

Showing 5 changed files with 22 additions and 4 deletions.
diff --git a/public/locales/en.json b/public/locales/en.json
@@ -420,6 +420,7 @@
   "installBraveDesc": "You need to install brave browser to use brave wallet. If you are on brave browser, you need to disable metamask or set Default Ethereum Wallet to Brave Wallet in settings. (brave://settings/wallet)",
   "installBitKeep": "Install BitKeep Wallet",
   "installTrustWallet": "Install TrustWallet",
+  "installOkxWallet": "Install OkxWallet",
   "wrongNetwork": "Wrong Network",
   "connectPolygonNetwork": "Please connect to the appropriate Polygon network.",
   "errorConnectRefresh": "Error connecting. Try refreshing the page.",

diff --git a/src/components/WalletModal/WalletModal.tsx b/src/components/WalletModal/WalletModal.tsx
@@ -3,8 +3,6 @@ import React, { useEffect, useState } from 'react';
 import { isMobile } from 'react-device-detect';
 import ReactGA from 'react-ga';
 import { Box } from '@material-ui/core';
-import MetamaskIcon from 'assets/images/metamask.png';
-import BraveWalletIcon from 'assets/images/braveWalletIcon.png';
 import { ReactComponent as Close } from 'assets/images/CloseIcon.svg';
 import { GlobalConst } from 'constants/index';
 import { ApplicationModal } from 'state/application/actions';
@@ -157,6 +155,7 @@ const WalletModal: React.FC<WalletModalProps> = ({
     const isPhantomWallet =
       (ethereum && ethereum.isPhantom) || (phantom && phantom.ethereum);
     const isCoinbaseWallet = ethereum && ethereum.isCoinbaseWallet;
+    const isOkxwallet = (window as any).okxwallet;
 
     return connections.map((option) => {
       if (
@@ -232,7 +231,23 @@ const WalletModal: React.FC<WalletModalProps> = ({
             header={t('installMetamask')}
             subheader={null}
             link={'https://metamask.io/'}
-            icon={MetamaskIcon}
+            icon={option.iconName}
+            iconify={iconify}
+          />
+        );
+      } else if (
+        option.name === GlobalConst.walletName.OKXWALLET &&
+        !isOkxwallet
+      ) {
+        return (
+          <WalletOption
+            id={`connect-${option.name}`}
+            key={option.name}
+            color={'#E8831D'}
+            header={t('installOkxWallet')}
+            subheader={null}
+            link={'https://www.okx.com/web3'}
+            icon={option.iconName}
             iconify={iconify}
           />
         );

diff --git a/src/connectors/OkxWallet.ts b/src/connectors/OkxWallet.ts
@@ -10,7 +10,7 @@ import { Connector } from '@web3-react/types';
 
 export class NoOkxWalletError extends Error {
   public constructor() {
-    super('BitKeep not installed');
+    super('OkxWallet not installed');
     this.name = NoOkxWalletError.name;
     Object.setPrototypeOf(this, NoOkxWalletError.prototype);
   }

diff --git a/src/connectors/index.ts b/src/connectors/index.ts
@@ -236,6 +236,7 @@ export const okxWalletConnection: Connection = {
   iconName: OkxWalletIcon,
   color: '#E8831D',
   description: 'OkxWallet browser extension.',
+  mobile: true,
 };
 
 const [web3CypherD, web3CypherDHooks] = initializeConnector<CypherD>(

diff --git a/src/connectors/utils.ts b/src/connectors/utils.ts
@@ -25,6 +25,7 @@ export const getIsMetaMaskWallet = () => {
   return Boolean(
     ethereum &&
       ethereum.isMetaMask &&
+      ethereum._metamask &&
       (ethereum.detected && ethereum.detected.length > 0
         ? ethereum.detected.find(
             (provider: any) =>