Communicate Between Unrelated LWC Components- Lightning Message Service (LMS)

LMS is a publish and subscribe service that helps communicating between LWC, Aura components, and Visualforce pages. 

In this, first we have to defined channels called as messaging channel to define attributes through which we can publish information. Both the components (publisher and subscriber) needs to import this channel. Consider message channel as protocol through which information will be shared between 2 components.

In order to define messaging channel, you have create a folder named as "messageChannels" under default folder in VS code.

Now create a new file named as "enquiry_sender.messageChannel-meta.xml". You can give any name to file but make sure that it has extension as ".messageChannel-meta.xml".

In this xml file you define, lightningMessageFields and its description. These fields names will be used to used information from one component to another.

Note: 

If you are getting a validation error for the XML, then turn XML validation off.

In VS Code, click File > Preferences > Settings (Windows) or Code > Settings > Settings (macOS). Search for Validation. Select XML and uncheck Validation.

Now we have defined a message channel, lets use it to publish and subscriber message.

Publish LMS

In order to publish message using this channel, we need to import LMS and channel that we created

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

import SEND_ENQUIRY_CHANNEL from '@salesforce/messageChannel/Enquiry_Sender__c';

Use below syntax to publish the LMS:

    @wire(MessageContext)

    messageContext;

    const payload = {

            email: 'sk@gmail.com',

            phone: '0123456789'

          };

          console.log('***payload:'+JSON.stringify(payload));

          publish(this.messageContext, SEND_ENQUIRY_CHANNEL, payload);

Subscribe LMS

In order to subscribe LMS, subscribing also need to import LMS and channel that we have been created for communication.

import { subscribe, MessageContext } from 'lightning/messageService';

import SEND_ENQUIRY_CHANNEL from '@salesforce/messageChannel/Enquiry_Sender__c';

Use below syntax to subscribe LMS:

    @wire(MessageContext)

    messageContext;

    subscribeToLMS() {

        this.subscription = subscribe(

        this.messageContext,

        SEND_ENQUIRY_CHANNEL,

        (message) => this.handleMessage(message)

        );

    }

    handleMessage(message) {

        console.log('**recieved message:'+JSON.stringify(message));

    }

    connectedCallback() {

        this.subscribeToLMS();

    }

In this way information can be passed between 2 LWC components which are not related to each other.

I have created 2 LWC components for demo purpose to show how it works. In first LWC component (userEnquiry), we take email and phone from user and when he clicks on send button, a message is published. Now we have another LWC component (contactCheck) which will subscribe to send_enquiry__c channel. 

So whenever first component will publish message, another LWC component will display information send by first component.

Below is complete code for reference:

	<template>
	<lightning-card title="Subscriber Component">
	<div style="background-color:#a3ce98;border-style: solid;margin:5%;padding:2%;">
	<p>This component is using LMS framework to subscribe message</p>
	<div style="background-color:#7ff6f6;border-style: solid;padding:2%;">
	<p>Email-<b>{conEmail}</b></p>
	</div>
	<div style="background-color:#7ff6f6;border-style: solid;padding:2%;">
	<p>Phone-<b>{conPhone}</b></p>
	</div>
	</div>
	</lightning-card>
	</template>

view raw contactCheck.html hosted with ❤ by GitHub

	import { LightningElement,wire,track } from 'lwc';
	import { subscribe, MessageContext } from 'lightning/messageService';
	import SEND_ENQUIRY_CHANNEL from '@salesforce/messageChannel/Enquiry_Sender__c';
	export default class ContactCheck extends LightningElement {
	@track conEmail;
	@track conPhone;
	@wire(MessageContext)
	messageContext;
	subscribeToLMS() {
	this.subscription = subscribe(
	this.messageContext,
	SEND_ENQUIRY_CHANNEL,
	(message) => this.handleMessage(message)
	);
	}
	handleMessage(message) {
	console.log('**message:'+JSON.stringify(message));
	this.conEmail=message.email;
	this.conPhone=message.phone;
	}
	connectedCallback() {
	this.subscribeToLMS();
	}
	}

view raw contactCheck.js hosted with ❤ by GitHub

	<?xml version="1.0" encoding="UTF-8"?>
	<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
	<apiVersion>58.0</apiVersion>
	<isExposed>true</isExposed>
	<targets>
	<target>lightning__AppPage</target>
	</targets>
	</LightningComponentBundle>

