LWC Methods for Enhanced Messaging in Lightning Experience

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="getEnhancedConversationLog" onclick={handleButtonClick} value="getEnhancedConversationLog"></lightning-button>
10        <lightning-button label="getConversationLog" onclick={handleButtonClick} value="getConversationLog"></lightning-button>
11        <lightning-button label="sendTextMessage" onclick={handleButtonClick} value="sendTextMessage"></lightning-button>
12        <lightning-button label="setAgentInput" onclick={handleButtonClick} value="setAgentInput"></lightning-button>
13        <lightning-button label="endConversation" onclick={handleButtonClick} value="endConversation"></lightning-button>
14      </div>
15      <template for:each={log} for:item="item">
16        <li key={item}>
17          {item}
18        </li>
19      </template>
20       
21    </lightning-card>
22  </template>

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>

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 'getEnhancedConversationLog':
18        result = await toolKit.getEnhancedConversationLog(this.recordId);
19        break;
20      case 'getConversationLog':
21        result = await toolKit.getConversationLog(this.recordId);
22        for(let i=0;i<result.messages.length;i++){
23          var msg = {
24              type:result.messages[i].type,
25              content:result.messages[i].content,
26              name:result.messages[i].name,
27              timestamp:result.messages[i].timestamp
28          }
29          this.log.push(JSON.stringify(msg));
30        }
31        break;
32      case 'sendTextMessage':
33        result = await toolKit.sendTextMessage(this.recordId, { text: 'Text from toolkit' });
34        break;
35      case 'setAgentInput':
36        result = await toolKit.setAgentInput(this.recordId,{ text: 'Inserting from toolkit' });
37        break;
38      case 'endConversation':
39        result = await toolKit.endConversation(this.recordId);
40        break;
41    }
42    if(result){
43      this.apiOutput = event.target.value + " sucess";
44    } else {
45      this.apiOutput = event.target.value + " failed";
46    }
47 
48  }
49 
50  reset(){
51    this.log = [];
52    this.apiOutput='';
53  }
54 
55}