Skip to main content

Integrating a Buddy in UI-Kit

This topic covers the necessary tasks to add a Pega GenAI Knowledge Buddy™ to a UI-KIT application. Before you perform these steps, ensure that the Buddy component is in your application, and then verify that the authentication profile and Knowledge Buddy service URL have the correct configurations. For more information, see the Implementation Guide at Knowledge Buddy integration and the topic Integrating a Buddy into a Pega application.

After you meet the prerequisites, perform the steps described in the following sections in order.

Setting up the configuration

The Knowledge Buddy - Widget Configuration Set enables you to customize the parameters of a Buddy's behavior. Confirm that the setup of the Configuration Set is correct.

  1. In the navigation pane of App Studio, click Settings > Configurations.
  2. Locate the configuration set named Knowledge Buddy – Widget.
  3. Optional: If you want to change any configurations, click Edit this setting, apply a change, and then click Submit.

Five configurations are included with the standalone Buddy for both UI KIT and Constellation:

  • Default Knowledge Buddy: Enter the Buddy name as the default for the Buddy widget to refer to and generate a response. If you leave this blank, the Knowledge Buddy does not produce any response.
  • Display References: When enabled, the Buddy displays the references that it uses to generate the response for the query asked.
  • Enable Copy Response: Enables the copy response option for responses generated by Knowledge Buddy. When enabled, a copy option is displayed next to each Buddy response, which users can click to copy the response.
  • Enable Share Response: Enables the share response option for responses generated by Knowledge Buddy. When enabled, a Share option is displayed next to each Buddy response, allowing users to share the response in email/chat.
Note: You need to enable the Email or Messaging channel enabled on the application and integrate the Share response event by the Buddy. Without this, users will not be able to share a response.
  • Enable Share Reference: If enabled, the system shares the reference in the Buddy response in email or chat when configured, along with the Buddy response.
The Knowledge-Buddy Widget configuration set

Setting up the UI

To set up the UI correctly, add the KMBuddyStyleHelper CSS file to the application skin.

  1. In the header of Dev Studio, click the Application > Skin.
  2. Click the Included Styles tab.
  3. Expand the Additional Style sheets section, and then click Add style sheet.
  4. In the field, enter or select KMBuddyStyleHelper.
    The additional style sheets section with kmbuddystylehelper style sheet added

The KMBuddyContainer Section belongs to the @baseclass class and the PegaKnowledgeBuddy-Component Ruleset. It includes the Knowledge Buddy UI out of the box. Add this Section to a wrapper section in the respective implementation layer to embed Buddy.

The Section accepts the InvokedFrom parameter, which differentiates whether you added the Buddy as part of the Knowledge Management widget. Configure the parameter with the value KMWidget if you added it along with the KM Widget.

This Section includes the following features:

  1. Search area: Takes the search text and the Buddy configurations selected in App Studio as parameters and invokes the Buddy Data Page.
  2. Response: Displays the content and references of a Buddy's response. The Section references KMBuddyReferences, which you can override in the respective implementation layer to customize the onClick behavior of references (the included onClick references open the content in a new tab).
  3. Default disclaimer: Displays the default disclaimer when the Buddy answers a question. You can override the default value of the disclaimer by using the Knowledge Buddy Disclaimer field value.
     
A UI-Kit application where a Knowledge Buddy was added to the dashboard.

 


This Topic is available in the following Module:

If you are having problems with your training, please review the Pega Academy Support FAQs.

Did you find this content helpful?

Want to help us improve this content?

We'd prefer it if you saw us at our best.

Pega Academy has detected you are using a browser which may prevent you from experiencing the site as intended. To improve your experience, please update your browser.

Close Deprecation Notice