Checkout summary component

Learn how to use the Checkout summary component

Note: The information in this section applies to both the drb2b_checkoutSummary component (Aura only) and the drb2b_checkoutSummary_LWR component (LWR only).

Use the drb2b_checkouSummary component to display the detailed amounts on the cart to the shopper. You can configure this component in the experience builder or flow.

You can publish an event to reload the checkout summary component. Depending on your flow, reloading the component using an event may be required.

Publish the Checkout summary component events

Complete the following tasks to publish various event types. The event purpose and payload will vary depending on the use case.

Import DigitalRiverMessageChannel__c message channel and message service into a custom JavaScript file, as shown below.

Import example

import dr_lms from "@salesforce/messageChannel/digitalriverv3__DigitalRiverMessageChannel__c";

import {publish, MessageContext } from "lightning/messageService";

Declare the message context variable as shown below.

Declare variable example

@wire(MessageContext) messageContext;

Publish the event.

Event publishing example

publish(this.messageContext, dr_lms, { 
                    purpose: '<purpose>',           
                    payload: '<payload>'            
                });

Refer to the following table for more information on the Checkout summary component events.

Event purpose	Event payload example	Description
reloadCheckoutSummary	{"isShow":true}	Publish this event to show {"isShow":true} or hide {"isShow":false} the Checkout summary component.

Replace the Checkout Summary component

Consider the following suggestions if you want to replace your drb2b_checkoutSummary component rather than customizing the provided component.

Use the Checkout Summary component to query data from the WebCart object. The fields in the component use and display information such as taxes, fees, total, etc. The following table describes the fields used by the provided component.

WebCart field	UI Label	Designer attributes
DR_Total_IOR_Tax__c	IOR tax	Show IOR tax
GrandTotalAmount - DR_Total_Fees__c - DR_Total_IOR_Tax__c -DR_Total_Duty__c	Subtotal	N/A
TotalTaxAmount	Tax	Show Tax
GrandTotalAmount	Grand Total	N/A
TotalChargeAmount	Shipping	Show Shipping
DR_Total_Fees__c	Fee	Show Regulatory Fee
DR_Total_Duty__c	Duty	Show Duty

Your component needs to listen for updates in tax calculation. In LWR, implement both the CheckoutInformationAdapter and subscribe to the refreshCalculateTax event. See tax calculation for more information. The firing of this event can be used to indicate that the tax has been recalculated. On receiving this event, use the component to refresh its display with the latest data from the WebCart object.

If you use regulatory fees in your application, you can make an additional query to the DR_regulatory_fee__c object to get individual fee information and display it in your UI.

You can query the following fields available from the DR_Regulatory_Fee__c object:

• Fee_Type__c

• Name

• Amount__c

• Cart_Item_Id__c