Consult with the Treasure team to develop a data dictionary / taxonomy prior to telemetry instrumentation

Our analytics tracking system allows you to track custom client-side events and properties to better understand your users’ behavior. Integration is simple and requires only a few lines of code.

See the connect-react example application for the full end-to-end source code.

Usage

To use analytics please let us know and in a private channel we’ll provide you the {DATA_PLATFORM_URL} and the X-API-Key header value to use.

The React TDK’s analytics API is built on top of the core TDK’s analytics API. By passing in additional options to the TreasureProvider components, the useTreasure hook will return allow you to use the trackCustomEvent method to interact with Darkmatter API.

Provider with AnalyticsOptions

To use the React Analytics API, you will need to pass in an AnalyticsOptions object to the TreasureProvider component. These are the same parameters that you would pass to the core TDK’s AnalyticsManager class.

jsx
import { TreasureProvider } from "@treasure-dev/tdk-react";

<TreasureProvider
    ...
    analyticsOptions={{
        apiUri: "{DATA_PLATFORM_URL}",
        apiKey: "{X-API-Key}",
        appInfo: {
            // bundle/package name of ap e.g. lol.treasure.tdkjs
            app_identifier: "YOUR_APP_IDENTIFIER",
            // version of app e.g. 0.0.1,
            app_version: "YOUR_APP_VERSION",
            // 0 for dev, 1 for prod
            app_environment: 0,
        },
        cartridgeTag: "YOUR_CARTRIDGE_TAG",
    }}
>

Track events

Track a custom event with the trackCustomEvent method exposed by the useTreasure hook.

jsx
import { useTreasure } from "@treasure-dev/tdk-react";

const { trackCustomEvent } = useTreasure();

const result = await trackCustomEvent({
  name: "test-click",
  properties: { test: "test-value" },
});
console.log(`Successfully tracked custom event: ${result}`);

The trackCustomEvent method accepts an AnalyticsEvent object with the following properties:

type AnalyticsEvent = {
  name: string;
  userId?: string;
  address?: string;
  properties: {
    [key: string]: PropertyValue | PropertyValue[];
  };
};

Unlike the core TDK’s trackCustomEvent method, the React TDK’s trackCustomEvent only requires a userId or address to be passed in if a user hasn’t been logged in.