feat:[CM-661][Sale Widget] Introduce a base currency override param t…

…o Primary Sales (#1800)
immutable · May 21, 2024 · 2ff1ac5 · 2ff1ac5
1 parent f2b58f6
commit 2ff1ac5
Show file tree

Hide file tree

Showing 6 changed files with 24 additions and 2 deletions.
diff --git 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 */
+  preferredCurrency?: string;
 };
 
 /**

diff --git 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,
+    preferredCurrency,
     waitFulfillmentSettlements = true,
   } = props;
+
   const { connectLoaderState } = useContext(ConnectLoaderContext);
   const { checkout, provider } = connectLoaderState;
   const chainId = useRef<ChainId>();
@@ -124,6 +126,7 @@ export default function SaleWidget(props: SaleWidgetProps) {
           passport: checkout?.passport,
           collectionName,
           excludePaymentTypes,
+          preferredCurrency,
           waitFulfillmentSettlements,
         }}
       >

diff --git 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<WidgetType.SALE> {
                   environmentId={this.parameters.environmentId!}
                   collectionName={this.parameters.collectionName!}
                   excludePaymentTypes={this.parameters.excludePaymentTypes!}
+                  preferredCurrency={this.parameters.preferredCurrency!}
                   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
@@ -44,6 +44,7 @@ type SaleContextProps = {
   checkout: ConnectLoaderState['checkout'];
   passport?: Passport;
   excludePaymentTypes: SalePaymentTypes[];
+  preferredCurrency?: string;
   waitFulfillmentSettlements: boolean;
 };
 
@@ -115,6 +116,7 @@ const SaleContext = createContext<SaleContextValues>({
   orderQuote: defaultOrderQuote,
   signTokenIds: [],
   excludePaymentTypes: [],
+  preferredCurrency: undefined,
   selectedCurrency: undefined,
   waitFulfillmentSettlements: true,
 });
@@ -140,6 +142,7 @@ export function SaleContextProvider(props: {
       passport,
       collectionName,
       excludePaymentTypes,
+      preferredCurrency,
       waitFulfillmentSettlements,
     },
   } = props;
@@ -182,6 +185,7 @@ export function SaleContextProvider(props: {
     provider,
     environmentId,
     environment: config.environment,
+    preferredCurrency,
   });
 
   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
@@ -12,6 +12,7 @@ type UseQuoteOrderParams = {
   environmentId: string;
   environment: Environment;
   provider: Web3Provider | undefined;
+  preferredCurrency?: string;
 };
 
 export const defaultOrderQuote: OrderQuote = {
@@ -33,6 +34,7 @@ export const useQuoteOrder = ({
   environment,
   environmentId,
   provider,
+  preferredCurrency,
 }: 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 baseCurrencyOverride = preferredCurrency
+      ? orderQuote.currencies.find((c) => c.name === preferredCurrency)
+      : undefined;
+
+    const defaultSelectedCurrency = baseCurrencyOverride
+      || 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
@@ -80,12 +80,15 @@ const useParams = () => {
 
   const multicurrency = urlParams.get("multicurrency") === "true";
 
+  const preferredCurrency = urlParams.get("preferredCurrency") as string ?? undefined;
+
   return {
     login,
     environmentId,
     collectionName,
     excludePaymentTypes,
     multicurrency,
+    preferredCurrency,
   };
 };
 
@@ -125,6 +128,7 @@ export function SaleUI() {
     collectionName,
     excludePaymentTypes,
     multicurrency,
+    preferredCurrency,
   } = 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,
+      preferredCurrency,
     });
     saleWidget.addListener(SaleEventType.CLOSE_WIDGET, () => {
       saleWidget.unmount();
@@ -283,6 +287,7 @@ export function SaleUI() {
             collectionName,
             items: defaultItems,
             excludePaymentTypes,
+            preferredCurrency,
           })
         }
       >