---
title: "MessageHub Integrations: Dashboard Apps"
slug: "messagehub-integrations-dashboard-apps"
updated: 2025-01-21T18:56:25Z
published: 2025-01-21T18:56:25Z
canonical: "support.myclickfunnels.com/messagehub-integrations-dashboard-apps"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://support.myclickfunnels.com/llms.txt
> Use this file to discover all available pages before exploring further.

# MessageHub Integrations: Dashboard Apps

This article will review the **Dashboard Apps Integration** inside of the **Chat Settings**. Dashboard Apps allows you to embed other applications inside the MessageHub dashboard to provide the context for customer support agents. This feature allows you to create an application independently and embed it inside the dashboard to provide user information, orders, or previous payment history. When you embed your application using the dashboard in MessageHub, your application will appear as a new tab next to the customer’s conversation.

![](https://cdn.document360.io/e3762771-4bea-47c2-a830-5473d543417a/Images/Documentation/uadpxmyrn2ozw49rl1omiujbl1lrffqijw.png)

---

## Requirements

- An active ClickFunnels account
- The [MessageHub](/v1/docs/getting-started-with-messagehub) App

---

## Adding a Dashboard App

1. Click on the gear icon to open **Chat Settings**, then **Chat Integrations.** ![](https://cdn.document360.io/e3762771-4bea-47c2-a830-5473d543417a/Images/Documentation/itekcd0hpqxcih6b-kvvonm2fcg5vctfug.png)
2. Click on **Configure** next to Dashboard Apps. ![](https://cdn.document360.io/e3762771-4bea-47c2-a830-5473d543417a/Images/Documentation/rmhbzeiffxnvfvivvfer3nkaqqodba9cma.png)
3. Click on **Add a New Dashboard App**. ![](https://cdn.document360.io/e3762771-4bea-47c2-a830-5473d543417a/Images/Documentation/6ku-wwvnx8rxeumwb_hr2vfz1eal7ztglg.png)
4. Complete the following information: ![](https://cdn.document360.io/e3762771-4bea-47c2-a830-5473d543417a/Images/Documentation/ygvk4v44se6tezobljjr7mtm0pw11f310w.png)
  1. Add a **Name** for your Dashboard App.
  2. Paste the **Endpoint URL** of your App.
  3. Click on **Submit** when finished.

---

## Receiving Data from MessageHub into Your App

MessageHub will send you the conversation context and the contact as a window event. You can listen to it in your app as described below.

> [!WARNING]
> IMPORTANT
> 
> Due to the varying nature of **code**, our support team cannot assist with any custom code or script. If you experience trouble setting up your custom CSS, please consult a qualified developer.

```plaintext
window.addEventListener("message", function (event) {
  if (!isJSONValid(event.data)) {
    return;
  }

  const eventData = JSON.parse(event.data);
});
```

---

## Event Payload

> [!WARNING]
> IMPORTANT
> 
> Due to the varying nature of **code**, our support team cannot assist with any custom code or script. If you experience trouble setting up your custom CSS, please consult a qualified developer.

### `conversation` Objects

```plaintext
{
  "meta": {
    "sender": {
      "additional_attributes": {
        "description": "string",
        "company_name": "string",
        "social_profiles": {
          "github": "string",
          "twitter": "string",
          "facebook": "string",
          "linkedin": "string"
        }
      },
      "availability_status": "string",
      "email": "string",
      "id": "integer",
      "name": "string",
      "phone_number": "string",
      "identifier": "string",
      "thumbnail": "string",
      "custom_attributes": "object",
      "last_activity_at": "integer"
    },
    "channel": "string",
    "assignee": {
      "id": "integer",
      "account_id": "integer",
      "availability_status": "string",
      "auto_offline": "boolean",
      "confirmed": "boolean",
      "email": "string",
      "available_name": "string",
      "name": "string",
      "role": "string",
      "thumbnail": "string"
    },
    "hmac_verified": "boolean"
  },
  "id": "integer",
  "messages": [
    {
      "id": "integer",
      "content": "Hello",
      "inbox_id": "integer",
      "conversation_id": "integer",
      "message_type": "integer",
      "content_type": "string",
      "content_attributes": {},
      "created_at": "integer",
      "private": "boolean",
      "source_id": "string",
      "sender": {
        "additional_attributes": {
          "description": "string",
          "company_name": "string",
          "social_profiles": {
            "github": "string",
            "twitter": "string",
            "facebook": "string",
            "linkedin": "string"
          }
        },
        "custom_attributes": "object",
        "email": "string",
        "id": "integer",
        "identifier": "string",
        "name": "string",
        "phone_number": "string",
        "thumbnail": "string",
        "type": "string"
      }
    }
  ],
  "account_id": "integer",
  "additional_attributes": {
    "browser": {
      "device_name": "string",
      "browser_name": "string",
      "platform_name": "string",
      "browser_version": "string",
      "platform_version": "string"
    },
    "referer": "string",
    "initiated_at": {
      "timestamp": "string"
    }
  },
  "agent_last_seen_at": "integer",
  "assignee_last_seen_at": "integer",
  "can_reply": "boolean",
  "contact_last_seen_at": "integer",
  "custom_attributes": "object",
  "inbox_id": "integer",
  "labels": "array",
  "muted": "boolean",
  "snoozed_until": null,
  "status": "string",
  "timestamp": "integer",
  "unread_count": "integer",
  "allMessagesLoaded": "boolean",
  "dataFetched": "boolean"
}
```

### `contact` Objects

```plaintext
{
  "additional_attributes": {
    "description": "string",
    "company_name": "string",
    "social_profiles": {
      "github": "string",
      "twitter": "string",
      "facebook": "string",
      "linkedin": "string"
    }
  },
  "availability_status": "string",
  "email": "string",
  "id": "integer",
  "name": "string",
  "phone_number": "+91 9000000001",
  "identifier": "string || null",
  "thumbnail": "+91 9000000001",
  "custom_attributes": {},
  "last_activity_at": "integer"
}
```

### `currentAgent` Objects

```plaintext
{
  "email": "string",
  "id": "integer",
  "name": "string"
}
```

### The Final Payload

```plaintext
{
  "event": "appContext",
  "data": {
    "conversation": {
      // <...conversation Object Attributes>
    },
    "contact": {
      // <...contact Object Attributes>
    },
    "currentAgent": {
      // <...currentAgent Object Attributes>
    }
  }
}
```