Lightning: Populating Email Body of chatter Email using Email Templates

Requirement: User should be able to choose temples and then populate email body in chatter email based on Email Template as shown below-

Solution: We will create following lightning Aura component and will drop just above the Chatter Email. Let’s take a look at the code-

UpdateEmailComponent.cmp

<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId" access="global" controller="UpdateEmailComponentController">
    <aura:attribute name="recordId" type="String" access="global"/>
    <lightning:quickActionAPI aura:id="quickActionAPI" />
    <aura:handler name='init' value='{!this}' action='{!c.init}'/>
    <aura:attribute name='templateList' type='sObject[]'/>
    <aura:attribute name='selectedTemplateId' type='String'/>
    <aura:attribute name='templateBody' type='Object'/>
    <aura:attribute name="emailActionName" type="String" access="global" default="Case.SendEmail" />
    
    <lightning:card >
        <lightning:layout multipleRows="true">
            <lightning:layoutItem size="1" class="border text-right"> 
            </lightning:layoutItem>
            <lightning:layoutItem size="5" class="border text-right">  
                <lightning:select  aura:id="templateId" name="select" label="Select Template" required="true" onchange="{! c.selectTemplate }">
                    <option value="">None</option>
                    
                    <aura:iteration items="{!v.templateList}" var="template">
                        <option value="{!template.Id}">{!template.Name}</option>
                    </aura:iteration>
                </lightning:select>
            </lightning:layoutItem>
            
            
            <lightning:layoutItem size="6" class="border text-right" >
                <lightning:button label="Send Email" onclick="{!c.sendEmail}" class="slds-m-around--large" />
            </lightning:layoutItem>
    	</lightning:layout>
    </lightning:card>
</aura:component>

UpdateEmailComponentController.js

({
	init:function(component, event, helper) {
        var action = component.get('c.getEmailTemplate'); 
        action.setCallback(this, function(a){
            debugger;
            var state = a.getState(); // get the response state
            if(state == 'SUCCESS') {
                component.set('v.templateList', a.getReturnValue());
            }
        });
        $A.enqueueAction(action);
    },
    selectTemplate: function (cmp, evt, helper) {
        var selectedTemplateId = cmp.find('templateId').get('v.value');
        cmp.set("v.selectedTemplateId", selectedTemplateId);
    },
    sendEmail: function (component, event, helper) {
        var selectedTemplateId =  component.get("v.selectedTemplateId");
        if(selectedTemplateId!= undefined && selectedTemplateId!="" && selectedTemplateId!="undefined")
        {
            helper.getEmailBody(component, event, helper);  
            
        }
        else
        {
            var inputCmp = component.find("templateId");
            inputCmp.setCustomValidity("Please select a value");

            inputCmp.reportValidity();
            
        }
    }
})

UpdateEmailComponentHelper.js

({
	getEmailBody:  function(component, event, helper) {
        debugger;
        var action = component.get('c.getEmailBodyfromApex'); 
        var selectedTemplateId =  component.get("v.selectedTemplateId");
        var recordId =  component.get("v.recordId");
        var self=this;
        
        action.setParams({
            "emailTemplateId" :selectedTemplateId,
            "recordId":recordId
        });
        
        action.setCallback(this, function(a){
            debugger;
            var state = a.getState(); // get the response state
            if(state == 'SUCCESS') {
                component.set('v.templateBody', a.getReturnValue());
                self.callQuickAction(component, event, helper);
            }
        });
        $A.enqueueAction(action);
        
    },
    
    callQuickAction:function(component, event, helper) {
        var recordId =  component.get("v.recordId");
        var templateBody=component.get("v.templateBody");
        var emailActionName =component.get("v.emailActionName");
        var actionAPI = component.find("quickActionAPI");
        var targetFields={Subject: {value: templateBody.emailSubject}, HtmlBody: {value: templateBody.emailBody, insertType: "replace"}};
        var args = { actionName :emailActionName,targetFields : targetFields};
        console.log('About to fire quick action');
        actionAPI.setActionFieldValues(args)
        .then(function(result){
            console.log('Fired Quick Action');})
        .catch(function(e){
            console.error(e);
            alert('Hi' + JSON.stringify(e) );
        });
    },
})

ContactListCompController.apxc

public class UpdateEmailComponentController 
{
    @auraEnabled
    public static list<emailTemplate> getEmailTemplate() {
        list<emailTemplate>lstEmailTemplate= [select id,name,foldername from emailTemplate  where isactive=true and folder.name = 'SampleFolder'];
        return lstEmailTemplate;
    }
    
    @auraEnabled
    public static emailTemplateWrapper getEmailBodyfromApex(string emailTemplateId,string recordId) {
        Case c = [Select AccountId from Case where id = :recordId];
        emailTemplateWrapper objemailTemplateWrapper = new emailTemplateWrapper();
        Messaging.SingleEmailMessage mail = new Messaging.SingleEmailMessage();
        mail = Messaging.renderStoredEmailTemplate(emailTemplateId, userinfo.getUserId(), c.AccountId);
        
        objemailTemplateWrapper.emailSubject = mail.getSubject();
        string emailhtmlBody=mail.getHtmlBody();
        string emailtextBody=mail.getPlainTextBody(); 
        if(string.isNotBlank(emailhtmlBody))
            objemailTemplateWrapper.emailBody = emailhtmlBody;
        else {
           string replaceStr= emailtextBody.replace('\n', '<br/>');
           objemailTemplateWrapper.emailBody =replaceStr;
        }
        return objemailTemplateWrapper;        
    }
    
    public class emailTemplateWrapper {
        @auraenabled public string emailSubject;
        @auraenabled public string emailBody;        
    }
}

Please note:

  • Email to Case should be enabled for chatter Email to be visible on case.
  • You should have ‘sendEmail’ action on the case.
  • Your Email Templates should be in ‘SampleFolder’. If its in different folder, rename the folder in apex class accordingly.

Published by Sandeep Kumar

He is a Salesforce Certified Application Architect having 11+ years of experience in Salesforce.

Leave a Reply