Clean Bridge page

scrtlabs · Dec 12, 2024 · d1b562b · d1b562b
1 parent 8b963d2
commit d1b562b
Showing 1 changed file with 41 additions and 45 deletions.
diff --git a/src/pages/bridge/Bridge.tsx b/src/pages/bridge/Bridge.tsx
@@ -2,12 +2,10 @@ import { faArrowUpRightFromSquare, faShuffle } from '@fortawesome/free-solid-svg
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { Link } from 'react-router-dom'
 import { Helmet } from 'react-helmet-async'
-import { bridgeJsonLdSchema, bridgePageDescription, bridgePageTitle, formatNumber, pageTitle } from 'utils/commons'
-import mixpanel from 'mixpanel-browser'
+import { bridgeJsonLdSchema, bridgePageDescription, bridgePageTitle } from 'utils/commons'
 import { useEffect, useState } from 'react'
 import { trackMixPanelEvent } from 'utils/commons'
 import SquidModal from './SquidModal'
-import { useSecretNetworkClientStore } from 'store/secretNetworkClient'
 import Title from 'components/Title'
 import { useUserPreferencesStore } from 'store/UserPreferences'
 import SwingModal from './SwingModal'
@@ -22,8 +20,6 @@ function Bridge() {
   const [isSwingModalOpen, setIsSwingModalOpen] = useState(false)
   const [isSilentModalOpen, setIsSilentModalOpen] = useState(false)
 
-  const { walletAddress } = useSecretNetworkClientStore()
-
   return (
     <>
       <Helmet>
@@ -53,22 +49,34 @@ function Bridge() {
       </div>
 
       <div className="max-w-2xl mx-auto px-6 text-neutral-600 dark:text-neutral-400 leading-7 text-justify divide-y divide-gray-300 dark:divide-gray-600">
-        {/* SilentSwap Section */}
+        {/* Secret Tunnel Section */}
         <div className="py-4">
           <p>
-            SilentSwap is the official privacy cross-chain aggregator for Secret Network. It offers a fast, cheap, and
-            convenient way to privately and securely swap your assets by leveraging Secret Network's confidential
-            computing layer. SilentSwap obfuscates the trace between sender and receiver in an entirely noncustodial,
-            trustless, and permisionless manner. It is fully compliant and allows users to trade or transfer in private,
-            all abstracted in a seamless user experience.
+            Use the{' '}
+            <a
+              href="https://tunnel.scrt.network"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="pb-0.5 border-b border-neutral-400 dark:border-neutral-600 hover:text-black dark:hover:text-white hover:border-black dark:hover:border-white transition-colors"
+              onClick={() => {
+                trackMixPanelEvent('Clicked Secret Tunnel link (from Bridge page)')
+              }}
+            >
+              Secret Tunnel
+            </a>{' '}
+            to bridge your assets from blockchains such as Ethereum, Binance Smart Chain (BSC), and Axelar to the Secret
+            Network.
           </p>
           <a
-            href="https://app.silentswap.com"
+            href="https://tunnel.scrt.network"
             target="_blank"
             rel="noopener noreferrer"
             className="text-white block mt-6 p-3 w-full text-center font-semibold bg-cyan-600 dark:bg-cyan-600 rounded-lg text-sm hover:bg-cyan-500 dark:hover:bg-cyan-500 focus:bg-cyan-600 dark:focus:bg-cyan-600 transition-colors"
+            onClick={() => {
+              trackMixPanelEvent('Clicked Secret Tunnel link (from Bridge page)')
+            }}
           >
-            Go to Silent Swap
+            Go to Secret Tunnel
             <FontAwesomeIcon icon={faArrowUpRightFromSquare} className="ml-2" />
           </a>
         </div>
@@ -97,38 +105,6 @@ function Bridge() {
           </p>
         </div>
 
-        {/* Secret Tunnel Section */}
-        <div className="py-4">
-          <p>
-            Use the{' '}
-            <a
-              href="https://tunnel.scrt.network"
-              target="_blank"
-              rel="noopener noreferrer"
-              className="pb-0.5 border-b border-neutral-400 dark:border-neutral-600 hover:text-black dark:hover:text-white hover:border-black dark:hover:border-white transition-colors"
-              onClick={() => {
-                trackMixPanelEvent('Clicked Secret Tunnel link (from Bridge page)')
-              }}
-            >
-              Secret Tunnel
-            </a>{' '}
-            to bridge your assets from blockchains such as Ethereum, Binance Smart Chain (BSC), and Axelar to the Secret
-            Network.
-          </p>
-          <a
-            href="https://tunnel.scrt.network"
-            target="_blank"
-            rel="noopener noreferrer"
-            className="text-white block mt-6 p-3 w-full text-center font-semibold bg-cyan-600 dark:bg-cyan-600 rounded-lg text-sm hover:bg-cyan-500 dark:hover:bg-cyan-500 focus:bg-cyan-600 dark:focus:bg-cyan-600 transition-colors"
-            onClick={() => {
-              trackMixPanelEvent('Clicked Secret Tunnel link (from Bridge page)')
-            }}
-          >
-            Go to Secret Tunnel
-            <FontAwesomeIcon icon={faArrowUpRightFromSquare} className="ml-2" />
-          </a>
-        </div>
-
         {/* Squid Router Section */}
         <div className="py-4">
           <p>Alternatively, use Squid Router to bridge your assets into Secret Network.</p>
@@ -158,6 +134,26 @@ function Bridge() {
             Use Swing Swap
           </a>
         </div>
+
+        {/* SilentSwap Section */}
+        <div className="py-4">
+          <p>
+            SilentSwap is the official privacy cross-chain aggregator for Secret Network. It offers a fast, cheap, and
+            convenient way to privately and securely swap your assets by leveraging Secret Network's confidential
+            computing layer. SilentSwap obfuscates the trace between sender and receiver in an entirely noncustodial,
+            trustless, and permisionless manner. It is fully compliant and allows users to trade or transfer in private,
+            all abstracted in a seamless user experience.
+          </p>
+          <a
+            href="https://app.silentswap.com"
+            target="_blank"
+            rel="noopener noreferrer"
+            className="text-white block mt-6 p-3 w-full text-center font-semibold bg-cyan-600 dark:bg-cyan-600 rounded-lg text-sm hover:bg-cyan-500 dark:hover:bg-cyan-500 focus:bg-cyan-600 dark:focus:bg-cyan-600 transition-colors"
+          >
+            Go to Silent Swap
+            <FontAwesomeIcon icon={faArrowUpRightFromSquare} className="ml-2" />
+          </a>
+        </div>
       </div>
 
       {/* Modals should be outside the divided container to avoid being affected by divide-y */}