Options
All
  • Public
  • Public/Protected
  • All
Menu

The ChatBubble class is the high-level container class that allows you to render a Chat Bubble in your web page or React Native app.

Main entry point for interfacing with all functions related to the Botsquad chat bubble. Its main purposes are the following:

  • Get information about the chat bubble (bot details, unread message count)
  • Keep the unread message count updated in realtime
  • Send 'page view' events to indicate on which page the bubble is being displayed
  • Configure the (web)app's push token
  • Handle in-app nudges and allow the user to engage with these.

Getting started

Instantiate this class with a Config object; then call ChatBubble.connect to establish the connection to the server.

Example code:

import { ChatBubble } from '@botsquad/sdk'

const config = {
  // required:
  botId: '66a8fe768ea6fea876f987ea',
  userAgent: 'testApp/1.0 (Android; 8)',

  // optional:
  locale: 'nl_NL',
  timezone: 'Europe/Amsterdam',
  userToken: '<userToken that was sent on the previous connect()>',
  hostname: 'bsqd.me'
}

const bubble = new ChatBubble(config)

// initiate the connection.
const info = await bubble.connect()

// information that is returned:
const {
  userToken,
  userInfo,
  badgeCount,
  bot: {
    id, title, profilePicture
  }
} = info

console.log(`Connected with user token: ${userToken}`)

bubble.on('badgeCountUpdate', badgeCount => {
  console.log('Got new badge count: ' + badgeCount)
})

// page change
bubble.sendPageView('http://pageurl.com', 'page title')

// nudges
bubble.on('nudge', nudge => {
  const {
    message, profilePicture, caption
  } = nudge

  // show the nudge
  if (caption) {
    // show nudge with title bar and (optionally) a picture
  } else {
    // show basic message-only nudge
  }
})

// dismiss the nudge
bubble.nudgeDismiss(nudge)

// engage with the nudge
await bubble.nudgeEngage(nudge)

// open the chat by visiting the webview URL:
bubble.getWebviewUrl()

// configure push token
await bubble.configurePushToken('pushwoosh', '<token data>')

// send extra user information to the bot
await bubble.putUserInfo({ first_name: "john", last_name: "doe", visitor_id: "12345" })

Hierarchy

  • ChatBubble

Index

Constructors

constructor

Properties

Private Optional bot

bot: I.BotAPIResponse

Private config

config: Config

Private conversations

conversations: C.Conversations

Private onNudgeDispatcher

onNudgeDispatcher: SimpleEventDispatcher<Nudge> = new SimpleEventDispatcher<Nudge>()

Private postConnect

postConnect: function[] = []

Private restClient

restClient: R.RESTClient

Private socket

socket: Socket

Private userInfo

userInfo: UserInfo | null = null

Private Optional userToken

userToken: undefined | string

Private Optional visitors

visitors: V.Visitors

Accessors

onBadgeCountUpdate

onBadgeCountUpdate:

Subscribe to updates to the badge counter in the chat bubble.

Usage:

bubble.onBadgeCountUpdate.subscribe(count => console.log(`Count updated: ${count}`))

When you subscribe to the badge count update, the callback is invoked right away with the current badge count value.

onNudge

onNudge:

Subscribe to nudges that are sent from the server. Nudges are sent in response to visitor events, mainly page views.

Methods

connect

Private connectSocket

  • connectSocket(): Promise<void>

disconnect

  • disconnect(): Promise<void>
  • Close the connection to the server, if it was opened.

    Returns Promise<void>

getConfig

  • Return the current config. This is the Config object that was passed in, augmented with all the default parameters.

    Returns Config

getWebviewUrl

  • getWebviewUrl(g?: undefined | string): string | null
  • Retrieve the URL for the webview that can be embedded to show the bot's conversation(s). Returns null when not connected or when the configured but does not have a publicly accessible web interface.

    Parameters

    • Optional g: undefined | string

    Returns string | null

nudgeDiscard

  • nudgeDiscard(nudge: Nudge): Promise<void>
  • Signal the server that the user has discarded a nudge. The given nudge will not be triggered again for this user.

    Parameters

    Returns Promise<void>

nudgeEngage

  • nudgeEngage(nudge: Nudge): Promise<void>
  • Signal the server that the user has engaged with a nudge.

    Parameters

    Returns Promise<void>

putUserInfo

  • Push a user information update to the Botsquad platform.

    For any subsequent new chatbot conversation, the information provided in this API call will be available in Bubblescript under the user.* variable namespace.

    Parameters

    Returns Promise<UserInfo>

registerPushToken

sendPageView

  • sendPageView(url: string, title: string): Promise<__type>
  • Send a page view event to the server.

    Use this to track on which page of the website your user is currently visiting. In the backend this is used to show a realtime view of current visitors.

    Parameters

    • url: string

      The URL of the current page. This parameter needs to be a valid URL, in the form of scheme://hostname/path. For native apps, use something like app://app-package-name/current-screen. If your native app supports Android app links or iOS Universal links, you can also send these.

    • title: string

      The title of the current page or app screen.

    Returns Promise<__type>

Private whenConnected

  • whenConnected<T>(callback: function): Promise<T>
  • Type parameters

    • T

    Parameters

    • callback: function
        • (): Promise<T>
        • Returns Promise<T>

    Returns Promise<T>

Legend

  • Module
  • Object literal
  • Variable
  • Function
  • Function with type parameter
  • Index signature
  • Type alias
  • Type alias with type parameter
  • Enumeration
  • Enumeration member
  • Property
  • Method
  • Interface
  • Interface with type parameter
  • Constructor
  • Property
  • Method
  • Index signature
  • Class
  • Class with type parameter
  • Constructor
  • Property
  • Method
  • Accessor
  • Index signature
  • Inherited constructor
  • Inherited property
  • Inherited method
  • Inherited accessor
  • Protected property
  • Protected method
  • Protected accessor
  • Private property
  • Private method
  • Private accessor
  • Static property
  • Static method

Generated using TypeDoc