Benutzerdefinierte Ereignisse und benutzerdefinierte UI-Modul-Connectors

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

Wenn beispielsweise ein Agent Assist-Vorschlag eingeht, sendet ein Connector-Dienst für UI-Module ein analyze-content-received-Ereignis an die UI-Module. Die Module sind für solche Ereignisse registriert.

Details zu benutzerdefinierten Ereignissen

Die 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 Ereignis analyze-content-received 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 für UI-Module Folgendes angezeigt:

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

Und 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 sich manuell für ein benutzerdefiniertes Ereignis zu registrieren:

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

Das folgende Beispiel zeigt eine benutzerdefinierte Ereignisregistrierung:

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

Benutzerdefinierte Connectors für UI-Module

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

Wenn Sie Agent Assist-UI-Module in einen Agent-Desktop ohne vorgefertigten Connector für UI-Module einbinden, müssen Sie einen benutzerdefinierten Connector erstellen. Nachdem Sie einen benutzerdefinierten Connector für UI-Module erstellt haben, kehren Sie zur Dokumentation zur Implementierung von UI-Modulen zurück. Dort finden Sie Details zum Konfigurieren Ihrer Connectors und zum Implementieren der Module. Sie können einen benutzerdefinierten Connector für UI-Module entweder mit einem verwalteten Container oder mit einzelnen Modulen verwenden.

Ein benutzerdefinierter Connector für UI-Module muss für die folgenden Vorgänge verantwortlich sein:

1. Senden eines Ereignisses, um die aktive Unterhaltung auszuwählen. Dadurch wird die Unterhaltung zusammen mit den Teilnehmern initialisiert. Ereignisname: active-conversation-selected
2. Bei Chatunterhaltungen: Senden eines Ereignisses, wenn eine neue Äußerung vom Agent oder Kunden registriert wird. Ereignisname: analyze-content-requested
3. Benachrichtigen des Modulsystems, wenn in der primären Anwendung der Dark-Modus aktiviert oder deaktiviert wurde. Ereignisname: dark-mode-toggled

Außerdem muss ein benutzerdefinierter Connector für UI-Module für die folgenden Ereignisse registriert sein, um die UI des Agent-Desktops gegebenenfalls zu aktualisieren:

1. Bei Smart Reply: Aktualisieren des Eingabefelds des Agents, wenn ein Smart Reply-Chip ausgewählt wird. Ereignisname: smart-reply-selected.
2. Bei der generativen Wissensunterstützung: Aktualisieren des Eingabefelds des Agents, wenn eine Antwort der Wissensunterstützung in das Eingabefeld eingefügt wird. Ereignisname: knowledge-assist-v2-answer-pasted.

Mehrere Instanzen von UI-Modulen mit namespace initialisieren

Wenn mehrere Instanzen der UI-Module auf derselben Seite geladen werden sollen, benötigen Agent-Desktops mehrere Initialisierungsinstanzen. Damit sie getrennt bleiben, übergeben Sie bei der Initialisierung eine namespace Konfigurationsoption an die UI-Module und den UIModulesConnector.

Verwenden Sie diese Option, wenn Sie feststellen, dass Nachrichten und Vorschläge zwischen verschiedenen Unterhaltungen auf 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);