Follow-up suggestion is usually shown after assistant response. It guides the user towards continuing the conversation about a specific product. We recommend using it along with an Inline ad or Box ad that will actually link to the advertiser website and drive conversion.

How to use a BoxAd

  • code - Code for unique identification of the ad placement (you get this code from us during onboarding)
  • messageId - Unique ID of the message the ad is tied to
  • onClick - Handler that takes a string and expects you to send the message user clicked to assistant or to add it to the chat input.
  • leftIcon? - Icon to be shown on the left side of the suggestion (optional)
  • rightIcon? - Icon to be shown on the right side of the suggestion (optional)
<QueryStream
    code="<your-code>"
    onClick={(suggestion) => sendUserMessage(suggestion)}
    leftIcon={<SearchIcon/>}
    messageId="<unique-message-id>"
/>

Custom styling

  • .mb-query-stream - Top level wrapper class
  • .mb-query-stream-left-icon - Left icon class
  • .mb-query-stream-right-icon - Right icon class