From 2c5e64de8cb2f646d4ab16505ef2e9d463e629df Mon Sep 17 00:00:00 2001 From: Jhonatan Gonzalez Date: Tue, 12 Mar 2024 11:51:45 +0900 Subject: [PATCH] fix default crypto amount in on-ramp service --- .../sdk/src/fiatRamp/fiatRamp.test.ts | 43 ++++++++--- .../checkout/sdk/src/fiatRamp/fiatRamp.ts | 77 +++++++++++-------- 2 files changed, 79 insertions(+), 41 deletions(-) diff --git a/packages/checkout/sdk/src/fiatRamp/fiatRamp.test.ts b/packages/checkout/sdk/src/fiatRamp/fiatRamp.test.ts index 0deb584999..4e1475033f 100644 --- a/packages/checkout/sdk/src/fiatRamp/fiatRamp.test.ts +++ b/packages/checkout/sdk/src/fiatRamp/fiatRamp.test.ts @@ -5,11 +5,19 @@ import { FiatRampService, FiatRampWidgetParams } from './fiatRamp'; import { ExchangeType, OnRampProvider } from '../types'; import { HttpClient } from '../api/http'; -const defaultWidgetUrl = 'https://global-stg.transak.com?apiKey=mock-api-key' -+ '&network=immutablezkevm&defaultPaymentMethod=credit_debit_card&disablePaymentMethods=sepa_bank_transfer,' -+ 'gbp_bank_transfer,pm_cash_app,pm_jwire,pm_paymaya,pm_bpi,pm_ubp,pm_grabpay,pm_shopeepay,pm_gcash,pm_pix,' -+ 'pm_astropay,pm_pse,inr_bank_transfer&productsAvailed=buy&exchangeScreenTitle=Buy&themeColor=0D0D0D' -+ '&defaultFiatAmount=50&defaultFiatCurrency=usd'; +const defaultURL = 'https://global-stg.transak.com'; +const defaultParams = { + apiKey: 'mock-api-key', + network: 'immutablezkevm', + defaultPaymentMethod: 'credit_debit_card', + disablePaymentMethods: 'sepa_bank_transfer,gbp_bank_transfer,pm_cash_app,pm_jwire,pm_paymaya,pm_bpi,pm_ubp,pm_grabpay,pm_shopeepay,pm_gcash,pm_pix,pm_astropay,pm_pse,inr_bank_transfer', // eslint-disable-line max-len + productsAvailed: 'buy', + exchangeScreenTitle: 'Buy', + themeColor: '0D0D0D', + defaultFiatCurrency: 'usd', +}; + +const defaultWidgetUrl = `${defaultURL}?${new URLSearchParams(defaultParams).toString()}`; jest.mock('../config/remoteConfigFetcher'); @@ -117,8 +125,23 @@ describe('FiatRampService', () => { }; const result = await fiatRampService.createWidgetUrl(params); expect(result).toContain(defaultWidgetUrl); - expect(result).toContain('&email=passport.user%40immutable.com'); - expect(result).toContain('&isAutoFillUserData=true&disableWalletAddressForm=true'); + expect(result).toContain('&email=passport.user%2540immutable.com'); + expect(result).toContain('&isAutoFillUserData=true'); + expect(result).toContain('&disableWalletAddressForm=true'); + }); + + it(`should return widget url with defaultFiatAmount and defaultCryptoCurrency query params when tokenAmount and + tokenSymbol are no present`, async () => { + const params: FiatRampWidgetParams = { + exchangeType: ExchangeType.ONRAMP, + isPassport: false, + }; + const result = await fiatRampService.createWidgetUrl(params); + expect(result).toContain(defaultWidgetUrl); + expect(result).toContain('&defaultFiatAmount=50'); + expect(result).toContain('&defaultCryptoCurrency=IMX'); + expect(result).not.toContain('&defaultCryptoAmount=100'); + expect(result).not.toContain('&cryptoCurrencyCode=ETH'); }); it(`should return widget url with defaultCryptoAmount and cryptoCurrencyCode query params when tokenAmount and @@ -132,7 +155,9 @@ describe('FiatRampService', () => { const result = await fiatRampService.createWidgetUrl(params); expect(result).toContain(defaultWidgetUrl); expect(result).toContain('&defaultCryptoAmount=100'); - expect(result).toContain('&defaultCryptoCurrency=ETH'); + expect(result).toContain('&cryptoCurrencyCode=ETH'); + expect(result).not.toContain('&defaultFiatAmount='); + expect(result).not.toContain('&defaultCryptoCurrency=IMX'); }); it('should return widget url with walletAddress query params when walletAddress is present', async () => { @@ -154,7 +179,7 @@ describe('FiatRampService', () => { }; const result = await fiatRampService.createWidgetUrl(params); expect(result).toContain(defaultWidgetUrl); - expect(result).toContain('&cryptoCurrencyList=eth,imx'); + expect(result).toContain('&cryptoCurrencyList=eth%2Cimx'); }); }); }); diff --git a/packages/checkout/sdk/src/fiatRamp/fiatRamp.ts b/packages/checkout/sdk/src/fiatRamp/fiatRamp.ts index 334a1dca1b..fd669788ac 100644 --- a/packages/checkout/sdk/src/fiatRamp/fiatRamp.ts +++ b/packages/checkout/sdk/src/fiatRamp/fiatRamp.ts @@ -1,7 +1,5 @@ import { ExchangeType } from '../types/fiatRamp'; -import { - OnRampConfig, OnRampProvider, OnRampProviderFees, -} from '../types'; +import { OnRampConfig, OnRampProvider, OnRampProviderFees } from '../types'; import { CheckoutConfiguration } from '../config'; import { TRANSAK_API_BASE_URL } from '../env'; @@ -35,48 +33,63 @@ export class FiatRampService { return (await this.getTransakWidgetUrl(params)); } - private async getTransakWidgetUrl(params: FiatRampWidgetParams): Promise { - let widgetUrl = `${TRANSAK_API_BASE_URL[this.config.environment]}?`; - const onRampConfig = (await this.config.remote.getConfig('onramp')) as OnRampConfig; - const apiKey = onRampConfig[OnRampProvider.TRANSAK].publishableApiKey; - const transakPublishableKey = `apiKey=${apiKey}`; - const zkevmNetwork = 'network=immutablezkevm'; - const defaultPaymentMethod = 'defaultPaymentMethod=credit_debit_card'; - const disableBankTransfer = 'disablePaymentMethods=sepa_bank_transfer,gbp_bank_transfer,' - + 'pm_cash_app,pm_jwire,pm_paymaya,pm_bpi,pm_ubp,pm_grabpay,pm_shopeepay,pm_gcash,pm_pix,' - + 'pm_astropay,pm_pse,inr_bank_transfer'; - const productsAvailed = 'productsAvailed=buy'; - const exchangeScreenTitle = 'exchangeScreenTitle=Buy'; - const themeColor = 'themeColor=0D0D0D'; - const defaultFiat = 'defaultFiatAmount=50&defaultFiatCurrency=usd'; + private async getTransakWidgetUrl( + params: FiatRampWidgetParams, + ): Promise { + const onRampConfig = (await this.config.remote.getConfig( + 'onramp', + )) as OnRampConfig; + + const widgetUrl = TRANSAK_API_BASE_URL[this.config.environment]; + let widgetParams: Record = { + apiKey: onRampConfig[OnRampProvider.TRANSAK].publishableApiKey, + network: 'immutablezkevm', + defaultPaymentMethod: 'credit_debit_card', + disablePaymentMethods: 'sepa_bank_transfer,gbp_bank_transfer,pm_cash_app,pm_jwire,pm_paymaya,' + + 'pm_bpi,pm_ubp,pm_grabpay,pm_shopeepay,pm_gcash,pm_pix,pm_astropay,pm_pse,inr_bank_transfer', + productsAvailed: 'buy', + exchangeScreenTitle: 'Buy', + themeColor: '0D0D0D', + defaultFiatCurrency: 'usd', + }; - widgetUrl += `${transakPublishableKey}&` - + `${zkevmNetwork}&` - + `${defaultPaymentMethod}&` - + `${disableBankTransfer}&` - + `${productsAvailed}&` - + `${exchangeScreenTitle}&` - + `${themeColor}&` - + `${defaultFiat}`; if (params.isPassport && params.email) { - const encodedEmail = encodeURIComponent(params.email); - widgetUrl += `&email=${encodedEmail}&isAutoFillUserData=true&disableWalletAddressForm=true`; + widgetParams = { + ...widgetParams, + email: encodeURIComponent(params.email), + isAutoFillUserData: true, + disableWalletAddressForm: true, + }; } if (params.tokenAmount && params.tokenSymbol) { - widgetUrl += `&defaultCryptoAmount=${params.tokenAmount}&defaultCryptoCurrency=${params.tokenSymbol}`; + widgetParams = { + ...widgetParams, + defaultCryptoAmount: params.tokenAmount, + cryptoCurrencyCode: params.tokenSymbol, + }; } else { - widgetUrl += '&defaultCryptoCurrency=IMX'; + widgetParams = { + ...widgetParams, + defaultFiatAmount: '50', + defaultCryptoCurrency: 'IMX', + }; } if (params.walletAddress) { - widgetUrl += `&walletAddress=${params.walletAddress}`; + widgetParams = { + ...widgetParams, + walletAddress: params.walletAddress, + }; } if (params.allowedTokens) { - widgetUrl += `&cryptoCurrencyList=${params.allowedTokens?.join(',').toLowerCase()}`; + widgetParams = { + ...widgetParams, + cryptoCurrencyList: params.allowedTokens?.join(',').toLowerCase(), + }; } - return widgetUrl; + return `${widgetUrl}?${new URLSearchParams(widgetParams).toString()}`; } }