Salesforce Console Developer Guide
jNewer Version Available
LWC Methods for Enhanced Messaging in Lightning Experience
The Conversation Toolkit API is designed for Enhanced Messaging channels, which includes Messaging for In-App and Web, Enhanced Apple, Enhanced Facebook Messenger, Enhanced WhatsApp, Enhanced SMS, and Partner Messaging.
These methods help developers customize the agent experience and how users and other components interact with the conversation component on a page. For example, if you want to customize how an agent composes a message, you can create a messaging composer to draft and send a message during the conversation. These methods only work with an open Messaging Session record page in the console or standard app. If the record is not open, the methods don’t work.
Sample Code
This sample code is an example of the .html file of an LWC bundle that uses Conversation Toolkit API.
1<template>
2 <lightning-card title="LWC tool kit api" icon-name="custom:custom14">
3 <lightning-conversation-toolkit-api lwc:ref="lwcToolKitApi">
4 </lightning-conversation-toolkit-api>
5 <div>
6 {apiOutput}
7 </div>
8 <div>
9 <lightning-button label="getConversationLog" onclick={handleButtonClick} value="getConversationLog"></lightning-button>
10 <lightning-button label="sendTextMessage" onclick={handleButtonClick} value="sendTextMessage"></lightning-button>
11 <lightning-button label="setAgentInput" onclick={handleButtonClick} value="setAgentInput"></lightning-button>
12 <lightning-button label="endConversation" onclick={handleButtonClick} value="endConversation"></lightning-button>
13 </div>
14 <template for:each={log} for:item="item">
15 <li key={item}>
16 {item}
17 </li>
18 </template>
19
20 </lightning-card>
21 </template>This sample code is an example of the .xml metadata file of the LWC bundle.
1<?xml version="1.0" encoding="UTF-8"?>
2<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata" fqn="helloWorld">
3 <apiVersion>52.0</apiVersion>
4 <isExposed>true</isExposed>
5 <targets>
6 <target>lightning__AppPage</target>
7 <target>lightning__RecordPage</target>
8 <target>lightning__HomePage</target>
9 </targets>
10</LightningComponentBundle>This sample code is an example of the .js file of the LWC bundle. Here is where you use the LWC methods for Enhanced Messaging.
1import { LightningElement, api,track } from 'lwc';
2
3export default class HelloWorld extends LightningElement {
4 @api recordId;
5
6 @track log = [];
7 @track apiOutput;
8 changeHandler(event) {
9 this.greeting = event.target.value;
10 }
11
12 async handleButtonClick(event){
13 this.reset();
14 const toolKit = this.refs.lwcToolKitApi;
15 let result;
16 switch (event.target.value) {
17 case 'getConversationLog':
18 result = await toolKit.getConversationLog(this.recordId);
19 for(let i=0;i<result.messages.length;i++){
20 var msg = {
21 type:result.messages[i].type,
22 content:result.messages[i].content,
23 name:result.messages[i].name,
24 timestamp:result.messages[i].timestamp
25 }
26 this.log.push(JSON.stringify(msg));
27 }
28 break;
29 case 'sendTextMessage':
30 result = await toolKit.sendTextMessage(this.recordId, { text: 'Text from toolkit' });
31 break;
32 case 'setAgentInput':
33 result = await toolKit.setAgentInput(this.recordId,{ text: 'Inserting from toolkit' });
34 break;
35 case 'endConversation':
36 result = await toolKit.endConversation(this.recordId);
37 break;
38 }
39 if(result){
40 this.apiOutput = event.target.value + " sucess";
41 } else {
42 this.apiOutput = event.target.value + " failed";
43 }
44
45 }
46
47 reset(){
48 this.log = [];
49 this.apiOutput='';
50 }
51
52}These are the LWC methods for Enhanced Messaging.