Send a Message as the End User

1import { LightningElement, api, track } from "lwc";
2
3export default class CustomChatHeader extends LightningElement {
4
5	...
6
7	sendTextMessage() {
8		this.configuration.util.sendTextMessage("Text");
9		.then(() => {
10			// Success handler used to perform actions when the message is sent successfully.
11			// For example, create a method that logs the message was successfull.
12			logMessageSuccessfullySent();
13		}).catch(() => {
14			// Error handler used to perform actions if the message fails to send.
15			// For example, log the failure.
16			logMessageFailed();
17		}).finally(() => {
18			// Finally handler used to perform any clean-up actions
19			// regardless of whether the message was successfully sent or not.
20			// For example, create a method that logs attempt to send message.
21			logMessageAttempt();
22		});
23	}
24}

1<template>
2    ...
3
4    <!-- Header menu -->
5    <section class={menuClass}>
6        <template if:true={showMenuButton}>
7            <!-- Menu button -->
8            <button class="headerButton menuButton" onclick={onMenuButtonClick}>
9                <lightning-icon icon-name="utility:threedots_vertical" variant="inverse" size="x-small"></lightning-icon>
10            </button>
11        </template>
12
13        <!-- Menu options-->
14        <section class="optionsMenu slds-dropdown slds-dropdown_left slds-nubbin_top-left">
15            <ul class="slds-dropdown__list">
16                ...
17
18                <!-- Send text message -->
19                <li class="slds-dropdown__item">
20                    <button class="chatbotMenuOption"
21                            onclick={sendTextMessage}>
22                        <span class="slds-text-color_error">Send text</span>
23                    </button>
24                </li>
25
26            ...
27            </ul>
28        </section>
29    </section>
30   ...
31</template>