Benutzerdefinierte Ereignisse und benutzerdefinierte UI-Modul-Connectors

Die gesamte Kommunikation zwischen einem Agent Assist-UI-Modul und seinem Connector erfolgt über benutzerdefinierte Ereignisse. Der UI-Modul-Connector ermöglicht Ereignisse zwischen dem Agent-Desktop und den UI-Modulen.

Wenn beispielsweise ein Vorschlag von Agent Assist eingeht, sendet ein UI-Modul-Connector-Dienst ein analyze-content-received-Ereignis an die UI-Module, die solche Ereignisse abonniert haben.

Details zu benutzerdefinierten Ereignissen

Eine vollständige Liste der UI-Modulereignisse und ihrer Nutzlasten finden Sie in der API-Dokumentation zu UI-Modulereignissen.

Verwenden Sie die folgende Syntax, um ein benutzerdefiniertes Ereignis manuell zu senden:

    dispatchAgentAssistEvent('event_name', {
      detail: event_payload,
    });

Das folgende Beispiel zeigt, wie das analyze-content-received-Ereignis gesendet wird:

if (newMessageFromHumanAgent) {
  dispatchAgentAssistEvent('analyze-content-received', {
    detail: {
      participantRole: 'HUMAN_AGENT',
      request: {
        textInput: {text: newMessageFromHumanAgent},
        messageSendTime: new Date().toISOString()
      }
    }
  });
}

Nachdem Sie ein benutzerdefiniertes Ereignis gesendet haben, wird im Connector-Dienst des UI-Moduls Folgendes angezeigt:

    this.api.analyzeContent(...).then(function (response) {
      dispatchAgentAssistEvent('analyze-content-response-received', {
       detail: {response: response}});
    });

Im Modul wird Folgendes angezeigt:

    addAgentAssistEventListener('analyze-content-response-received', function (event) {
      // Use the AnalyzeContent response to render suggestions in the UI.
    });

Verwenden Sie die folgende Syntax, um ein benutzerdefiniertes Ereignis manuell zu abonnieren:

    addAgentAssistEventListener('event_name', function (event) {
      // `event.detail` contains the event payload.
    });

Das folgende Beispiel zeigt ein benutzerdefiniertes Ereignis-Abo:

addAgentAssistEventListener('smart-reply-selected', function (event) {
  var chipContent = event.details;
  // Populate the agent chat box with the selected Smart Reply chip.
});

Connectors für benutzerdefinierte UI-Module

Sie können benutzerdefinierte Ereignisse auch verwenden, um eigene benutzerdefinierte UI-Modul-Connectors zu erstellen. So können Sie die UI-Module in einen Agent-Desktop einbinden, der nicht von Agent Assist unterstützt wird. Weitere Informationen zur Implementierung von Modulen und Connectors finden Sie in der Implementierungsdokumentation.

Wenn Sie Agent Assist-UI-Module in einen beliebigen Agent-Desktop ohne einen vorgefertigten UI-Modul-Connector einbinden, müssen Sie einen benutzerdefinierten Connector schreiben. Nachdem Sie einen Connector für benutzerdefinierte UI-Module erstellt haben, kehren Sie zur Dokumentation zur Implementierung von UI-Modulen zurück, um Informationen zum Konfigurieren der Connectors und zum Implementieren der Module zu erhalten. Sie können einen benutzerdefinierten UI-Modul-Connector entweder mit einem verwalteten Container oder mit einzelnen Modulen verwenden.

Ein benutzerdefinierter Connector für Benutzeroberflächenmodule muss für die folgenden Vorgänge verantwortlich sein:

1. Ein Ereignis wird gesendet, um die aktive Unterhaltung auszuwählen. Dadurch wird die Unterhaltung mit den Teilnehmern gestartet. Name des Ereignisses: active-conversation-selected
2. Bei Chatunterhaltungen wird ein Ereignis gesendet, wenn eine neue Äußerung vom Agent oder Kunden registriert wird. Name des Ereignisses: analyze-content-requested
3. Das Modulsystem wird benachrichtigt, wenn in der primären Anwendung der „Dunkelmodus“ aktiviert oder deaktiviert wurde. Name des Ereignisses: dark-mode-toggled

Außerdem muss ein benutzerdefinierter UI-Modul-Connector die folgenden Ereignisse abonnieren, um die Agent-Desktop-Benutzeroberfläche gegebenenfalls zu aktualisieren:

1. Aktualisieren Sie für die Funktion „Intelligente Antwort“ das Eingabefeld des Agents, wenn ein Chip für die intelligente Antwort ausgewählt wird. Ereignisname: smart-reply-selected.
2. Aktualisieren Sie für die generative Wissensunterstützung das Eingabefeld des Kundenservicemitarbeiters, wenn eine Antwort der Wissensunterstützung in das Eingabefeld eingefügt wird. Ereignisname: knowledge-assist-v2-answer-pasted.

Mehrere UI-Modulinstanzen mit namespace initialisieren

Wenn mehrere Instanzen der UI-Module auf derselben Seite geladen werden sollen, sind für Agent-Desktops mehrere Initialisierungsinstanzen erforderlich. Wenn Sie sie getrennt halten möchten, übergeben Sie bei der Initialisierung die Konfigurationsoption namespace an die UI-Module und UIModulesConnector.

Verwenden Sie diese Option, wenn Sie feststellen, dass Nachrichten und Vorschläge zwischen verschiedenen Unterhaltungen in Ihrem Agent-Desktop geteilt werden. Beispiel:

const connector = new UiModulesConnector();
const config = {};
// ...other UI module connector config options
config.uiModuleEventOptions = { namespace: this.recordId }

const containerElement = document.createElement("agent-assist-ui-modules-v2");
// ...other UI modules HTML attributes
containerEl.setAttribute("namespace", this.recordId);