GPR | Sale Widget | fix transak calldata param encoding (#1027)

immutable · Oct 19, 2023 · 70845f5 · 70845f5
1 parent f584df6
commit 70845f5
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 3 deletions.
diff --git a/packages/checkout/widgets-lib/package.json b/packages/checkout/widgets-lib/package.json
@@ -32,6 +32,7 @@
     "ethers": "^5.7.2",
     "https-browserify": "^1.0.0",
     "os-browserify": "^0.3.0",
+    "pako": "^2.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.11.0",

diff --git a/packages/checkout/widgets-lib/src/components/Transak/useTransakIframe.ts b/packages/checkout/widgets-lib/src/components/Transak/useTransakIframe.ts
@@ -1,5 +1,6 @@
-import { Environment } from '@imtbl/config';
 import { useCallback, useEffect, useState } from 'react';
+import { Environment } from '@imtbl/config';
+import pako from 'pako';
 
 export type TransakNFTData = {
   imageURL: string;
@@ -29,6 +30,8 @@ type UseTransakIframeProps = {
   type: TransakWidgetType;
 } & TransakNFTCheckoutParams;
 
+const MAX_GAS_LIMIT = '30000000';
+
 // TODO: Move to common config file inside Checkout SDK while refactoring onRamp
 // const { baseUrl, apiKey } = checkout.fiatExchangeConfig('transak')
 export const TRANSAK_API_BASE_URL = {
@@ -50,6 +53,7 @@ export const useTransakIframe = (props: UseTransakIframeProps) => {
 
   const getNFTCheckoutURL = useCallback(() => {
     const {
+      calldata,
       nftData: nfts,
       estimatedGasLimit,
       ...restTransakParams
@@ -59,15 +63,15 @@ export const useTransakIframe = (props: UseTransakIframeProps) => {
     // as transak currently only supports on nft at a time
     const nftData = nfts?.slice(0, 1);
 
-    // FIXME: Gas limit is not being calculated correctly, and cant be set to 0
-    const gasLimit = estimatedGasLimit > 0 ? estimatedGasLimit : 300000;
+    const gasLimit = estimatedGasLimit > 0 ? estimatedGasLimit : MAX_GAS_LIMIT;
 
     const params = {
       apiKey,
       network,
       isNFT: 'true',
       disableWalletAddressForm: 'true',
       environment: 'STAGING',
+      calldata: btoa(String.fromCharCode.apply(null, pako.deflate(calldata))),
       nftData: btoa(JSON.stringify(nftData)),
       estimatedGasLimit: gasLimit.toString(),
       ...restTransakParams,

diff --git a/yarn.lock b/yarn.lock
@@ -3170,6 +3170,7 @@ __metadata:
     jest: ^29.4.3
     local-cypress: ^1.2.6
     os-browserify: ^0.3.0
+    pako: ^2.1.0
     react: ^18.2.0
     react-app-rewired: ^2.2.1
     react-dom: ^18.2.0
@@ -23641,6 +23642,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"pako@npm:^2.1.0":
+  version: 2.1.0
+  resolution: "pako@npm:2.1.0"
+  checksum: 71666548644c9a4d056bcaba849ca6fd7242c6cf1af0646d3346f3079a1c7f4a66ffec6f7369ee0dc88f61926c10d6ab05da3e1fca44b83551839e89edd75a3e
+  languageName: node
+  linkType: hard
+
 "pako@npm:~0.2.0":
   version: 0.2.9
   resolution: "pako@npm:0.2.9"