Retail Order LWC

Namespace

The orderExtensionUtils LWC exposes events and methods to get the order state and extract data from the order, and push new data to the order.

1cgcloud

Supported Methods

Here are all the available methods in the orderExtensionUtils service component. You can import these methods in your custom LWC.

getOrderData

Get the order data.

API Version

59.0

Signature

getOrderData(recordId)

Example

1import { LightningElement, api } from 'lwc';
2import { getOrderData } from 'cgcloud/orderExtensionUtils';
3
4export default class CustomComponent extends LightningElement {
5  @api recordId;
6  initialOrderData = {};
7
8  connectedCallback() {
9    getOrderData(this.recordId).then((data) => {
10      this.initialOrderData = data;
11    });
12  }
13}

updateOrderData

Update the managed packaged Order sObject (Order__c) fields.

API Version

59.0

Signature

updateOrderData(recordId, srcThisRef, fieldApiName, value)

Example

1import { LightningElement, api } from 'lwc';
2import { getOrderData, updateOrderData } from 'cgcloud/orderExtensionUtils';
3
4export default class CustomComponent extends LightningElement {
5  @api recordId;
6  initialOrderData = {};
7
8  connectedCallback() {
9    getOrderData(this.recordId).then((data) => {
10      this.initialOrderData = data;
11    });
12  }
13
14  // You can invoke this method with the click of a button
15  updateOrderFieldValue() {
16    const fieldName = 'cgcloud__Delivery_Note__c';
17    const newValue = 'test-note';
18
19    updateOrderData(this.recordId, this, fieldName, newValue);
20  }
21}

getOrderItemData

Get the order item data.

API Version

59.0

Signature

getOrderItemData(recordId)

Example

1import { LightningElement, api } from 'lwc';
2import { getOrderItemData } from 'cgcloud/orderExtensionUtils';
3
4export default class CustomComponent extends LightningElement {
5  @api recordId;
6  initialOrderItemsData = [];
7
8  connectedCallback() {
9    getOrderItemData(this.recordId).then((data) => {
10      this.initialOrderItemsData = data;
11    });
12  }
13}

updateOrderItemData

Update the managed packaged Order Item sObject (Order_Item__c) fields.

API Version

59.0

Signature

updateOrderItemData(recordId, srcThisRef, itemId, fieldApiName, value)

Example

1import { LightningElement, api } from 'lwc';
2import { getOrderItemData, updateOrderItemData } from 'cgcloud/orderExtensionUtils';
3
4export default class CustomComponent extends LightningElement {
5  @api recordId;
6  initialOrderItemsData = [];
7
8  connectedCallback() {
9    getOrderItemData(this.recordId).then((data) => {
10      this.initialOrderItemsData = data;
11    });
12  }
13
14  updateOrderItemFieldData() {
15    const orderItemId = this.initialOrderItemsData[0].Id;
16    const fieldName = 'cgcloud__Discount__c';
17    const value = 9;
18
19    updateOrderItemData(this.recordId, this, orderItemId, fieldName, value);
20  }
21}

setCustomState

Sets a custom state for the order that is saved. Using the custom state, you can set up additional data to be saved along the order data in the same transaction as the order. This custom state gets forwarded to the Apex class that handles order save customizations.

API Version

59.0

Signature

setCustomState(recordId, customState)

Example

1import { LightningElement, api } from 'lwc';
2import { setCustomState } from 'cgcloud/orderExtensionUtils';
3
4export default class CustomComponent extends LightningElement {
5  @api recordId;
6
7  connectedCallback() {}
8
9  setOrderCustomState() {
10    setCustomState(this.recordId, {
11      customProp: 'Test'
12    });
13  }
14}

getIsOrderInEditMode

Check if the order is in the edit mode or read-only mode. Use this method to render custom LWC components in the read-only or edit mode.

API Version

59.0

Signature

getIsOrderInEditMode()

Example

1import { LightningElement, api, track } from 'lwc';
2import { getIsOrderInEditMode } from 'cgcloud/orderExtensionUtils';
3
4export default class CustomComponent extends LightningElement {
5  @api recordId;
6  @track isOrderInEditMode = false;
7
8  connectedCallback() {
9    this.isOrderInEditMode = getIsOrderInEditMode();
10  }
11}

registerListenerForOrderDataUpdates

Listen for the order data changes. Register a callback method, which gets invoked when an order field changes.

API Version

59.0

Signature

registerListenerForOrderDataUpdates(recordId, thisRef, callback)

Example