view raw contactCheck.js-meta.xml hosted with ❤ by GitHub

	<?xml version="1.0" encoding="UTF-8" ?>
	<LightningMessageChannel xmlns="http://soap.sforce.com/2006/04/metadata">
	<masterLabel>EnquirySender</masterLabel>
	<isExposed>true</isExposed>
	<description>Message Channel to pass user email Id</description>
	<lightningMessageFields>
	<fieldName>email</fieldName>
	<description>Specify the email</description>
	</lightningMessageFields>
	<lightningMessageFields>
	<fieldName>phone</fieldName>
	<description>Specify the user email</description>
	</lightningMessageFields>
	</LightningMessageChannel>

view raw enquiry_sender.messageChannel-meta.xml hosted with ❤ by GitHub

	<template>
	<lightning-card title="Publisher Component">
	<div style="background-color:#E6E6FA;border-style: solid;margin:5%;padding:2%;">
	<p>This component is using LMS framework to publish message</p>
	<div style="padding:2%;">
	<lightning-input name="uEmail" type="email" label="Enter Email" value={userEmail}
	required=true onchange={onChangeHandler} variant="label-inline"></lightning-input>
	<lightning-input name="uPhone" type="tel" label="Enter Phone" value={userPhone}
	required=true onchange={onChangeHandler} variant="label-inline"></lightning-input>
	<lightning-button label="Send" onclick={sendUserInputToSubscriber}></lightning-button>
	</div>
	</div>
	</lightning-card>
	</template>

view raw userEnquiry.html hosted with ❤ by GitHub

	import { LightningElement,wire,track } from 'lwc';
	import { publish, MessageContext } from 'lightning/messageService';
	import SEND_ENQUIRY_CHANNEL from '@salesforce/messageChannel/Enquiry_Sender__c';
	export default class UserEnquiry extends LightningElement {
	@track userEmail;
	@track userPhone;
	@wire(MessageContext)
	messageContext;
	//syntax to publish
	sendUserInputToSubscriber(){
	const payload = {
	email: this.userEmail,
	phone: this.userPhone
	};
	console.log('***payload:'+JSON.stringify(payload));
	publish(this.messageContext, SEND_ENQUIRY_CHANNEL, payload);
	}
	onChangeHandler(event){
	const inputValue = event.target.value;
	const inputTarget = event.target.name;
	console.log('****onChangeHandler called**inputTarget-inputValue:'+inputTarget+'-'+inputValue);
	if(inputTarget=='uEmail'){
	this.userEmail= inputValue;
	}if(inputTarget=='uPhone'){
	this.userPhone= inputValue;
	}
	}
	}

view raw userEnquiry.js hosted with ❤ by GitHub

	<?xml version="1.0" encoding="UTF-8"?>
	<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
	<apiVersion>58.0</apiVersion>
	<isExposed>true</isExposed>
	<targets>
	<target>lightning__AppPage</target>
	</targets>
	</LightningComponentBundle>

view raw userEnquiry.js-meta.xml hosted with ❤ by GitHub

Note:

LMS is powerful, effective, and easy to use, but use it only if it is necessary. Firing DOM events is much more efficient and should be first preference.

Hope this will help!!

Lifecycle Hooks in LWC (Lightning Web Components)

 A lifecycle hook is a callback method which is called automatically at a specific phase of a component lifecycle. These are managed by LWC framework. These hooks get called at different phases like initialization of components, when elements gets inserted in DOM or removed from DOM, rendering of components based on property changes etc.

Lets go through different lifecycle hooks:

constructor()

• Whenever component is created, this function gets called.
• This hook flows from parent to child, which means that it fires in the parent first.
• As child element do not exist, you cannot access them.
• Properties are mainly assigned to component after constructor() and before connectedCallback()
• If you define constructor() callback then you should always super() from constructor(). This is because every LWC component extends LightningElement and since LightningElement has its own constructor, so we should first invoke the parent constructor.

import { LightningElement } from 'lwc'
export default class ConstructorCallbackExample extends LightningElement{
	constructor(){
		super();
	}
}

connectedCallback()

