Live dashboard

With Voximplant's contact center, you can create a dashboard that shows all necessary metrics and updates them live. You can access this dashboard's data from anywhere by making HTTP requests. You decide what metrics to collect and show.

This article will help you to create a live dashboard for the contact center.

To store the metrics and access them elsewhere, we are going to use Key-value storage. In the contact center scenario, we need to decide what metrics we need and save them to the key-value storage via the VoxEngine's put method.

To access the saved data from the scenario, you can use the get method. However, we need to access the data from outside the contact center's application, which is why we are going to use the Management API GetKeyValueItems method. You can call this method from any Voximplant's or 3rd-party applications and websites to get the stored data.

Let us assume, that you already have your application working. It can be a common voice contact center or even a video contact center. You can refer to these articles to learn how to create a contact center.

Alternatively, you can collect any data from any application you have, for example, a call list application or a common calling application.

First, you need to require the ApplicationStorage, that manages the key-value storage, as it is explained in the Key-value storage guide:

require(Modules.ApplicationStorage);

Then, you need to decide what data to collect. Create an object in your scenario and store there all the data you need for your dashboard. We recommend creating a prefix for all key-value pairs that you are going to use in this application, so you can manage all the keys at once (request, delete).

Use the ApplicationStorage.put method to save the key-value pairs to the storage. Remember, when you create a new record with the same key, the old value is deleted.

In this example, we are going to save the basic call data, such as caller number, destination number, call state, and connection time. See the full scenario example to understand how it works:

In this scenario example, each time you call updateCallData(), the key-value pairs are updated.

Do not forget to delete the existing key-value pairs after you stop your application to prevent additional spending. You can find the pricing for key-value storage on the Voximplant's billing page.

After you store all necessary metrics for your dashboard to the key-value storage, you can request these metrics from your dashboard via a Management API's method called GetKeyValueItems. You receive the data in the JSON format, so it is easy for you to parse the data and substitute it to your dashboard. And you can control how often you want to update the data.

Refer to the Service accounts and API keys to learn how to authorize during your Management API request.