diff --git a/packages/checkout/sdk/src/fiatRamp/fiatRamp.ts b/packages/checkout/sdk/src/fiatRamp/fiatRamp.ts index 267a60adbc..5d447d6cc6 100644 --- a/packages/checkout/sdk/src/fiatRamp/fiatRamp.ts +++ b/packages/checkout/sdk/src/fiatRamp/fiatRamp.ts @@ -11,6 +11,8 @@ export interface FiatRampWidgetParams { tokenSymbol?: string; email?: string; allowedTokens?: string[]; + showMenu?: boolean; + customSubTitle?: string; } export class FiatRampService { @@ -49,9 +51,10 @@ export class FiatRampService { defaultPaymentMethod: 'credit_debit_card', disablePaymentMethods: '', productsAvailed: 'buy', - exchangeScreenTitle: 'Buy', + exchangeScreenTitle: params.customSubTitle === '' ? ' ' : (params.customSubTitle ?? 'Buy'), themeColor: '0D0D0D', defaultCryptoCurrency: params.tokenSymbol || 'IMX', + hideMenu: !(params.showMenu ?? true), }; if (params.isPassport && params.email) { diff --git a/packages/checkout/sdk/src/sdk.ts b/packages/checkout/sdk/src/sdk.ts index 67c3496a4b..690ccf728d 100644 --- a/packages/checkout/sdk/src/sdk.ts +++ b/packages/checkout/sdk/src/sdk.ts @@ -669,6 +669,8 @@ export class Checkout { tokenSymbol, email, allowedTokens, + showMenu: params.showMenu, + customSubTitle: params.customSubTitle, } as FiatRampWidgetParams); } diff --git a/packages/checkout/sdk/src/types/fiatRamp.ts b/packages/checkout/sdk/src/types/fiatRamp.ts index 277a71bf2d..84ec3c5ea8 100644 --- a/packages/checkout/sdk/src/types/fiatRamp.ts +++ b/packages/checkout/sdk/src/types/fiatRamp.ts @@ -26,4 +26,6 @@ export interface FiatRampParams { tokenAmount?: string; tokenAddress?: string; passport?: any; + showMenu?: boolean; + customSubTitle?: string; } diff --git a/packages/checkout/sdk/src/widgets/definitions/configurations/onramp.ts b/packages/checkout/sdk/src/widgets/definitions/configurations/onramp.ts index f3f08c6cab..51f132d92e 100644 --- a/packages/checkout/sdk/src/widgets/definitions/configurations/onramp.ts +++ b/packages/checkout/sdk/src/widgets/definitions/configurations/onramp.ts @@ -4,4 +4,8 @@ import { WidgetConfiguration } from './widget'; * Onramp Widget Configuration represents the configuration options for the Onramp Widget. */ export type OnrampWidgetConfiguration = { + /** Whether to show the menu in the Transak widget (default: true) */ + showMenu?: boolean; + /** The custom subtitle to display on the exchange screen in the Transak widget (default: 'Buy') */ + customSubTitle?: string; } & WidgetConfiguration; diff --git a/packages/checkout/widgets-lib/src/widgets/immutable-commerce/CommerceWidget.tsx b/packages/checkout/widgets-lib/src/widgets/immutable-commerce/CommerceWidget.tsx index 09191aa1c0..548b48e482 100644 --- a/packages/checkout/widgets-lib/src/widgets/immutable-commerce/CommerceWidget.tsx +++ b/packages/checkout/widgets-lib/src/widgets/immutable-commerce/CommerceWidget.tsx @@ -324,7 +324,7 @@ export default function CommerceWidget(props: CommerceWidgetInputs) { )} diff --git a/packages/checkout/widgets-lib/src/widgets/on-ramp/OnRampWidget.tsx b/packages/checkout/widgets-lib/src/widgets/on-ramp/OnRampWidget.tsx index ded8730416..619ac79c49 100644 --- a/packages/checkout/widgets-lib/src/widgets/on-ramp/OnRampWidget.tsx +++ b/packages/checkout/widgets-lib/src/widgets/on-ramp/OnRampWidget.tsx @@ -1,7 +1,7 @@ import { useContext, useEffect, useMemo, useReducer, useState, } from 'react'; -import { IMTBLWidgetEvents, OnRampWidgetParams } from '@imtbl/checkout-sdk'; +import { IMTBLWidgetEvents, OnRampWidgetParams, OnrampWidgetConfiguration } from '@imtbl/checkout-sdk'; import { useTranslation } from 'react-i18next'; import { UserJourney } from '../../context/analytics-provider/SegmentAnalyticsProvider'; import { NATIVE } from '../../lib'; @@ -27,11 +27,12 @@ import { OrderInProgress } from './views/OrderInProgress'; import { ServiceUnavailableErrorView } from '../../views/error/ServiceUnavailableErrorView'; export type OnRampWidgetInputs = OnRampWidgetParams & { - config: StrongCheckoutWidgetsConfig + config: StrongCheckoutWidgetsConfig; + onrampConfig?: OnrampWidgetConfiguration; }; export default function OnRampWidget({ - amount, tokenAddress, config, showBackButton, + amount, tokenAddress, config, showBackButton, onrampConfig, }: OnRampWidgetInputs) { const { isOnRampEnabled, isSwapEnabled, isBridgeEnabled, @@ -139,6 +140,8 @@ export default function OnRampWidget({ tknAddr ?? viewState.view.data?.tokenAddress } showBackButton={showBackButton} + showMenu={onrampConfig?.showMenu} + customSubTitle={onrampConfig?.customSubTitle} /> )} diff --git a/packages/checkout/widgets-lib/src/widgets/on-ramp/OnRampWidgetRoot.tsx b/packages/checkout/widgets-lib/src/widgets/on-ramp/OnRampWidgetRoot.tsx index 011ac07cc4..734cc2011a 100644 --- a/packages/checkout/widgets-lib/src/widgets/on-ramp/OnRampWidgetRoot.tsx +++ b/packages/checkout/widgets-lib/src/widgets/on-ramp/OnRampWidgetRoot.tsx @@ -102,6 +102,7 @@ export class OnRamp extends Base { amount={this.parameters.amount} config={this.strongConfig()} showBackButton={this.parameters.showBackButton} + onrampConfig={this.properties.config} /> diff --git a/packages/checkout/widgets-lib/src/widgets/on-ramp/views/OnRampMain.tsx b/packages/checkout/widgets-lib/src/widgets/on-ramp/views/OnRampMain.tsx index 5f7b772c4d..af4e197117 100644 --- a/packages/checkout/widgets-lib/src/widgets/on-ramp/views/OnRampMain.tsx +++ b/packages/checkout/widgets-lib/src/widgets/on-ramp/views/OnRampMain.tsx @@ -42,6 +42,8 @@ interface OnRampProps { tokenAddress?: string; passport?: Passport; showBackButton?: boolean; + showMenu?: boolean; + customSubTitle?: string; } export function OnRampMain({ passport, @@ -49,6 +51,8 @@ export function OnRampMain({ tokenAmount, tokenAddress, showBackButton, + showMenu, + customSubTitle, }: OnRampProps) { const { connectLoaderState } = useContext(ConnectLoaderContext); const { checkout, provider } = connectLoaderState; @@ -236,6 +240,8 @@ export function OnRampMain({ tokenAddress, tokenAmount, passport, + showMenu, + customSubTitle, }; setWidgetUrl(await checkout.createFiatRampUrl(params));