• When the element is inserted into a document, this function gets called.
• This hook flows also from parent to child. So you can’t access child elements because they don’t exist yet.
• Properties are assigned to component so this callback can be used to perform or fetch initial data set.
• If you manipulate the elements means adding or removing element from component, then connectedCallback() will fire more than once. So always put some checks if you don’t want to run particular logic everytime.
• connectedCallback() can be used to Subscribe and Unsubscribe from a Message Channel.

import { LightningElement } from 'lwc'
export default class ConnectedCallbackExample extends LightningElement{
	connectedCallback(){
		console.log('***connected callback is called');
	}
}

renderedCallback()

• renderedCallback() gets called after every render of component. Whenever value of reactive component changes, component get rendered.
• renderedCallback() is specific to LWC and it has no dependency in HTML custom elements specifications.
• renderedCallback() flows from child to parent.
• Remember, updating state of component can cause infinite loop. So don’t update a public property or field in renderedCallback(). If you perform changes to reactive attributes, guard them or they can trigger wasteful rerenders or an infinite rendering loop.
• Also don’t update a wire adapter configuration object property in renderedCallback(). 

disconnectedCallback()

• Whenever an element is removed from DOM, then disconnectedCallback() is called.
• This hook flows from parent to child.
• Use disconnectedCallback() to clean up work done in the connectedCallback(), like purging caches or removing event listeners or unsubscribe from a message channel.

import { LightningElement } from 'lwc'
export default class disconnectedCallbackExample extends LightningElement{
	disconnectedCallback(){
    	console.log('**** disconnectedCallback is called');
    }
}

render()

• If there is need to display different UI to end user based on some conditions, then we can have 2 different HTML files and decide which HTML file to render based on conditions.
• Render() may be called before or after connectedCallback().
• Imagine that you have a component that can be rendered in two different ways but you don’t want to mix the HTML in one file. Create multiple HTML files in the component bundle. Import them both and add a condition in the render() method to return the correct template depending on the component’s state.
• Although it’s possible for a component to render multiple templates, it is recommended to use  lwc:if|elseif|else directives to render nested templates conditionally instead.

import { LightningElement } from "lwc";
import templateOne from "./templateOne.html";
import templateTwo from "./templateTwo.html";
export default class MiscMultipleTemplates extends LightningElement {
  showTemplateOne = true;
  render() {
    return this.showTemplateOne ? templateOne : templateTwo;
  }
  switchTemplate() {
    this.showTemplateOne = !this.showTemplateOne;
  }
}

errorCallback(error, stack)

• The errorCallback(error, stack) hook is called when the component throws an error.
• The error argument is a JavaScript native error object, and the stack argument is a string.
• This method works like a JavaScript catch{} block for catching errors.
• The errorCallback() is unique to Lightning Web Components. Implement it to create an error boundary component that captures errors in all the descendent components in its tree. It captures errors that occur in the descendant's lifecycle hooks or during an event handler declared in an HTML template. errorCallback() catches errors that occurs in the descendant components but not itself. You can code the error boundary component to log stack information and render an alternative view to tell users what happened and what to do next

import { LightningElement } from "lwc";
export default class ErrorCallbackExample extends LightningElement {
  error;
  stack;
  errorCallback(error, stack) {
    this.error = error;
  }
}

Hope this will help!!

Communicate from Parent to Child Component in LWC

There are few scenarios where we need to pass property/values from parent component to child component in LWC. There are different ways to achieve this:

• Using @api decorator (public property)

The @api decorator in the child component makes property as public, which can be utilised by parent component to update it. So whenever you add child component in parent component, then specify child public property as an attribute and pass the value from parent component property. 

For example, Child component contains public property "passedUrl" with @api decorator

-----------childComponent.html--------------------

<template>
    <div style="background-color:#b2b689;border-style: solid;">
        <b>Child component</b>
	<p>URL passed from parent-<b>{passedUrl}</b></p>
    </div>
</template>

--------childComponent.js---------------------

import { LightningElement,api} from 'lwc';
export default class SkChildComponent extends LightningElement {
    @api passedUrl;    
}

Now if you have to pass value to "passedUrl" property from parent component then just specify attribute as property name and pass any value from parent component property.

--------parentComponent.html---------------------

