sushiswap · matthewlilley · Feb 2, 2022 · Feb 2, 2022
diff --git a/src/components/Header/Desktop.tsx b/src/components/Header/Desktop.tsx
@@ -1,12 +1,11 @@
 import { NATIVE } from '@sushiswap/core-sdk'
-import { InjectedConnector } from '@web3-react/injected-connector'
-import { WalletLinkConnector } from '@web3-react/walletlink-connector'
 import Container from 'app/components/Container'
 import { NAV_CLASS } from 'app/components/Header/styles'
 import useMenu from 'app/components/Header/useMenu'
 import LanguageSwitch from 'app/components/LanguageSwitch'
 import Web3Network from 'app/components/Web3Network'
 import Web3Status from 'app/components/Web3Status'
+import useIsCoinbaseWallet from 'app/hooks/useIsCoinbaseWallet'
 import { useActiveWeb3React } from 'app/services/web3'
 import { useETHBalances } from 'app/state/wallet/hooks'
 import Image from 'next/image'
@@ -19,13 +18,9 @@ const HEADER_HEIGHT = 64
 
 const Desktop: FC = () => {
   const menu = useMenu()
-  const { account, chainId, library, connector } = useActiveWeb3React()
+  const { account, chainId, library } = useActiveWeb3React()
   const userEthBalance = useETHBalances(account ? [account] : [])?.[account ?? '']
-
-  const isCbWallet =
-    connector instanceof WalletLinkConnector ||
-    (connector instanceof InjectedConnector && window.walletLinkExtension) ||
-    window?.ethereum?.isCoinbaseWallet
+  const isCoinbaseWallet = useIsCoinbaseWallet()
 
   return (
     <>
@@ -42,7 +37,7 @@ const Desktop: FC = () => {
                 })}
               </div>
               <div className="flex items-center justify-end gap-2">
