@multiversx/sdk-dapp-liquidity 1.1.0-alpha.24 → 1.1.0-alpha.26

package/package.json

@@ -28,7 +28,7 @@
   },
   "homepage": "https://github.com/multiversx/mx-sdk-dapp-liquidity#readme",
   "license": "MIT",
-  "version": "1.1.0-alpha.24",
+  "version": "1.1.0-alpha.26",
   "main": "index.js",
   "module": "index.mjs",
   "types": "index.d.ts",

package/reactjs/components/BridgeForm/BridgeForm.js

@@ -5,6 +5,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const faSpinner = require("@fortawesome/free-solid-svg-icons/faSpinner");
 const reactFontawesome = require("@fortawesome/react-fontawesome");
 const formatAmount = require("@multiversx/sdk-dapp-utils/out/helpers/formatAmount");
+const react = require("@reown/appkit/react");
 const debounce = require("lodash/debounce");
 const React = require("react");
 const reactToastify = require("react-toastify");
@@ -36,7 +37,6 @@ require("react-popper");
 require("../base/MxTooltip/components/TooltipContainer/TooltipContainer.js");
 const reactjs_components_BridgeHistory_BridgeHistory = require("../BridgeHistory/BridgeHistory.js");
 const reactjs_components_Connect_BridgeConnectButton = require("../Connect/BridgeConnectButton.js");
-require("@reown/appkit/react");
 require("wagmi");
 const reactjs_components_Connect_MvxConnectButton = require("../Connect/MvxConnectButton.js");
 const reactjs_components_Connect_BridgeAccountDisplay = require("../Connect/BridgeAccountDisplay.js");