<template>
    <lightning-card  title="Communicate from Parent to Child">
        <div style="background-color:#E6E6FA;border-style: ">
            <b>This is parent Component</b>            
            <c-child-component passed-url={selResourceURL} >
            </c-child-component> 
        </div>
	</lightning-card> 
</template>

--------parentComponent.js---------------------

import { LightningElement,track } from 'lwc';
export default class SkParentContainerCmp extends LightningElement {
	@track selResourceURL='https://www.sfdcstuff.com/';
}

• Using getter setter property in child component

you can define @api property with separate getter setter defined. Whenever the value of this property changes from parent component, your setter method for that property will always get called. Now you can define your custom logic if you have and then utilise that in child component.

--------childComponent.js---------------------

import { LightningElement,api,track } from 'lwc';
export default class SkChildComponent extends LightningElement {
    @track _userInputNumber;
    @api
    get userInputNumber(){
        return this._userInputNumber;
    }
    set userInputNumber(value){
        //write your logic to set any property
        this._userInputNumber=value;
    }
}

• By accessing child function from parent component

You can decorate the function defined in child component with @api. Now parent component can access this public function. By using this method, you can invoke function defined in child component.

Suppose you have defined below function in child component:

@api
increaseCounter(){
   //your logic
}

Now from parent component you can access this function by using below syntax:

this.template.querySelector('c-child-component').increaseCounter();

I have created parent and child component to explain how this communication from parent to child component happen. Please find below complete code snippet and components snapshot:

Complete Code

	<template>
	<div style="background-color:#b2b689;border-style: solid;padding:2%;">
	<b>Child component</b>
	<div style="background-color:#7ff6f6;border-style: solid;padding:2%;">
	<p>Getting value from parent using public property @api decorator</p>
	<p>URL passed from parent-<b>{passedUrl}</b></p>
	</div>
	<div style="background-color:#7ff6f6;border-style: solid;padding:2%;">
	<p>Call a public function on the child</p>
	<p>increase counter by 10 from parent-<b>{counter}</b></p>
	</div>
	<div style="background-color:#7ff6f6;border-style: solid;padding:2%;">
	<p>Use a Public Getter and Setter</p>
	<p>Square of Captured Input from parent-<b>{squareValue}</b></p>
	</div>
	</div>
	</template>

view raw skChildComponent.html hosted with ❤ by GitHub

	import { LightningElement,api,track } from 'lwc';
	export default class SkChildComponent extends LightningElement {
	@api passedUrl;
	@track counter=0;
	@track squareValue;
	@api
	increaseCounterbyTen(){
	console.log('****increaseCounterbyTen called');
	this.counter += 10;
	}
	@api
	get userInputNumber(){
	return this.squareValue;
	}
	set userInputNumber(value){
	console.log('****userInputNumber setter get called-value:'+value);
	if(value){
	this.squareValue=value*value;
	}else{
	this.squareValue=undefined;
	}
	}
	}

view raw skChildComponent.js hosted with ❤ by GitHub

	<?xml version="1.0" encoding="UTF-8"?>
	<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
	<apiVersion>59.0</apiVersion>
	<isExposed>true</isExposed>
	<targets>
	<target>lightning__AppPage</target>
	</targets>
	</LightningComponentBundle>

view raw skChildComponent.js-meta.xml hosted with ❤ by GitHub

	<template>
	<lightning-card title="Communicate from Parent to Child">
	<div style="background-color:#E6E6FA;border-style: solid;padding:2%;">
	<b>This is parent Component</b>
	<br/>
	<div style="padding:2px;">
	<lightning-button label="SFDCSTUFF BLOGS" onclick={sendMessageToChildCmp}></lightning-button>
	<lightning-button label="TRAILHEAD" onclick={sendMessageToChildCmp}></lightning-button>
	</div>
	<div style="padding:2%;">
	<lightning-button label="Increase Counter by 10" onclick={increaseCounter}></lightning-button>
	</div>
	<div style="padding:2%;">
	<lightning-input type="number" label="Enter Number" value={userInput} onchange={onChangeHandler}></lightning-input>
	<lightning-button label="Calculate Square in Child" onclick={sendUserInputToChild}></lightning-button>
	</div>
	<c-sk-child-component passed-url={selResourceURL} user-input-number={userInputToPassToChild} ></c-sk-child-component>
	</div>
	</lightning-card>
	</template>

