For many applications, this will be the only component you need to integrate to get started. It should be noted too that the component is fully responsive. If embedded in a narrow width sidebar for instance, it will collapse down to show a smaller mobile-style view.

​
Installation

The simplest version of the inbox component can be embedded like this:

<iframe
  src="https://embed.surgemsg.com/conversations?user_id={SURGE_USER_ID}&token={ACCOUNT_TOKEN}"
></iframe>

Both {SURGE_USER_ID} and {ACCOUNT_TOKEN} are required parameters. You can find them in the Surge dashboard. We will also be providing more robust auth options in the near future.

​
Events

The Inbox component emits events that you can listen to in your application. Here are the events that you can listen to:

​
Conversation Selected

When the user selects a conversation, this event is emitted with the details of the conversation:

{
  "source": "surge-inbox",
  "type": "conversation-selected",
  "conversation": %{
    "id": "cnv_01jadpja6sen796q4wxygg5q78",
    "contact": {
      "id": "ctc_01jadpk0asfq599vt3pwn3he6x",
      "first_name": "Dominic",
      "last_name": "Toretto",
      "phone_number": "+18015551234"
    }
  }
}
IntroductionConversation