@@ -144,6 +144,7 @@ const BridgeForm = ({
   const [pendingSigning, setPendingSigning] = React.useState(false);
   const [siginingTransactionsCount, setSigningTransactionsCount] = React.useState(0);
   const account = reactjs_hooks_useAccount.useAccount();
+  const { switchNetwork } = react.useAppKitNetwork();
   const { config, options, supportedChains: sdkChains } = reactjs_context_useWeb3App.useWeb3App();
   const chainId = reactjs_hooks_useGetChainId.useGetChainId();
   const {
@@ -180,9 +181,9 @@ const BridgeForm = ({
   } = reactjs_queries_useGetRate_mutation.useGetRateMutation();
   const rateValidationError = ((_a = rateError == null ? void 0 : rateError.response) == null ? void 0 : _a.status) === 400 ? (_b = rateError == null ? void 0 : rateError.response) == null ? void 0 : _b.data.message : void 0;
   const [firstToken, setFirstToken] = React.useState();
-  const [firstAmount, setFirstAmount] = React.useState("");
+  const [firstAmount, setFirstAmount] = React.useState(firstTokenAmount ?? "");
   const [secondToken, setSecondToken] = React.useState();
-  const [secondAmount, setSecondAmount] = React.useState("");
+  const [secondAmount, setSecondAmount] = React.useState(secondTokenAmount ?? "");
   const bridgeAddress = account.address;
   const isAuthenticated = account.isConnected && Boolean(bridgeAddress);
   const fromOptions = React.useMemo(
@@ -400,6 +401,12 @@ const BridgeForm = ({
       updateUrlParams({
         firstTokenId: firstOption == null ? void 0 : firstOption.address
       });
+      const selectedOptionChain = (sdkChains == null ? void 0 : sdkChains.find(
+        (chain) => chain.id.toString() === (firstOption == null ? void 0 : firstOption.chainId.toString())
+      )) ?? activeChain;
+      if (selectedOptionChain) {
+        switchNetwork(selectedOptionChain);
+      }
       initializedFirstToken = true;
     }
     let initializedSecondToken = false;
@@ -619,11 +626,19 @@ const BridgeForm = ({
   }, [mvxTokensWithBalances, secondToken == null ? void 0 : secondToken.address]);
   React.useEffect(() => {
     if (firstTokenAmount) {
+      formik.setFieldValue(
+        reactjs_hooks_useBridgeFormik.BridgeFormikValuesEnum.firstAmount,
+        firstTokenAmount
+      );
       handleOnChangeFirstAmount(firstTokenAmount);
     }
-  }, [firstTokenAmount]);
+  }, []);
   React.useEffect(() => {
     if (secondTokenAmount) {
+      formik.setFieldValue(
+        reactjs_hooks_useBridgeFormik.BridgeFormikValuesEnum.secondAmount,
+        secondTokenAmount
+      );
       handleOnChangeSecondAmount(secondTokenAmount);
     }
   }, [secondTokenAmount]);

package/reactjs/components/BridgeForm/BridgeForm.mjs

@@ -2,6 +2,7 @@ import { jsx, Fragment, jsxs } from "react/jsx-runtime";
 import { faSpinner } from "@fortawesome/free-solid-svg-icons/faSpinner";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { formatAmount } from "@multiversx/sdk-dapp-utils/out/helpers/formatAmount";
+import { useAppKitNetwork } from "@reown/appkit/react";
 import debounce from "lodash/debounce";
 import { useRef, useState, useMemo, useCallback, useEffect } from "react";
 import { toast } from "react-toastify";
@@ -33,7 +34,6 @@ import "react-popper";
 import "../base/MxTooltip/components/TooltipContainer/TooltipContainer.mjs";
 import { BridgeHistory } from "../BridgeHistory/BridgeHistory.mjs";
 import { BridgeConnectButton } from "../Connect/BridgeConnectButton.mjs";
-import "@reown/appkit/react";
 import "wagmi";
 import { MvxConnectButton } from "../Connect/MvxConnectButton.mjs";
 import { BridgeAccountDisplay } from "../Connect/BridgeAccountDisplay.mjs";
@@ -141,6 +141,7 @@ const BridgeForm = ({
   const [pendingSigning, setPendingSigning] = useState(false);
   const [siginingTransactionsCount, setSigningTransactionsCount] = useState(0);
   const account = useAccount();
+  const { switchNetwork } = useAppKitNetwork();
   const { config, options, supportedChains: sdkChains } = useWeb3App();
   const chainId = useGetChainId();
   const {
@@ -177,9 +178,9 @@ const BridgeForm = ({
   } = useGetRateMutation();
   const rateValidationError = ((_a = rateError == null ? void 0 : rateError.response) == null ? void 0 : _a.status) === 400 ? (_b = rateError == null ? void 0 : rateError.response) == null ? void 0 : _b.data.message : void 0;
   const [firstToken, setFirstToken] = useState();
-  const [firstAmount, setFirstAmount] = useState("");
+  const [firstAmount, setFirstAmount] = useState(firstTokenAmount ?? "");
   const [secondToken, setSecondToken] = useState();
-  const [secondAmount, setSecondAmount] = useState("");
+  const [secondAmount, setSecondAmount] = useState(secondTokenAmount ?? "");
   const bridgeAddress = account.address;
   const isAuthenticated = account.isConnected && Boolean(bridgeAddress);
   const fromOptions = useMemo(
@@ -397,6 +398,12 @@ const BridgeForm = ({
       updateUrlParams({
         firstTokenId: firstOption == null ? void 0 : firstOption.address
       });
+      const selectedOptionChain = (sdkChains == null ? void 0 : sdkChains.find(
+        (chain) => chain.id.toString() === (firstOption == null ? void 0 : firstOption.chainId.toString())
+      )) ?? activeChain;
+      if (selectedOptionChain) {
+        switchNetwork(selectedOptionChain);
+      }
       initializedFirstToken = true;
     }
     let initializedSecondToken = false;
@@ -616,11 +623,19 @@ const BridgeForm = ({
   }, [mvxTokensWithBalances, secondToken == null ? void 0 : secondToken.address]);
   useEffect(() => {
     if (firstTokenAmount) {
+      formik.setFieldValue(
+        BridgeFormikValuesEnum.firstAmount,
+        firstTokenAmount
+      );
       handleOnChangeFirstAmount(firstTokenAmount);
     }
-  }, [firstTokenAmount]);
+  }, []);
   useEffect(() => {
     if (secondTokenAmount) {
+      formik.setFieldValue(
+        BridgeFormikValuesEnum.secondAmount,
+        secondTokenAmount
+      );
       handleOnChangeSecondAmount(secondTokenAmount);
     }
   }, [secondTokenAmount]);