Integrate UI modules with LivePerson

This document walks you through the steps required to integrate UI modules with LivePerson and surface real-time suggestions. The following actions are included in this tutorial:

  1. Install the Conversational Cloud application in LivePerson.
  2. Update the missing environment variables in both servers and re-deploy them.
  3. Configure the Agent Assist widget in LivePerson.

Before you begin

You must complete the following actions before you can begin this tutorial. Both repositories need to be deployed before the LivePerson integration will work:

  1. For access to the repository, please reach out to agent-assist-ui-modules-support@google.com.
  2. Deploy an application server that will serve the Agent Assist modules UI.
  3. Deploy a proxy server that will handle authentication and calls to the Dialogflow API.

Install a Conversational Cloud application

You need to register your application as a Conversational Cloud application in your LivePerson account in order to integrate with LivePerson OAuth authentication. You will need to contact a LivePerson team member who can facilitate the installation. Follow the instructions for doing this in the LivePerson documentation.

The Manifest Schema that you submit to LivePerson should look similar to the following. Replace all instances of {APPLICATION_SERVER_URL} with the URL of your UI modules application server:

{
  "client_name": "com.liveperson.GoogleAgentAssist",
  "display_name": "Agent Assist",
  "response_types": ["code"],
  "scope": "msg.consumer",
  "entry_uri": "{APPLICATION_SERVER_URL}",
  "grant_types": [
    "authorization_code",
    "client_credentials",
    "refresh_token"
  ],
  "redirect_uris": [
    "{APPLICATION_SERVER_URL}/home"
  ]
}

Update missing environment variables

Once the Conversational Cloud application has been installed, LivePerson will provide a client ID and client secret. Update the environment variables of the application server and the proxy server to include the correct values for LP_CLIENT_ID and LP_CLIENT_SECRET, then re-deploy both servers.

Configure the LivePerson widget

To configure the LivePerson widget, follow the instructions for adding your own widgets to the agent workspace.

The URL of the application should be in the following format, with the following replacements:

  • Replace {APPLICATION_SERVER_URL} with the URL of your UI application server.
  • Replace {CONVERSATION_PROFILE_NAME} with the name of the Conversation Profile you would like to use (example: projects/my-project/conversationProfiles/abc123).
  • Replace {FEATURES} with a comma-separated list of Agent Assist features you would like the application to include. Currently supported features include: SMART_REPLY, ARTICLE_SUGGESTION, FAQ, and CONVERSATION_SUMMARIZATION. Only include features that are configured on your conversation profile.

{APPLICATION_SERVER_URL}?conversationProfile={CONVERSATION_PROFILE_NAME}&features={FEATURES}

Example URL:

https://my-project.wm.r.appspot.com?conversationProfile=projects/my-project/conversationProfiles/abc123&features=ARTICLE_SUGGESTION,CONVERSATION_SUMMARIZATION