Merge pull request #486 from bobanetwork/main

Gateway new release Stake Fixes | SEO
bobanetwork · Apr 21, 2024 · 3bf82f9 · 3bf82f9
2 parents 0a31809 + 52acff0
commit 3bf82f9
Show file tree

Hide file tree

Showing 13 changed files with 72 additions and 93 deletions.
diff --git a/boba-logo.svg b/boba-logo.svg
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@bobanetwork/gateway",
-  "version": "0.14.3",
+  "version": "0.14.4",
   "private": true,
   "scripts": {
     "audit-check": "audit-ci --moderate",

diff --git a/public/boba_gateway.png b/public/boba_gateway.png
diff --git a/public/index.html b/public/index.html
@@ -4,19 +4,35 @@
     <meta charset="utf-8" />
     <link rel="icon" href="%PUBLIC_URL%/favicon.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
-    <meta
-      name="viewport"
-      content="width=device-width, initial-scale=1, user-scalable=no"
-    />
-    <meta name="theme-color" content="#000000" />
-    <meta name="description" content="BOBA"/>
-    <link rel="apple-touch-icon" href="favicon.svg" />
+
+    <!-- Light Mode Theme Color -->
+    <meta name="theme-color" content="#1CD6D1">
+
+    <!-- Dark Mode Theme Color -->
+    <meta name="theme-color-dark" content="#BAE21A">
+
+    <title>Boba Network Gateway: Unlock Seamless Token Bridging</title>
+    <meta name="description" content="Explore Boba Network Gateway, facilitating effortless token bridging between Layer 1 (L1) and Layer 2 (L2) networks, featuring Staking, DAO, and Earn functionalities.">
+    <meta name="keywords" content="Boba Gateway Network, Boba Network, token bridging, Layer 1, Layer 2, crypto staking, DAO, Earn, cryptocurrency, blockchain">
+
+    <meta property="og:title" content="Boba Network Gateway: Unlock Seamless Token Bridging">
+    <meta property="og:description" content="Explore Boba Network Gateway, empowering seamless bridging of crypto tokens between Layer 1 (L1) and Layer 2 (L2) networks, accompanied by Staking, DAO, and Earn functionalities.">
+    <meta property="og:image" content="%PUBLIC_URL%/boba_gateway.png">
+    <meta property="og:url" content="https://gateway.boba.network/">
+    <meta property="og:type" content="website">
+
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:title" content="Boba Network Gateway: Unlock Seamless Token Bridging">
+    <meta name="twitter:description" content="Explore Boba Network Gateway, empowering seamless bridging of crypto tokens between Layer 1 (L1) and Layer 2 (L2) networks, accompanied by Staking, DAO, and Earn functionalities.">
+    <meta name="twitter:image" content="%PUBLIC_URL%/boba_gateway.png">
+
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/favicon.svg" />
     <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" rel="stylesheet">
     <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@700&display=swap" rel="stylesheet">
-    <title>Boba Gateway</title>
+
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>

diff --git a/src/components/layout/Header/styles.ts b/src/components/layout/Header/styles.ts
@@ -12,7 +12,7 @@ export const HeaderContainer = styled.div`
   align-items: center;
   justify-content: flex-start;
   backdrop-filter: blur(7.5px);
-  z-index: 9999;
+  z-index: 10;
   background: ${({ theme: { name, colors } }) =>
     name === 'light' ? 'rgba(255, 255, 255, 0.35)' : 'rgba(0, 0, 0, 0.05)'};
 

diff --git a/src/containers/history/History.tsx b/src/containers/history/History.tsx
@@ -160,21 +160,10 @@ const History = () => {
       />
     )
   }
-  // @todo @note review and try to refactor as it seems multiple call to same function!
+
   const syncTransactions = async () => {
     if (accountEnabled) {
-      const newTransactions = await transactionService.getTransactions()
-      if (newTransactions.length === 0) {
-        setTransactionsFound(false)
-      } else {
-        setTransactionsFound(true)
-      }
-      if (
-        new Set(ValidValuesFromArray(transactions)).size !==
-        new Set(newTransactions).size
-      ) {
-        dispatch(fetchTransactions())
-      }
+      dispatch(fetchTransactions())
     }
   }
 

diff --git a/src/containers/home/__snapshots__/index.test.tsx.snap b/src/containers/home/__snapshots__/index.test.tsx.snap
@@ -16,7 +16,7 @@ exports[`Home  should match snapshot 1`] = `
     class="sc-hGMjit aucDE"
   >
     <div
-      class="sc-eldPxv dmoUXT"
+      class="sc-eldPxv hrjSZe"
       id="header"
     >
       <a

diff --git a/src/containers/modals/stake/DepositStake.tsx b/src/containers/modals/stake/DepositStake.tsx
@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react'
-import { connect, useDispatch, useSelector } from 'react-redux'
+import { useDispatch, useSelector } from 'react-redux'
 
 import { openAlert, closeModal } from 'actions/uiAction'
 
@@ -33,6 +33,7 @@ const DepositStake = (props: any) => {
     fee: '0',
     stakeValue: '0.0',
     value_Wei_String: '',
+    loading: false,
   })
 
   useEffect(() => {
@@ -199,7 +200,7 @@ const DepositStake = (props: any) => {
         {netLayer === 'L2' && (
           <Button
             onClick={() => handleConfirm()}
-            loading={props.loading}
+            loading={state.loading}
             disabled={!accountEnabled}
             label="Stake"
           />

diff --git a/src/containers/save/Save.tsx b/src/containers/save/Save.tsx
@@ -43,6 +43,7 @@ import useInterval from 'hooks/useInterval'
 import { selectBalance, selectFixed, selectLayer, selectSetup } from 'selectors'
 import styled from 'styled-components'
 import { POLL_INTERVAL } from 'util/constant'
+import { fetchBalances } from 'actions/networkAction'
 
 export const OutputLabel = styled(Typography).attrs({
   variant: 'title',
@@ -79,13 +80,15 @@ const Save = () => {
       dispatch(getFS_Saves())
       dispatch(getFS_Info())
       getMaxTransferValue()
+      dispatch(fetchBalances())
     }
   }, [accountEnabled])
 
   useInterval(() => {
     if (accountEnabled) {
       dispatch(getFS_Info())
       dispatch(getFS_Saves())
+      dispatch(fetchBalances())
     }
   }, POLL_INTERVAL)
 

diff --git a/src/hooks/useBridgeAlerts/index.test.tsx b/src/hooks/useBridgeAlerts/index.test.tsx
@@ -87,14 +87,6 @@ describe('useBridgeAlerts', () => {
       },
       type: 'BRIDGE/ALERT/CLEAR',
     })
-    expect(actions).toContainEqual({
-      payload: {
-        meta: 'TELEPORTATION_NO_UNCONVENTIONAL_WALLETS',
-        text: "This bridge doesn't support smart-contract wallets that use a costly fallback method.",
-        type: 'info',
-      },
-      type: 'BRIDGE/ALERT/SET',
-    })
     expect(actions).toContainEqual({
       payload: { keys: ['OMG_INFO'] },
       type: 'BRIDGE/ALERT/CLEAR',

diff --git a/src/hooks/useBridgeAlerts/index.ts b/src/hooks/useBridgeAlerts/index.ts
@@ -62,7 +62,7 @@ const useBridgeAlerts = () => {
   const layer = useSelector(selectLayer())
   const bridgeType = useSelector(selectBridgeType())
   const token = useSelector(selectTokenToBridge())
-  const amountToBridge = useSelector(selectAmountToBridge())
+  let amountToBridge = useSelector(selectAmountToBridge())
   // network
   const activeNetwork = useSelector(selectActiveNetwork())
   const tokenForTeleportationSupported: ITeleportationTokenSupport =
@@ -87,6 +87,8 @@ const useBridgeAlerts = () => {
   const LPLiquidity = useSelector(selectL1LPLiquidity)
 
   useEffect(() => {
+    amountToBridge = Number(amountToBridge)
+
     if (bridgeType === BRIDGE_TYPE.LIGHT) {
       if (!tokenForTeleportationSupported.supported) {
         dispatch(
@@ -115,6 +117,28 @@ const useBridgeAlerts = () => {
             ],
           })
         )
+
+        const maxDepositAmount = Number(
+          ethers.utils.formatEther(
+            tokenForTeleportationSupported.maxDepositAmount
+          )
+        )
+        const minDepositAmount = Number(
+          ethers.utils.formatEther(
+            tokenForTeleportationSupported.minDepositAmount
+          )
+        )
+        const transferredAmount = Number(
+          ethers.utils.formatEther(
+            tokenForTeleportationSupported.transferredAmount
+          )
+        )
+        const maxTransferAmount = Number(
+          ethers.utils.formatEther(
+            tokenForTeleportationSupported.maxTransferAmountPerDay
+          )
+        )
+
         dispatch(
           setBridgeAlert({
             meta: ALERT_KEYS.TELEPORTATION_NO_UNCONVENTIONAL_WALLETS,
@@ -124,6 +148,7 @@ const useBridgeAlerts = () => {
         )
 
         if (
+          amountToBridge > 0 &&
           (tokenForTeleportationSupported.transferredAmount as BigNumber).eq(
             tokenForTeleportationSupported.maxTransferAmountPerDay
           )
@@ -136,13 +161,8 @@ const useBridgeAlerts = () => {
             })
           )
         } else if (
-          ethers.utils.formatEther(
-            tokenForTeleportationSupported.transferredAmount
-          ) +
-            amountToBridge >
-          ethers.utils.formatEther(
-            tokenForTeleportationSupported.maxTransferAmountPerDay
-          )
+          amountToBridge > 0 &&
+          transferredAmount + amountToBridge > maxTransferAmount
         ) {
           const maxAmount =
             tokenForTeleportationSupported.maxTransferAmountPerDay as BigNumber
@@ -159,13 +179,7 @@ const useBridgeAlerts = () => {
           )
         }
 
-        if (
-          amountToBridge &&
-          amountToBridge <
-            ethers.utils.formatEther(
-              tokenForTeleportationSupported.minDepositAmount
-            )
-        ) {
+        if (amountToBridge && amountToBridge < minDepositAmount) {
           dispatch(
             setBridgeAlert({
               meta: ALERT_KEYS.VALUE_LESS_THAN_MIN_BRIDGE_CONFIG_AMOUNT,
@@ -175,12 +189,7 @@ const useBridgeAlerts = () => {
               )}.`,
             })
           )
-        } else if (
-          amountToBridge >
-          ethers.utils.formatEther(
-            tokenForTeleportationSupported.maxDepositAmount
-          )
-        ) {
+        } else if (amountToBridge > maxDepositAmount) {
           dispatch(
             setBridgeAlert({
               meta: ALERT_KEYS.VALUE_GREATER_THAN_MAX_BRIDGE_CONFIG_AMOUNT,

diff --git a/src/services/networkService.ts b/src/services/networkService.ts
@@ -1580,7 +1580,6 @@ class NetworkService {
           from: this.gasEstimateAccount,
         })
         approvalCost_BN = approvalGas_BN.mul(gasPrice)
-        console.log('Approve cost in ETH:', utils.formatEther(approvalCost_BN))
       }
 
       const DiscretionaryExitFeeContract = new ethers.Contract(
@@ -2367,7 +2366,6 @@ class NetworkService {
         from: this.gasEstimateAccount,
       })
       approvalCost_BN = approvalGas_BN.mul(gasPrice)
-      console.log('Approve cost in ETH:', utils.formatEther(approvalCost_BN))
     }
 
     const L2BillingContract = new ethers.Contract(
@@ -2444,7 +2442,6 @@ class NetworkService {
 
       const approvalGas_BN = await this.L1Provider!.estimateGas(tx)
       approvalCost_BN = approvalGas_BN.mul(gasPrice)
-      console.log('Approve cost in ETH:', utils.formatEther(approvalCost_BN))
     }
 
     //in some cases zero not allowed
@@ -2949,7 +2946,6 @@ class NetworkService {
       const allowance_BN = await this.BobaContract!.connect(
         this.provider!
       ).allowance(this.gasEstimateAccount, this.addresses.BobaFixedSavings)
-      console.log('benchmarkAllowance_BN', allowance_BN.toString())
 
       // second, we need the approval cost
       const tx1 = await this.BobaContract!.connect(
@@ -2961,7 +2957,6 @@ class NetworkService {
 
       const approvalGas_BN = await this.provider!.estimateGas(tx1)
       approvalCost_BN = approvalGas_BN.mul(gasPrice_BN)
-      console.log('Approve cost in ETH:', utils.formatEther(approvalCost_BN))
 
       // third, we need the stake cost
       const FixedSavings = new ethers.Contract(
@@ -2976,10 +2971,8 @@ class NetworkService {
       )
       const stakeGas_BN = await this.provider!.estimateGas(tx2)
       stakeCost_BN = stakeGas_BN.mul(gasPrice_BN)
-      console.log('Stake cost in ETH:', utils.formatEther(stakeCost_BN))
 
       const safety_margin_BN = BigNumber.from('1000000000000')
-      console.log('Stake safety margin:', utils.formatEther(safety_margin_BN))
 
       return approvalCost_BN.add(stakeCost_BN).add(safety_margin_BN)
     } catch (error) {

diff --git a/src/services/transaction.service.ts b/src/services/transaction.service.ts
@@ -256,9 +256,10 @@ class TransactionService {
         toHash: undefined,
       }
 
-      let status = txReceipt?.status
-        ? TRANSACTION_STATUS.Pending
-        : TRANSACTION_STATUS.Failed
+      let status =
+        txReceipt && txReceipt?.status
+          ? TRANSACTION_STATUS.Pending
+          : TRANSACTION_STATUS.Failed
       if (disburseEvent && status === TRANSACTION_STATUS.Pending) {
         const rpc = new providers.JsonRpcProvider(
           getRpcUrlByChainId(sendEvent.toChainId)
@@ -267,7 +268,7 @@ class TransactionService {
           disburseEvent.transactionHash_
         )
         status =
-          disburseTxReceipt.status === 1
+          disburseTxReceipt && disburseTxReceipt.status === 1
             ? TRANSACTION_STATUS.Succeeded
             : TRANSACTION_STATUS.Failed
         if (
@@ -422,6 +423,8 @@ class TransactionService {
     return [
       [42161, 288],
       [10, 288],
+      [288, 56288],
+      [56288, 288],
     ].map((p) => ({
       L1: {
         chainId: p[0],