1import { LightningElement, api } from 'lwc';
2import {
3  getOrderData,
4  registerListenerForOrderDataUpdates
5} from 'cgcloud/orderExtensionUtils';
6
7export default class CustomComponent extends LightningElement {
8  @api recordId;
9  initialOrderData = {};
10  orderDataUpdates = {};
11
12  connectedCallback() {
13    getOrderData(this.recordId).then((data) => {
14      this.initialOrderData = data;
15    });
16    registerListenerForOrderDataUpdates(
17      this.recordId,
18      this,
19      this.handleOrderDataUpdates
20    );
21  }
22
23  handleOrderDataUpdates(fieldApiName, value) {
24    this.orderDataUpdates[fieldApiName] = value;
25  }
26}

registerOrderDataInlineValidator

Validate the order data changes. Register a callback method, which gets invoked when an order field changes. The method returns an error message if any validation fails.

API Version

59.0

Signature

registerOrderDataInlineValidator(recordId, thisRef, callback)

Example

1import { LightningElement, api } from 'lwc';
2import {
3  getOrderData,
4  registerOrderDataInlineValidator
5} from 'cgcloud/orderExtensionUtils';
6
7export default class CustomComponent extends LightningElement {
8  @api recordId;
9  initialOrderData = {};
10
11  connectedCallback() {
12    getOrderData(this.recordId).then((data) => {
13      this.initialOrderData = data;
14    });
15    registerOrderDataInlineValidator(
16      this.recordId,
17      this,
18      this.validateOrderDataChanges
19    );
20  }
21
22  validateOrderDataChanges(fieldName, value) {
23    switch (fieldName) {
24      case 'cgcloud__Invoice_Note__c':
25      case 'cgcloud__Delivery_Note__c':
26        return this.validateNoteFields(value);
27      default:
28        return '';
29    }
30  }
31
32  validateNoteFields(value) {
33    if (value && value.length > 100) {
34      return 'This text should be less than 100 characters';
35    }
36  }
37}

registerListenerForOrderItemDataUpdates

Listen for the order item data changes. Register a callback method, which gets invoked whenever any order item field changes.

API Version

59.0

Signature

registerListenerForOrderItemDataUpdates(recordId, thisRef, callback)

Example

1import { LightningElement, api } from 'lwc';
2import {
3  getOrderItemData,
4  registerListenerForOrderItemDataUpdates
5} from 'cgcloud/orderExtensionUtils';
6
7export default class CustomComponent extends LightningElement {
8  @api recordId;
9  initialOrderItemsData = [];
10
11  connectedCallback() {
12    getOrderItemData(this.recordId).then((data) => {
13      this.initialOrderItemsData = data;
14    });
15    registerListenerForOrderItemDataUpdates(
16      this.recordId,
17      this,
18      this.handleOrderItemDataUpdates
19    );
20  }
21
22  handleOrderItemDataUpdates(itemId, fieldApiName, value) {
23    const orderItem = this.initialOrderItemsData.find(
24      (_orderItem) => _orderItem.Id === itemId
25    );
26
27    orderItem[fieldApiName] = value;
28  }
29}

registerOrderItemDataInlineValidator

Validate the order item data changes. Register a callback method, which gets invoked whenever any order item field changes. The method returns an error message if any validation fails.

API Version

59.0

Signature

registerOrderItemDataInlineValidator(recordId, thisRef, callback)

Example

1import { LightningElement, api } from 'lwc';
2import {
3  getOrderItemData,
4  registerOrderItemDataInlineValidator
5} from 'cgcloud/orderExtensionUtils';
6
7export default class CustomComponent extends LightningElement {
8  @api recordId;
9  initialOrderItemsData = [];
10
11  connectedCallback() {
12    getOrderItemData(this.recordId).then((data) => {
13      this.initialOrderItemsData = data;
14    });
15    registerOrderItemDataInlineValidator(
16      this.recordId,
17      this,
18      this.validateOrderItemDataChanges
19    );
20  }
21
22  validateOrderItemDataChanges(itemId, fieldName, value) {
23    switch (fieldName) {
24      case 'Discount__c':
25        return this.validateDiscount(value);
26      default:
27        return '';
28    }
29  }
30
31  validateDiscount(value) {
32    if (value > 10) {
33      return 'Item discount should not be more than 10%';
34    }
35    return '';
36  }
37}

registerBeforeAddItemActionHandler

Register callbacks before adding items.

API Version

59.0

Signature

registerBeforeAddItemActionHandler(recordId, thisRef, callback)

