update tooltip (#2164)

KyberNetwork · Aug 22, 2023 · 1c2b833 · 1c2b833
1 parent 5f56f4d
commit 1c2b833
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 26 deletions.
diff --git a/src/components/SwapForm/AddMEVProtectionModal.tsx b/src/components/SwapForm/AddMEVProtectionModal.tsx
@@ -138,17 +138,20 @@ export default function AddMEVProtectionModal({ isOpen, onClose }: { isOpen: boo
         <Row gap="12px">
           <Text fontSize={12} lineHeight="16px">
             <Trans>
-              We suggest using the{' '}
+              <ExternalLink href="https://docs.kyberswap.com/getting-started/foundational-topics/decentralized-finance/maximal-extractable-value-mev">
+                MEV
+              </ExternalLink>{' '}
+              Protection safeguards you from front-running attacks on Ethereum. We suggest you employing the{' '}
               <ExternalLink href="https://docs.kyberswap.com/getting-started/foundational-topics/decentralized-technologies/rpc">
                 RPC endpoint
               </ExternalLink>{' '}
-              of trusted third-parties like{' '}
+              of reliable third-parties such as{' '}
               <ExternalLink href="https://docs.flashbots.net/flashbots-protect/overview">Flashbots</ExternalLink> or{' '}
-              <ExternalLink href="https://mevblocker.io/#faq">MEVBlocker</ExternalLink> to protect you from MEV Bots.{' '}
+              <ExternalLink href="https://mevblocker.io/#faq">MEVBlocker</ExternalLink>.
               <br />
               <br />
-              Please note that adding a RPC endpoint automatically is only supported via the MetaMask wallet. If you
-              wish to add the RPC endpoint to your wallet manually, refer to this{' '}
+              Note that adding the RPC endpoint automatically is only available via the MetaMask wallet. If you would
+              like to add the RPC endpoint to your wallet manually, please refer to this{' '}
               <ExternalLink href="https://docs.kyberswap.com/getting-started/quickstart/faq#how-to-change-rpc-in-metamask">
                 guide
               </ExternalLink>

diff --git a/src/components/SwapForm/SlippageSettingGroup.tsx b/src/components/SwapForm/SlippageSettingGroup.tsx
@@ -8,11 +8,10 @@ import styled from 'styled-components'
 
 import { Shield } from 'components/Icons'
 import SlippageSetting from 'components/SwapForm/SlippageSetting'
-import { MouseoverTooltip } from 'components/Tooltip'
 import { useActiveWeb3React } from 'hooks'
 import useMixpanel, { MIXPANEL_TYPE } from 'hooks/useMixpanel'
 import useTheme from 'hooks/useTheme'
-import { ExternalLink, MEDIA_WIDTHS } from 'theme'
+import { MEDIA_WIDTHS } from 'theme'
 
 import AddMEVProtectionModal from './AddMEVProtectionModal'
 
@@ -52,25 +51,14 @@ export default function SlippageSettingGroup({
 
   const rightButton =
     chainId === ChainId.MAINNET && walletEVM.isConnected ? (
-      <MouseoverTooltip
-        text={
-          <Trans>
-            MEV Protection will protect you from front-running and sandwich attacks on Ethereum. Learn more{' '}
-            <ExternalLink href="https://docs.kyberswap.com/getting-started/foundational-topics/decentralized-finance/maximal-extractable-value-mev">
-              here ↗
-            </ExternalLink>
-          </Trans>
-        }
-      >
-        <PriceAlertButton onClick={addMevProtectionHandler}>
-          <Shield size={14} color={theme.subText} />
-          {upToXXSmall ? null : (
-            <Text color={theme.subText} style={{ whiteSpace: 'nowrap' }}>
-              <Trans>Add MEV Protection</Trans>
-            </Text>
-          )}
-        </PriceAlertButton>
-      </MouseoverTooltip>
+      <PriceAlertButton onClick={addMevProtectionHandler}>
+        <Shield size={14} color={theme.subText} />
+        {upToXXSmall ? null : (
+          <Text color={theme.subText} style={{ whiteSpace: 'nowrap' }}>
+            <Trans>Add MEV Protection</Trans>
+          </Text>
+        )}
+      </PriceAlertButton>
     ) : null
 
   return (