view raw skParentContainerCmp.html hosted with ❤ by GitHub

	import { LightningElement,track } from 'lwc';
	export default class SkParentContainerCmp extends LightningElement {
	@track selResourceURL;
	@track userInput;
	@track userInputToPassToChild;
	sendMessageToChildCmp(event){
	const selBtnName = event.target.label;
	console.log('****selBtnName:'+selBtnName);
	if(selBtnName=='SFDCSTUFF BLOGS'){
	this.selResourceURL='https://www.sfdcstuff.com/';
	}if(selBtnName=='TRAILHEAD'){
	this.selResourceURL='https://trailhead.salesforce.com/';
	}
	}
	increaseCounter(){
	this.template.querySelector('c-sk-child-component').increaseCounterbyTen();
	}
	onChangeHandler(event){
	const inputValue = event.target.value;
	console.log('****onChangeHandler called**inputValue:'+inputValue);
	this.userInput= inputValue;
	}
	sendUserInputToChild(){
	this.userInputToPassToChild= this.userInput;
	console.log('****increaseCounter called**this.userInputToPassToChild:'+this.userInputToPassToChild);
	}
	}

view raw skParentContainerCmp.js hosted with ❤ by GitHub

	<?xml version="1.0" encoding="UTF-8"?>
	<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
	<apiVersion>59.0</apiVersion>
	<isExposed>true</isExposed>
	<targets>
	<target>lightning__AppPage</target>
	</targets>
	</LightningComponentBundle>

view raw skParentContainerCmp.js-meta.xml hosted with ❤ by GitHub

Hope this will Help!!

Export all Custom Metadata Records in CSV file using Apex

Using apex, we can export all custom metadata records in CSV files. This is sometime needed if we want to review all custom metadata records after sandbox refresh or to check the dependency of any field or attribute in all custom metadata records.

Below is apex class which can be used for this and once you execute its method from developer console, you will receive email with csv that contain all custom metadata records.

	public class SK_CustomMetadataUtility {
	public static void exportAllCMRecordsInCSV(){
	Map<string,List<string>> objToFieldsMap = new Map<string,List<string>>();
	Map<String, Schema.SObjectType> schemaMap = Schema.getGlobalDescribe();
	for(String ss1: schemaMap.keyset()){
	Schema.SObjectType objToken=schemaMap.get(ss1);
	//find details about sobject
	Schema.DescribeSObjectResult objDescribe=objToken.getdescribe();
	string objAPIName= string.valueof(objDescribe.getName());
	//filter object for which APi name ends with _mdt
	//filter manage package objects as they contain __ twice in their API name
	if(objAPIName.endsWith('__mdt') && objAPIName.countMatches('__')==1){
	//system.debug('***custom metadata name:'+objAPIName);
	objToFieldsMap.put(objAPIName,new List<string>());
	//finding all fields of sobjects
	Map<String, Schema.SObjectField> fieldMap = objDescribe.fields.getMap();
	objToFieldsMap.get(objAPIName).add('DeveloperName');
	objToFieldsMap.get(objAPIName).add('MasterLabel');
	for(String ss:Fieldmap.keyset()){
	Schema.DescribeFieldResult fd=fieldMap.get(ss).getDescribe();
	string fieldAPIName=string.valueof(fd.getName());
	//check if field is custom or not
	if(fd.isCustom()){
	objToFieldsMap.get(objAPIName).add(fieldAPIName);
	}
	}
	}
	}
	system.debug('**objToFieldsMap size:'+objToFieldsMap.size());
	system.debug('**objToFieldsMap:'+objToFieldsMap);
	integer count =0;
	string csvString = 'Name,DeveloperName,MasterLabel,Fields\n';
	for(string objAPIName: objToFieldsMap.keyset()){
	if(count<100){ //here we are restricting script to export only 100 custom metadata records
	Map<string,List<string>> developerNameWithFieldValuesMap= new Map<string,List<string>>();
	String qryString = 'SELECT '+ string.join(objToFieldsMap.get(objAPIName),',') +' From '+objAPIName;
	system.debug('**qryString-'+objAPIName+'-:'+qryString);
	for(sobject sb: Database.query(qryString)){
	string developerName= string.valueof(sb.get('developerName'));
	developerNameWithFieldValuesMap.put(developerName,new List<string>());
	for(string field: objToFieldsMap.get(objAPIName)){
	if(sb.get(field)!=null && field!='developerName' && field!='MasterLabel'){
	//Fields coulm will contains Field API and its corresponding value
	//here &SK& is delimiter to differentiate the API name with value
	developerNameWithFieldValuesMap.get(developerName).add(field+'&SK&'+sb.get(field));
	}
	}
	csvString = csvString + objAPIName+','+string.valueof(sb.get('DeveloperName')).escapeCsv()+','+ string.valueof(sb.get('MasterLabel')).escapeCSV()+','+ string.join(developerNameWithFieldValuesMap.get(developerName),',').escapecsv()+'\n';
	}
	count= +1;
	}
	}
	Messaging.EmailFileAttachment csvAttc = new Messaging.EmailFileAttachment();
	blob csvBlob = Blob.valueOf(csvString);
	string csvname= 'Custom metadata records.csv';
	csvAttc.setFileName(csvname);
	csvAttc.setBody(csvBlob);
	Messaging.SingleEmailMessage email =new Messaging.SingleEmailMessage();
	String[] toAddresses = new list<string> {UserInfo.getUserEmail()};
	String subject = 'Custom metadata records -'+system.now();
	email.setSubject(subject);
	email.setToAddresses( toAddresses );
	email.setPlainTextBody(subject);
	email.setFileAttachments(new Messaging.EmailFileAttachment[]{csvAttc});
	Messaging.SendEmailResult [] r = Messaging.sendEmail(new Messaging.SingleEmailMessage[] {email});
	}
	}