Example

1import { LightningElement, api } from 'lwc';
2import {
3  getOrderData,
4  registerListenerForOrderDataUpdates,
5  registerBeforeAddItemActionHandler
6} from 'cgcloud/orderExtensionUtils';
7
8export default class CustomLWC extends LightningElement {
9  @api recordId;
10  initialOrderData = {};
11  orderDataUpdates = {};
12
13  connectedCallback() {
14    getOrderData(this.recordId).then((data) => {
15      this.initialOrderData = data;
16    });
17    registerListenerForOrderDataUpdates(
18      this.recordId,
19      this,
20      this.handleOrderDataUpdates
21    );
22    registerBeforeAddItemActionHandler(
23      this.recordId,
24      this,
25      this.handleBeforeAddItemCB
26    );
27  }
28
29  handleOrderDataUpdates(fieldApiName, value) {
30    this.orderDataUpdates[fieldApiName] = value;
31  }
32
33  handleBeforeAddItemCB(newOrderItems) {
34    const orderData = { ...this.initialOrderData, ...this.orderDataUpdates };
35
36    newOrderItems = newOrderItems.map((orderItem) => {
37      if (
38        orderData.cgcloud__Order_Account__r.Name === '*NTO Store #201' &&
39        orderItem['Product__r.Description_1__c'] === 'BBQ'
40      ) {
41        throw new Error("You can't add BBQ product");
42      }
43
44      orderItem.Quantity__c = 2;
45      orderItem.Number__c = 10;
46
47      return orderItem;
48    });
49  }
50}

registerBeforeSaveActionHandler

Register a callback before the save action.

API Version

59.0

Signature

registerBeforeSaveActionHandler(recordId, thisRef, callback)

Example

1import { LightningElement, api } from 'lwc';
2import {
3  getOrderData,
4  registerBeforeSaveActionHandler
5} from 'cgcloud/orderExtensionUtils';
6
7export default class CustomLWC extends LightningElement {
8  @api recordId;
9  initialOrderData = {};
10
11  connectedCallback() {
12    getOrderData(this.recordId).then((data) => {
13      this.initialOrderData = data;
14    });
15    registerBeforeSaveActionHandler(
16      this.recordId,
17      this,
18      this.handleBeforeSaveCB
19    );
20  }
21
22  handleBeforeSaveCB(savePayload) {
23    const {
24      orderItemsToBeUpserted: orderItems,
25      updatedOrder: orderData
26    } = savePayload;
27
28    for (let i = 0; i < orderItems.length; i++) {
29      const orderItem = orderItems[i];
30
31      if (orderItem.cgcloud__Quantity__c > 90) {
32        throw new Error("Order Item Quantity shouldn't be more than 90");
33      }
34    }
35
36    let headerDiscount = orderData.cgcloud__Header_Discount_Percentage__c;
37    headerDiscount = headerDiscount && Number(headerDiscount);
38
39    if (headerDiscount && headerDiscount > 15) {
40      throw new Error("Header discount can't be greater than 15");
41    }
42
43    let deliveryDate = orderData.cgcloud__Delivery_Date__c;
44
45    if (deliveryDate) {
46      deliveryDate = new Date(deliveryDate);
47      deliveryDate.setDate(deliveryDate.getDate() + 1);
48      orderData.cgcloud__Delivery_Date__c = deliveryDate;
49    }
50  }
51}

registerListenerForEnablingOrDisablingEditMode

Register a callback for the edit action. Render the custom LWC component in the read-only or edit mode.

API Version

59.0

Signature

registerListenerForEnablingOrDisablingEditMode(recordId, thisRef, callback)

Example

1import { LightningElement, api, track } from 'lwc';
2import {
3  getOrderData,
4  registerListenerForEnablingOrDisablingEditMode
5} from 'cgcloud/orderExtensionUtils';
6
7export default class CustomLWC extends LightningElement {
8  @api recordId;
9  @track isOrderInEditMode = false;
10  initialOrderData = {};
11
12  connectedCallback() {
13    getOrderData(this.recordId).then((data) => {
14      this.initialOrderData = data;
15    });
16    registerListenerForEnablingOrDisablingEditMode(
17      this.recordId,
18      this,
19      (isOrderInEditMode) => {
20        this.isOrderInEditMode = isOrderInEditMode;
21      }
22    );
23  }
24}

When setting the runtimeNamespace property in the metadata file, your component can’t use modules from the @salesforce package (any import whose route starts with @salesforce).