Scenario Overview

As a developer you may run into scenarios where a user action, such as pressing a button, needs to be logged in the chat history without overt user involvement. This could be crucial for maintaining conversation context or system logging purposes.

1

Add a Button to Trigger the Message

Add a button to your interface with an onClick event handler that will call a function to send the system message:

<button id="log-action" onClick="logUserAction()">Log Action</button>
2

Log the Action as a System Message

When the button is clicked, the logUserAction function will silently insert a system message into the chat history:

function logUserAction() {
  // Function to log the user action
  vapi.send({
    type: "add-message",
    message: {
      role: "system",
      content: "The user has pressed the button, say peanuts",
    },
  });
}
  • vapi.send: The primary function to interact with your assistant, handling various requests or commands.
  • type: "add-message": Specifies the command to add a new message.
  • message: This is the actual message that you want to add to the message history.
    • role: “system” Designates the message origin as ‘system’, ensuring the addition is unobtrusive. Other possible values of role are ‘user’ | ‘assistant’ | ‘tool’ | ‘function’
    • content: The actual message text to be added.

Practical Use Cases

  • Silent logging of user activities. - Contextual updates in conversations triggered by background processes. - Non-intrusive user experience enhancements through additional information provision.