view raw SK_CustomMetadataUtility.apxc hosted with ❤ by GitHub

Open developer console and open execute anonymous window. Execute below script:

SK_CustomMetadataUtility.exportAllCMRecordsInCSV();

Below is snapshot of csv file:

Note:

• This script will specify the custom metadata field api name and its value seperated by "&SK&" delimiter.
• All fields and its values are seperated by comma.
• You can modify this method to fetch all custom metadata related to installed packages by specifying a parameter for namespace.

Hope this will help!!

 

Open Standard Email composer from LWC Component - Global Email Quick Action

As we all know that we can create Email Actions in Salesforce but capability to invoke Email Action from LWC components was not present. After Winter' 23, Salesforce allowed to invoke global email action from custom components (from Aura and LWC both).

In this blog, I am going to explain how to invoke email action from LWC component. You can launch email composer from custom button. 

We have to use the lightning-navigation and lightning-page-reference-utils components to create a QuickAction (Global) Send Email action, which opens an email draft with pre-populated field values.

We will create simple LWC component which will have button. Once we click on this button, email composer will open. Below is sample code for reference:

	<template>
	<lightning-card title="Launch Standard Email Composer in LWC">
	<div style="background-color:#E6E6FA;border-style: solid;height:200px;margin:5%;padding:2%;">
	<lightning-button variant="neutral" label="Send an Email" onclick={onButtonClick}></lightning-button>
	</div>
	</lightning-card>
	</template>

view raw SkStandardEmailComposer.html hosted with ❤ by GitHub

	import { LightningElement , api, track} from 'lwc';
	import { NavigationMixin } from 'lightning/navigation';
	import { encodeDefaultFieldValues } from 'lightning/pageReferenceUtils';
	import findEmailInfo from '@salesforce/apex/skStandardEmailComposerController.findEmailInfo';
	export default class SkStandardEmailComposer extends NavigationMixin(LightningElement) {
	@api emailInfo;
	@api error;
	connectedCallback(){
	this.findEmailInformation();
	}
	findEmailInformation(){
	findEmailInfo()
	.then((result) => {
	this.emailInfo = result;
	console.log('***email details-'+JSON.stringify(this.emailInfo));
	})
	.catch((error) => {
	this.error = error;
	});
	}
	onButtonClick(){
	console.log('***onButtonClick-recordRelatedToId:'+this.emailInfo.recordRelatedToId);
	var pageRef = {
	type: "standard__quickAction",
	attributes: {
	apiName: "Global.SendEmail"
	},
	state: {
	recordId: this.emailInfo.recordRelatedToId,
	defaultFieldValues:
	encodeDefaultFieldValues({
	HtmlBody : "Pre-populated text for the email body.",
	Subject : "Pre-populated Subject of the Email",
	CcAddress : this.emailInfo.ccAddress.join(','),
	ToAddress : this.emailInfo.toAddress.join(','),
	ValidatedFromAddress : this.emailInfo.fromAddress,
	})
	}
	};
	this[NavigationMixin.Navigate](pageRef);
	}
	}

