Email Quick Action in LWC

Hello folks, today we will discuss Send Email Quick Action in LWC. This Quick Action will allow you to open an Email Composer with predefined values.

Use APIs from the lightning/navigation and lightning/pageReferenceUtils modules to create a QuickAction (Global) Send Email action, which opens an email draft with pre-populated field values.

In your component’s HTML file, import the navigation services from the lightning/navigation module and the page reference utilities from lightning/pageReferenceUtils.

Default Email Field Values 

By default, Salesforce prepopulates the To field with a contact or lead email address when you open the email action from the contact or lead record home pages. Ensure that the fields you specify in the encodeDefaultFieldValues function aren’t Read-Only in the Send Email global action’s layout. If the HTML Body and Subject fields are Read-Only, the email draft doesn’t include pre-populated text for those fields.

These fields are supported:

• FromAddress
• ToAddress
• CcAddress
• BccAddress
• Subject
• HTMLBody
• RelatedToId

Also, check this: Action Buttons in Salesforce Lightning Flow

Key Highlights :

1. Display prequisite content before displaying the email composer.
2. Set predefined field values for an email based on user input.
3. To include default text in the email composer, use the encodeDefaultFieldValues function.
4. To populate the email with input from your component, pass the field values into the encodeDefaultFieldValues function.

Code :

sendEmailQuickAction.HTML:

<template>

</template>

sendEmailQuickAction.JS:

import { LightningElement, api } from 'lwc';
import { NavigationMixin } from 'lightning/navigation';
import { encodeDefaultFieldValues } from 'lightning/pageReferenceUtils';
export default class SendEmailQuickAction extends NavigationMixin(LightningElement) {
    @api recordId;
    @api invoke() {
        var pageRef = {
            type: "standard__quickAction",
            attributes: {
                apiName: "Global.SendEmail"
            },
            state: {
                recordId: this.recordId,
                defaultFieldValues:
                    encodeDefaultFieldValues({
                        HtmlBody: "Hi Sir \n Good Morming \n",
                        Subject: "Greetings"
                    })
            }
        };
        this[NavigationMixin.Navigate](pageRef);
    }
}

sendEmailQuickAction.JS-meta.xml:

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>57.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__RecordAction</target>
    </targets>
    <targetConfigs>
        <targetConfig targets="lightning__RecordAction">
            <actionType>Action</actionType>
        </targetConfig>
    </targetConfigs>
</LightningComponentBundle>

Output :

Reference :

1. Create an Email as a Quick Action