Building a Custom Question-Answering Bot and Custom Bot UI Using Azure
A Blog by Sanjay Senthilkumar
Website: sanjaysenthilkumar.me
Table of Contents
- Introduction
- Architecture
- Getting Started with Custom Question and Answer Bots Using Azure’s Language Services
- Let’s Get Practical
- Managing Your Knowledge Base
- Creating Your Bot
- Configuring Your Bot for Interaction:
- Fine-Tuning the Custom Question Answering Bot: Advanced Code Configuration (Unnecessary and Not Recommended for Those New to C# or Beginners)
- Custom Bot UI for Your Website: A Step-by-Step Guide
Introduction:
In the ever-evolving world of technology, innovation continues to shape the way we interact with information. Our latest project, a custom Question-Answering (QA) bot, is a testament to this spirit of innovation. Developed meticulously and professionally, this bot leverages the power of Microsoft Azure’s cloud services and Language Services to bring a seamless, knowledge-driven experience to users.
This project, a collaborative effort between myself sanjay senthilkumar ,Ruphak Varma and Raahul R S demonstrates the potential of AI and cloud computing to simplify information retrieval and enhance user interactions. The core of our creation lies in its simplicity — a custom QA bot designed for practicality and efficiency.
In this blog, we’ll delve into the intricacies of our project, shedding light on how we harnessed Azure’s Language Services to build an intelligent knowledge base and seamlessly integrated it into a custom user interface (UI) design. We believe in the power of practical solutions, and our bot exemplifies this philosophy — no flashy bells and whistles, just a professionally crafted tool that gets the job done efficiently.
Join us on this journey as we explore the development process, the integration of Azure’s cloud capabilities, and the nuances of designing a UI that emphasizes user-friendliness. This project isn’t about fancy gimmicks; it’s about using cutting-edge technology to create a practical, real-world solution.
You can explore our project on its GitHub page, where we’ve shared the code.
Let’s dive in and discover how we’ve harnessed the power of Azure’s Language Services to create a custom QA bot and UI that simplifies information access, making it a valuable asset for any knowledge-driven endeavor.
Project Objectives:
Our main goal in developing a simple QA bot using Azure and Language Services was to offer streamlined and efficient user interaction and support for Neuralinverse.live. We aimed to create a straightforward solution that simplifies communication between the website and its users, providing quick answers and assistance. This bot serves as a valuable resource for end users, ensuring that their queries are addressed promptly and efficiently, enhancing their overall experience on the platform.
Architecture
This reference architecture, described by the Azure Architecture Center, serves as a foundation for conversational bot architecture. To build our Q&A bot, we have taken this advanced architecture and simplified it
Custom Question and Answer Bots with Azure’s Language Services
Understanding Question and Answering (Q&A)
Before we dive into the practical aspects of creating and configuring this chatbot, let’s take a moment to grasp the essence of question and answering.
At its core, Q&A leverages cloud-based natural language processing, enabling the development of a conversational layer over your data. This means that you can create conversational client applications for your end users. When users have queries or questions, they can effortlessly engage with your application, input their queries, and receive accurate responses. Essentially, they find the answers they need within the data you provide.
Now, let’s explore the different capabilities within question answering:
Custom Question Answering:
This capability puts you, as a low-code chatbot developer, in control. You can customize various aspects, such as editing question and answer pairs sourced from content, defining synonyms, adding metadata, and even accepting or rejecting suggestions provided by Microsoft based on the data you input.
Pre-built Question Answering:
On the other hand, pre-built question answering simplifies the process even further. Users can receive responses by querying a text passage without needing to manage knowledge bases themselves. Here, the responsibility of knowledge base management is seamlessly handled by the system.
Let’s Get Practical
Now that we’ve laid the groundwork by understanding question and answering, it’s time to delve into the practical aspects. We’ll demonstrate how to create and configure these chatbots in a way that simplifies communication between your platform and users.
let’s explore how to create the necessary Language Resource in your Azure portal. There are two straightforward ways to achieve this:
Method 1:
1.First, navigate to your Azure portal.
2.Click on “Cognitive Services.”
3.Under “Language,” click on “Language Services.”
4.Click on the “Create” button.
5.In the “Select additional features” section, you’ll have two options: “Custom Question Answering” and “Custom Text Classification and Custom Named Entity Recognition.” For this demo, we’ll focus on “Custom Question Answering.”
6.Click on “Continue” to create the resource.
Method 2:
1.Begin on your Azure portal homepage.
2.Click on “Create a resource.”
3.Under “Categories,” select “AI + Machine Learning.”
4.You’ll find “Language Services” as the fourth option. Click on it.
5.Click on “Create.”
6.Here, choose “Custom Question Answering” under “Custom Features.”
7.Click “Continue” to proceed.
Now, let’s configure the resource:
For the subscription, select your preferred subscription (e.g., “Azure Eduction”). Choose a resource group (e.g., “atcsl India”). The region can be set as “East U.S.” Provide a name for the resource, such as “atcsl Language.” Now, you’ll select the pricing tier. For this demo, we recommend choosing “Standard,” as it allows for more comprehensive usage. Note that you might need to select this option if you’ve already utilized a free tier.
Next, for Azure Search Region, you can leave it as “East U.S.”
- For Azure Search Pricing Tier, you’ll need to choose an appropriate option, such as “Standard S1.” The choice depends on your specific requirements.
- Ensure to check the box for “Responsible AI.”
- The following sections, such as “Network” and “Identity,” can be left with their default settings for this demo.
- Once all these steps are complete, click on “Review + Create.”
- The system will validate your inputs, and once the validation passes, click on “Create” to initiate the resource creation process.
- Now, your resource will be deployed, which may take a few minutes. Stay patient.
Once the resource is successfully created, you can click on “Go to Resource Group” to access it. You’ll see several components, including the Language Service you’ve just created.
Next, let’s delve into the essential steps to create and configure your custom question and answer project within the Azure Language Studio. This is a critical part of setting up your chatbot, so pay close attention.
Accessing Your Language Resource:
- To start, head back to your Azure portal and locate the language resource you previously created, named “adcsl language.”
- Within this resource, you’ll find valuable information under the “Keys and Endpoint” section, including two keys (Key 1 and Key 2) that can be regenerated if needed.
- Take note of the resource’s location, which is set to “East US,” and its endpoint, which should be in the format of “adcslanguage.cognitiveservices.azure.com.”
- Additionally, if you navigate to the “Overview” section, you’ll find a link to access the “Language Studio.” Click on “Get started with the Language Studio” to proceed.
Sign-In and Configuration:
- Upon entering the Language Studio, you may notice that you’re not automatically signed in. No worries, just click on the “Sign In” option.
- Sign in with your credentials, ensuring you’re using your Azure Active Directory.
- Next, select your Azure subscription from the drop-down menu. If you have multiple subscriptions, make sure to choose the one relevant to your project.
Resource Type and Name:
- Under “Resource Type,” select “Language” as it aligns with your language resource requirements.
- For the “Resource Name,” you should see “adcsl language” as an option in the drop-down menu. Choose this to link your Language Studio with your language resource.
- Finally, click “Done” to proceed.
Creating a Custom Question and Answer Project:
- Within Language Studio, you’ll now see the option to create a new project. Click on the “Create new” drop-down menu.
- From the available project types, select “Custom Question Answering.” This project type is precisely what we need for our chatbot.
Project Configuration:
- A pop-up will appear, prompting you to specify the language for your project. Given your preference for English, select it from the drop-down menu.
- In the “Name” field, provide a descriptive title for your project. For instance, you could use “Digital Questions.” Adding a brief description is optional.
- Ensure “English” is selected as the source language, and you can customize the default answer when no specific response is found. For instance, you might use “No answer found. Contact the administrator.”
- Click “Next” to proceed.
Project Creation:
- Review all the project details to ensure accuracy.
- Once satisfied, click “Create Project.”
Managing Your Knowledge Base:
Now that you’ve set up your custom question and answer project, it’s time to manage your knowledge base. This is where you’ll fine-tune your chatbot’s responses and ensure it’s equipped to provide accurate information.
Edit Knowledge Base:
- If you’ve already uploaded or provided the source for your question and answer pairs, you have the option to refine them. This is where you can edit both the questions and answers as needed.
- To edit a question-answer pair, simply click on “Edit Answer.” You can add more context or clarify responses. If any information is no longer relevant, feel free to remove it.
-Keep in mind that you can have alternate questions leading to the same answer. This can enhance your chatbot’s ability to understand user queries effectively.
Review Suggestions:
- Microsoft offers suggestions based on your question-answer pairs. These suggestions aim to improve the quality and comprehensiveness of your chatbot’s responses. You can review these suggestions in this section.
- Consider accepting relevant suggestions to enhance the overall performance of your chatbot.
Project Settings:
- Within your project settings, you can configure various aspects to align the chatbot with your specific requirements. This includes fine-tuning language preferences, access control, and other project-specific settings.
Managing Your Knowledge Sources:
Your knowledge base is powered by the sources you provide. Here’s how you can manage them effectively:
Adding Sources:
- Click on “Add Source” to incorporate new content into your knowledge base. You have three options for adding sources.
- You can input specific URLs to extract question-answer pairs from online sources.
- Alternatively, you can upload files containing question-answer pairs. This is particularly useful for offline content. For a more conversational touch, you can explore “chit chat” options, although this is often used for different purposes.
Uploading Files:
- If you choose to upload files, click on “Files” and then “Add File.” You can then select the file containing your question-answer pairs.
- Give your uploaded source a name for easy reference, and then click “Add All” to complete the process.
- The system will process the uploaded file and incorporate its content into your knowledge base.
Editing Knowledge Base:
- As mentioned earlier, you can edit your question-answer pairs from this section. This step allows you to maintain the relevance and accuracy of your chatbot’s responses.
Deploying Your Knowledge Base:
- Once you’re satisfied with your question-answer pairs and overall knowledge base, it’s time to deploy it. Click on “Deploy Knowledge Base” to initiate this process.
- Confirm the deployment by clicking the “Deploy” button in the pop-up.
After deploying your knowledge base, you’ll be well-prepared to move forward with creating your chatbot. This knowledge base serves as the foundation upon which your chatbot will provide answers and assistance to users.
Creating Your Bot:
After successfully deploying your knowledge base, it’s time to create your chatbot. Follow these steps to set up your bot:
Bot Configuration:
- Click on “Create a Bot” to initiate the bot creation process. — The subscription is automatically selected for you. For the resource group, select “atcsl India” from the dropdown menu.
Resource Group Location:
- The resource group location is pre-set to “Asia Pacific Central India” based on your previous selection. No need to make any changes.
Bot Handle:
- Here, you’ll define a name for your bot. By default, a suggestion is provided, but you can customize it if needed. For demonstration purposes, you can leave it as suggested.
Pricing Tier:
- The pricing tier is set to “Standard” by default. You can retain this setting unless you have specific requirements that necessitate a different tier.
Creation Type:
- Choose between “Create a new user-assigned managed identity” or “Use the existing user-assigned managed identity.” This setting pertains to the bot’s managed identity, not the language service project. Select “Create a new user-assigned managed identity” since you haven’t created one previously.
Web App Configuration:
In this section, you’ll configure your bot’s web app settings:
- App Name: The default app name is suggested. You can customize it as per your preference.
- SDK Language: Choose between C# or Node.js. For this demonstration, we’ll stick with C#.
- App Service Plan: Allow the bot service to create a new app service plan for you.
Language Resource Key:
This is a crucial step for authorization. The language resource key ensures a secure connection between your bot and the custom question-answering knowledge base. There are two methods to obtain this key:
- You can find the key in the “Deployment Knowledge Base” section by clicking on “Settings” and then “Resources.”
- Alternatively, you can copy either “Key 1” or “Key 2” from the “Keys and Endpoint” section in the Azure portal. It’s recommended to use “Key 1.”
Language Project Name:
- Keep the name as “Eg;digital questions.”
Review and Create:
- After verifying all the settings, click on “Review and Create.”
- Once the validation is successful, click on the “Create” button to initiate the deployment.
Deployment Completion:
- The deployment process will take a few minutes. You can pause and wait for it to complete.
Upon successful deployment, several resources will be created, including your bot, site extensions, the actual site, and a user-assigned managed identity for the bot.
Configuring Your Bot for Interaction:
Now that you’ve successfully deployed your chatbot, it’s time to configure it for interaction. Follow these steps for the final setup:
Bot Profile:
- Inside the Azure bot, under “Settings,” you’ll find various options, including “Bot Profile.” Here, you can see the display name, bot handle, and description (if provided during setup).
Upload an Icon (Optional):
- If you wish, you can upload an icon for your chatbot to make it visually identifiable.
Configuration:
In the “Configuration” section, you’ll find important settings:
- Messaging Endpoint: Ensure the messaging endpoint is correctly set. It should be in the format: https://adcsl- language.azurewebsites.net/api/messages. This endpoint facilitates communication between your bot and the language services knowledge base.
- Application Insights: You’ll find options to set up application insights instrumentation key and API key for accessing analytics data related to your bot.
Channels:
- Under “Channels,” you’ll see existing options like “Direct Line” and “Web Chat.” These are basic integration channels.
- To expand your bot’s reach, click “Add a Channel” to integrate with additional applications. Options include Alexa, Microsoft Teams, and more.
Microsoft Teams Integration:
For Microsoft Teams integration:
- Select “Microsoft Teams.”
- Accept the terms of service and privacy statements.
- Choose “Microsoft Teams Commercial” as it’s the default option for most use cases.
- Click “Apply” to integrate your bot with Microsoft Teams.
Calling and Publishing (Optional):
- You can enable calling functionality if you intend to use Teams’ calling features within your organization. If not, skip this step.
- In the “Publish” section, you’ll find options to test your bot in Teams and publish it. For most cases, bot publishing happens automatically, so you may not need to intervene here.
Messaging Integration Testing:
- For testing your bot’s messaging integration, you can click on “Test in Web Chat.” This provides a real-time interface to interact with your bot.
Using Language Services Chatbot:
- Interact with your bot using natural language queries. For example, you can ask a question like “What are the benefits of implementing SR automation?” to receive relevant responses from the knowledge base.
Embedding Web Chat in Your Website (Optional):
To embed the chatbot in your website, follow these steps:
- Go to the “Channels” section.
- Select “Web Chat.”
- Under “Default Site,” find the secret keys and embedded code.
- Copy the embedded code and paste it into the HTML body of your website.
- This enables your HTML page to function as a chatbot application page that can be hosted anywhere.
And there you have it! Your chatbot is now configured and ready for interaction. You can test it directly in web chat or embed it in your website for user convenience. This setup not only streamlines responses to frequently asked questions but also saves time and effort by automating common tasks. Enjoy the benefits of efficient communication with your chatbot.
Fine-Tuning the Custom Question Answering Bot: Working with Code
Downloading the Source Code from Azure Portal for the Azure Bot, or You Can Access It from My Repository Alongside the Custom UI Code
Clone the Repository
You can clone my repository to your local machine using Git. To do so, open your terminal or command prompt and navigate to the directory where you want to clone the project. Then, use the following command:
gh repo clone sanjay-senthilkumar01/Custom-Question-Answering-Bot-and-custom-Bot-UI-
If you don’t have the GitHub CLI installed, you can also use the standard git clone
git clone https://github.com/sanjay-senthilkumar01/Custom-Question-Answering-Bot-and-custom-Bot-UI-.gi
Bot Framework v4 Custom question answering bot sample. This sample demonstrates usage of advanced features of Custom question answering like Precise answering, support for unstructured sources along with Multi-turn conversations and Active Learning in a bot.
This bot has been created using Bot Framework, it shows how to create a bot that uses the Custom question answering feature in Language Service.
Concepts introduced in this sample
The Custom question answering feature in Language Service enables you to build, train and publish a simple question and answer bot based on FAQ URLs, structured and unstructured documents or editorial content in minutes. In this sample, we demonstrate:
- How to use the Active Learning to generate suggestions for knowledge base.
- How to use follow up prompts to create multiple turns of a conversation.
- How to configure display of precise answers.
- How to enable/disable querying unstructured sources with the bot.
Prerequisites
- This project requires a Language resource with Custom question answering enabled.
Configure knowledge base of the project
- Follow instructions here to create a Custom question answering project. You will need this project’s name to be used as
ProjectName
in appsettings.json. - Visit Language Studio and open created project.
- Go to
Edit knowledge base
-> Click on...
-> Click onImport questions and answers
-> Click onImport as TSV
. - Import SampleForCQA.tsv file.
- You can test your knowledge base by clicking on
Test
option. - Go to
Deploy knowledge base
and click onDeploy
.
Connect your bot to the project.
Follow these steps to update appsettings.json.
- In the Azure Portal, go to your resource.
- Go to
Keys and Endpoint
under Resource Management. - Copy one of the keys as value of
LanguageEndpointKey
and Endpoint as value ofLanguageEndpointHostName
in appsettings.json. ProjectName
is the name of the project created in Language Studio.
To try this sample
- Install the Bot Framework Emulator version 4.14.0 or greater from here
- Run the bot from a terminal or from Visual Studio, choose option A or B.
- A) From a terminal
# run the bot
dotnet run
- B) Or from Visual Studio
- Launch Visual Studio
- File -> Open -> Project/Solution
- Select
QnABotWithMSI.csproj
file - Press
F5
to run the project - Connect to the bot using Bot Framework Emulator 1) Launch Bot Framework Emulator 2) File -> Open Bot 3) Enter a Bot URL of
http://localhost:3978/api/messages
Try Active Learning
- Try the following utterances: 1) Surface Book 2) Power
- In Language Studio, click on inspect to see the closeness in the scores of the returned answers.
- In Bot Framework Emulator, a card is generated with the suggestions.
- Clicking an option would send a feedback record which would show as suggestion under
Review suggestions
in Language Studio. ActiveLearningCardTitle
,ActiveLearningCardNoMatchText
andActiveLearningCardNoMatchResponse
in the card could be changed from QnAMakerBaseDialog.cs.
Try Multi-turn prompt
- Try the following utterances: 1) Accessibility 2) Options
- You will notice that multi-turn prompts associated with the question are also returned in the responses.
Try Precise Answering
- Try the following utterances: 1) Accessibility 2) Register
- You will notice a short answer returned along with a long answer.
- If testing in Language Studio, you might have to check
Include short answer response
at the top. - You can disable precise answering by setting
EnablePreciseAnswer
to false in appsettings.json. - You can set
DisplayPreciseAnswerOnly
to true in appsettings.json to display just precise answers in the response. - Learn more about precise answering.
Query unstructured content
- Go to your project in Language Studio -> In
Manage sources
click on+ Add source
- Click on
URLs
and addhttps://www.microsoft.com/en-us/microsoft-365/blog/2022/01/27/from-empowering-frontline-workers-to-accessibility-improvements-heres-whats-new-in-microsoft-365/
and select unstructured in theClassify file structure
dropdown. - Try the following utterances: 1) Frontline workers 2) Hybrid work solutions
- You can observe that, answers are returned with high score.
- You can set
_includeUnstructuredSources
to false in QnAMakerBaseDialog.cs to prevent querying unstructured sources.
Try Filters
- Go to your project in Language Studio -> In
Edit knowledge bases
-> Under Metadata column click on+ Add
- Select a QnA to edit and add a key value pair, say
Language
:CSharp
, and click onSave changes
. - Click on
Test
and select metadata that you just added(Language : CSharp
) by clicking on Show advanced options. - This will return answers with specified metadata only.
- You can filter answers using bot as well by passing metadata and/or source filters. Edit line no. 81 in QnAMakerBaseDialog.cs to something like below. Learn more.
var filters = new Filters
{
MetadataFilter = new MetadataFilter()
{
LogicalOperation = Bot.Builder.AI.QnA.JoinOperator.AND.ToString()
},
LogicalOperation = Bot.Builder.AI.QnA.JoinOperator.AND.ToString()
};
filters.MetadataFilter.Metadata.Add(new KeyValuePair<string, string>("Language", "CSharp"));
filters.SourceFilter.Add("SampleForCQA.tsv");
filters.SourceFilter.Add("SampleActiveLearningImport.tsv");
// Initialize Filters with filters in line No. 81
Microsoft Teams channel group chat fix
When a bot (named as HelpBot
) is added to a Teams channel or Teams group chat, you will have to refer it as @HelpBot
How to build a bot?
to get answers from the service. However, bot tries to send <at>HelpBot</at>
How to build a bot?
as query to Custom question answering service which may not give expected results for question to bot. The following code removes <at>HelpBot</at>
mentions of the bot from the message and sends the remaining text as query to the service.
- Goto
Bots/QnABotWithMSI.cs
- Add References
using Microsoft.Bot.Connector;
using System.Text.RegularExpressions;
- Modify
OnTurnAsync
function as:
public override async Task OnTurnAsync(ITurnContext turnContext, CancellationToken cancellationToken = default)
{
// Teams group chat
if (turnContext.Activity.ChannelId.Equals(Channels.Msteams))
{
turnContext.Activity.Text = turnContext.Activity.RemoveRecipientMention();
}
await base.OnTurnAsync(turnContext, cancellationToken);
// Save any state changes that might have occurred during the turn.
await ConversationState.SaveChangesAsync(turnContext, false, cancellationToken);
await UserState.SaveChangesAsync(turnContext, false, cancellationToken);
}
Deploy the bot to Azure
See Deploy your C# bot to Azure for instructions.
The deployment process assumes you have an account on Microsoft Azure and are able to log into the Microsoft Azure Portal.
If you are new to Microsoft Azure, please refer to Getting started with Azure for guidance on how to get started on Azure.
Further reading
Custom Bot UI for Your Website: A Step-by-Step Guide
Integrating a chatbot into your website can enhance user experience and provide quick answers to common questions. In this guide, we’ll walk you through the process of adding a web chatbot to your website with a customized user interface. This tutorial assumes you have a Microsoft Bot Framework bot and basic knowledge of HTML, CSS, and JavaScript.
Clone the Repository
You can clone my repository to your local machine using Git and you can find the custom UI. To do so, open your terminal or command prompt and navigate to the directory where you want to clone the project. Then, use the following command:
gh repo clone sanjay-senthilkumar01/Custom-Question-Answering-Bot-and-custom-Bot-UI-
If you don’t have the GitHub CLI installed, you can also use the standard git clone
git clone https://github.com/sanjay-senthilkumar01/Custom-Question-Answering-Bot-and-custom-Bot-UI-.gi
Prerequisites:
Before you begin, make sure you have the following:
- A Microsoft Bot Framework bot with a Direct Line token.
- Basic knowledge of HTML, CSS, and JavaScript.
- Access to the HTML code of your website.
Getting Started:
Follow these steps to integrate the web chatbot into your website:
Step 1: Add HTML Code
Copy and paste the following HTML code into the HTML source code of your web page where you want the chatbot to appear:
<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
<style>
/* Your CSS styles go here */
</style>
</head>
<body>
<!-- Your chatbot container goes here -->
<script>
// Your JavaScript code goes here
</script>
</body>
</html>
This code sets up the basic structure of your web page and includes the necessary scripts and styles.
Step 2: Configure the JavaScript Code
In the JavaScript section of your code, you’ll need to configure a few settings:
// Replace 'Your direct line key here' with your actual Direct Line token from Azure Bot Service.
directLine: window.WebChat.createDirectLine({
token: 'Your direct line key here'
}),
Replace ‘Your direct line key here’ with the actual Direct Line token you obtain from your Azure Bot Service. This token is crucial for establishing a connection between your web chat and your bot.
Step 3: Customize the Appearance (CSS)
- You can customize the appearance of your chatbot by modifying the CSS styles within the
<style>
tags. Adjust colors, sizes, and other styling attributes to match your website’s design.
Step 4: Additional Customization (JavaScript)
You can further customize the chatbot’s appearance and behavior by modifying the provided JavaScript code. Here are some customization options:
- Changing the bot’s name: Update the text within the
<span id="cover-name">
element to change the bot’s display name. - Styling: Customize the chat window’s appearance by modifying the CSS styles defined within the
<style>
tags. Adjust colors, sizes, and other visual aspects. - Timeout for resizing: By default, the chat window will automatically reset to its initial size after 5 minutes of inactivity. You can adjust this timeout by changing the value passed to
resetToInitialSize
within thestartResizingTimeout
function. - Initial chat window size: Modify the initial size of the chat window for different screen sizes by adjusting the values within the
resetToInitialSize
function.
Usage:
Once you’ve integrated the code into your website and customized it to your liking, visitors to your website can interact with the chatbot by clicking on the chatbot icon. The chatbot will expand, allowing users to ask questions and receive responses.
Troubleshooting:
If you encounter any issues or have questions about integrating the chatbot into your website, refer to the Microsoft Bot Framework documentation or seek assistance from your development team.
Credits:
This integration is powered by the Microsoft Bot Framework Web Chat library. For more information about the library and its capabilities, visit Bot Framework Web Chat documentation.