Navigation tracking

Navigation tracking tells SignalFox which screens users visit and how they move through your app. It is the base for understanding screen-to-screen journeys.

SignalFox supports two navigation setups:

• React Navigation
• Expo Router

Use only the one that matches your app.

React Navigation

Use reactNavigationIntegration when your app uses @react-navigation/native directly.

import { useEffect } from 'react';
import {
  SignalFox,
  reactNavigationIntegration,
} from '@asgami-digital/signalfox-react-native';
import {
  NavigationContainer,
  createNavigationContainerRef,
} from '@react-navigation/native';

const navigationRef = createNavigationContainerRef();

export function Root() {
  useEffect(() => {
    void SignalFox.init({
      apiKey: signalFoxApiKey,
      integrations: [reactNavigationIntegration({ navigationRef })],
    });
  }, []);

  return (
    <NavigationContainer ref={navigationRef}>
      <AppNavigator />
    </NavigationContainer>
  );
}

Pass the same root ref to NavigationContainer and to the SignalFox integration.

Expo Router

Use expoRouterIntegration when your app uses Expo Router. You need a navigation container ref from Expo Router and a useEffect that calls SignalFox.init when integrations are ready (see examples/expo-rniap in the library repo).

import { useEffect, useMemo } from 'react';
import { Stack, useNavigationContainerRef } from 'expo-router';
import { SignalFox, expoRouterIntegration } from '@asgami-digital/signalfox-react-native';

export default function RootLayout() {
  const navigationRef = useNavigationContainerRef();
  const integrations = useMemo(
    () => [expoRouterIntegration({ navigationRef })],
    [navigationRef]
  );

  useEffect(() => {
    void SignalFox.init({
      apiKey: signalFoxApiKey,
      integrations,
    });
  }, [integrations]);

  return <Stack>{/* screens */}</Stack>;
}

How to choose

If you render your own NavigationContainer, use reactNavigationIntegration.

If your routes are managed by Expo Router, use expoRouterIntegration.

Do not configure both for the same app.

What you get

Navigation tracking records screen views and basic navigation context. In the dashboard, this helps SignalFox show screen structure and user paths.

Modal-style screens from React Navigation can also appear as modal activity when your navigation presentation is configured that way.

Limitations

Navigation tracking is for real screen changes. Changing route params alone is not treated as a new screen view.

For flows made of separate screens, navigation tracking is usually enough. Use trackFunnelStep only for journeys that happen inside the same screen or modal.