カスタム イベントとカスタム UI モジュール コネクタ

Agent Assist UI モジュールとそのコネクタ間の通信はすべて、カスタム イベントを介して行われます。UI モジュール コネクタは、エージェント デスクトップと UI モジュール間のイベントを容易にします。

たとえば、エージェント アシストの候補が受信されると、UI モジュール コネクタ サービスは UI モジュールに analyze-content-received イベントをディスパッチします。モジュールはこのようなイベントにサブスクライブされます。

カスタム イベントの詳細

UI モジュール イベントとそのペイロードの完全なリストについては、UI モジュール イベント API のドキュメントをご覧ください。

カスタム イベントを手動でディスパッチするには、次の構文を使用します。

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

次の例は、analyze-content-received イベントをディスパッチする方法を示しています。

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

カスタム イベントをディスパッチすると、UI モジュール コネクタ サービスに次のように表示されます。

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

モジュールには次のように表示されます。

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

カスタム イベントを手動でサブスクライブするには、次の構文を使用します。

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

次の例は、カスタム イベント サブスクリプションを示しています。

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

カスタム UI モジュール コネクタ

カスタム イベントを使用して独自のカスタム UI モジュール コネクタを作成することもできます。これにより、Agent Assist でサポートされていないエージェント デスクトップに UI モジュールを統合できます。モジュールとコネクタの実装の詳細については、実装ドキュメントをご覧ください。

事前構築された UI モジュール コネクタを使用せずに、Agent Assist UI モジュールをエージェント デスクトップに統合する場合は、カスタム コネクタを作成する必要があります。カスタム UI モジュール コネクタを作成したら、UI モジュールの実装のドキュメントに戻り、コネクタの構成とモジュールの実装について確認します。カスタム UI モジュール コネクタは、マネージド コンテナまたは個々のモジュールで使用できます。

カスタム UI モジュール コネクタは、次のオペレーションを担当する必要があります。

  1. アクティブな会話を選択するイベントをディスパッチしています。これにより、会話とその参加者が初期化されます。イベント名: active-conversation-selected
  2. チャット会話の場合、エージェントまたはお客様から新しい発話が登録されるたびにイベントをディスパッチします。イベント名: analyze-content-requested
  3. プライマリ アプリで「ダークモード」が切り替えられたときにモジュール システムに通知する。イベント名: dark-mode-toggled

また、カスタム UI モジュール コネクタは、該当する場合にエージェント デスクトップ UI を更新するために、次のイベントをサブスクライブする必要があります。

  1. スマート リプライの場合、スマート リプライ チップが選択されるたびに、エージェントの入力フィールドを更新します。イベント名: smart-reply-selected
  2. 生成ナレッジ アシストの場合、ナレッジ アシストの回答が入力ボックスに貼り付けられるたびに、エージェントの入力フィールドを更新します。 イベント名: knowledge-assist-v2-answer-pasted