Nav Bar
- 14 Jul 2022
- 1 Minute to read
- Print
- DarkLight
Nav Bar
- Updated on 14 Jul 2022
- 1 Minute to read
- Print
- DarkLight
Article summary
Did you find this summary helpful?
Thank you for your feedback
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:
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
});
Was this article helpful?