Custom Sections for Inbox

Zowie offers built-in mechanism to extend your agent workspace with custom sections. You can connect Zowie to your APIs and offer real-time access to your data whenever it's needed.

Start with exposing data via API endpoint

Building custom section is easy, you need prepare API endpoint that will return JSON in the required format. Whenever agent is about to view thread, we will make API call to your endpoint to pull section data.

Please make sure that your endpoint returns JSON in the following format:

{
  "highlightText": "3 warranty requests found",
  "initiallyVisiblePropertyCount": 2,
  "properties": [
    {
      "name": "All requests",
      "value": {
        "content": "3 requests",
        "style": "fontPrimary"
      },
      "format": "StringSingleLine"
    },
    {
      "name": "Pending",
      "value": {
        "content": "2 requests",
        "style": "fontPrimary"
      },
      "clickAction": {
        "type": "open_new_tab",
        "payload": {
          "url": "https://demo.chatbotize.com/warranty-requests.html"
        }
      },
      "format": "StringMultiLine"
    },
    {
      "name": "Completed",
      "value": {
        "content": "1 request",
        "style": "fontPrimary"
      },
      "clickAction": {
        "type": "open_modal",
        "payload": {
          "url": "https://demo.chatbotize.com/warranty-requests.html",
          "title": "Warranty Requests",
          "widthPercentage": 60,
          "heightPercentage": 80
        }
      }
    }
  ],
  "groups": [
    {
      "title": {
        "text": {
          "content": "Pending requests",
          "style": "fontPrimary"
        },
        "icon": {
          "name": "cart",
          "color": "fontPrimary"
        },
        "clickAction": {
          "type": "open_new_tab",
          "payload": {
            "url": "https://demo.chatbotize.com/warranty-requests.html"
          }
        }
      },
      "properties": [
        {
          "name": "Total value",
          "value": {
            "content": "$529.00",
            "style": "fontPrimary"
          },
          "icon": {
            "name": "cart",
            "color": "fontPrimary"
          }
        },
        {
          "name": "Reviewer",
          "value": {
            "content": "Tom Hanks",
            "style": "fontPrimary"
          },
          "clickAction": {
            "type": "open_new_tab",
            "payload": {
              "url": "https://demo.chatbotize.com/warranty-requests.html"
            }
          }
        },
        {
          "name": "Approver",
          "value": {
            "content": "Anna Jackson",
            "style": "fontPrimary"
          },
          "clickAction": {
            "type": "open_modal",
            "payload": {
              "url": "https://demo.chatbotize.com/warranty-requests.html",
              "title": "Modal test title",
              "widthPercentage": 60,
              "heightPercentage": 80
            }
          }
        }
      ],
      "initiallyVisiblePropertyCount": 3,
      "cards": [
        {
          "leftTitle": {
            "text": {
              "content": "#984394",
              "style": "fontPrimary"
            },
            "icon": {
              "name": "cart",
              "color": "fontPrimary"
            },
            "clickAction": {
              "type": "open_new_tab",
              "payload": {
                "url": "https://demo.chatbotize.com/warranty-requests.html"
              }
            }
          },
          "rightTitle": {
            "text": {
              "content": "Pending approval",
              "style": "fontPrimary"
            },
            "icon": {
              "name": "cart",
              "color": "fontPrimary"
            },
            "clickAction": {
              "type": "open_new_tab",
              "payload": {
                "url": "https://demo.chatbotize.com/warranty-requests.html"
              }
            }
          },
          "initiallyVisiblePropertyCount": 2,
          "properties": [
            {
              "name": "Updated at",
              "value": {
                "content": "28th Jan 2024",
                "style": "fontPrimary"
              },
              "icon": {
                "name": "cart",
                "color": "fontPrimary"
              }
            },
            {
              "name": "Expectations",
              "value": {
                "content": "Replacement",
                "style": "fontPrimary"
              }
            },
            {
              "name": "Total value",
              "value": {
                "content": "$199.00",
                "style": "fontPrimary"
              },
              "icon": {
                "name": "cart",
                "color": "fontPrimary"
              }
            },
            {
              "name": "Images",
              "value": {
                "content": "Preview",
                "style": "fontPrimary"
              },
              "clickAction": {
                "type": "open_new_tab",
                "payload": {
                  "url": "https://demo.chatbotize.com/warranty-requests.html"
                }
              }
            },
            {
              "name": "Order",
              "value": {
                "content": "Preview",
                "style": "fontPrimary"
              },
              "clickAction": {
                "type": "open_modal",
                "payload": {
                  "url": "https://demo.chatbotize.com/warranty-requests.html",
                  "title": "Modal test title",
                  "widthPercentage": 60,
                  "heightPercentage": 80
                }
              }
            }
          ],
          "buttons": [
            {
              "caption": "Approve",
              "style": "secondary",
              "clickAction": {
                "type": "open_new_tab",
                "payload": {
                  "url": "https://demo.chatbotize.com/approve-request"
                }
              }
            },
            {
              "caption": "Reject",
              "style": "secondary",
              "clickAction": {
                "type": "open_modal",
                "payload": {
                  "url": "https://demo.chatbotize.com/reject-request",
                  "title": "Reject Request",
                  "widthPercentage": 60,
                  "heightPercentage": 80
                }
              }
            }
          ]
        },
        {
          "leftTitle": {
            "text": {
              "content": "#728382",
              "style": "fontPrimary"
            },
            "icon": {
              "name": "cart",
              "color": "fontPrimary"
            },
            "clickAction": {
              "type": "open_new_tab",
              "payload": {
                "url": "https://demo.chatbotize.com/warranty-requests.html"
              }
            }
          },
          "rightTitle": {
            "text": {
              "content": "Pending review",
              "style": "fontPrimary"
            },
            "icon": {
              "name": "cart",
              "color": "fontPrimary"
            },
            "clickAction": {
              "type": "open_new_tab",
              "payload": {
                "url": "https://demo.chatbotize.com/warranty-requests.html"
              }
            }
          },
          "initiallyVisiblePropertyCount": 2,
          "properties": [
            {
              "name": "Updated at",
              "value": {
                "content": "13th Feb 2024",
                "style": "fontPrimary"
              },
              "icon": null,
              "clickAction": null
            },
            {
              "name": "Expectations",
              "value": {
                "content": "Refund",
                "style": "fontPrimary"
              },
              "icon": null,
              "clickAction": null
            },
            {
              "name": "Total value",
              "value": {
                "content": "$329.00",
                "style": "fontPrimary"
              },
              "icon": {
                "name": "cart",
                "color": "fontPrimary"
              },
              "clickAction": null
            },
            {
              "name": "Images",
              "value": {
                "content": "Preview",
                "style": "fontPrimary"
              },
              "icon": null,
              "clickAction": {
                "type": "open_new_tab",
                "payload": {
                  "url": "https://demo.chatbotize.com/warranty-requests.html"
                }
              }
            },
            {
              "name": "Order",
              "value": {
                "content": "Preview",
                "style": "fontPrimary"
              },
              "icon": null,
              "clickAction": {
                "type": "open_modal",
                "payload": {
                  "url": "https://demo.chatbotize.com/warranty-requests.html",
                  "title": "Modal test title",
                  "widthPercentage": 60,
                  "heightPercentage": 80
                }
              }
            }
          ],
          "buttons": [
            {
              "caption": "Review",
              "style": "secondary",
              "clickAction": {
                "type": "open_new_tab",
                "payload": {
                  "url": "https://demo.chatbotize.com/review-request"
                }
              }
            }
          ]
        }
      ],
      "buttons": [
        {
          "caption": "Approve All",
          "style": "custom black",
          "clickAction": {
            "type": "open_new_tab",
            "payload": {
              "url": "https://demo.chatbotize.com/approve-all"
            }
          }
        },
        {
          "caption": "Reject All",
          "style": "custom black",
          "clickAction": {
            "type": "open_modal",
            "payload": {
              "url": "https://demo.chatbotize.com/reject-all",
              "title": "Reject All Requests",
              "widthPercentage": 70,
              "heightPercentage": 90
            }
          }
        }
      ]
    }
  ],
  "buttons": [
    {
      "caption": "Review all",
      "style": "primary",
      "clickAction": {
        "type": "open_new_tab",
        "payload": {
          "url": "https://demo.chatbotize.com/warranty-requests.html"
        }
      }
    },
    {
      "caption": "Create new",
      "style": "primary",
      "clickAction": {
        "type": "open_modal",
        "payload": {
          "url": "https://demo.chatbotize.com/warranty-requests.html",
          "title": "Create warranty request",
          "widthPercentage": 60,
          "heightPercentage": 80
        }
      }
    },
    {
      "caption": "Run HTTP",
      "style": "primary",
      "clickAction": {
        "type": "make_http_call",
        "payload": {
          "url": "https://customizations.chatbotize.com/ecommerce/users",
          "body": "{\"test\": \"value\"}",
          "method": "POST",
          "headers": [
            {
              "name": "X-Api-Key",
              "value": "e35f4459059b45deb05890d297750828"
            },
            {
              "name": "Content-Type",
              "value": "application/json"
            },
            {
              "name": "Accept",
              "value": "application/json"
            }
          ]
        }
      }
    },
    {
      "caption": "Upload FILE",
      "style": "primary",
      "clickAction": {
        "type": "upload_file",
        "payload": {
          "url": "https://customizations.chatbotize.com/ecommerce/files"
        }
      }
    }
  ]
}

Configure Zowie to use your endpoint

  1. Navigate to Workspace -> Integrations -> Custom API.
  2. Add new Custom API integration by providing name and URL to your endpoint.

Supported variables

You can pass contextual variables to your API endpoint, we support the following variables:

${email}An email address related to customer's thread.
${phoneNumber}A phone number related to customer's thread.
${customParams.XYZ}A custom parameter realted to customer's thread.

Example URL: https://api.yourdomain.com?email=${email}&segment=${customParams.userSegment}