Konektor peristiwa kustom dan modul UI kustom

Semua komunikasi antara modul UI Agent Assist dan konektornya terjadi melalui peristiwa kustom. Konektor modul UI memfasilitasi peristiwa antara desktop agen dan modul UI.

Misalnya, saat saran Agent Assist diterima, layanan konektor modul UI akan mengirimkan peristiwa analyze-content-received ke modul UI, dan modul tersebut berlangganan peristiwa tersebut.

Detail peristiwa kustom

Untuk mengetahui daftar lengkap peristiwa modul UI dan payload-nya, lihat dokumentasi API peristiwa modul UI.

Untuk mengirim peristiwa kustom secara manual, gunakan sintaksis berikut:

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

Contoh berikut menunjukkan cara mengirim peristiwa analyze-content-received:

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

Setelah mengirim peristiwa kustom, Anda akan melihat hal berikut di layanan konektor modul UI:

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

Dan Anda akan melihat hal berikut di modul:

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

Untuk berlangganan peristiwa kustom secara manual, gunakan sintaksis berikut:

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

Contoh berikut menunjukkan langganan peristiwa kustom:

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

Konektor modul UI kustom

Anda juga dapat menggunakan peristiwa kustom untuk membuat konektor modul UI kustom Anda sendiri, yang memungkinkan Anda mengintegrasikan modul UI ke desktop agen yang tidak didukung oleh Agent Assist. Untuk mengetahui informasi selengkapnya tentang penerapan modul dan konektor, lihat dokumentasi penerapan.

Jika Anda mengintegrasikan modul UI Agent Assist ke desktop agen tanpa konektor modul UI bawaan, Anda harus menulis konektor kustom. Setelah membuat konektor modul UI kustom, kembali ke dokumentasi penerapan modul UI untuk mengetahui detail tentang cara mengonfigurasi konektor dan menerapkan modul. Anda dapat menggunakan konektor modul UI kustom dengan penampung terkelola atau dengan modul individual.

Konektor modul UI kustom harus bertanggung jawab atas operasi berikut:

  1. Mengirim peristiwa untuk memilih percakapan aktif. Tindakan ini akan menginisialisasi percakapan beserta pesertanya. Nama peristiwa: active-conversation-selected
  2. Untuk percakapan chat, mengirim peristiwa setiap kali ucapan baru didaftarkan dari agen atau pelanggan. Nama peristiwa: analyze-content-requested
  3. Memberi tahu sistem modul saat 'mode gelap' diaktifkan di aplikasi utama aplikasi. Nama peristiwa: dark-mode-toggled
  4. Mengirim peristiwa untuk meminta agar percakapan ditandai sebagai selesai di backend. Nama peristiwa: complete-conversation-requested

Selain itu, konektor modul UI kustom harus berlangganan peristiwa berikut untuk memperbarui UI desktop agen jika berlaku:

  1. Untuk Smart Reply, perbarui kolom input agen setiap kali chip Smart Reply dipilih. Nama peristiwa: smart-reply-selected.
  2. Untuk Generative Knowledge Assist, perbarui kolom input agen setiap kali jawaban knowledge assist ditempelkan ke kotak input. Nama peristiwa: knowledge-assist-v2-answer-pasted.

Menginisialisasi beberapa instance modul UI dengan namespace

Untuk memuat beberapa instance modul UI di halaman yang sama, desktop agen memerlukan beberapa instance inisialisasi. Untuk memisahkannya, saat inisialisasi, teruskan opsi konfigurasi namespace ke modul UI dan UIModulesConnector.

Gunakan opsi ini jika Anda melihat pesan dan saran yang dibagikan di antara percakapan yang berbeda di desktop agen. Contoh:

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);