view raw SkStandardEmailComposer.js hosted with ❤ by GitHub

	<?xml version="1.0" encoding="UTF-8"?>
	<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
	<apiVersion>58.0</apiVersion>
	<isExposed>true</isExposed>
	<targets>
	<target>lightning__AppPage</target>
	</targets>
	</LightningComponentBundle>

view raw SkStandardEmailComposer.js-meta-xml hosted with ❤ by GitHub

	public class skStandardEmailComposerController {
	@AuraEnabled
	public static emailWrapper findEmailInfo(){
	emailWrapper returnValue= new emailWrapper();
	//you can implement your own logic to
	returnValue.ccAddress.add('sk111111demo@gmail.com');
	returnValue.ccAddress.add('sk22222demo@gmail.com');
	returnValue.toAddress.add('skemailtocaseEmail1@gmail.com');
	returnValue.fromAddress='skcurrentUser@gmail.com';//make sure it is some user address or org wide address
	returnValue.recordRelatedToId=[select id from Account Limit 1].Id;
	return returnValue;
	}
	//in wrapper you can define define ccAddress,toAddress,from address, emailBody,EmailSubject
	public class emailWrapper{
	@auraEnabled
	public string recordRelatedToId;
	@AuraEnabled
	public List<string> ccAddress;
	@AuraEnabled
	public List<string> toAddress;
	@AuraEnabled
	public string fromAddress;
	public emailWrapper(){
	ccAddress = new List<String>();
	toAddress = new List<String>();
	}
	}
	}

view raw skStandardEmailComposerController.apxc hosted with ❤ by GitHub

Note:

• You can default email properties like subject, body, ccAddress, toAddress and fromEmailAddress.
• You always need to provide record. Whenever you click on send button after composing email, system will create an emailmessage record with relatedToId as specified recordId.
• encodeDefaultFieldValues is being provide to specify all default values.

Snapshots for reference:

Reference- Create an Email as a Quick Action

Hope this will help!!

Automatically Remove Special Characters from Filename while Uploading Files in Salesforce

 As we all know that we can perform URL hack to download all files related to parent record from salesforce. We have observed that sometime downloaded file name is changed to contentversion recordId by salesforce instead of actual file name. 

It is my observation that if file name contains special characters, then when we perform download All, file name is changed to "068xxxxxxxxxxxxxx.pdf".

I have added 2 files to account record for reference:

Now I can generate download URL if I have contentversionId of these 2 files. In my case the download URL will be:

https://xxxx/sfc/servlet.shepherd/version/download/0680K00000kLSdbQAG/0680K00000kLSfwQAG

where xxxx is you org domain URL.

You can use below script to generate download all files URL if you know the parent record Id.

	string parentRecordId='0012800001IrqlyAAB';
	string orgbaseUrl=URL.getSalesforceBaseUrl().toExternalForm();
	string downloadAllFileUrl=orgbaseUrl+'/sfc/servlet.shepherd/version/download';
	List<string> contentVersionIdList = new List<string>();
	for(ContentDocumentLink cdl:[SELECT ContentDocumentId,ContentDocument.title,ContentDocument.LatestPublishedVersionId FROM ContentDocumentLink where LinkedEntityId =:parentRecordId]){
	contentVersionIdList.add(string.valueof(cdl.ContentDocument.LatestPublishedVersionId));
	}
	downloadAllFileUrl = downloadAllFileUrl +'/'+string.join(contentVersionIdList,'/');
	system.debug('***downloadAllFileUrl:'+downloadAllFileUrl);

view raw downloadAllFileScript.apxc hosted with ❤ by GitHub

If I open this URL, I will zip file which will contain both files and when I will extract it, it will appear as shown below:

As my observation, if any special character is present in file name then salesforce changes the file name. If "-" character is present, then salesforce won't change file name.

