Nav Bar

The widget appears as a tab on the left side of the agent console. Display the entry page you configured in the manifest in the tab.

Example manifest:

{
  "manifestVersion": "2.0",
  "agentConsole": {
    "widgets": {
      "navBar": {
        "id": "custom-tab",
        "url": "./index.html",
        "label": "Custom Tab"
      }
    }
  }
}

See more introduction.

The following additional actions are available in this widget:

Chat
Ticket

How to Use API

You must invoke api through SDK, which provides different methods, such as listening to events using the on method. Which method is used to call the api? It it desided by the providor.

Learn more for SDK view here.

Actions

Set a badge for the extended tab.
You can set a badge on the tab, e.g. the number of unprocessed messages.

Params:

Name	Type	Description
badge	number	It will display yellow badge on the top of tab when the value is more than `0`

Return: No

Example:

const client = APPClient.init();
client.set("agentconsole.navBar.badge", badge);

2. Switch Nav Bar
Use this API to switch to the specify tab according to the passed tab Id.

Params:

Name	Type	Description
id	string	The id of the nav bar, system tab Id: `visitor`, `chat`, `tickets` and `agent`. If it is extensive tab, use the widgetId instead.

Return: No.

Example:

const client = APPClient.init();
client.set("agentconsole.navBar.select", id);

Events

Nav Bar switched event

You can listen to the following event to track left tab switched.

Params:

Name	Type	Description
callback	function	The callback function will be fired when left tab changed.

Return: No.

Example:

const client = APPClient.init();
client.on("agentconsole.navBar.selected", function (leftTab) {
  // do stuff
});