How to Exclude Stages in LWC Path?

Question

I need to exclude certain stages, such as “Awaiting Approval” and “Contract Acceptance,” from the Path in a custom LWC component based on the value of a field (acceptance). How can I achieve this?

Answer

To fix the error and achieve conditional exclusion of the “Awaiting Approval” and “Contract Acceptance” stages, you should first use Array.filter() to exclude the unwanted stages based on the condition and then use Array.map() to process the remaining items. The reason this works is that map() requires every iteration to return a value, and using filter() ensures that only the stages you want to include will pass through for mapping.

Here is the modified solution:

import { LightningElement, wire, api } from "lwc";
import { getObjectInfo, getPicklistValues } from "lightning/uiObjectInfoApi";
import MY_OBJECT from "@salesforce/schema/My_Object__c";
import MY_OBJECT_STATUS from "@salesforce/schema/My_Object__c.Status__c";

export default class RegistryTransferPath extends LightningElement {
  @api objectApiName;
  @api recordId;
  stageOptions;
  status = MY_OBJECT_STATUS;
  acceptance = "Enabled";  // Assuming this is dynamically set

  currentStep = "slds-path__item slds-is-current";
  completeStep = "slds-path__item slds-is-active";
  incompleteStep = "slds-path__item slds-is-incomplete";

  @wire(getObjectInfo, { objectApiName: MY_OBJECT })
  registryTransfer;

  @wire(getPicklistValues, {
    recordTypeId: "$myObject.data.defaultRecordTypeId",
    fieldApiName: MY_OBJECT_STATUS
  })
  picklistValues({ data }) {
    if (data) {
      let increment = 1;
      const isAcceptanceEnabled = this.acceptance === "Enabled";
      
      this.stageOptions = data.values
        .filter((item) => isAcceptanceEnabled || (item.value !== "Awaiting Approval" && item.value !== "Contract Acceptance"))
        .map((item) => {
          return {
            position: increment++,
            value: item.value,
            pathStatus: this.incompleteStep,
            tickIcon: false
          };
        });
    }
  }
}

Explanation:

1. filter(): This method is used to exclude the stages “Awaiting Approval” and “Contract Acceptance” when the acceptance field is not "Enabled". The filter condition checks if the acceptance field is "Enabled" or if the stage is not one of the two stages to be excluded.
2. map(): Once the unwanted stages are filtered out, map() is applied to the remaining items to create the necessary structure for displaying the Path component.

By filtering the stages first, we ensure that only the relevant stages are passed to map(), and no stages are skipped, preventing the error caused by a return statement missing in the map() function.
This approach efficiently handles the exclusion and mapping while adhering to best practices.

Real-Time Project-Based Salesforce Course to Kick Start Your Career

Our Salesforce Course is designed to provide you with a deep understanding of the Salesforce platform, equipping you with the essential skills to succeed in the CRM field. The program covers important modules such as Salesforce Admin, Developer, and AI, blending theory with hands-on practice. You’ll gain practical experience through real-world projects and assignments, enabling you to solve complex business challenges using Salesforce solutions. Our expert instructors ensure that you gain both technical proficiency and relevant industry knowledge to thrive within the Salesforce ecosystem.

Beyond technical skills, our Salesforce training in Mumbai offers personalized mentorship, exam preparation, and interview coaching to enhance your career prospects. You’ll have access to comprehensive study materials, live project experience, and dedicated support throughout your learning journey. Upon completing the course, you’ll be fully prepared for certification exams and equipped with the problem-solving skills that employers seek. Start your Salesforce journey with us and unlock a world of career opportunities. Enroll for a Free Demo now!