For this kind of scenarios, I recommend to have script in place which will remove all special characters from file name whenever file is being uploaded. You can write trigger on contentVersion object to remove special characters from file name. Below is code snippet which can help:

	//purpose- remove special characters from file names when uploaded in salesforce
	trigger SK_ContentVersionTrigger on ContentVersion (before insert) {
	for(ContentVersion cv: trigger.new){
	if(string.isNotBlank(cv.Title)){
	cv.Title= cv.Title.replaceAll('[^-a-zA-Z0-9\\s+]', '');
	System.debug('***updated Title '+cv.Title);
	}
	}
	}

view raw SK_ContentVersionTrigger.apxt hosted with ❤ by GitHub

Hope this will help!!!!

FieldDefinition - How to get list of all fields present in any Object using Tooling API in Salesforce

We can utilize Tooling API to get information of all fields present in a object. You can put different filters like to get all fields or specific fields like auto number fields, ExternalID fields etc.

Below is apex class which contains method to get all fields. Remember that callout uses Named Credential in order to do handshake with SFDC org.

This method contains 3 parameters:

• selOrgNCName : Name of Named Credential created to connect to SFDC org
• objAPIName : Specify the object API name in order to get list of all fields
• namespacePrefix : Specify namespacePrefix if you want to retrieve fields related to any installed packages. If you want to get list of fields created in SFDC org, then specify blank or NULL.

Note:

• I have added filter not to return auto number fields. If you want to get those fields details then remove it from query string.
• If you want to query only External Id fields then specify filter as DataType+Like+\'%25(External+ID)%25\'';

	public class SK_ToolingAPIFieldsUtility {
	@AuraEnabled
	public static DM_FieldWrapper findAllFields(string selOrgNCName,string objAPIName,string NamespacePrefix){
	DM_FieldWrapper returnValue= new DM_FieldWrapper();
	string URIForFields='/services/data/v54.0/tooling/query/?q=Select+id,Datatype,ReferenceTo,ExtraTypeInfo,IsCalculated,IsCompound,IsIndexed,ValueTypeId,RelationshipName,NamespacePrefix,Label,IsNameField,QualifiedApiName,developerName+from+FieldDefinition+';
	URIForFields=URIForFields + 'where+EntityDefinition.QualifiedApiName=\''+objAPIName+'\'+AND+IsCalculated=false+';
	URIForFields=URIForFields + '+AND+DataType!=\'Auto+Number\'';
	string endpointURL='callout:'+selOrgNCName+URIForFields;
	if(string.isNotBlank(NamespacePrefix)){
	endpointURL=endpointURL+'+AND+NamespacePrefix=\''+NamespacePrefix+'\'';
	}
	system.debug('***endpointURL:'+endpointURL);
	HttpRequest req = new HttpRequest();
	req.setEndpoint(endpointURL);
	req.setMethod('GET');
	Http http = new Http();
	HTTPResponse res = http.send(req);
	DM_FieldWrapper JSONDetails= DM_FieldWrapper.parse(res.getBody());
	System.debug('****field count-:'+JSONDetails.records.size());
	for(cls_records fdata : JSONDetails.records){
	system.debug('****fdata.QualifiedApiName:'+fdata);
	}
	returnValue= JSONDetails;
	return returnValue;
	}
	public class DM_FieldWrapper{
	public Integer size;
	public Integer totalSize;
	public boolean done;
	public String entityTypeName;
	public cls_records[] records;
	}
	public class cls_records {
	public String Id;
	public String DataType;
	public boolean IsCalculated;
	public boolean IsCompound;
	public boolean IsIndexed;
	public string RelationshipName;
	public string NamespacePrefix;
	public String Label;
	public boolean IsNameField;
	public String QualifiedApiName;
	public String DeveloperName;
	public ReferenceTo ReferenceTo;
	public cls_EntityDefinition EntityDefinition;
	}
	public class ReferenceTo {
	public List<String> referenceTo;
	}
	public class cls_EntityDefinition {
	public String QualifiedApiName;
	public string MasterLabel;
	}
	public static DM_FieldWrapper parse(String json){
	return (DM_FieldWrapper) System.JSON.deserialize(json, DM_FieldWrapper.class);
	}
	}

view raw SK_ToolingAPIFieldsUtility hosted with ❤ by GitHub

Hope this will help!!