External analytics

This feature is available only on Enterprise self-hosted and Enterprise cloud-hosted plans.

The external analytics feature allows you to forward analytics and audit logs events with third-party analytics/logging solutions. If settings for external analytics are provided, a third-party script will be dynamically loaded, and Audit Log events will be forwarded to the respective third-party system. NOTE: default Audit logs will still be available in your UI Bakery workspace.

Currently, integrations with the following third-party analytics/logging systems are available:

• Datadog

• Google Analytics 4

• Google Tag Manager

External analytics scripts are only loaded after the user is logged into the platform and for anonymous apps. No external analytics scripts are loaded for the UI Bakery login screen.

Datadog external analytics

Currently, UI Bakery provides the interface to set up integration with the following Datadog services:

• Real user monitoring

• Browser logs

It is also possible to set up UI Bakery backend log collection using the Datadog agent but this has to be done on the VM or Kubernetes level.

Setting up Datadog Real User Monitoring (RUM)

Datadog RUM allows recording user sessions to better understand their user experience and track issues in app business logic.

In your Datadog console, navigate to UX monitoring > RUM applications and click the "New application" button:

Creating new RUM application in Datadog

Choose JS as your application type. Type your application name, for instance, "UI Bakery", and click "Create new application" button. You will be provided with the initialization script similar to:

import { datadogRum } from '@datadog/browser-rum';

datadogRum.init({
    applicationId: 'xxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
    clientToken: 'pubxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
    site: 'datadoghq.com',
    service:'ui-bakery',
    
    // Specify a version number to identify the deployed version of your application in Datadog 
    // version: '1.0.0',
    sessionSampleRate: 100,
    sessionReplaySampleRate: 20,
    trackUserInteractions: true,
    trackResources: true,
    trackLongTasks: true,
    defaultPrivacyLevel:'mask-user-input'
});
    
datadogRum.startSessionReplayRecording();

Take the object from init function and convert it to valid JSON (replace the single quotes and add double quotes to properties name:

{
    "applicationId": "xxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
    "clientToken": "pubxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
    "site": "datadoghq.com",
    "service":"ui-bakery",
    "sessionSampleRate": 100,
    "sessionReplaySampleRate": 20,
    "trackUserInteractions": true,
    "trackResources": true,
    "trackLongTasks": true,
    "defaultPrivacyLevel": "mask-user-input"
}

Paste the JSON object to your Datadog RUM settings in UI Bakery:

Adding Datadog RUM to UI Bakery

Click Save and reload your pages for changes to apply.

Setting up Datadog browser logs

Datadog browser logs allow streaming UI Bakery audit logs directly to Datadog to help you analyze them in a single place.

In order to set this feature up, first you need to acquire your client token as described here. The client token usually has a format of pubxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx.

After this is done, paste the following JSON to your Datadog browser logs settings replacing <DATADOG_CLIENT_TOKEN> with a valid client token:

{
    "clientToken": "<DATADOG_CLIENT_TOKEN>",
    "site": "datadoghq.com",
    "forwardErrorsToLogs": true,
    "sessionSampleRate": 100
}

Setting up Datadog browser logs in UI Bakery

After reloading the page, the Datadog client script will start collecting your Audit Logs and store them in UI Bakery.

Setting up Google analytics 4 or GTM

In order to set up Google Analytics 4 or GTM you will need to acquire your tracking ID and paste it into the respective settings field.

Setting up Google Analytics 4 in UI Bakery

After this is done and the page is reloaded, this Google Analytics or GTM script will be loaded and UI Bakery Audit logs would be streamed to Google Analytics 4 as events, or in GTM as dataLayer events.

Global external analytics script

UI Bakery also allows adding script tags on the instance level using UI_BAKERY_GTM an environment variable. It will add the provided string after the opening <body> tag.

Please note, if you use this option, UI Bakery will not stream audit log events to the external analytics you installed with the script.