@repliqo/sdk-react-native 0.3.7 → 0.4.0

package/src/trackers/navigation.tracker.ts

@@ -1,98 +1,107 @@
-import { useRef, useCallback } from 'react';
-import { AppAnalytics } from '../core/client';
-
-interface NavigationState {
-  routes: Array<{ name: string; key: string; state?: NavigationState }>;
-  index: number;
-}
-
-function getActiveRouteName(state: NavigationState | undefined): string | null {
-  if (!state) {
-    return null;
-  }
-
-  const route = state.routes[state.index];
-  if (!route) {
-    return null;
-  }
-
-  // Dive into nested navigators
-  if (route.state) {
-    return getActiveRouteName(route.state as NavigationState);
-  }
-
-  return route.name;
-}
-
-export function useNavigationTracker() {
-  const routeNameRef = useRef<string | null>(null);
-  const navigationRef = useRef<any>(null);
-
-  const onReady = useCallback(() => {
-    if (navigationRef.current) {
-      const state = navigationRef.current.getRootState() as
-        | NavigationState
-        | undefined;
-      const currentRouteName = getActiveRouteName(state);
-      routeNameRef.current = currentRouteName;
-
-      if (currentRouteName) {
-        try {
-          const analytics = AppAnalytics.getInstance();
-          analytics.onScreenEnter(currentRouteName);
-        } catch {
-          // AppAnalytics not initialized, silently ignore
-        }
-      }
-    }
-  }, []);
-
-  const onStateChange = useCallback(() => {
-    if (!navigationRef.current) {
-      return;
-    }
-
-    const state = navigationRef.current.getRootState() as
-      | NavigationState
-      | undefined;
-    const currentRouteName = getActiveRouteName(state);
-    const previousRouteName = routeNameRef.current;
-
-    if (
-      currentRouteName &&
-      previousRouteName &&
-      currentRouteName !== previousRouteName
-    ) {
-      try {
-        const analytics = AppAnalytics.getInstance();
-        analytics.trackNavigation(previousRouteName, currentRouteName);
-        analytics.onScreenExit(previousRouteName);
-        analytics.onScreenEnter(currentRouteName);
-      } catch {
-        // AppAnalytics not initialized, silently ignore
-      }
-    }
-
-    routeNameRef.current = currentRouteName;
-  }, []);
-
-  return {
-    navigationRef,
-    onStateChange,
-    onReady,
-  };
-}
-
-export function trackScreenChange(
-  fromScreen: string,
-  toScreen: string,
-): void {
-  try {
-    const analytics = AppAnalytics.getInstance();
-    analytics.trackNavigation(fromScreen, toScreen);
-    analytics.onScreenExit(fromScreen);
-    analytics.onScreenEnter(toScreen);
-  } catch {
-    // AppAnalytics not initialized, silently ignore
-  }
-}
+import { useRef, useCallback } from 'react';
+import { AppAnalytics } from '../core/client';
+
+interface NavigationState {
+  routes: Array<{ name: string; key: string; state?: NavigationState }>;
+  index: number;
+}
+
+function getActiveRouteName(state: NavigationState | undefined): string | null {
+  if (!state) {
+    return null;
+  }
+
+  const route = state.routes[state.index];
+  if (!route) {
+    return null;
+  }
+
+  // Dive into nested navigators
+  if (route.state) {
+    return getActiveRouteName(route.state as NavigationState);
+  }
+
+  return route.name;
+}
+
+export function useNavigationTracker() {
+  const routeNameRef = useRef<string | null>(null);
+  const navigationRef = useRef<any>(null);
+
+  const onReady = useCallback(() => {
+    if (navigationRef.current) {
+      const state = navigationRef.current.getRootState() as
+        | NavigationState
+        | undefined;
+      const currentRouteName = getActiveRouteName(state);
+      routeNameRef.current = currentRouteName;
+
+      if (currentRouteName) {
+        try {
+          const analytics = AppAnalytics.getInstance();
+          analytics.onScreenEnter(currentRouteName);
+        } catch {
+          // AppAnalytics not initialized, silently ignore
+        }
+      }
+    }
+  }, []);
+
+  const onStateChange = useCallback(() => {
+    if (!navigationRef.current) {
+      return;
+    }
+
+    const state = navigationRef.current.getRootState() as
+      | NavigationState
+      | undefined;
+    const currentRouteName = getActiveRouteName(state);
+    const previousRouteName = routeNameRef.current;
+
+    if (
+      currentRouteName &&
+      previousRouteName &&
+      currentRouteName !== previousRouteName
+    ) {
+      try {
+        const analytics = AppAnalytics.getInstance();
+        analytics.trackNavigation(previousRouteName, currentRouteName);
+        analytics.onScreenExit(previousRouteName);
+        analytics.onScreenEnter(currentRouteName);
+      } catch {
+        // AppAnalytics not initialized, silently ignore
+      }
+    } else if (currentRouteName && !previousRouteName) {
+      // First route seen without onReady having fired (some apps only wire
+      // onStateChange). Without this, currentScreen stays null until the
+      // SECOND navigation and early touches/visits go unattributed.
+      try {
+        AppAnalytics.getInstance().onScreenEnter(currentRouteName);
+      } catch {
+        // AppAnalytics not initialized, silently ignore
+      }
+    }
+
+    routeNameRef.current = currentRouteName;
+  }, []);
+
+  return {
+    navigationRef,
+    onStateChange,
+    onReady,
+  };
+}
+
+export function trackScreenChange(
+  fromScreen: string,
+  toScreen: string,
+): void {
+  try {
+    const analytics = AppAnalytics.getInstance();
+    analytics.trackNavigation(fromScreen, toScreen);
+    analytics.onScreenExit(fromScreen);
+    analytics.onScreenEnter(toScreen);
+  } catch {
+    // AppAnalytics not initialized, silently ignore
+  }
+}