diff --git a/packages/checkout/sdk/src/widgets/definitions/parameters/sale.ts b/packages/checkout/sdk/src/widgets/definitions/parameters/sale.ts index 9140bcaf89..a5385448de 100644 --- a/packages/checkout/sdk/src/widgets/definitions/parameters/sale.ts +++ b/packages/checkout/sdk/src/widgets/definitions/parameters/sale.ts @@ -24,6 +24,8 @@ export type SaleWidgetParams = { language?: WidgetLanguage; /** The disabled payment types */ excludePaymentTypes?: SalePaymentTypes[]; + /** Preferred currency, replacing the backend's base currency */ + baseCurrencyOverride?: string; }; /** diff --git a/packages/checkout/widgets-lib/src/widgets/sale/SaleWidget.tsx b/packages/checkout/widgets-lib/src/widgets/sale/SaleWidget.tsx index 4f462051b4..45b23083f4 100644 --- a/packages/checkout/widgets-lib/src/widgets/sale/SaleWidget.tsx +++ b/packages/checkout/widgets-lib/src/widgets/sale/SaleWidget.tsx @@ -60,8 +60,10 @@ export default function SaleWidget(props: SaleWidgetProps) { environmentId, collectionName, excludePaymentTypes, + baseCurrencyOverride, waitFulfillmentSettlements = true, } = props; + const { connectLoaderState } = useContext(ConnectLoaderContext); const { checkout, provider } = connectLoaderState; const chainId = useRef(); @@ -124,6 +126,7 @@ export default function SaleWidget(props: SaleWidgetProps) { passport: checkout?.passport, collectionName, excludePaymentTypes, + baseCurrencyOverride, waitFulfillmentSettlements, }} > diff --git a/packages/checkout/widgets-lib/src/widgets/sale/SaleWidgetRoot.tsx b/packages/checkout/widgets-lib/src/widgets/sale/SaleWidgetRoot.tsx index c8745f0487..3036bc6d1f 100644 --- a/packages/checkout/widgets-lib/src/widgets/sale/SaleWidgetRoot.tsx +++ b/packages/checkout/widgets-lib/src/widgets/sale/SaleWidgetRoot.tsx @@ -128,6 +128,7 @@ export class Sale extends Base { environmentId={this.parameters.environmentId!} collectionName={this.parameters.collectionName!} excludePaymentTypes={this.parameters.excludePaymentTypes!} + baseCurrencyOverride={this.parameters.baseCurrencyOverride!} language="en" waitFulfillmentSettlements={this.properties?.config?.waitFulfillmentSettlements ?? true} /> diff --git a/packages/checkout/widgets-lib/src/widgets/sale/context/SaleContextProvider.tsx b/packages/checkout/widgets-lib/src/widgets/sale/context/SaleContextProvider.tsx index 9377fd82dc..f29006f063 100644 --- a/packages/checkout/widgets-lib/src/widgets/sale/context/SaleContextProvider.tsx +++ b/packages/checkout/widgets-lib/src/widgets/sale/context/SaleContextProvider.tsx @@ -44,6 +44,7 @@ type SaleContextProps = { checkout: ConnectLoaderState['checkout']; passport?: Passport; excludePaymentTypes: SalePaymentTypes[]; + baseCurrencyOverride?: string; waitFulfillmentSettlements: boolean; }; @@ -115,6 +116,7 @@ const SaleContext = createContext({ orderQuote: defaultOrderQuote, signTokenIds: [], excludePaymentTypes: [], + baseCurrencyOverride: undefined, selectedCurrency: undefined, waitFulfillmentSettlements: true, }); @@ -140,6 +142,7 @@ export function SaleContextProvider(props: { passport, collectionName, excludePaymentTypes, + baseCurrencyOverride, waitFulfillmentSettlements, }, } = props; @@ -182,6 +185,7 @@ export function SaleContextProvider(props: { provider, environmentId, environment: config.environment, + baseCurrencyOverride, }); const fromTokenAddress = selectedCurrency?.address || ''; diff --git a/packages/checkout/widgets-lib/src/widgets/sale/hooks/useQuoteOrder.ts b/packages/checkout/widgets-lib/src/widgets/sale/hooks/useQuoteOrder.ts index efec8a7eea..a8f478a5ae 100644 --- a/packages/checkout/widgets-lib/src/widgets/sale/hooks/useQuoteOrder.ts +++ b/packages/checkout/widgets-lib/src/widgets/sale/hooks/useQuoteOrder.ts @@ -12,6 +12,7 @@ type UseQuoteOrderParams = { environmentId: string; environment: Environment; provider: Web3Provider | undefined; + baseCurrencyOverride?: string; }; export const defaultOrderQuote: OrderQuote = { @@ -33,6 +34,7 @@ export const useQuoteOrder = ({ environment, environmentId, provider, + baseCurrencyOverride, }: UseQuoteOrderParams) => { const [selectedCurrency, setSelectedCurrency] = useState< OrderQuoteCurrency | undefined @@ -108,7 +110,12 @@ export const useQuoteOrder = ({ // Set default currency if (orderQuote.currencies.length === 0) return; - const defaultSelectedCurrency = orderQuote.currencies.find((c) => c.base) + const preferredCurrency = baseCurrencyOverride + ? orderQuote.currencies.find((c) => c.name === baseCurrencyOverride) + : undefined; + + const defaultSelectedCurrency = preferredCurrency + || orderQuote.currencies.find((c) => c.base) || orderQuote.currencies?.[0]; setSelectedCurrency(defaultSelectedCurrency); diff --git a/packages/checkout/widgets-sample-app/src/components/ui/sale/sale.tsx b/packages/checkout/widgets-sample-app/src/components/ui/sale/sale.tsx index 59b2a5c60a..866b2611d2 100644 --- a/packages/checkout/widgets-sample-app/src/components/ui/sale/sale.tsx +++ b/packages/checkout/widgets-sample-app/src/components/ui/sale/sale.tsx @@ -80,12 +80,15 @@ const useParams = () => { const multicurrency = urlParams.get("multicurrency") === "true"; + const baseCurrencyOverride = urlParams.get("baseCurrencyOverride") as string ?? undefined; + return { login, environmentId, collectionName, excludePaymentTypes, multicurrency, + baseCurrencyOverride, }; }; @@ -125,6 +128,7 @@ export function SaleUI() { collectionName, excludePaymentTypes, multicurrency, + baseCurrencyOverride, } = params; const [passportConfig, setPassportConfig] = useState( JSON.stringify(defaultPassportConfig, null, 2) @@ -177,11 +181,11 @@ export function SaleUI() { // mount sale widget and subscribe to close event useEffect(() => { saleWidget.mount("sale", { - environmentId, collectionName, items: defaultItems, excludePaymentTypes, + baseCurrencyOverride, }); saleWidget.addListener(SaleEventType.CLOSE_WIDGET, () => { saleWidget.unmount(); @@ -283,6 +287,7 @@ export function SaleUI() { collectionName, items: defaultItems, excludePaymentTypes, + baseCurrencyOverride, }) } >