Skip to main content

Component-level event tracking

Wire event capture directly into your component handlers:
import { setEventProperties, setPageProperties } from 'zeo-collect';
import { Button } from 'react-native';

const ProductDetail = ({ name, price, size, color, navigation, onAddToCart }) => {
  return (
    <BottomButtons
      onPress={() => {
        setPageProperties({ page: "Product Detail" });
        setEventProperties("Add To Cart", {
          name,
          price,
          size,
          color,
          quantity: 1
        });
        onAddToCart();
        navigation.navigate('Cart');
      }}
    />
  );
};

Identity patterns

Tie post-login behavior to a known user

import { setUserIdentities, setEventProperties } from 'zeo-collect';

const handleLogin = async (email, password) => {
  await api.login(email, password);

  setUserIdentities({
    email,
    loginid: "userA-123",
    fpuid: "crm_42"
  });

  setEventProperties("login", { method: "password" });
};
All subsequent events carry those identities.

Differentiate two users on the same device

setUserIdentities ties events to the current identity until you clear them:
import { setUserIdentities, unSetUserIdentities } from 'zeo-collect';

setUserIdentities({ email: "alice@example.com" });
// ... Alice's activity

unSetUserIdentities();
setUserIdentities({ email: "bob@example.com" });
// ... Bob's activity

Let the package hash raw PII

import { initialiseZeoCollect, setUserIdentities } from 'zeo-collect';

initialiseZeoCollect({
  android_write_key: "...",
  ios_write_key: "...",
  are_identities_hashed: false,
  hash_identities: true
});

setUserIdentities({
  email: "xyz@gmail.com",   // hashed by package
  crmID: "12345"            // custom identity, sent as-is
});

Send pre-hashed identities

initialiseZeoCollect({
  android_write_key: "...",
  ios_write_key: "...",
  are_identities_hashed: true
});

setUserIdentities({
  email_sha256_lowercase: "32e19a491662fd86de7d3806b1199b76f0ee44e928d3475f05b0c8a59912c097",
  crmID: "12345"
});

Common payloads

View product

import { setEventProperties } from 'zeo-collect';

setEventProperties("view_product", {
  productID: "sku_123",
  productName: "watch"
});

Add to cart

setEventProperties("addToCart", {
  productID: "sku_123",
  quantity: 1,
  price: 29.99
});

Purchase

setEventProperties("purchase", {
  orderID: "order_456",
  total: 89.97,
  currency: "EUR"
});

Logout

import { unSetUserIdentities } from 'zeo-collect';

unSetUserIdentities();

Send events with callbacks

All event functions accept an optional callback. Useful in dev for surfacing dispatch errors:
import { setEventProperties } from 'zeo-collect';

setEventProperties("Add_to_cart", { sku: "abc" }, (res) => {
  if (res.status === "ERROR") {
    console.warn("Event failed:", res.message);
  }
});

Pause and resume

import { pauseCollection, resumeCollection } from 'zeo-collect';

pauseCollection();
// ... screen where no events should fire
resumeCollection();

Initialize from useEffect (App.js)

Best practice — initialize once on app mount and call SDK functions only after that. Using React Navigation? Mount this in your root App component, not inside a screen:
import React, { useEffect } from 'react';
import { initialiseZeoCollect } from 'zeo-collect';
import { NavigationContainer } from '@react-navigation/native';

const App = () => {
  useEffect(() => {
    initialiseZeoCollect({
      android_write_key: process.env.ZEOTAP_ANDROID_KEY,
      ios_write_key: process.env.ZEOTAP_IOS_KEY,
      use_consent: true,
      check_for_cmp: false
    });
  }, []);

  return (
    <NavigationContainer>
      {/* ... */}
    </NavigationContainer>
  );
};

Contextual data captured automatically

You don’t need to send these explicitly — the underlying native SDKs append them to every event:
  • Device ID (iOS ID / Android ID)
  • IP address, telco carrier, network type, OS version
  • Device manufacturer, model, version
  • App name, app version
  • zi (SDK-generated user ID)
  • AdID / IDFA (when permitted on each platform)
Last modified on June 22, 2026