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 del 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 eseguire manualmente la sottoscrizione 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 i tuoi 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 personalizzato, 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 di moduli UI personalizzati con un container gestito o con singoli moduli.
Un connettore del modulo UI personalizzato 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 - Invio di un evento per richiedere che la conversazione venga contrassegnata come completata nel backend.
Nome evento:
complete-conversation-requested
Inoltre, un connettore del modulo UI personalizzato deve sottoscrivere i seguenti eventi per aggiornare l'UI del desktop dell'agente, se applicabile:
- Per Risposta rapida, aggiorna il campo di immissione dell'agente ogni volta che viene selezionato un chip di Risposta rapida.
Nome evento:
smart-reply-selected. - Per l'assistenza knowledge base generativa, aggiorna il campo di immissione dell'agente ogni volta che una risposta dell'assistenza knowledge base viene incollata nella casella di immissione.
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 hanno bisogno di più istanze di inizializzazione. Per mantenerli separati, durante l'inizializzazione, passa un'opzione di configurazione namespace ai moduli UI e a 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);