-                {library && (library.provider.isMetaMask || isCbWallet) && (
+                {library && (library.provider.isMetaMask || isCoinbaseWallet) && (
                   <div className="hidden sm:inline-block">
                     <Web3Network />
                   </div>

diff --git a/src/components/Header/Mobile.tsx b/src/components/Header/Mobile.tsx
@@ -1,11 +1,10 @@
 import { Dialog, Transition } from '@headlessui/react'
 import { MenuIcon } from '@heroicons/react/outline'
 import { NATIVE } from '@sushiswap/core-sdk'
-import { InjectedConnector } from '@web3-react/injected-connector'
-import { WalletLinkConnector } from '@web3-react/walletlink-connector'
 import useMenu from 'app/components/Header/useMenu'
 import Web3Network from 'app/components/Web3Network'
 import Web3Status from 'app/components/Web3Status'
+import useIsCoinbaseWallet from 'app/hooks/useIsCoinbaseWallet'
 import { useActiveWeb3React } from 'app/services/web3'
 import { useETHBalances } from 'app/state/wallet/hooks'
 import Image from 'next/image'
@@ -16,14 +15,10 @@ import { NavigationItem } from './NavigationItem'
 
 const Mobile: FC = () => {
   const menu = useMenu()
-  const { account, chainId, library, connector } = useActiveWeb3React()
+  const { account, chainId, library } = useActiveWeb3React()
   const userEthBalance = useETHBalances(account ? [account] : [])?.[account ?? '']
   const [open, setOpen] = useState(false)
-
-  const isCbWallet =
-    connector instanceof WalletLinkConnector ||
-    (connector instanceof InjectedConnector && window.walletLinkExtension) ||
-    window?.ethereum?.isCoinbaseWallet
+  const isCoinbaseWallet = useIsCoinbaseWallet()
 
   return (
     <>
@@ -72,7 +67,7 @@ const Mobile: FC = () => {
                       </nav>
 
                       <div className="px-6 flex flex-col gap-4">
-                        {library && (library.provider.isMetaMask || isCbWallet) && (
+                        {library && (library.provider.isMetaMask || isCoinbaseWallet) && (
                           <div className="hidden sm:flex">
                             <Web3Network />
                           </div>

diff --git a/src/components/Settings/index.tsx b/src/components/Settings/index.tsx
@@ -11,6 +11,7 @@ import Switch from 'app/components/Switch'
 import TransactionSettings from 'app/components/TransactionSettings'
 import Typography from 'app/components/Typography'
 import { classNames } from 'app/functions'
+import useWalletSupportsOpenMev from 'app/hooks/useWalletSupportsOpenMev'
 import { useActiveWeb3React } from 'app/services/web3'
 import { useToggleSettingsMenu } from 'app/state/application/hooks'
 import { useExpertModeManager, useUserOpenMev, useUserSingleHopOnly } from 'app/state/user/hooks'
@@ -33,6 +34,7 @@ const SettingsTab: FC<SettingsTabProps> = ({ placeholderSlippage, className, tri
   const [singleHopOnly, setSingleHopOnly] = useUserSingleHopOnly()
   const [showConfirmation, setShowConfirmation] = useState(false)
   const [userUseOpenMev, setUserUseOpenMev] = useUserOpenMev()
+  const walletSupportsOpenMev = useWalletSupportsOpenMev()
 
   return (
     <>
@@ -101,7 +103,7 @@ const SettingsTab: FC<SettingsTabProps> = ({ placeholderSlippage, className, tri
                 </div>
               )}
               {/*@ts-ignore TYPE NEEDS FIXING*/}
-              {OPENMEV_ENABLED && OPENMEV_SUPPORTED_NETWORKS.includes(chainId) && (
+              {OPENMEV_ENABLED && OPENMEV_SUPPORTED_NETWORKS.includes(chainId) && walletSupportsOpenMev && (
                 <div className="flex items-center justify-between">
                   <div className="flex items-center">
                     <Typography variant="xs" className="text-high-emphesis" weight={700}>

diff --git a/src/hooks/useIsCoinbaseWallet.tsx b/src/hooks/useIsCoinbaseWallet.tsx
@@ -0,0 +1,15 @@
+import { InjectedConnector } from '@web3-react/injected-connector'
+import { WalletLinkConnector } from '@web3-react/walletlink-connector'
+import { useActiveWeb3React } from 'app/services/web3'
+import { useMemo } from 'react'
+
+export default function useIsCoinbaseWallet(): boolean {
+  const { connector } = useActiveWeb3React()
+  return useMemo(() => {
+    return (
+      connector instanceof WalletLinkConnector ||
+      (connector instanceof InjectedConnector && window.walletLinkExtension) ||
+      window?.ethereum?.isCoinbaseWallet
+    )
+  }, [connector])
+}
diff --git a/src/hooks/useWalletSupportsOpenMev.tsx b/src/hooks/useWalletSupportsOpenMev.tsx
@@ -0,0 +1,7 @@
+import useIsCoinbaseWallet from './useIsCoinbaseWallet'
+
+export default function useWalletSupportsOpenMev() {
+  const isCoinbaseWallet = useIsCoinbaseWallet()
+  if (isCoinbaseWallet) return false
+  return true
+}
diff --git a/src/pages/legacy/swap/[[...tokens]].tsx b/src/pages/legacy/swap/[[...tokens]].tsx
@@ -23,6 +23,7 @@ import useIsArgentWallet from 'app/hooks/useIsArgentWallet'
 import { useIsSwapUnsupported } from 'app/hooks/useIsSwapUnsupported'
 import { useSwapCallback } from 'app/hooks/useSwapCallback'
 import { useUSDCValue } from 'app/hooks/useUSDCPrice'
+import useWalletSupportsOpenMev from 'app/hooks/useWalletSupportsOpenMev'
 import useWrapCallback, { WrapType } from 'app/hooks/useWrapCallback'
 import { SwapLayout, SwapLayoutCard } from 'app/layouts/SwapLayout'
 import TokenWarningModal from 'app/modals/TokenWarningModal'
@@ -187,6 +188,7 @@ const Swap = ({ banners }) => {
   }, [approvalState, approvalSubmitted])
 
   const [useOpenMev] = useUserOpenMev()
+  const walletSupportsOpenMev = useWalletSupportsOpenMev()
 
   // the callback to execute the swap
   const { callback: swapCallback, error: swapCallbackError } = useSwapCallback(
@@ -196,7 +198,7 @@ const Swap = ({ banners }) => {
     signatureData,
     /* @ts-ignore TYPE NEEDS FIXING */
     null,
-    useOpenMev
+    walletSupportsOpenMev && useOpenMev
   )
 
   const [singleHopOnly] = useUserSingleHopOnly()