You can use the HubSpot mobile chat SDK to integrate your iOS mobile application with HubSpot’s live chat functionality. The mobile chat SDK allows you to:
  • Integrate HubSpot chat into your mobile app to deliver real-time, in-app customer support.
  • Leverage the bot and knowledge base tools to help deflect customer inquires when your support agents are unavailable.
  • Alert users of new messages via push notifications.
  • Customize the chat experience to align with your business’s brand and UI.
mobile-chat-sdk-demo-screenshot

Installation

To get start developing with the mobile chat SDK:
  • Add the GitHub repository URL of the mobile chat SDK to your project using Swift Package Manager. From your project settings, select the Package Dependencies tab, then search for the HubSpot mobile chat SDK GitHub URL to add it to your project.
  • While this feature is in beta, you may need to configure Xcode with your GitHub account since this repository is private:
    • To add your GitHub account directly in Xcode, navigate to Xcode > Settings in the top menu bar, then click Account. Click the + icon to add your GitHub account.
    • If you’re developing your app using a CLI tool like xcodebuild, you may need to specify the -scmProvider system or -scmProvider xcode arguments to choose whether your system git credentials or xcode credentials are used.

Configuration

After you’ve added the mobile SDK to your project using the Swift Package Manager, include your HubSpot-Info.plist config file in your project, then mark it as included in the app target. During app startup, or in another suitable location in your app’s code where you initialize your app components, call the configure method on the SDK.
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {

    // Override point for customization after application launch.

    // This will configure the SDK using the `Hubspot-Info.plist` file that is bundled in app
    try! HubspotManager.configure()

    return true
}

Open HubSpot Chat View

You can present the chat view modally as a sheet, as a fullscreen view, or pushed into a navigation stack. The simplest way to get started is to present the chat as a sheet in response to a button press in the UI of your app. The chat view can be initialized using the HubSpotChatView.init(manager:pushData:chatFlow:) method, using either default values or with customized chat settings.

Show the chat view as a sheet in SwiftUI

The chat view is a SwiftUI View, meaning it can be the contents of a sheet, or embedded in your existing UI like any other view. You can present it as a sheet using the .sheet modifier, in response to a user action such as tapping a button.
Button(action: {
     showChat.toggle()
 }, label: {
     Text("Chat Now")
 }).sheet(isPresented: $showChat, content: {
     HubspotChatView(chatFlow: "support")
 })
In the example above, $showChat is a state property in the view:
@State var showChat = false

Show the chat as a presented view controller in UIKit

Although the HubSpot Chat View is a SwiftUI view, it will also work when contained in a UIHostingController. For example, you can present the chat view from a UIViewController button action.
@IBAction
func onButtonPress(_ source: Any) {

    //Init chat view with no arguments , or use alternative initialiser for configuring chat specifics
    let chatView = HubspotChatView()
    //Create a hosting controller to hold the chat view
    let hostingVC = UIHostingController(rootView: chatView)

    // Present the view controller like any other (or push into a navigation stack)
    self.present(hostingVC, animated: true)
}

Identify users with the HubSpot visitor identification token

You can identify users by using the visitor identification API, detailed in this article. This API is best implemented in your own server project, where you can pass the identity token to your app based on whether suits your specific setup (i.e., passing a token in response to a visitor going through a login page as a result of a dedicated API that you own). Once a token is generated, it can associated with a contact’s email address by calling HubspotManager/setUserIdentity(identityToken:email:). This should be called before opening a chat view.

Add custom chat data properties

The SDK supports setting key-value pairs to keep track of data you might need to track while a chat session is open. You can set your own custom values, or declare common permission preferences such as photo or notification permissions. Use the HubspotManager/setChatProperties(data:) method and provide the associated key and value you want to set. This is best called before starting a chat, and will apply to all new chats. You could set an account status, or other identifiers when setting up your user. These will then appear in all chats opened for the remainder of the app launch. For example, the following code would set several pre-defined permissions and custom properties:
var properties: [String: String] = [
     ChatPropertyKey.cameraPermissions.rawValue: self.checkCameraPermissions(),
     "myapp-install-id": appUniqueId,
     "subscription-tier": "premium"
 ]

HubspotManager.shared.setChatProperties(data: properties)

Clearing data on logout

The SDK stores in memory identification tokens, email address, and any properties set. The push token for the app is also associated with the current user, if applicable. You may want to clear this data when a user is logging out, or changing users in a multi user app. To clear this data, call HubspotManager/clearUserData() at an appropriate time in your app.

Reference documentation

You can consult the reference documentation for details on how to use each of the components in the HubSpot mobile SDK.