# SnapEngage

[SnapEngage](https://snapengage.com/) is an enterprise chat platform. It offers chatbots and live chat integrations to drive conversions, reduce response times, and increase customer satisfaction.

RudderStack supports SnapEngage as a destination where you can seamlessly send your event data.

## Connection compatibility

{{< destination-config >}}

{{< info >}}
In the web device mode integration, that is, using [JavaScript SDK]({{< ref "sources/event-streams/sdks/rudderstack-javascript-sdk/_index.md" >}}) as a source, RudderStack loads the SnapEngage native SDK from the `https://storage.googleapis.com/` domain.

Based on your website's content security policy, you might need to [allowlist this domain]({{< ref "sources/event-streams/sdks/rudderstack-javascript-sdk/load-js-sdk.md#allowlist-destination-domain" >}}) to load the SnapEngage SDK successfully.
{{< /info >}}

## Get started

Once you have confirmed that the source platform supports sending events to SnapEngage, follow these steps:

1. From your [RudderStack dashboard](https://app.rudderstack.com/), add a source. Then, from the list of destinations, select **SnapEngage**.
2. Assign a name to the destination and click **Continue**.

## Connection settings

To successfully configure SnapEngage as a destination, you will need to configure the following settings:

{{< image src="images/event-stream-destinations/snapengage-connection-settings-1.webp" alt="SnapEngage connection settings" >}}
{{< image src="images/event-stream-destinations/snapengage-connection-settings-2.webp" alt="SnapEngage connection settings" >}}

- **Widget ID**: Enter your SnapEngage widget ID.

{{< info >}}
For more information on obtaining your SnapEngage widget ID, refer to the [FAQ]({{< ref "#faq" >}}) section below.
{{< /info >}}

- **Record Live Chat Events**: Enable this setting to allow RudderStack to automatically record your SnapEngage Live Chat events as `track` events.
- **Update Event Name in track call**: If **Record Live Chat Events** is enabled, enable this setting to update the event names in the `track` call.
    - **Mapping to update the Event Name in track call**: Use this setting to map the standard SnapEngage events with your custom event names.
- **Client-side Events Filtering**: This setting lets you specify which events should be blocked or allowed to flow through to SnapEngage.

{{< info >}}
For more information on this setting, refer to the [Client-side Events Filtering]({{< ref "sources/event-streams/sdks/event-filtering.md" >}}) guide.
{{< /info >}}

- **Use device mode to send events**: As this is a [web device mode]({{< ref "destinations/rudderstack-connection-modes.md#device-mode" >}})-only destination, this setting is enabled by default and cannot be disabled.

## Identify

You can use the [`identify`]({{< ref "event-spec/standard-events/identify.md" >}}) call to set the user's email and username in SnapEngage through their [SDK](https://developer.snapengage.com/javascript-api/#javascript-api).

A sample `identify` call is shown below:

```javascript
rudderanalytics.identify(
  "1hKOmRA4GRlm", {
    email: "alex@example.com",
    name: "Alex Keener"
  }
);
```

### Supported mappings

The following table lists the mappings between the RudderStack and SnapEngage properties:

| RudderStack property | SnapEngage property | Data type | Presence
|:---------------------|:-------------|:--------------|:--------------|
| `traits.email` / `context.traits.email` | `email` | String | Required |
| `traits.name` / `context.traits.name` | `name` | String | Optional |

## Track

If you enable the **Record Live Chat Events** dashboard setting, RudderStack records the SnapEngage Live Chat events based on the user's interactions and sends them as [track]({{< ref "event-spec/standard-events/track.md" >}}) events. You can then view and analyze these events using other tools (connected to the same source in RudderStack).

### Supported events

RudderStack automatically records and sends the following Live Chat events:

- [Live Chat Conversation Started](https://developer.snapengage.com/javascript-api/#startchat-event)

```javascript
SnapEngage.setCallback("StartChat", function() {
  window.rudderanalytics.track(
    "Live Chat Conversation Started", {}, {
      context: {
        integration: {
          name: 'snapengage',
          version: '1.0.0'
        }
      }
    }
  );
});
```

- [Live Chat Conversation Ended](https://developer.snapengage.com/javascript-api/#close-event)

```javascript
SnapEngage.setCallback("Close", function() {
  window.rudderanalytics.track(
    "Live Chat Conversation Ended", {}, {
      context: {
        integration: {
          name: 'snapengage',
          version: '1.0.0'
        }
      }
    }
  );
});
```

- [Live Chat Message Sent](https://developer.snapengage.com/javascript-api/#chatmessagesent-event) 

```javascript
SnapEngage.setCallback("ChatMessageSent", function() {
  window.rudderanalytics.track(
    "Live Chat Message Sent", {}, {
      context: {
        integration: {
          name: 'snapengage',
          version: '1.0.0'
        }
      }
    }
  );
});
```

- [Live Chat Message Received](https://developer.snapengage.com/javascript-api/#chatmessagereceived-event)

```javascript
SnapEngage.setCallback("ChatMessageReceived", function(agent) {
  window.rudderanalytics.track(
    "Live Chat Message Received", {
      agentUsername: agent
    }, {
      context: {
        integration: {
          name: 'snapengage',
          version: '1.0.0'
        }
      }
    }
  );
});
```

- [Button Clicked](https://developer.snapengage.com/javascript-api/#button-event)

```javascript
SnapEngage.setCallback("InlineButtonClicked", function() {
  window.rudderanalytics.track(
    "Inline Button Clicked", {}, {
      context: {
        integration: {
          name: 'snapengage',
          version: '1.0.0'
        }
      }
    }
  );
});
```

### Mapping events

You can also update the standard SnapEngage Live Chat events with custom event names. Enable the **Update Event Name in track call** dashboard setting in RudderStack and specify the required mapping:

{{< image src="images/event-stream-destinations/snapengage-event-mapping.webp" alt="SnapEngage event name mapping" >}}

From the mappings set in the above image, RudderStack replaces the event names `"Live Chat Conversation Started"` and `"Live Chat Message Sent"`with `"User Started Chat"` and `"Submit"` respectively.

## FAQ 

#### Where can I find the SnapEngage widget ID?

To get your SnapEngage widget ID, follow these steps:

1. Log into your [SnapEngage dashboard](https://www.snapengage.com/app/).
2. In the sidebar, select the widget under **Current Widget** for which you want the widget ID.
3. Go to **Settings** > **Get the Code**. You will find the widget ID under **(Advanced) Widget ID**:

{{< image src="images/event-stream-destinations/snapengage-widget-id.webp" alt="SnapEngage widget ID" >}}