For discussing the development and usage of Checkout UI extensions, post-purchase extensions, web pixels, Customer Accounts UI extensions, and POS UI extensions
Hi, I am working on a project developing a checkout ui extension for pre-purchase. I am wondering is there any way to apply a discount to the new added item. I am following the example https://shopify.dev/docs/apps/checkout/product-offers/pre-purchase/getting-started,
const result = await applyCartLinesChange({ type: 'addCartLine', merchandiseId: variants.nodes[0].id, quantity: 1, });
I want to apply some discount to the new added item as a pre-purchase upsell.
In post purchase extension, I can pass discount object.
/** Requests a variant to be added to the initial purchase. */ interface AddVariantChange { /** A fixed value of "add_variant". */ type: 'add_variant'; /** The product variant to add. */ variantId: number; /** The quantity of the specified variant. */ quantity: number; /** Refer to [ExplicitDiscount](/api/checkout-extensions/extension-points/api#explicitdiscount). */ discount?: ExplicitDiscount; }
But I can not find similar thing in `useApplyCartLinesChange` hook.
Thanks.
Hi Caoyuanqi,
As you may have discovered, for the pre-purchase phase of the checkout UI extension, there is no built-in mechanism to directly apply discounts to the new added items with the `useApplyCartLinesChange` hook provided by the Shopify App Bridge React library. However, you should still be able to achieve this by implementing it manually in your extension.
The general process to apply a discount to a newly added item as a pre-purchase upsell would be:
1. Calculate the discounted price: Determine the discounted price for the item based on your specific logic or rules. This could involve applying a percentage or fixed discount, or any other custom calculation.
2. Modify the line item: Update the `price` or `totalPrice` of the line item within the `useApplyCartLinesChange` hook's callback function to reflect the discounted price. You can access and modify the line item's properties within the `cartLinesChange` callback.
Hope this helps!
Liam | Developer Advocate @ Shopify
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- To learn more visit Shopify.dev or the Shopify Web Design and Development Blog
Hi @Liam, thanks for your answer. I tried the approach that you suggested but cannot find a way to update the `price` or `totalPrice` in the callback function. The only properties that I can change according to merchandise ID, quantity, attributes and sellingPlanID. Could you give some more information your suggestion?
```
```
Thanks!
Hi folks, I'm looking to update the line total too using applyCartLinesChange.
@Liam - is it possible to influence the cart line total?
@Liam for point number 2, can you please give an example of how we could modify the 'price' and 'totalPrice' via 'useApplyCartLinesChange'?