• This article talks about a workaround for creating multiple topic pickers that render a specific list of topics as required.
• This article also talks about removing/Hiding the topics from the main OOB topic picker so to avoid rendering duplicates in the custom topic pickers.

Firstly what is a topic picker :

• The topic Piker renders the collection of published topics which is rendered by the below API.
• var greetingMessage = vaSystem.getTopicSelectionMessage(); vaSystem.sendTopicPickerControl(greetingMessage, "<New Name>"); * This setup topic controls the display of the initial greetings and the Show me everything button in Virtual Agent conversations. * As it is clear what the topic picker is, let's dive into creating a multiple topic picker that doesn't use the above API as there is no way to render the specific list of topics using the OOB method.

Creating a Button that looks like a topic picker that leverages the 'promoted topics' configuration.

• Please refer to the Configure a Virtual Agent chat experience to understand what promoted topics are.
• 1. Navigate to .
  
  1. Or simply open the 'sys_cs_context_profile' and scroll down to the related list as shown in the below image.
     
  2. Create a topic from the designer that renders a list of topics to be shown in the new custom topic picker as shown below.
     
  3. In the static choice component, Configure the list of choices that are to be rendered.
     
  4. To map the choices to the actual topics, we need a script action to call the respective topics.
     
  5. The below script explains using the supported API to call a specific topic which is documented in the Virtual Agent scripts.

(function execute() {

  vaVars.selectedTopic = vaInputs.select_topic;

 switch (vaVars.selectedTopic) {

  case 'Test choice':
  vaSystem.switchTopicByName('Test choice') ;
    break;

  case 'Test multi link':
  vaSystem.switchTopicByName('Test multi link') ;
    break;

    case 'Test Queues':
  vaSystem.switchTopicByName('Test Queues') ;
    break;

    case 'survey test':
  vaSystem.switchTopicByName('survey test') ;
    break;
}
})()

• Create a scripted variable EX:'selectedTopic' that stores the value of the selected topic and make use of it in the switch case.
• The variable 'vaInputs.select_topic' is the name of the static choice component defined above and its value of it is mapped to the scripted variable 'vaVars.selectedTopic'.
• As mentioned above the script leverages the OOB API called 'vaSystem.switchTopicByName('') ;'.

Mapping the above topic created to the promoted topics.

• Once the topic is created, as mentioned above, Click on the add topic UI action in the promoted topics and select the above-created topic.
• The VA chatbot renders the Promoted topic as shown below.
• 
• On click of the 'Frequently used Topics' which is a custom topic that is been created above, The VA renders the list of topics as shown below.
• 

How to remove the topics from the OOB Topic Picker:

• Navigate to the designer > Open the topic that should be removed from the topic picker.
• Uncheck the 'Included in the list of topics ' check box as shown below.
• 

Note:

• This article demonstrates navigating to several topics using a switch case, but this can be done using the OOB way by creating several decision components and script actions.
• The script action uses the topic names that I have configured, but please add the topics as per the requirement.

Do share your thoughts on the same.

Happy learning.

Labels: