@reservamos/browser-analytics 1.0.6 → 1.0.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reservamos/browser-analytics",
-  "version": "1.0.6",
+  "version": "1.0.9",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/reservamos/reservamos-browser-analytics.git"
@@ -88,6 +88,6 @@
     "upgradeps": "^2.0.6",
     "vite": "^5.0.12",
     "vitest": "^1.2.1",
-    "@reservamos/js-api-client": "5.26.0"
+    "@reservamos/js-api-client": "6.0.0-alpha.2"
   }
 }

package/src/events/customEvent/trackCustomEvent.ts

@@ -18,7 +18,7 @@ function trackCustomEvent(
     trackEvent(eventName, eventData, meta);
   } catch (error) {
     console.error('Error trackCustomEvent:', error);
-    trackEventError(eventName, error);
+    trackEventError(eventName, error, eventData);
   }
 }
 

package/src/events/identify/identify.ts

@@ -1,8 +1,8 @@
-import { getApiConfig } from '@/init';
 import createAnonymousProfile from '@/profiles/createAnonymousProfile';
+import configService from '@/services/config';
 import geolocationService from '@/services/geolocation';
 import validatorService from '@/services/validator';
-import { trackEventError } from '@/track';
+import { trackEventError, tryTrackEvent } from '@/track';
 import fingerprintService from '../../services/fingerprint';
 import mixpanelService from '../../services/mixpanel';
 import { DefaultProperties } from './identifySchema';
@@ -53,7 +53,6 @@ const identifyWithLocation = async (
   properties: UserProperties,
 ) => {
   try {
-    const apiConfig = getApiConfig();
     const coordinates = geolocationService.getCoordinates();
 
     if (!coordinates) {
@@ -69,12 +68,13 @@ const identifyWithLocation = async (
     delete properties.firstName;
     delete properties.lastName;
 
-    fetch(`${apiConfig?.coreUrl}/${apiConfig?.coreVersion}/datalake/identify`, {
+    const coreApiConfig = configService.getCoreAPIConfig();
+    fetch(`${coreApiConfig.baseUrl}/v1/datalake/identify`, {
       method: 'POST',
       headers: {
         'Content-Type': 'application/json',
-        'Authorization': apiConfig?.coreApiKey || '',
-        ...(apiConfig?.headers || {}),
+        'Authorization': coreApiConfig.defaultHeaders?.Authorization || '',
+        'Origin': coreApiConfig.defaultHeaders?.Origin || '',
       },
       body: JSON.stringify({
         profile_params: {
@@ -99,35 +99,32 @@ async function identify(
   userId: string,
   properties: UserProperties = {},
 ): Promise<void> {
-  try {
-    if (!mixpanelService.isReady()) {
-      console.error('Mixpanel is not initialized.');
-      throw new Error('Mixpanel is not initialized.');
-    }
-
-    validatorService.parseIdentifyProps(properties);
+  tryTrackEvent(async () => {
+    try {
+      validatorService.parseIdentifyProps(properties);
 
-    if (!userId) {
-      console.error('User ID is required for identification.');
-      throw new Error('User ID is required for identification.');
-    }
-    const anonymousProfile = await createAnonymousProfile(properties);
+      if (!userId) {
+        console.error('User ID is required for identification.');
+        throw new Error('User ID is required for identification.');
+      }
+      const anonymousProfile = await createAnonymousProfile(properties);
 
-    if (anonymousProfile) {
-      properties.reservamos_one_id = anonymousProfile.id;
-    }
-    const mappedProps = mapProperties(properties);
-    mixpanelService.identify(userId, mappedProps);
-    const fingerprint = await fingerprintService.getFingerprint();
-    if (fingerprint) {
-      mixpanelService.attachProperty(FINGERPRINT_PROPERTY, fingerprint);
+      if (anonymousProfile) {
+        properties.reservamos_one_id = anonymousProfile.id;
+      }
+      const mappedProps = mapProperties(properties);
+      mixpanelService.identify(userId, mappedProps);
+      const fingerprint = await fingerprintService.getFingerprint();
+      if (fingerprint) {
+        mixpanelService.attachProperty(FINGERPRINT_PROPERTY, fingerprint);
+      }
+    } catch (error) {
+      console.error('Error identifying user', error);
+      trackEventError('Identify', error, { userId, properties });
+    } finally {
+      identifyWithLocation(userId, properties);
     }
-  } catch (error) {
-    console.error('Error identifying user', error);
-    trackEventError('Identify', error);
-  } finally {
-    identifyWithLocation(userId, properties);
-  }
+  });
 }
 
 export default identify;

package/src/events/identify/identifySchema.ts

@@ -6,7 +6,6 @@ const IdentifySchema = z.object({
   email: z.string().email().optional(),
   phone: z
     .string()
-    .regex(/^(\+?[1-9]\d{1,14})?$/)
     .optional(),
 });
 

package/src/index.ts

@@ -26,7 +26,6 @@ import init, { isTrackerReady } from '@/init';
 import createAnonymousProfile from '@/profiles/createAnonymousProfile';
 import fingerprintService from '@/services/fingerprint';
 import mixpanelService from '@/services/mixpanel';
-import './js-api-client.d.ts';
 import trackPurchaseCanceled from './events/purchaseCanceled/trackPurchaseCanceled.js';
 
 const analytics = {

package/src/init.ts

@@ -1,4 +1,4 @@
-import { setConfig as setApiConfig } from '@reservamos/js-api-client';
+import coreApi from '@reservamos/js-api-client/core';
 import { z } from 'zod';
 import configService from '@/services/config';
 import fingerprintService from '@/services/fingerprint';
@@ -21,15 +21,6 @@ function onLoaded() {
   window.dispatchEvent(new CustomEvent('Tracker Ready'));
 }
 
-interface ApiConfig {
-  coreUrl: string;
-  coreVersion: string;
-  headers: { Origin: string };
-  coreApiKey: string;
-}
-
-let apiConfig: ApiConfig | null = null;
-
 /**
  * Initializes the tracking library with the provided configuration.
  * @param {InitConfig} config - The configuration object for initialization.
@@ -60,10 +51,8 @@ async function init(config: InitConfig) {
     console.error('Error initializing identification service:', error);
   }
 
-  const environment = isSandbox ? 'sandbox' : 'prod';
-  apiConfig = configService.coreAPIConfig[environment];
-
-  setApiConfig(apiConfig);
+  configService.setEnvironment(isSandbox ? 'sandbox' : 'prod');
+  coreApi.setConfig(configService.getCoreAPIConfig());
 
   // Dispatch the 'Tracker Ready' event
   onLoaded();
@@ -79,12 +68,5 @@ function isTrackerReady(): boolean {
   return mixpanelService.isReady();
 }
 
-/**
- * Returns the current API configuration.
- * @returns {ApiConfig | null} The current API configuration or null if not initialized.
- */
-function getApiConfig(): ApiConfig | null {
-  return apiConfig;
-}
-export { isTrackerReady, getApiConfig };
+export { isTrackerReady };
 export default init;

package/src/profiles/createAnonymousProfile/createAnonymousProfile.ts

@@ -1,31 +1,20 @@
+import type {
+  AnonymousIdentifier,
+  AnonymousProfile,
+  CreateAnonymousProfilePayload,
+  IdentifierKey,
+} from '@reservamos/js-api-client/core';
 import type { CreateAnonymousProfileProps } from './createAnonymousProfileSchema';
-import { core as coreApi } from '@reservamos/js-api-client';
+import coreApi from '@reservamos/js-api-client/core';
 import fingerprintService from '@/services/fingerprint';
 import mixpanelService from '@/services/mixpanel';
 import validatorService from '@/services/validator';
 import CreateAnonymousProfileSchema from './createAnonymousProfileSchema';
 
-type IdentifierKey = 'phone' | 'email';
-
-interface AnonymousProfilePayload {
-  identifier_key: IdentifierKey;
-  identifier_value: string;
-  identifiers: AnonymousIdentifier[];
-  details: Record<string, string>;
-}
-interface AnonymousProfileResponse {
-  id: string;
-}
-/**
- * Transforms the identifier object based on the provided values.
- * @param {CreateAnonymousProfileProps} values - The values to transform.
- * @param {AnonymousIdentifier[]} identifiersProps - Additional identifiers to include.
- * @returns {AnonymousProfilePayload} The transformed identifier object.
- */
 function getAnonymousProfilePayload(
   values: CreateAnonymousProfileProps,
   identifiersProps: AnonymousIdentifier[],
-): AnonymousProfilePayload {
+): CreateAnonymousProfilePayload {
   let identifier_key: IdentifierKey = 'phone';
   let identifier_value: string = values.phone || '';
   const identifiers: AnonymousIdentifier[] = [];
@@ -65,19 +54,9 @@ function getAnonymousProfilePayload(
   };
 }
 
-interface AnonymousIdentifier {
-  key: string;
-  value: string;
-}
-
-/**
- * Creates an anonymous profile using the provided payload.
- * @param {CreateAnonymousProfileProps} payload - The payload to create the anonymous profile.
- * @returns {Promise<void>} - A promise that resolves when the anonymous profile is created.
- */
 async function createAnonymousProfile(
   payload: CreateAnonymousProfileProps,
-): Promise<AnonymousProfileResponse | undefined> {
+): Promise<AnonymousProfile | undefined> {
   try {
     validatorService.validateProps(payload, CreateAnonymousProfileSchema);
 
@@ -90,9 +69,7 @@ async function createAnonymousProfile(
     if (distinctId) identifiers.push({ key: 'distinct_id', value: distinctId });
 
     const dataPayload = getAnonymousProfilePayload(payload, identifiers);
-
-    const result = await coreApi.createAnonymousProfile(dataPayload);
-    return result.data;
+    return await coreApi.profiles.createAnonymousProfile(dataPayload);
   } catch (error) {
     console.error('Could not create anonymous profile:', error);
     return undefined;

package/src/services/config.ts

@@ -1,26 +1,49 @@
+import type { ApiConfig } from '@reservamos/js-api-client/core';
+
+type AvailableEnvironments = 'sandbox' | 'prod';
+
+let environment: AvailableEnvironments | undefined;
 const origin = window.location.origin;
 
-const coreAPIConfig = {
+type CoreAPIConfig = Record<AvailableEnvironments, ApiConfig>;
+
+const coreAPIConfig: CoreAPIConfig = {
   sandbox: {
-    coreUrl: 'https://datalake-api-dev.reservamossaas.com/api',
-    coreVersion: 'v1',
-    headers: {
+    baseUrl: 'https://datalake-api-dev.reservamossaas.com/api',
+    defaultHeaders: {
       Origin: origin,
+      Authorization: 'Bearer 753bf0710dc920a84236d42241d4f487',
     },
-    coreApiKey: 'Bearer 753bf0710dc920a84236d42241d4f487'
   },
   prod: {
-    coreUrl: 'https://data-lake.reservamossaas.com/api',
-    coreVersion: 'v1',
-    headers: {
+    baseUrl: 'https://data-lake.reservamossaas.com/api',
+    defaultHeaders: {
       Origin: origin,
+      Authorization: 'Bearer 753bf0710dc920a84236d42241d4f487',
     },
-    coreApiKey:'Bearer 753bf0710dc920a84236d42241d4f487'
   },
 };
 
+function setEnvironment(env: AvailableEnvironments) {
+  environment = env;
+}
+
+/**
+ * Returns the core API config for the current environment.
+ * @throws {Error} Throws an error if the environment is not set.
+ */
+function getCoreAPIConfig(): ApiConfig {
+  if (!environment) {
+    throw new Error(
+      'Unable to get core API config, environment not set. Use configService.setEnvironment(environment) to set the environment.',
+    );
+  }
+  return coreAPIConfig[environment];
+}
+
 const configService = {
-  coreAPIConfig,
+  setEnvironment,
+  getCoreAPIConfig,
 };
 
 export default configService;

package/src/services/mixpanel.ts

@@ -1,4 +1,5 @@
 import mixpanel from 'mixpanel-browser';
+import { version } from '../../package.json';
 
 declare global {
   interface Window {
@@ -6,6 +7,8 @@ declare global {
   }
 }
 
+const MIXPANEL_DISTINCT_ID_CACHE_KEY = 'mp_distinct_id';
+
 /**
  * Initializes Mixpanel with the provided token and debug flag.
  * @param {string} mixpanelToken - The Mixpanel token used for authenticating API requests.
@@ -38,11 +41,8 @@ function init(
  * @throws {Error} If Mixpanel is not initialized (handled internally).
  */
 function identify(userId: string, properties: Record<string, unknown>): void {
-  if (!isReady()) {
-    return;
-  }
-
   mixpanel.identify(userId);
+  updateCachedDistinctId(userId);
   mixpanel.people.set(properties);
 }
 
@@ -80,8 +80,7 @@ function track(eventName: string, properties: Record<string, unknown>): void {
   if (!isReady()) {
     return;
   }
-
-  mixpanel.track(eventName, properties);
+  mixpanel.track(eventName, { ...properties, 'Reservamos Version': version });
 }
 
 /**
@@ -91,11 +90,27 @@ function track(eventName: string, properties: Record<string, unknown>): void {
  * @returns {string | null} The distinct ID if available, or null if Mixpanel is not initialized.
  */
 export const getMixpanelDistinctId = (): string | null => {
+  const cachedId = localStorage.getItem(MIXPANEL_DISTINCT_ID_CACHE_KEY);
+
   if (mixpanel && mixpanel.get_distinct_id) {
-    return mixpanel.get_distinct_id();
+    const distinctId = mixpanel.get_distinct_id();
+
+    updateCachedDistinctId(distinctId);
+
+    return distinctId;
+  } else if (cachedId) {
+    return cachedId;
   }
   return null;
 };
+/**
+ * Updates the cached Mixpanel distinct ID.
+ * Should be called when identifying a user to ensure cache stays in sync.
+ * @param {string} distinctId - The distinct ID to cache
+ */
+function updateCachedDistinctId(distinctId: string): void {
+  localStorage.setItem(MIXPANEL_DISTINCT_ID_CACHE_KEY, distinctId);
+}
 
 const mixpanelService = {
   init,

package/src/track.ts

@@ -68,16 +68,33 @@ function flattenEventData(data: object): EventData {
  * Send an error event to Mixpanel when an event fails to track.
  * The event contains the event name, error message, and validation errors.
  */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function trackEventError(eventName: string, error: any): void {
-  try {
-    mixpanelService.track('Track Event Error', {
-      'Failed Event Name': eventName,
-      'Error Message': error?.message ?? 'Failed to track event',
-      'Validation Errors': error?.errors || [],
+export function trackEventError(
+  eventName: string,
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  error: any,
+  payload: object,
+): void {
+  tryTrackEvent(async () => {
+    try {
+      mixpanelService.track('Track Event Error', {
+        'Failed Event Name': eventName,
+        'Error Message': error?.message ?? 'Failed to track event',
+        'Validation Errors': error?.errors || [],
+        'Event Payload': payload,
+      });
+    } catch (trackingError) {
+      console.error('Failed to track error event:', trackingError);
+    }
+  });
+}
+
+export async function tryTrackEvent(trackEventCallback: () => Promise<void>) {
+  if (mixpanelService.isReady()) {
+    await trackEventCallback();
+  } else {
+    window.addEventListener('Tracker Ready', async () => {
+      await trackEventCallback();
     });
-  } catch (trackingError) {
-    console.error('Failed to track error event:', trackingError);
   }
 }
 
@@ -126,7 +143,7 @@ export async function trackEvent(
     mixpanelService.track(eventName, properties);
   } catch (error) {
     console.error(`Error tracking event '${eventName}':`, error);
-    trackEventError(eventName, error);
+    trackEventError(eventName, error, eventProperties);
   }
 }
 

package/src/js-api-client.d.ts

@@ -1,15 +0,0 @@
-declare module '@reservamos/js-api-client' {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  export const core: any; // Replace 'any' with a more specific type if possible
-
-  interface ConfigOptions {
-    coreUrl: string;
-    coreVersion?: string;
-    withCredentials?: boolean;
-    headers?: {
-      Origin?: string;
-    };
-  }
-
-  export function setConfig(options: ConfigOptions): void;
-}