Tutte le comunicazioni tra un modulo dell'interfaccia utente di Agent Assist e il relativo connettore avvengono tramite eventi personalizzati. Il connettore del modulo UI facilita gli eventi tra il desktop dell'agente e i moduli UI.
Ad esempio, quando viene ricevuto un suggerimento di Agent Assist, un servizio di connessione dei moduli UI invia un evento analyze-content-received
ai moduli UI e i moduli sono iscritti a questi eventi.
Dettagli dell'evento personalizzato
Per l'elenco completo degli eventi del modulo UI e dei relativi payload, consulta la documentazione dell'API relativa agli eventi del modulo UI.
Per inviare manualmente un evento personalizzato, utilizza la seguente sintassi:
dispatchAgentAssistEvent('event_name', {
detail: event_payload,
});
L'esempio seguente mostra come inviare l'evento analyze-content-received
:
if (newMessageFromHumanAgent) { dispatchAgentAssistEvent('analyze-content-received', { detail: { participantRole: 'HUMAN_AGENT', request: { textInput: {text: newMessageFromHumanAgent}, messageSendTime: new Date().toISOString() } } }); }
Dopo aver inviato un evento personalizzato, nel servizio connettore del modulo UI vedrai quanto segue:
this.api.analyzeContent(...).then(function (response) {
dispatchAgentAssistEvent('analyze-content-response-received', {
detail: {response: response}});
});
Nel modulo vedrai quanto segue:
addAgentAssistEventListener('analyze-content-response-received', function (event) {
// Use the AnalyzeContent response to render suggestions in the UI.
});
Per abbonarti manualmente a un evento personalizzato, utilizza la seguente sintassi:
addAgentAssistEventListener('event_name', function (event) {
// `event.detail` contains the event payload.
});
L'esempio seguente mostra un abbonamento a un evento personalizzato:
addAgentAssistEventListener('smart-reply-selected', function (event) { var chipContent = event.details; // Populate the agent chat box with the selected Smart Reply chip. });
Connettori di moduli UI personalizzati
Puoi anche utilizzare eventi personalizzati per creare connettori di moduli UI personalizzati, che ti consentono di integrare i moduli UI in un desktop dell'agente non supportato da Agent Assist. Per saperne di più sull'implementazione di moduli e connettori, consulta la documentazione sull'implementazione.
Se integri i moduli dell'interfaccia utente di Agent Assist in qualsiasi desktop dell'agente senza un connettore di moduli dell'interfaccia utente predefinito, dovrai scriverne uno personalizzato. Dopo aver creato un connettore di moduli UI personalizzati, torna alla documentazione relativa all'implementazione dei moduli UI per informazioni dettagliate sulla configurazione dei connettori e sull'implementazione dei moduli. Puoi utilizzare un connettore del modulo UI personalizzato con un container gestito o con singoli moduli.
Un connettore del modulo dell'interfaccia utente personalizzata deve essere responsabile delle seguenti operazioni:
- Invio di un evento per selezionare la conversazione attiva. In questo modo, la conversazione e i relativi partecipanti verranno inizializzati.
Nome evento:
active-conversation-selected
- Per le conversazioni di chat, invio di un evento ogni volta che viene registrata una nuova espressione
da parte dell'agente o del cliente.
Nome evento:
analyze-content-requested
- Notifica al sistema di moduli quando la "modalità Buio" è stata attivata/disattivata nell'applicazione principale.
Nome evento:
dark-mode-toggled
Inoltre, un connettore del modulo UI personalizzato deve sottoscrivere i seguenti eventi per aggiornare l'interfaccia utente del desktop dell'agente, se applicabile:
- Per Risposta rapida, aggiorna il campo di input dell'agente ogni volta che viene selezionato un chip di Risposta rapida.
Nome evento:
smart-reply-selected
. - Per l'assistente generativo di conoscenze, aggiorna il campo di input dell'agente ogni volta che una risposta dell'assistente di conoscenze viene incollata nella casella di input.
Nome evento:
knowledge-assist-v2-answer-pasted
.
Inizializza più istanze di moduli UI con namespace
Per caricare più istanze dei moduli UI sulla stessa pagina, i desktop degli agenti richiedono più istanze di inizializzazione. Per mantenerli separati, durante l'inizializzazione, passa un'opzione di configurazione namespace
ai moduli UI e al UIModulesConnector
.
Utilizza questa opzione se noti messaggi e suggerimenti condivisi tra conversazioni distinte nel desktop dell'agente. Ad esempio:
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);