Add chain wrapper when confirming transactions

Author: osiastedian

components/Bridge/v3/Steps/ConfirmNEVMTransaction.tsx

@@ -1,10 +1,10 @@
 import { ITransferLog, TransferStatus } from "@contexts/Transfer/types";
 import { useTransfer } from "../context/TransferContext";
-import { useWeb3 } from "../context/Web";
 import { Alert, CircularProgress, Link, Typography } from "@mui/material";
 import { useNevmTransaction } from "../hooks/useNevmTransaction";
 import { useEffect } from "react";
 import { NEVM_TX_BLOCKCHAIN_URL } from "@constants";
+import NEVMStepWrapper from "../NEVMStepWrapepr";
 
 type Props = {
   successStatus: TransferStatus;
@@ -70,4 +70,10 @@ const BridgeV3ConfirmNEVMTransaction: React.FC<Props> = ({
   );
 };
 
-export default BridgeV3ConfirmNEVMTransaction;
+const Wrapped: React.FC<Props> = (props) => (
+  <NEVMStepWrapper>
+    <BridgeV3ConfirmNEVMTransaction {...props} />
+  </NEVMStepWrapper>
+);
+
+export default Wrapped;

components/Bridge/v3/Steps/ConfirmUTXOTransaction.tsx

@@ -2,8 +2,9 @@ import { Alert, Box, CircularProgress, Link } from "@mui/material";
 import { useTransfer } from "../context/TransferContext";
 import { useUtxoTransaction } from "components/Bridge/v3/hooks/useUtxoTransaction";
 import { ITransferLog, TransferStatus } from "@contexts/Transfer/types";
-import { useEffect } from "react";
+import React, { useEffect } from "react";
 import { SYSCOIN_TX_BLOCKCHAIN_URL } from "@constants";
+import UTXOStepWrapper from "../UTXOStepWrapper";
 
 type Props = {
   invalidStateMessage: string;
@@ -76,4 +77,10 @@ const BridgeV3StepConfirmUTXOTransaction: React.FC<Props> = ({
   );
 };
 
-export default BridgeV3StepConfirmUTXOTransaction;
+const Wrapped: React.FC<Props> = (props) => (
+  <UTXOStepWrapper>
+    <BridgeV3StepConfirmUTXOTransaction {...props} />
+  </UTXOStepWrapper>
+);
+
+export default Wrapped;

components/Bridge/v3/hooks/useFreezeAndBurn.ts

@@ -4,6 +4,7 @@ import { useMutation } from "react-query";
 import { SYSX_ASSET_GUID } from "@contexts/Transfer/constants";
 import { toWei } from "web3-utils";
 import { useErc20ManagerContract } from "./useErc20ManagerContract";
+import { DEFAULT_GAS_LIMIT } from "@constants";
 
 export const useFreezeAndBurn = (transfer: ITransfer) => {
   const erc20ManagerContract = useErc20ManagerContract();
@@ -21,6 +22,7 @@ export const useFreezeAndBurn = (transfer: ITransfer) => {
 
       const gas = await method.estimateGas().catch((error: Error) => {
         console.error("Estimate gas error", error);
+        return DEFAULT_GAS_LIMIT
       });
 
       return new Promise<string>((resolve, reject) => {