@xswap-link/sdk 0.6.8 → 0.6.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xswap-link/sdk",
-  "version": "0.6.8",
+  "version": "0.6.10",
   "description": "JavaScript SDK for XSwap platform",
   "homepage": "https://github.com/xswap-link/xswap-sdk",
   "repository": {

package/src/components/Swap/SwapView/ConfirmationView/TxOverview/index.tsx

@@ -58,7 +58,7 @@ export const TxOverview = ({ onCloseClick }: Props) => {
   const evmContractApi = useEvmContractApi();
 
   const trackTransaction = useCallback(
-    (txReceipt: ContractReceipt) => {
+    async (txReceipt: ContractReceipt) => {
       if (!srcChain || !dstChain || !srcToken || !dstToken || !route) {
         return;
       }
@@ -98,18 +98,6 @@ export const TxOverview = ({ onCloseClick }: Props) => {
         const messageReceivedXSwapCustomRouterEventSignature =
           "MessageReceived(bytes32,uint64,address,bytes)"; // TODO think of getting this signature in a different way because its easy to forgot about it when we will change event on smartcontract
 
-        const messageSentEvent = txReceipt.logs?.find((log) => {
-          return log.topics[0] === ethers.utils.id(messageSentEventSignature);
-        });
-        const messageSentXSwapCustomRouterEvent = txReceipt.logs?.find(
-          (log) => {
-            return (
-              log.topics[0] ===
-              ethers.utils.id(messageSentXSwapCustomRouterEventSignature)
-            );
-          },
-        );
-
         const destinationChainProvider = ethers.getDefaultProvider(
           supportedChains.find(
             (chain) =>
@@ -118,55 +106,68 @@ export const TxOverview = ({ onCloseClick }: Props) => {
           )?.publicRpcUrls[0],
         );
 
-        if (messageSentEvent) {
-          // subscription for xswap router event
-          const messageId = messageSentEvent?.topics[1] as string;
-          transactionData.messageId = messageId;
+        const handleMessageEvent = async (
+          contractKey: "XSwapRouter" | "CustomXSwapRouter",
+          messageSentEventSignature: string,
+          messageReceivedEventSignature: string,
+        ) => {
+          const messageEvent = txReceipt.logs?.find((log) => {
+            return log.topics[0] === ethers.utils.id(messageSentEventSignature);
+          });
 
-          const xSwapRouterOnDestination = new ethers.Contract(
-            // @ts-ignore
-            ADDRESSES[dstChain.chainId].XSwapRouter,
-            XSwapRouterAbi,
-            destinationChainProvider,
-          );
+          if (messageEvent) {
+            const messageId = messageEvent?.topics[1] as string;
+            transactionData.messageId = messageId;
 
-          const eventFilter = {
-            // @ts-ignore
-            address: ADDRESSES[dstChain.chainId].XSwapRouter,
-            topics: [ethers.utils.id(messageReceivedEventSignature), messageId],
-          };
+            const xSwapRouterOnDestination = new ethers.Contract(
+              // @ts-ignore
+              ADDRESSES[dstChain?.chainId]?.[contractKey],
+              contractKey === "XSwapRouter"
+                ? XSwapRouterAbi
+                : CustomXSwapRouterAbi,
+              destinationChainProvider,
+            );
 
-          xSwapRouterOnDestination.once(eventFilter, () => {
-            transactionData.status = "DONE";
-            updateTransactionInLocalHistory(transactionData, txReceipt.from);
-          });
-        } else if (messageSentXSwapCustomRouterEvent) {
-          // subscription for custom router event
-          const messageId = messageSentXSwapCustomRouterEvent
-            ?.topics[1] as string;
-          transactionData.messageId = messageId;
+            const eventFilter = {
+              address: ADDRESSES[dstChain.chainId]?.[contractKey],
+              topics: [
+                ethers.utils.id(messageReceivedEventSignature),
+                messageId,
+              ],
+            };
 
-          const xSwapRouterOnDestination = new ethers.Contract(
-            // @ts-ignore
-            ADDRESSES[dstChain.chainId].CustomXSwapRouter,
-            CustomXSwapRouterAbi,
-            destinationChainProvider,
-          );
+            const pastEvents = await xSwapRouterOnDestination.queryFilter(
+              eventFilter,
+            );
 
-          const eventFilter = {
-            address: ADDRESSES[dstChain.chainId]?.CustomXSwapRouter,
-            topics: [
-              ethers.utils.id(messageReceivedXSwapCustomRouterEventSignature),
-              messageId,
-            ],
-          };
+            if (pastEvents.length > 0) {
+              transactionData.status = "DONE";
+              updateTransactionInLocalHistory(transactionData, txReceipt.from);
+            } else {
+              xSwapRouterOnDestination.once(eventFilter, () => {
+                transactionData.status = "DONE";
+                updateTransactionInLocalHistory(
+                  transactionData,
+                  txReceipt.from,
+                );
+              });
+            }
+          }
+        };
 
-          xSwapRouterOnDestination.once(eventFilter, () => {
-            transactionData.status = "DONE";
-            updateTransactionInLocalHistory(transactionData, txReceipt.from);
-          });
-        }
+        await handleMessageEvent(
+          "XSwapRouter",
+          messageSentEventSignature,
+          messageReceivedEventSignature,
+        );
+
+        await handleMessageEvent(
+          "CustomXSwapRouter",
+          messageSentXSwapCustomRouterEventSignature,
+          messageReceivedXSwapCustomRouterEventSignature,
+        );
       }
+
       addTransactionToLocalHistory(transactionData, txReceipt.from);
     },
     [
@@ -246,15 +247,19 @@ export const TxOverview = ({ onCloseClick }: Props) => {
       }
     }
   }, [
-    evmContractApi,
-    signer,
-    enqueueTransaction,
-    refreshBalance,
+    srcToken,
     route,
-    setTxNeedsApproval,
+    enqueueTransaction,
+    signer,
+    evmContractApi,
     setTxStatus,
-    srcToken,
+    refreshBalance,
     trackTransaction,
+    srcChain?.chainId,
+    dstChain?.chainId,
+    dstToken?.address,
+    dstValueWei,
+    setTxNeedsApproval,
   ]);
 
   return (

package/src/components/Swap/SwapView/SwapPanel/ChainPanel/index.tsx

@@ -6,6 +6,7 @@ import { useCallback, useEffect } from "react";
 import { useAccount } from "wagmi";
 import { SwapPanelType } from "../../../SwapView";
 import { ChainPicker } from "./ChainPicker";
+import { useMemo } from "react";
 
 type Props = {
   chain: Chain | undefined;
@@ -22,13 +23,20 @@ export const ChainPanel = ({ chain, type }: Props) => {
     setSrcToken,
     dstToken,
     setDstToken,
+    srcChainProvided,
+    dstChainProvided,
   } = useSwapContext();
 
   const { chainId } = useAccount();
 
+  const projectSelectedDestinationChain = useMemo(
+    () => type === "destination" && dstChainProvided,
+    [type, dstChainProvided],
+  );
+
   // select chain from user wallet
   useEffect(() => {
-    if (!chainId) return;
+    if (!chainId || srcChainProvided) return;
 
     const userChainFromWallet = supportedChains.find(
       (chain) => chain.chainId === String(chainId),
@@ -71,6 +79,7 @@ export const ChainPanel = ({ chain, type }: Props) => {
     <>
       <button
         type="button"
+        disabled={projectSelectedDestinationChain}
         onClick={() =>
           openModal(
             <ChainPicker
@@ -91,9 +100,11 @@ export const ChainPanel = ({ chain, type }: Props) => {
               {chain ? chain.displayName : "Select"}
             </p>
           </div>
-          <div className="w-4 h-2 fill-t_text_primary">
-            <ArrowDownIcon />
-          </div>
+          {!projectSelectedDestinationChain && (
+            <div className="w-4 h-2 fill-t_text_primary">
+              <ArrowDownIcon />
+            </div>
+          )}
         </div>
       </button>
     </>

package/src/components/Swap/SwapView/SwapPanel/TokenPanel/index.tsx

@@ -26,8 +26,14 @@ export const TokenPanel = ({ chain, token, type }: Props) => {
     supportedChains,
     setDstToken,
     setDstChain,
+    dstTokenProvided,
   } = useSwapContext();
 
+  const projectSelectedDestinationToken = useMemo(
+    () => type === "destination" && dstTokenProvided,
+    [type, dstTokenProvided],
+  );
+
   const { openModal, closeModal } = useModal();
 
   const tokensWithBalances = useMemo(
@@ -62,7 +68,8 @@ export const TokenPanel = ({ chain, token, type }: Props) => {
     <>
       <button
         type="button"
-        onClick={() =>
+        disabled={projectSelectedDestinationToken}
+        onClick={() => {
           openModal(
             <TokenPicker
               type={type}
@@ -74,8 +81,8 @@ export const TokenPanel = ({ chain, token, type }: Props) => {
               isOpen={open}
               setModalOpen={setOpen}
             />,
-          )
-        }
+          );
+        }}
       >
         <div className="flex justify-between items-center p-4 gap-8 border-r border-solid border-t_text_primary border-opacity-10">
           <div className="flex gap-2 items-center">
@@ -91,9 +98,11 @@ export const TokenPanel = ({ chain, token, type }: Props) => {
               </p>
             </div>
           </div>
-          <div className="w-4 h-2 fill-t_text_primary">
-            <ArrowDownIcon />
-          </div>
+          {!projectSelectedDestinationToken && (
+            <div className="w-4 h-2 fill-t_text_primary">
+              <ArrowDownIcon />
+            </div>
+          )}
         </div>
       </button>
     </>

package/src/components/TxWidgetWC/index.tsx

@@ -122,10 +122,10 @@ export type TxWidgetWCAttributes = {
   "dst-token": WidgetIntegrationPayload["dstToken"];
   "src-chain": WidgetIntegrationPayload["srcChain"];
   "src-token": WidgetIntegrationPayload["srcToken"];
-  "custom-contract-calls": WidgetIntegrationPayload["customContractCalls"];
+  "custom-contract-calls": string | undefined;
   desc: WidgetIntegrationPayload["desc"];
   "dst-display-token": WidgetIntegrationPayload["dstDisplayToken"];
   "light-theme": WidgetIntegrationPayload["lightTheme"];
   "default-wallet-picker": WidgetIntegrationPayload["defaultWalletPicker"];
-  styles: WidgetIntegrationPayload["styles"];
+  styles: string | undefined;
 };

package/src/components/TxWidgetWCWrapped/index.tsx

@@ -43,12 +43,12 @@ export const TxWidgetWCWrapped = ({
       dst-token={dstToken}
       src-chain={srcChain}
       src-token={srcToken}
-      custom-contract-calls={customContractCalls}
+      custom-contract-calls={JSON.stringify(customContractCalls)}
       desc={desc}
       dst-display-token={dstDisplayToken}
       light-theme={lightTheme}
       default-wallet-picker={defaultWalletPicker}
-      styles={styles}
+      styles={typeof styles === "string" ? styles : JSON.stringify(styles)}
     ></xpay-widget>
   );
 };

package/src/context/SwapProvider.tsx

@@ -53,18 +53,22 @@ type SwapContext = {
   error: string;
   setError: Dispatch<SetStateAction<string>>;
   feeToken: Token | undefined;
+  srcChainProvided: boolean;
   srcChain: Chain | undefined;
   setSrcChain: Dispatch<SetStateAction<Chain | undefined>>;
   srcChainTokensOptions: TokenOption[];
   srcChainOtherTokensOptions: TokenOption[];
   srcChainTokensPrices: TokenPrices;
   dstChainTokensPrices: TokenPrices;
+  srcTokenProvided: boolean;
   srcToken: Token | undefined;
   setSrcToken: Dispatch<SetStateAction<Token | undefined>>;
+  dstChainProvided: boolean;
   dstChain: Chain | undefined;
   setDstChain: Dispatch<SetStateAction<Chain | undefined>>;
   dstChainTokensOptions: TokenOption[];
   dstChainOtherTokensOptions: TokenOption[];
+  dstTokenProvided: boolean;
   dstToken: Token | undefined;
   setDstToken: Dispatch<SetStateAction<Token | undefined>>;
   srcValue: string;
@@ -112,15 +116,19 @@ const init: SwapContext = {
   overlay: false,
   error: "",
   feeToken: undefined,
+  srcChainProvided: false,
   srcChain: undefined,
   srcChainTokensOptions: [],
   srcChainOtherTokensOptions: [],
   srcChainTokensPrices: {},
   dstChainTokensPrices: {},
+  dstChainProvided: false,
   dstChain: undefined,
   dstChainTokensOptions: [],
   dstChainOtherTokensOptions: [],
+  srcTokenProvided: false,
   srcToken: undefined,
+  dstTokenProvided: false,
   dstToken: undefined,
   srcValue: "",
   srcValueWei: "",
@@ -181,6 +189,22 @@ export const SwapProvider = ({
   const [infiniteApproval, setInfiniteApproval] = useState(
     init.infiniteApproval,
   );
+  const srcTokenProvided = useMemo(
+    () => !!integrationConfig?.srcTokenAddr,
+    [integrationConfig?.srcTokenAddr],
+  );
+  const dstTokenProvided = useMemo(
+    () => !!integrationConfig?.dstTokenAddr,
+    [integrationConfig?.dstTokenAddr],
+  );
+  const srcChainProvided = useMemo(
+    () => !!integrationConfig?.srcChainId,
+    [integrationConfig?.srcChainId],
+  );
+  const dstChainProvided = useMemo(
+    () => !!integrationConfig?.dstChainId,
+    [integrationConfig?.dstChainId],
+  );
   const [slippage, setSlippage] = useState(init.slippage);
   const [srcChain, setSrcChain] = useState(init.srcChain);
   const [dstChain, setDstChain] = useState(init.dstChain);
@@ -653,18 +677,22 @@ export const SwapProvider = ({
         error,
         setError,
         feeToken,
+        srcChainProvided,
         srcChain,
         setSrcChain,
         srcChainTokensOptions,
         srcChainOtherTokensOptions,
         dstChainTokensPrices,
         srcChainTokensPrices,
+        dstChainProvided,
         dstChain,
         setDstChain,
         dstChainTokensOptions,
         dstChainOtherTokensOptions,
+        srcTokenProvided,
         srcToken,
         setSrcToken,
+        dstTokenProvided,
         dstToken,
         setDstToken,
         srcValue,

package/src/models/payloads/WidgetIntegrationPayload.ts

@@ -1,4 +1,4 @@
-import { ContractCall } from "@src/models";
+import { ContractCall, ModalIntegrationStyles } from "@src/models";
 
 export type WidgetIntegrationPayload = {
   integratorId: string;
@@ -11,5 +11,5 @@ export type WidgetIntegrationPayload = {
   dstDisplayToken?: string;
   lightTheme?: boolean;
   defaultWalletPicker?: boolean;
-  styles?: string;
+  styles?: ModalIntegrationStyles | string;
 };

package/xswap.config.ts

@@ -2,6 +2,7 @@ import { XSwapConfig } from "@src/models";
 
 const xSwapConfig: XSwapConfig = {
   apiUrl: "https://xswap.link/api",
+  // apiUrl: "http://127.0.0.1:5001/xswap-app/europe-west1/app/api/beta",
   localCss: false,
 };