lightning:empApi Salesforce Winter19

03:54 2 Comments A+ a-


lightning:empApi 




Hi All,
Today I will talk about brand new lightning component lightning:empApi , Which was delivered in winter 19 salesforce realease.

When to use empApi:  To see live data in on lightning component.

We had serval options to do this such as polling which is an old technique in this we call server (Apex class) again and again. Or we use streaming api, and cometD JS (external javascript) which requires lots of efforts.

Drawbacks of polling (Calling apex server) : In this we need to travel to server after every particular interval. In this sometimes our server trip is useless , if we do not have any latest data there. 

But now we have an native lightning component (lightning:empApi) , which is very helpful and reducse developer's effort.

lightning:empApi can only be used in desktop browser only and require API version 44.0 and higher. lightning:empApi can be used with platform events, PushTopic events, generic events and Change Data Capture events.

Let's see an example of lightning:empApi with platform events. My colleague Aslam bari already have written an outstanding blog (quick demo salesforce platform events) on Platform event.

In our example we will display all case which has status = open. We would not reload our component and will see live/latest data.

Demo:



So firts of all we will create a new platform event.
I have created platform event (UpdateRecord__e).

Then we need to publish it whenever a new case is inserted with status = 'open'. As well as you can also publish platform event when status is changed from open to any other or vice versa. And same you can do for delete also.

CaseTrigger:


trigger CaseTrigger on Case (after insert) { List<Case> listOfOpenCase = new List<Case>(); for(Case objCase : trigger.new){ if(objCase.Status == 'Open'){ listOfOpenCase.add(objCase); } } if(listOfOpenCase.size() > 0){ EventBus.publish(new UpdateRecord__e(message__c = listOfOpenCase[0].id)); } }


empApiExample.cmp:

<aura:component controller="empApiExampleController" implements="force:appHostable"> <aura:handler name="init" value="{!this}" action="{!c.doInit}"></aura:handler> <aura:attribute name="listOfCases" type="List"/> <aura:attribute name="subscription" type="Map" /> <aura:attribute name="showSpinner" type="Boolean" default="false"/> <lightning:empApi aura:id="empApi"/> <aura:if isTrue="{!v.showSpinner}"> <lightning:spinner size="small"/> </aura:if> <lightning:card title="empApi Example" footer=""> <div> <table class="slds-table slds-table_cell-buffer slds-table_bordered"> <thead> <tr class="slds-line-height_reset"> <th class="slds-text-title_caps" scope="col"> <div class="slds-truncate" title="Opportunity Name">Case Subject</div> </th> <th class="slds-text-title_caps" scope="col"> <div class="slds-truncate" title="Account Name">Priority</div> </th> <th class="slds-text-title_caps" scope="col"> <div class="slds-truncate" title="Close Date">Reason</div> </th> </tr> </thead> <tbody> <aura:iteration items="{!v.listOfCases}" var="objCase"> <tr class="slds-hint-parent"> <td data-label="Case Subject"> <div class="slds-truncate" title="Cloudhub">{!objCase.Subject}</div> </td> <td data-label="Case Priority"> <div class="slds-truncate" title="Cloudhub">{!objCase.Priority}</div> </td> <td data-label="Case Reason"> <div class="slds-truncate" title="Cloudhub">{!objCase.Reason}</div> </td> </tr> </aura:iteration> </tbody> </table> </div> </lightning:card> </aura:component>



empApiExampleController.js



({ doInit : function(component, event, helper) { helper.getData(component); // Get the empApi component. var empApi = component.find("empApi"); // Error handler function that prints the error to the console. var errorHandler = function (message) { console.error("Received error ", JSON.stringify(message)); }; // Register error listener and pass in the error handler function. empApi.onError(errorHandler); var channel = '/event/UpdateRecord__e'; // platform event name var replayId = -1; var callback = function (message) { console.log("Event Received : " + JSON.stringify(message)); helper.getData(component); }; // Subscribe to the channel and save the returned subscription object. empApi.subscribe(channel,replayId, callback).then(function(newSubscription) { component.set("v.subscription", newSubscription); // can be used if you want to unsubscribe event }); } })

empApiExampleHelper.js



({ getData : function(component) { component.set("v.showSpinner",true); var action = component.get('c.getListOfCases'); action.setCallback(this,function(response){ if(response.getState() === "SUCCESS"){ component.set("v.listOfCases",response.getReturnValue()); component.set("v.showSpinner",false); } }); $A.enqueueAction(action); } })


empApiExampleController (Apex)


public class empApiExampleController { @AuraEnabled public static List<Case> getListOfCases(){ return [SELECT Id,Subject,Priority,Reason FROM Case WHERE Status = 'Open']; } }

Thanks,


2 comments

Write comments
Roja Priya
AUTHOR
26 November 2018 at 06:33 delete

This information is impressive; I am inspired by your post writing style & how continuously you describe this topic. After reading your post, thanks for taking the time to discuss this, I feel happy about it and I love learning more about this topic.

openstack training center in chennai | openstack certification training in chennai | redhat openstack training in chennai

Reply
avatar
Rithi Rawat
AUTHOR
26 November 2018 at 06:47 delete

Very nice post here thanks for it .I always like and such a super contents of these post.Excellent and very cool idea and great content of different kinds of the valuable information's. machine learning training center in chennai

artificial intelligence and machine learning course in chennai

machine learning classroom training in chennai

Reply
avatar